fix: (Platform) fix StackBlitz examples part 3 (#4512)

* fix: (platform) fix Value Help Dialog examples for StackBlitz * fix: (platform) fix Multi-Input examples for StackBlitz * fix: (platform) fix List examples for StackBlitz * fix: (platform) fix Action List Item examples for StackBlitz * fix: (platform) fix Display List Item examples for StackBlitz * fix: (platform) fix Object List Item examples for StackBlitz * fix: (platform) fix Standard List Item examples for StackBlitz * fix: (core) fix e2e after update examples
SAP · Feb 4, 2021 · a83860d · a83860d
1 parent 2f5a325
commit a83860d
Show file tree

Hide file tree

Showing 84 changed files with 678 additions and 632 deletions.
diff --git a/...rm/component-docs/platform-action-list-item/platform-action-list-item-docs.component.html b/...rm/component-docs/platform-action-list-item/platform-action-list-item-docs.component.html
@@ -4,7 +4,7 @@
 <description>By setting <code>title="action"</code> will help to create the action list items.
     Below examples shows declarative way to bind the list items.</description>
 <component-example>
-    <fdp-action-list-item-example></fdp-action-list-item-example>
+    <fdp-platform-action-list-item-example></fdp-platform-action-list-item-example>
 </component-example>
 <code-example [exampleFiles]="simpleALI"></code-example>
 <separator></separator>
@@ -14,7 +14,7 @@
 <description>This examples displays the action list items with no border when <code> noBorder="true"</code> in
     fdp-list. and compact mode when <code>contentDensity="compact"</code> in fdp-list.</description>
 <component-example>
-    <fdp-borderless-action-list-item-example></fdp-borderless-action-list-item-example>
+    <fdp-platform-action-list-item-border-less-example></fdp-platform-action-list-item-border-less-example>
 </component-example>
 <code-example [exampleFiles]="borderLessALI"></code-example>
 <separator></separator>
diff --git a/...form/component-docs/platform-action-list-item/platform-action-list-item-docs.component.ts b/...form/component-docs/platform-action-list-item/platform-action-list-item-docs.component.ts
@@ -3,10 +3,9 @@ import { Component } from '@angular/core';
 import { ExampleFile } from '../../../documentation/core-helpers/code-example/example-file';
 
 import * as aliSrc from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-example.component.html';
-import * as aliSrcTs from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-example.component.ts';
-import * as borderLessALISrc from '!raw-loader!./platform-action-list-item-examples/platform-borderless-action-list-item-example.component.html';
-import * as borderLessALITs from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-border-less-example.component.ts';
-
+import * as aliSrcTs from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-example.component';
+import * as borderLessALISrc from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-border-less-example.component.html';
+import * as borderLessALITs from '!raw-loader!./platform-action-list-item-examples/platform-action-list-item-border-less-example.component';
 
 @Component({
     selector: 'app-action-list-item',
@@ -23,21 +22,21 @@ export class PlatformActionListItemDocsComponent {
             language: 'typescript',
             component: 'PlatformActionListItemExampleComponent',
             code: aliSrcTs,
-            fileName: 'platform-borderless-action-list-item-example'
+            fileName: 'platform-action-list-item-example'
         }
     ];
 
     borderLessALI: ExampleFile[] = [
         {
             language: 'html',
             code: borderLessALISrc,
-            fileName: 'platform-borderless-action-list-item-example',
+            fileName: 'platform-action-list-item-border-less-example',
         },
         {
             language: 'typescript',
             component: 'PlatformActionListItemBorderLessExampleComponent',
             code: borderLessALITs,
-            fileName: 'platform-borderless-action-list-item-example'
+            fileName: 'platform-action-list-item-border-less-example'
         }
     ];
 

diff --git a/...s-action-list-item-example.component.html → ...t-item-border-less-example.component.html b/...s-action-list-item-example.component.html → ...t-item-border-less-example.component.html
diff --git a/...form-action-list-item-examples/platform-action-list-item-border-less-example.component.ts b/...form-action-list-item-examples/platform-action-list-item-border-less-example.component.ts
@@ -6,8 +6,8 @@ export interface Action {
     title: string;
 }
 @Component({
-    selector: 'fdp-borderless-action-list-item-example',
-    templateUrl: './platform-borderless-action-list-item-example.component.html'
+    selector: 'fdp-platform-action-list-item-border-less-example',
+    templateUrl: './platform-action-list-item-border-less-example.component.html'
 })
 export class PlatformActionListItemBorderLessExampleComponent {
     items: Action[] = [

diff --git a/...st-item/platform-action-list-item-examples/platform-action-list-item-example.component.ts b/...st-item/platform-action-list-item-examples/platform-action-list-item-example.component.ts
@@ -5,7 +5,7 @@ import { ActionChangeEvent } from '@fundamental-ngx/platform';
 import { Action } from './platform-action-list-item-border-less-example.component';
 
 @Component({
-    selector: 'fdp-action-list-item-example',
+    selector: 'fdp-platform-action-list-item-example',
     templateUrl: './platform-action-list-item-example.component.html'
 })
 export class PlatformActionListItemExampleComponent {

diff --git a/.../component-docs/platform-display-list-item/platform-display-list-item-docs.component.html b/.../component-docs/platform-display-list-item/platform-display-list-item-docs.component.html
@@ -10,8 +10,8 @@
     to bind the list items.
     Where we can pass list items individually where a number of items are less</description>
 <component-example>
-    <fdp-borderless-display-list-item-example>
-    </fdp-borderless-display-list-item-example>
+    <fdp-platform-display-list-item-border-less-example>
+    </fdp-platform-display-list-item-border-less-example>
 </component-example>
 <code-example [exampleFiles]="borderLessDLI"></code-example>
 <separator></separator>
@@ -24,8 +24,8 @@
     <code>[link]</code> will help to get into the desired destination on click of navigation. Below example shows
     declarative way to use it.</description>
 <component-example>
-    <fdp-display-list-item-with-navigation-example>
-    </fdp-display-list-item-with-navigation-example>
+    <fdp-platform-display-list-item-with-navigation-example>
+    </fdp-platform-display-list-item-with-navigation-example>
 </component-example>
 <code-example [exampleFiles]="dliWithNavigation"></code-example>
 <separator></separator>
diff --git a/...rm/component-docs/platform-display-list-item/platform-display-list-item-docs.component.ts b/...rm/component-docs/platform-display-list-item/platform-display-list-item-docs.component.ts
@@ -3,10 +3,10 @@ import { Component } from '@angular/core';
 import { ExampleFile } from '../../../documentation/core-helpers/code-example/example-file';
 
 import * as dliSrc from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-example.component.html';
-import * as borderLessDLISrc from '!raw-loader!./platform-display-list-item-examples/platform-borderless-display-list-item-example.component.html';
-import * as borderLessDLITs from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-border-less-example.component.ts';
+import * as borderLessDLISrc from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-border-less-example.component.html';
+import * as borderLessDLITs from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-border-less-example.component';
 import * as dliWithNavigation from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-with-navigation-example.component.html';
-
+import * as dliWithNavigationTs from '!raw-loader!./platform-display-list-item-examples/platform-display-list-item-with-navigation-example.component.ts';
 
 @Component({
     selector: 'app-standard-list-item',
@@ -25,13 +25,13 @@ export class PlatformDisplayListItemDocsComponent {
         {
             language: 'html',
             code: borderLessDLISrc,
-            fileName: 'platform-borderless-display-list-item-example',
+            fileName: 'platform-display-list-item-border-less-example',
         },
         {
             language: 'typescript',
-            component: 'PlatformDisplayListBorderLessExampleComponent',
+            component: 'PlatformDisplayListItemBorderLessExampleComponent',
             code: borderLessDLITs,
-            fileName: 'platform-borderless-display-list-item-example'
+            fileName: 'platform-display-list-item-border-less-example'
         }
     ];
 
@@ -40,6 +40,12 @@ export class PlatformDisplayListItemDocsComponent {
             language: 'html',
             code: dliWithNavigation,
             fileName: 'platform-display-list-item-with-navigation-example',
+        },
+        {
+            language: 'typescript',
+            component: 'PlatformDisplayListItemWithNavigationExampleComponent',
+            code: dliWithNavigationTs,
+            fileName: 'platform-display-list-item-with-navigation-example'
         }
     ];
 

diff --git a/...tform/component-docs/platform-display-list-item/platform-display-list-item-docs.module.ts b/...tform/component-docs/platform-display-list-item/platform-display-list-item-docs.module.ts
@@ -11,10 +11,8 @@ import { API_FILES } from '../../api-files';
 
 import { PlatformDisplayListItemHeaderComponent } from './platform-display-list-item-header/platform-display-list-item-header.component';
 import { PlatformDisplayListItemDocsComponent } from './platform-display-list-item-docs.component';
-import {
-    PlatformDisplayListItemExampleComponent,
-    PlatformDisplayListItemWithNavigationExampleComponent
-} from './platform-display-list-item-examples/platform-display-list-item-example.component';
+import { PlatformDisplayListItemExampleComponent } from './platform-display-list-item-examples/platform-display-list-item-example.component';
+import { PlatformDisplayListItemWithNavigationExampleComponent } from './platform-display-list-item-examples/platform-display-list-item-with-navigation-example.component';
 import { PlatformDisplayListItemBorderLessExampleComponent } from './platform-display-list-item-examples/platform-display-list-item-border-less-example.component';
 const routes: Routes = [
     {

diff --git a/...-display-list-item-example.component.html → ...t-item-border-less-example.component.html b/...-display-list-item-example.component.html → ...t-item-border-less-example.component.html
diff --git a/...rm-display-list-item-examples/platform-display-list-item-border-less-example.component.ts b/...rm-display-list-item-examples/platform-display-list-item-border-less-example.component.ts
@@ -9,8 +9,8 @@ export interface Movie {
 }
 
 @Component({
-    selector: 'fdp-borderless-display-list-item-example',
-    templateUrl: './platform-borderless-display-list-item-example.component.html'
+    selector: 'fdp-platform-display-list-item-border-less-example',
+    templateUrl: './platform-display-list-item-border-less-example.component.html'
 })
 export class PlatformDisplayListItemBorderLessExampleComponent {
     items: Movie[] = [

diff --git a/...-item/platform-display-list-item-examples/platform-display-list-item-example.component.ts b/...-item/platform-display-list-item-examples/platform-display-list-item-example.component.ts
@@ -1,32 +1,7 @@
 import { Component } from '@angular/core';
 
-export interface Corona {
-    title: string;
-    secondary: string;
-}
-
 @Component({
     selector: 'fdp-display-list-item-example',
     templateUrl: './platform-display-list-item-example.component.html'
 })
 export class PlatformDisplayListItemExampleComponent { }
-
-@Component({
-    selector: 'fdp-display-list-item-with-navigation-example',
-    templateUrl: './platform-display-list-item-with-navigation-example.component.html'
-})
-export class PlatformDisplayListItemWithNavigationExampleComponent {
-    items: Corona[] = [
-        {
-            'title': 'First Stage',
-            'secondary': 'First stage take medical help on call (Standard text)'
-        },
-        {
-            'title': 'Second Stage',
-            'secondary': 'Second stage take medical help in person (Standard text)'
-        },
-        {
-            'title': 'Third Stage',
-            'secondary': 'Third stage admit in hospital (Standard text)'
-        }];
-}
diff --git a/...isplay-list-item-examples/platform-display-list-item-with-navigation-example.component.ts b/...isplay-list-item-examples/platform-display-list-item-with-navigation-example.component.ts
@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+
+export interface Corona {
+    title: string;
+    secondary: string;
+}
+
+@Component({
+    selector: 'fdp-platform-display-list-item-with-navigation-example',
+    templateUrl: './platform-display-list-item-with-navigation-example.component.html'
+})
+export class PlatformDisplayListItemWithNavigationExampleComponent {
+    items: Corona[] = [
+        {
+            title: 'First Stage',
+            secondary: 'First stage take medical help on call (Standard text)'
+        },
+        {
+            title: 'Second Stage',
+            secondary: 'Second stage take medical help in person (Standard text)'
+        },
+        {
+            title: 'Third Stage',
+            secondary: 'Third stage admit in hospital (Standard text)'
+        }
+    ];
+}
diff --git a/...forms/multi-input/platform-mulit-input-example/platform-mulit-input-disabled.component.ts b/...forms/multi-input/platform-mulit-input-example/platform-mulit-input-disabled.component.ts
diff --git a/...rm-forms/multi-input/platform-mulit-input-header/platform-mulit-input-header.component.ts b/...rm-forms/multi-input/platform-mulit-input-header/platform-mulit-input-header.component.ts
diff --git a/...atform/component-docs/platform-forms/multi-input/platform-multi-input-docs.component.html b/...atform/component-docs/platform-forms/multi-input/platform-multi-input-docs.component.html
@@ -1,53 +1,53 @@
-<fd-docs-section-title id="mulitInputSimple" componentName="mulitInputSimple">
+<fd-docs-section-title id="multiInputSimple" componentName="multi-input">
     Multi Input With Simple list
 </fd-docs-section-title>
 <description> This example shows default Multi Input with simple list implementation. </description>
 <component-example>
     <fdp-platform-multi-input-example></fdp-platform-multi-input-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputSimple"></code-example>
+<code-example [exampleFiles]="multiInputSimple"></code-example>
 <separator></separator>
 
-<fd-docs-section-title id="mulitInputcomplex" componentName="mulitInputcomplex">
+<fd-docs-section-title id="multiInputcomplex" componentName="multi-input">
     Multi Input With Value help dialog box with complex Objects object
 </fd-docs-section-title>
 <description> This example shows default Multi Input with simple list implementation. </description>
 <component-example>
     <fdp-platform-multi-input-complex-example></fdp-platform-multi-input-complex-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputValueHelp"></code-example>
+<code-example [exampleFiles]="multiInputValueHelp"></code-example>
 <separator></separator>
 
-<fd-docs-section-title id="mulitInputGrouped" componentName="mulitInputGrouped">
+<fd-docs-section-title id="multiInputGrouped" componentName="multi-input">
     Multi Input With Grouped list
 </fd-docs-section-title>
 <description> This example shows default Multi Input with simple list implementation. </description>
 <component-example>
     <fdp-platform-multi-input-grouped-example></fdp-platform-multi-input-grouped-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputGrouped"></code-example>
+<code-example [exampleFiles]="multiInputGrouped"></code-example>
 <separator></separator>
 
-<fd-docs-section-title id="MultiInputDecline" componentName="MultiInputDecline">
+<fd-docs-section-title id="MultiInputDecline" componentName="multi-input">
     Multi Input With Decline List type
 </fd-docs-section-title>
 <description> This example shows default Multi Input with simple list implementation. </description>
 <component-example>
     <fdp-platform-multi-input-decline-example></fdp-platform-multi-input-decline-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputDecline"></code-example>
+<code-example [exampleFiles]="multiInputDecline"></code-example>
 <separator></separator>
 
-<fd-docs-section-title id="MultiInputDecline" componentName="MultiInputDecline">
+<fd-docs-section-title id="MultiInputDecline" componentName="multi-input">
     Multi Input Disabled
 </fd-docs-section-title>
 <description> This example shows default Multi Input with simple list implementation. </description>
 <component-example>
     <fdp-platform-multi-input-disabled></fdp-platform-multi-input-disabled>
 </component-example>
-<code-example [exampleFiles]="mulitiInputDisable"></code-example>
+<code-example [exampleFiles]="multiInputDisable"></code-example>
 <separator></separator>
-<fd-docs-section-title id="MultiInputMobile" componentName="MultiInputMobile">
+<fd-docs-section-title id="MultiInputMobile" componentName="multi-input">
     Multi Input Mobile
 </fd-docs-section-title>
 <description>
@@ -56,10 +56,10 @@
 <component-example>
     <fdp-platform-multi-input-mobile-example></fdp-platform-multi-input-mobile-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputMobile"></code-example>
+<code-example [exampleFiles]="multiInputMobile"></code-example>
 <separator></separator>
 
-<fd-docs-section-title id="MultiInputMobile" componentName="MultiInputMobile">
+<fd-docs-section-title id="MultiInputMobile" componentName="multi-input">
     Multi Input reactive
 </fd-docs-section-title>
 <description>
@@ -68,5 +68,5 @@
 <component-example>
     <fdp-platform-multi-input-reactive-example></fdp-platform-multi-input-reactive-example>
 </component-example>
-<code-example [exampleFiles]="mulitiInputReactive"></code-example>
+<code-example [exampleFiles]="multiInputReactive"></code-example>
 <separator></separator>