ELEMENTS-1237: add nuxeo-directory-radio-group to storybook

nuxeo · Nov 2, 2020 · ede833f · ede833f
1 parent 77abbad
commit ede833f
Show file tree

Hide file tree

Showing 3 changed files with 95 additions and 1 deletion.
diff --git a/storybook/src/data/directory-suggestion.data.js b/storybook/src/data/directory-suggestion.data.js
@@ -0,0 +1,70 @@
+export const DIRECTORY_SUGGESTION_ENTRIES = [
+  {
+    absoluteLabel: 'Arabic',
+    computedId: 'ar',
+    directoryName: 'language',
+    displayLabel: 'Arabic',
+    'entity-type': 'directoryEntry',
+    id: 'ar',
+    label: 'Arabic',
+    obsolete: 0,
+    ordering: 10000000,
+    properties: {
+      id: 'ar',
+      label: 'Arabic',
+      obsolete: 0,
+      ordering: 10000000,
+    },
+  },
+  {
+    absoluteLabel: 'Chinese',
+    computedId: 'zh',
+    directoryName: 'language',
+    displayLabel: 'Chinese',
+    'entity-type': 'directoryEntry',
+    id: 'zh',
+    label: 'Chinese',
+    obsolete: 0,
+    ordering: 10000000,
+    properties: {
+      id: 'zh',
+      label: 'Chinese',
+      obsolete: 0,
+      ordering: 10000000,
+    },
+  },
+  {
+    absoluteLabel: 'English',
+    computedId: 'en',
+    directoryName: 'language',
+    displayLabel: 'English',
+    'entity-type': 'directoryEntry',
+    id: 'en',
+    label: 'English',
+    obsolete: 0,
+    ordering: 10000000,
+    properties: {
+      id: 'en',
+      label: 'English',
+      obsolete: 0,
+      ordering: 10000000,
+    },
+  },
+  {
+    absoluteLabel: 'French',
+    computedId: 'fr',
+    directoryName: 'language',
+    displayLabel: 'French',
+    'entity-type': 'directoryEntry',
+    id: 'fr',
+    label: 'French',
+    obsolete: 0,
+    ordering: 10000000,
+    properties: {
+      id: 'fr',
+      label: 'French',
+      obsolete: 0,
+      ordering: 10000000,
+    },
+  },
+];
diff --git a/storybook/src/elements/nuxeo-directory-radio-group/nuxeo-directory-radio-group.stories.js b/storybook/src/elements/nuxeo-directory-radio-group/nuxeo-directory-radio-group.stories.js
@@ -0,0 +1,20 @@
+import { html } from 'lit-html';
+import { storiesOf } from '@storybook/polymer';
+import '@nuxeo/nuxeo-ui-elements/widgets/nuxeo-directory-radio-group.js';
+import { DIRECTORY_SUGGESTION_ENTRIES } from '../../data/directory-suggestion.data.js';
+
+storiesOf('UI/nuxeo-directory-radio-group', module).add('Default', () => {
+  const server = window.nuxeo.mock;
+  server.respondWith('post', '/api/v1/automation/Directory.SuggestEntries', () => DIRECTORY_SUGGESTION_ENTRIES);
+
+  return html`
+    <style>
+      .container {
+        margin: 2rem;
+      }
+    </style>
+    <div class="container">
+      <nuxeo-directory-radio-group label="Select language" directory-name="language"> </nuxeo-directory-radio-group>
+    </div>
+  `;
+});
diff --git a/storybook/src/elements/widgets/widget.stories.js b/storybook/src/elements/widgets/widget.stories.js
@@ -6,9 +6,13 @@ import '@nuxeo/nuxeo-ui-elements/widgets/nuxeo-input';
 import '@nuxeo/nuxeo-ui-elements/widgets/nuxeo-textarea';
 import '@nuxeo/nuxeo-ui-elements/widgets/nuxeo-date-picker';
 import '@nuxeo/nuxeo-ui-elements/nuxeo-data-table/iron-data-table.js';
+import '@nuxeo/nuxeo-ui-elements/widgets/nuxeo-directory-radio-group.js';
+import { DIRECTORY_SUGGESTION_ENTRIES } from '../../data/directory-suggestion.data.js';
 import { LIST } from '../../data/lists.data';
 
 const data = ['item1', 'item2', 'item3', 'item4', 'item5', 'item6', 'item7', 'item8', 'item9', 'item10'];
+const server = window.nuxeo.mock;
+server.respondWith('post', '/api/v1/automation/Directory.SuggestEntries', () => DIRECTORY_SUGGESTION_ENTRIES);
 storiesOf('Widgets', module).add('Vertical Alignment Consistency', () => {
   const label = text('Label', 'Label');
   const placeholder = text('Placeholder', 'Placeholder');
@@ -208,7 +212,7 @@ storiesOf('Widgets', module).add('Vertical Alignment Consistency', () => {
         >
         </nuxeo-selectivity>
         <nuxeo-date-picker label="${label}" placeholder="Placeholder"></nuxeo-date-picker>
-        <nuxeo-textarea label="${label}" placeholder="Placeholder"></nuxeo-textarea>
+        <nuxeo-directory-radio-group label="Select language" directory-name="language"> </nuxeo-directory-radio-group>
       </div>
     </div>
   `;