npm - @infineon/infineon-design-system-stencil - Versions diffs - 31.0.0--canary.1697.223df0ff1431a5398fd1261ed013c9dd2a89e7a0.0 → 31.0.0--canary.1640.0cb387dc208aadd19f988395e2eb1027e7e7f343.0 - Mend

@infineon/infineon-design-system-stencil 31.0.0--canary.1697.223df0ff1431a5398fd1261ed013c9dd2a89e7a0.0 → 31.0.0--canary.1640.0cb387dc208aadd19f988395e2eb1027e7e7f343.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (290) hide show

package/dist/collection/components/dropdown/dropdown.stories.js CHANGED Viewed

@@ -4,25 +4,22 @@ export default {
     title: 'Components/Dropdown',
     tags: ['autodocs'],
     args: {
-        Label: 'Dropdown',
-        variant: 'primary',
+        label: 'Dropdown',
         disabled: false,
-        icon: 'c-check-16',
-        size: 'm',
-        Search: false,
-        Header: false,
-        href: '',
-        target: '_self',
-        Separator: false,
-        DropDownMenuItemIcon: false,
         defaultOpen: false,
         noCloseOnOutsideClick: false,
         noCloseOnMenuClick: false,
         noAppendToBody: false,
+        variant: 'primary',
         placement: 'bottom-start',
+        size: 'm',
+        href: '',
+        target: '_self',
+        icon: 'c-info-16',
     },
     argTypes: {
         placement: {
+            description: 'Specifies the position of the dropdown relative to its trigger element.',
             options: [
                 'auto',
                 'auto-start',
@@ -40,57 +37,132 @@ export default {
                 'left-start',
                 'left-end',
             ],
-            control: { type: 'select' },
+            control: 'select',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: 'bottom-start'
+                }
+            }
         },
-        Label: {
-            description: 'The visible name or label for the dropdown button',
+        label: {
+            name: 'Label of Dropdown Trigger Button',
+            description: 'Set the label displayed on the *<ifx-dropdown-trigger-button>*.',
+            table: {
+                category: 'story controls',
+                defaultValue: {
+                    summary: 'Dropdown'
+                }
+            }
             // if: { arg: 'Type', eq: 'Default' }
         },
         size: {
-            description: 'Font Size options for menu items: s (14px) and m (16px) - default: m',
+            description: 'Font Size options for menu items: s (14px) and m (16px) - default: m.',
             options: ['s', 'm'],
-            control: { type: 'radio' },
+            control: 'radio',
+            table: {
+                category: 'ifx-dropdown-menu props',
+                defaultValue: {
+                    summary: 'm'
+                }
+            }
+        },
+        disabled: {
+            description: 'Determines if the dropdown button should be disabled.',
+            control: 'boolean',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: false
+                }
+            }
         },
-        disabled: { description: 'Determines if the dropdown button should be disabled' },
         variant: {
-            description: 'The visual style of the dropdown button. Accepted values are "primary", "secondary", "tertiary"',
+            description: 'The visual style of the dropdown button. Accepted values are "primary", "secondary", "tertiary".',
             options: ['primary', 'secondary', 'tertiary'],
-            control: { type: 'radio' },
+            control: 'radio',
+            table: {
+                category: 'ifx-dropdown-trigger-button props',
+                defaultValue: {
+                    summary: 'primary'
+                }
+            }
             // if: { arg: 'Type', eq: 'Default' }
         },
         target: {
+            description: 'Determines where to open the linked document when the dropdown item is clicked.',
             options: ['_self', '_blank'],
-            control: { type: 'radio' },
+            control: 'radio',
+            table: {
+                category: 'ifx-dropdown-item props',
+                defaultValue: {
+                    summary: '_self'
+                }
+            }
         },
         href: {
-            description: 'href link to menu item'
+            description: 'href link to menu item.',
+            table: {
+                category: 'ifx-dropdown-item props'
+            }
         },
         icon: {
-            description: 'The icon to be displayed on the dropdown button',
-            options: Object.values(icons).map(i => i['name']),
-            control: { type: 'select' },
+            description: 'The icon to be displayed on the dropdown items.',
+            options: ['none', ...Object.values(icons).map(i => i['name'])],
+            control: 'select',
+            table: {
+                category: 'ifx-dropdown-item props',
+                defaultValue: {
+                    summary: 'c-info-16'
+                }
+            }
             // if: { arg: 'Type', eq: 'Label Trigger' }
         },
-        Search: {
-            description: 'Show Search Bar'
+        defaultOpen: {
+            description: 'Determines if the dropdown should be open by default.',
+            control: 'boolean',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: false
+                }
+            }
         },
-        Header: {
-            description: 'Add Header Text'
+        noCloseOnOutsideClick: {
+            description: 'Determines if the dropdown should not close when a click outside the dropdown happens.',
+            control: 'boolean',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: false
+                }
+            }
         },
-        Separator: {
-            description: 'Use seperator in dropdown'
+        noCloseOnMenuClick: {
+            description: 'Determines if the dropdown should not close when a click inside the dropdown menu happens.',
+            control: 'boolean',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: false
+                }
+            }
         },
-        DropDownMenuItemIcon: {
-            description: 'Show menu item icon in dropdown'
+        noAppendToBody: {
+            description: 'Determines if the dropdown should not be appended to the body.',
+            control: 'boolean',
+            table: {
+                category: 'ifx-dropdown props',
+                defaultValue: {
+                    summary: false
+                }
+            }
         },
-        defaultOpen: { description: 'Determines if the dropdown should be open by default' },
-        noCloseOnOutsideClick: { description: 'Determines if the dropdown should not close when a click outside the dropdown happens' },
-        noCloseOnMenuClick: { description: 'Determines if the dropdown should not close when a click inside the dropdown menu happens' },
-        noAppendToBody: { description: 'Determines if the dropdown should not be appended to the body' },
         ifxOpen: {
             action: 'ifxOpen',
-            description: 'Custom event that is emitted when the dropdown opens',
+            description: 'Custom event that is emitted when the dropdown opens.',
             table: {
+                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxOpen={handleChange}\nVue:@ifxOpen="handleChange"\nAngular:(ifxOpen)="handleChange()"\nVanillaJs:.addEventListener("ifxOpen", (event) => {//handle change});',
@@ -99,8 +171,9 @@ export default {
         },
         ifxClose: {
             action: 'ifxClose',
-            description: 'Custom event emitted when dropdown closes',
+            description: 'Custom event emitted when dropdown closes.',
             table: {
+                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxClose={handleChange}\nVue:@ifxClose="handleChange"\nAngular:(ifxClose)="handleChange()"\nVanillaJs:.addEventListener("ifxClose", (event) => {//handle change});',
@@ -109,8 +182,9 @@ export default {
         },
         ifxDropdownMenuItem: {
             action: 'ifxDropdownMenuItem',
-            description: 'Custom event emitted when an item is selected',
+            description: 'Custom event emitted by ifx-dropdown-menu when an item is selected.',
             table: {
+                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxDropdownMenuItem={handleChange}\nVue:@ifxDropdownMenuItem="handleChange"\nAngular:(ifxDropdownMenuItem)="handleChange()"\nVanillaJs:.addEventListener("ifxDropdownMenuItem", (event) => {//handle change});',
@@ -129,18 +203,15 @@ const DefaultTemplate = args => {
   no-append-to-body="${args.noAppendToBody}">
     <ifx-dropdown-trigger-button variant="${args.variant}">
-      ${args.Label}
+      ${args.label}
     </ifx-dropdown-trigger-button>
   <ifx-dropdown-menu size="${args.size}">
-    ${args.Header ? `<ifx-dropdown-header>Header Text</ifx-dropdown-header>` : ''}
-    ${args.Search ? `<ifx-search-field show-delete-icon="false"></ifx-search-field>` : ''}
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    ${args.Separator ? `<ifx-dropdown-separator></ifx-dropdown-separator>` : ''}
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
   </ifx-dropdown-menu>
 </ifx-dropdown>`;
     const dropdown = wrapper.querySelector('ifx-dropdown');
@@ -151,13 +222,6 @@ const DefaultTemplate = args => {
     return wrapper;
 };
 export const Default = DefaultTemplate.bind({});
-Default.argTypes = {
-    icon: {
-        table: {
-            disable: true
-        }
-    }
-};
 const LabelTriggerTemplate = args => {
     const wrapper = document.createElement('div');
     wrapper.innerHTML = `<ifx-dropdown
@@ -170,18 +234,15 @@ const LabelTriggerTemplate = args => {
   >
     Hello World! Click on the text to open the dropdown
     <ifx-dropdown-trigger>
-      <ifx-icon icon="${args.icon}"></ifx-icon>
+      <ifx-icon icon="${'c-check-16'}"></ifx-icon>
     </ifx-dropdown-trigger>
     Some more text
   <ifx-dropdown-menu size="${args.size}">
-    ${args.Header ? `<ifx-dropdown-header>Header Text</ifx-dropdown-header>` : ''}
-    ${args.Search ? `<ifx-search-field show-delete-icon="false"></ifx-search-field>` : ''}
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
-    ${args.Separator ? `<ifx-dropdown-separator></ifx-dropdown-separator>` : ''}
-    <ifx-dropdown-item icon="${args.DropDownMenuItemIcon ? 'c-info-16' : ''}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
   </ifx-dropdown-menu>
 </ifx-dropdown>`;
     const dropdown = wrapper.querySelector('ifx-dropdown');
@@ -193,7 +254,7 @@ const LabelTriggerTemplate = args => {
 };
 export const LabelTrigger = LabelTriggerTemplate.bind({});
 LabelTrigger.argTypes = {
-    Label: {
+    label: {
         table: {
             disable: true
         }
@@ -204,4 +265,101 @@ LabelTrigger.argTypes = {
         }
     }
 };
+const HeaderTemplate = args => {
+    const wrapper = document.createElement('div');
+    wrapper.innerHTML = `<ifx-dropdown
+  placement="${args.placement}"
+  default-open="${args.defaultOpen}"
+  no-close-on-outside-click="${args.noCloseOnOutsideClick}"
+  no-close-on-menu-click="${args.noCloseOnOutsideClick}"
+  no-append-to-body="${args.noAppendToBody}">
+  <ifx-dropdown-header>Dropdown Header</ifx-dropdown-header>
+   <ifx-dropdown-trigger-button variant="${args.variant}">
+      ${args.label}
+    </ifx-dropdown-trigger-button>
+     <ifx-dropdown-menu size="${args.size}">
+    <ifx-dropdown-header>Header Text</ifx-dropdown-header>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+  </ifx-dropdown-menu>
+</ifx-dropdown>`;
+    const dropdown = wrapper.querySelector('ifx-dropdown');
+    const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');
+    dropdown.addEventListener('ifxOpen', action('ifxOpen'));
+    dropdown.addEventListener('ifxClose', action('ifxClose'));
+    dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));
+    return wrapper;
+};
+export const Header = HeaderTemplate.bind({});
+Header.argTypes = {
+    label: {
+        table: {
+            disable: true
+        }
+    },
+    variant: {
+        table: {
+            disable: true
+        }
+    },
+};
+const SearchTemplate = args => {
+    const wrapper = document.createElement('div');
+    wrapper.innerHTML = `<ifx-dropdown
+  placement="${args.placement}"
+  default-open="${args.defaultOpen}"
+  no-close-on-outside-click="${args.noCloseOnOutsideClick}"
+  no-close-on-menu-click="${args.noCloseOnOutsideClick}"
+  no-append-to-body="${args.noAppendToBody}">
+   <ifx-dropdown-trigger-button variant="${args.variant}">
+      ${args.label}
+    </ifx-dropdown-trigger-button>
+     <ifx-dropdown-menu size="${args.size}">
+    <ifx-search-field show-delete-icon="false"></ifx-search-field>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+  </ifx-dropdown-menu>
+</ifx-dropdown>`;
+    const dropdown = wrapper.querySelector('ifx-dropdown');
+    const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');
+    dropdown.addEventListener('ifxOpen', action('ifxOpen'));
+    dropdown.addEventListener('ifxClose', action('ifxClose'));
+    dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));
+    return wrapper;
+};
+export const SearchField = SearchTemplate.bind({});
+const SeparatorTemplate = args => {
+    const wrapper = document.createElement('div');
+    wrapper.innerHTML = `<ifx-dropdown
+  placement="${args.placement}"
+  default-open="${args.defaultOpen}"
+   no-close-on-outside-click="${args.noCloseOnOutsideClick}"
+  no-close-on-menu-click="${args.noCloseOnOutsideClick}"
+  no-append-to-body="${args.noAppendToBody}">
+   <ifx-dropdown-trigger-button variant="${args.variant}">
+      ${args.label}
+    </ifx-dropdown-trigger-button>
+     <ifx-dropdown-menu size="${args.size}">
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+    <ifx-dropdown-separator></ifx-dropdown-separator>
+    <ifx-dropdown-item icon="${args.icon === 'none' ? '' : args.icon}" target="${args.target}" href="${args.href !== '' ? args.href : ''}">Menu Item</ifx-dropdown-item>
+  </ifx-dropdown-menu>
+</ifx-dropdown>`;
+    const dropdown = wrapper.querySelector('ifx-dropdown');
+    const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');
+    dropdown.addEventListener('ifxOpen', action('ifxOpen'));
+    dropdown.addEventListener('ifxClose', action('ifxClose'));
+    dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));
+    return wrapper;
+};
+export const Separator = SeparatorTemplate.bind({});
 //# sourceMappingURL=dropdown.stories.js.map

package/dist/collection/components/dropdown/dropdown.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.stories.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport { icons } from '@infineon/infineon-icons';\n\nexport default {\n title: 'Components/Dropdown',\n tags: ['autodocs'],\n args: {\n Label: 'Dropdown',\n variant: 'primary',\n disabled: false,\n icon: 'c-check-16',\n size: 'm',\n Search: false,\n Header: false,\n href: '',\n target: '_self',\n Separator: false,\n DropDownMenuItemIcon: false,\n defaultOpen: false,\n noCloseOnOutsideClick: false,\n noCloseOnMenuClick: false,\n noAppendToBody: false,\n placement: 'bottom-start',\n },\n argTypes: {\n placement: {\n options: [\n 'auto',\n 'auto-start',\n 'auto-end',\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'right',\n 'right-start',\n 'right-end',\n 'left',\n 'left-start',\n 'left-end',\n ],\n control: { type: 'select' },\n },\n Label: { \n description: 'The visible name or label for the dropdown button',\n // if: { arg: 'Type', eq: 'Default' }\n },\n size: {\n description: 'Font Size options for menu items: s (14px) and m (16px) - default: m',\n options: ['s', 'm'],\n control: { type: 'radio' },\n },\n disabled: { description: 'Determines if the dropdown button should be disabled' },\n variant: {\n description: 'The visual style of the dropdown button. Accepted values are \"primary\", \"secondary\", \"tertiary\"',\n options: ['primary', 'secondary', 'tertiary'],\n control: { type: 'radio' },\n // if: { arg: 'Type', eq: 'Default' }\n },\n\n target: {\n options: ['_self', '_blank'],\n control: { type: 'radio' },\n },\n href: {\n description: 'href link to menu item'\n },\n icon: {\n description: 'The icon to be displayed on the dropdown button',\n options: Object.values(icons).map(i => i['name']),\n control: { type: 'select' },\n // if: { arg: 'Type', eq: 'Label Trigger' }\n },\n Search :{\n description: 'Show Search Bar'\n },\n Header: {\n description: 'Add Header Text'\n },\n Separator:{\n description: 'Use seperator in dropdown'\n },\n DropDownMenuItemIcon: {\n description: 'Show menu item icon in dropdown'\n },\n defaultOpen: { description: 'Determines if the dropdown should be open by default' },\n noCloseOnOutsideClick: { description: 'Determines if the dropdown should not close when a click outside the dropdown happens' },\n noCloseOnMenuClick: { description: 'Determines if the dropdown should not close when a click inside the dropdown menu happens' },\n noAppendToBody: { description: 'Determines if the dropdown should not be appended to the body' },\n ifxOpen: {\n action: 'ifxOpen',\n description: 'Custom event that is emitted when the dropdown opens',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxOpen={handleChange}\\nVue:@ifxOpen=\"handleChange\"\\nAngular:(ifxOpen)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxOpen\", (event) => {//handle change});',\n },\n },\n },\n ifxClose: {\n action: 'ifxClose',\n description: 'Custom event emitted when dropdown closes',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxClose={handleChange}\\nVue:@ifxClose=\"handleChange\"\\nAngular:(ifxClose)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxClose\", (event) => {//handle change});',\n },\n },\n },\n ifxDropdownMenuItem: {\n action: 'ifxDropdownMenuItem',\n description: 'Custom event emitted when an item is selected',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxDropdownMenuItem={handleChange}\\nVue:@ifxDropdownMenuItem=\"handleChange\"\\nAngular:(ifxDropdownMenuItem)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxDropdownMenuItem\", (event) => {//handle change});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown placement=\"${args.placement}\" \n disabled=\"${args.disabled}\" \n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n no-append-to-body=\"${args.noAppendToBody}\">\n\n <ifx-dropdown-trigger-button variant=\"${args.variant}\">\n ${args.Label}\n </ifx-dropdown-trigger-button>\n\n <ifx-dropdown-menu size=\"${args.size}\">\n ${args.Header ? `<ifx-dropdown-header>Header Text</ifx-dropdown-header>` : ''}\n ${args.Search ? `<ifx-search-field show-delete-icon=\"false\"></ifx-search-field>` : ''}\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n ${args.Separator ? `<ifx-dropdown-separator></ifx-dropdown-separator>` : ''}\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n};\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {\n icon: {\n table: {\n disable: true\n }\n }\n}\n\n\n\nconst LabelTriggerTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown\n placement=\"${args.placement}\"\n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n disabled=\"${args.disabled}\"\n no-append-to-body=\"${args.noAppendToBody}\"\n >\n Hello World! Click on the text to open the dropdown\n <ifx-dropdown-trigger>\n <ifx-icon icon=\"${args.icon}\"></ifx-icon>\n </ifx-dropdown-trigger>\n Some more text\n <ifx-dropdown-menu size=\"${args.size}\">\n ${args.Header ? `<ifx-dropdown-header>Header Text</ifx-dropdown-header>` : ''}\n ${args.Search ? `<ifx-search-field show-delete-icon=\"false\"></ifx-search-field>` : ''}\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n ${args.Separator ? `<ifx-dropdown-separator></ifx-dropdown-separator>` : ''}\n <ifx-dropdown-item icon=\"${args.DropDownMenuItemIcon ? 'c-info-16' : ''}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n};\n\nexport const LabelTrigger = LabelTriggerTemplate.bind({});\nLabelTrigger.argTypes = {\n Label: {\n table: {\n disable: true\n }\n },\n variant: {\n table: {\n disable: true\n }\n }\n}\n"]}
1	+ {"version":3,"file":"dropdown.stories.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport { icons } from '@infineon/infineon-icons';\n\nexport default {\n title: 'Components/Dropdown',\n tags: ['autodocs'],\n args: {\n label: 'Dropdown',\n disabled: false,\n defaultOpen: false,\n noCloseOnOutsideClick: false,\n noCloseOnMenuClick: false,\n noAppendToBody: false,\n variant: 'primary',\n placement: 'bottom-start',\n size: 'm',\n href: '',\n target: '_self',\n icon: 'c-info-16',\n },\n argTypes: {\n placement: {\n description: 'Specifies the position of the dropdown relative to its trigger element.',\n options: [\n 'auto',\n 'auto-start',\n 'auto-end',\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'right',\n 'right-start',\n 'right-end',\n 'left',\n 'left-start',\n 'left-end',\n ],\n control: 'select',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: 'bottom-start'\n }\n }\n },\n label: {\n name: 'Label of Dropdown Trigger Button',\n description: 'Set the label displayed on the <ifx-dropdown-trigger-button>.',\n table: {\n category: 'story controls',\n defaultValue: {\n summary: 'Dropdown'\n }\n }\n // if: { arg: 'Type', eq: 'Default' }\n },\n size: {\n description: 'Font Size options for menu items: s (14px) and m (16px) - default: m.',\n options: ['s', 'm'],\n control: 'radio',\n table: {\n category: 'ifx-dropdown-menu props',\n defaultValue: {\n summary: 'm'\n }\n }\n },\n disabled: {\n description: 'Determines if the dropdown button should be disabled.',\n control: 'boolean',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: false\n }\n }\n },\n variant: {\n description: 'The visual style of the dropdown button. Accepted values are \"primary\", \"secondary\", \"tertiary\".',\n options: ['primary', 'secondary', 'tertiary'],\n control: 'radio',\n table: {\n category: 'ifx-dropdown-trigger-button props',\n defaultValue: {\n summary: 'primary'\n }\n }\n // if: { arg: 'Type', eq: 'Default' }\n },\n\n target: {\n description: 'Determines where to open the linked document when the dropdown item is clicked.',\n options: ['_self', '_blank'],\n control: 'radio',\n table: {\n category: 'ifx-dropdown-item props',\n defaultValue: {\n summary: '_self'\n }\n }\n },\n href: {\n description: 'href link to menu item.',\n table: {\n category: 'ifx-dropdown-item props'\n }\n },\n icon: {\n description: 'The icon to be displayed on the dropdown items.',\n options: ['none', ...Object.values(icons).map(i => i['name'])],\n control: 'select',\n table: {\n category: 'ifx-dropdown-item props',\n defaultValue: {\n summary: 'c-info-16'\n }\n }\n // if: { arg: 'Type', eq: 'Label Trigger' }\n },\n defaultOpen: {\n description: 'Determines if the dropdown should be open by default.',\n control: 'boolean',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: false\n }\n }\n },\n noCloseOnOutsideClick: {\n description: 'Determines if the dropdown should not close when a click outside the dropdown happens.',\n control: 'boolean',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: false\n }\n }\n },\n noCloseOnMenuClick: {\n description: 'Determines if the dropdown should not close when a click inside the dropdown menu happens.',\n control: 'boolean',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: false\n }\n }\n },\n noAppendToBody: {\n description: 'Determines if the dropdown should not be appended to the body.',\n control: 'boolean',\n table: {\n category: 'ifx-dropdown props',\n defaultValue: {\n summary: false\n }\n }\n },\n ifxOpen: {\n action: 'ifxOpen',\n description: 'Custom event that is emitted when the dropdown opens.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxOpen={handleChange}\\nVue:@ifxOpen=\"handleChange\"\\nAngular:(ifxOpen)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxOpen\", (event) => {//handle change});',\n },\n },\n },\n ifxClose: {\n action: 'ifxClose',\n description: 'Custom event emitted when dropdown closes.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxClose={handleChange}\\nVue:@ifxClose=\"handleChange\"\\nAngular:(ifxClose)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxClose\", (event) => {//handle change});',\n },\n },\n },\n ifxDropdownMenuItem: {\n action: 'ifxDropdownMenuItem',\n description: 'Custom event emitted by ifx-dropdown-menu when an item is selected.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxDropdownMenuItem={handleChange}\\nVue:@ifxDropdownMenuItem=\"handleChange\"\\nAngular:(ifxDropdownMenuItem)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxDropdownMenuItem\", (event) => {//handle change});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown placement=\"${args.placement}\" \n disabled=\"${args.disabled}\" \n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n no-append-to-body=\"${args.noAppendToBody}\">\n\n <ifx-dropdown-trigger-button variant=\"${args.variant}\">\n ${args.label}\n </ifx-dropdown-trigger-button>\n\n <ifx-dropdown-menu size=\"${args.size}\">\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n};\n\nexport const Default = DefaultTemplate.bind({});\n\n\nconst LabelTriggerTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown\n placement=\"${args.placement}\"\n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n disabled=\"${args.disabled}\"\n no-append-to-body=\"${args.noAppendToBody}\"\n >\n Hello World! Click on the text to open the dropdown\n <ifx-dropdown-trigger>\n <ifx-icon icon=\"${'c-check-16'}\"></ifx-icon>\n </ifx-dropdown-trigger>\n Some more text\n <ifx-dropdown-menu size=\"${args.size}\">\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n};\n\nexport const LabelTrigger = LabelTriggerTemplate.bind({});\nLabelTrigger.argTypes = {\n label: {\n table: {\n disable: true\n }\n },\n variant: {\n table: {\n disable: true\n }\n }\n}\n\nconst HeaderTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown\n placement=\"${args.placement}\"\n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n no-append-to-body=\"${args.noAppendToBody}\">\n <ifx-dropdown-header>Dropdown Header</ifx-dropdown-header>\n <ifx-dropdown-trigger-button variant=\"${args.variant}\">\n ${args.label}\n </ifx-dropdown-trigger-button>\n <ifx-dropdown-menu size=\"${args.size}\">\n <ifx-dropdown-header>Header Text</ifx-dropdown-header>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n}\n\nexport const Header = HeaderTemplate.bind({});\nHeader.argTypes = {\n label: {\n table: {\n disable: true\n }\n },\n variant: {\n table: {\n disable: true\n }\n },\n}\n\nconst SearchTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown\n placement=\"${args.placement}\"\n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n no-append-to-body=\"${args.noAppendToBody}\">\n <ifx-dropdown-trigger-button variant=\"${args.variant}\">\n ${args.label}\n </ifx-dropdown-trigger-button>\n <ifx-dropdown-menu size=\"${args.size}\">\n <ifx-search-field show-delete-icon=\"false\"></ifx-search-field>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n}\n\nexport const SearchField = SearchTemplate.bind({});\n\nconst SeparatorTemplate = args => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `<ifx-dropdown\n placement=\"${args.placement}\"\n default-open=\"${args.defaultOpen}\"\n no-close-on-outside-click=\"${args.noCloseOnOutsideClick}\"\n no-close-on-menu-click=\"${args.noCloseOnOutsideClick}\"\n no-append-to-body=\"${args.noAppendToBody}\">\n <ifx-dropdown-trigger-button variant=\"${args.variant}\">\n ${args.label}\n </ifx-dropdown-trigger-button>\n <ifx-dropdown-menu size=\"${args.size}\">\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n <ifx-dropdown-separator></ifx-dropdown-separator>\n <ifx-dropdown-item icon=\"${args.icon === 'none' ? '' : args.icon}\" target=\"${args.target}\" href=\"${args.href !== '' ? args.href : ''}\">Menu Item</ifx-dropdown-item>\n </ifx-dropdown-menu>\n</ifx-dropdown>`;\n\n const dropdown = wrapper.querySelector('ifx-dropdown') as HTMLElement;\n const dropdownMenu = dropdown.querySelector('ifx-dropdown-menu');\n\n dropdown.addEventListener('ifxOpen', action('ifxOpen'));\n dropdown.addEventListener('ifxClose', action('ifxClose'));\n dropdownMenu.addEventListener('ifxDropdownMenuItem', action('ifxDropdownMenuItem'));\n\n return wrapper;\n}\n\nexport const Separator = SeparatorTemplate.bind({});\n\n"]}

package/dist/collection/components/footer/footer.stories.js CHANGED Viewed

@@ -1,17 +1,47 @@
+import { icons } from "@infineon/infineon-icons";
 export default {
     title: 'Components/Footer',
     tags: ['autodocs'],
     args: {
         copyrightText: '© 1999 - 2024 Infineon Technologies AG',
+        href: 'http://infineon.com',
+        icon: 'home-16'
     },
     argTypes: {
-        copyrightText: { control: 'text' },
+        copyrightText: {
+            description: 'Sets the text for the copyright.',
+            control: 'text',
+            table: {
+                category: 'ifx-footer props',
+            }
+        },
+        icon: {
+            description: 'Sets the icon for the footer.',
+            options: Object.values(icons).map(i => i['name']),
+            control: { type: 'select' },
+            table: {
+                category: 'ifx-icon props',
+                type: {
+                    summary: 'string'
+                }
+            }
+        },
+        href: {
+            description: 'Sets the link for the footer.',
+            control: 'text',
+            table: {
+                category: 'ifx-link props',
+            },
+        },
     },
 };
 const DefaultTemplate = args => {
     return `
     <ifx-footer copyright-text="${args.copyrightText}">
     <div slot="socials">
+    <ifx-link variant="title" href=${args.href}>
+        <ifx-icon icon=${args.icon}></ifx-icon>
+      </ifx-link>
       <ifx-link variant="title" href="http://facebook.com/infineon">
         <ifx-icon icon="facebook"></ifx-icon>
       </ifx-link>

package/dist/collection/components/footer/footer.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"footer.stories.js","sourceRoot":"","sources":["../../../src/components/footer/footer.stories.ts"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,IAAI,EAAE;QACJ,aAAa,EAAE,wCAAwC;~~KACxD~~;IACD,QAAQ,EAAE;QACR,aAAa,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;~~KACnC~~;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE;IAC7B,OAAO;kCACyB,IAAI,CAAC,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;~~gBA2BpC~~,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE/C,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC;;;;;;;gBAOZ,CAAC;AAEjB,MAAM,CAAC,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE5C,MAAM,aAAa,GAAG,GAAG,EAAE,CACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAuDY,CAAC;AAEf,MAAM,CAAC,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["~~export~~ default {\n title: 'Components/Footer',\n tags: ['autodocs'],\n args: {\n copyrightText: '© 1999 - 2024 Infineon Technologies AG',\n },\n argTypes: {\n copyrightText: { control: 'text' },\n },\n};\n\nconst DefaultTemplate = args => {\n return `\n <ifx-footer copyright-text=\"${args.copyrightText}\">\n <div slot=\"socials\">\n <ifx-link variant=\"title\" href=\"http://facebook.com/infineon\">\n <ifx-icon icon=\"facebook\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://youtube.com/infineon\">\n <ifx-icon icon=\"youtube\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://instagram.com/infineon\">\n <ifx-icon icon=\"instagram\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://linkedin.com/infineon\">\n <ifx-icon icon=\"linkedin\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://twitter.com/infineon\">\n <ifx-icon icon=\"twitter\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://xing.com/infineon\">\n <ifx-icon icon=\"xing\"></ifx-icon>\n </ifx-link>\n </div>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n </ifx-footer>`;\n};\n\nexport const Medium = DefaultTemplate.bind({});\n\nconst SmallTemplate = () => `<ifx-footer>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n </ifx-footer>`;\n\nexport const Small = SmallTemplate.bind({});\n\nconst LargeTemplate = () =>\n `<ifx-footer>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <div slot=\"socials\">\n <ifx-link variant=\"title\" href=\"http://facebook.com/infineon\">\n <ifx-icon icon=\"facebook\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://youtube.com/infineon\">\n <ifx-icon icon=\"youtube\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://instagram.com/infineon\">\n <ifx-icon icon=\"instagram\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://linkedin.com/infineon\">\n <ifx-icon icon=\"linkedin\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://twitter.com/infineon\">\n <ifx-icon icon=\"twitter\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://xing.com/infineon\">\n <ifx-icon icon=\"xing\"></ifx-icon>\n </ifx-link>\n </div>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n</ifx-footer>`;\n\nexport const Large = LargeTemplate.bind({});\n"]}
1	+ {"version":3,"file":"footer.stories.js","sourceRoot":"","sources":["../../../src/components/footer/footer.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACjD,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,IAAI,EAAE;QACJ,aAAa,EAAE,wCAAwC;QACvD,IAAI,EAAE,qBAAqB;QAC3B,IAAI,EAAE,SAAS;KAChB;IACD,QAAQ,EAAE;QACR,aAAa,EAAE;YACb,WAAW,EAAE,kCAAkC;YAC/C,OAAO,EAAE,MAAM;YACf,KAAK,EAAE;gBACL,QAAQ,EAAE,kBAAkB;aAC7B;SACF;QACD,IAAI,EAAE;YACJ,WAAW,EAAE,+BAA+B;YAC5C,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;YACjD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,KAAK,EAAE;gBACL,QAAQ,EAAE,gBAAgB;gBAC1B,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;QACD,IAAI,EAAE;YACJ,WAAW,EAAE,+BAA+B;YAC5C,OAAO,EAAE,MAAM;YACf,KAAK,EAAE;gBACL,QAAQ,EAAE,gBAAgB;aAC3B;SACF;KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE;IAC7B,OAAO;kCACyB,IAAI,CAAC,aAAa;;qCAEf,IAAI,CAAC,IAAI;yBACrB,IAAI,CAAC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;gBA2BlB,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE/C,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC;;;;;;;gBAOZ,CAAC;AAEjB,MAAM,CAAC,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE5C,MAAM,aAAa,GAAG,GAAG,EAAE,CACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAuDY,CAAC;AAEf,MAAM,CAAC,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { icons } from '@infineon/infineon-icons';\nexport default {\n title: 'Components/Footer',\n tags: ['autodocs'],\n args: {\n copyrightText: '© 1999 - 2024 Infineon Technologies AG',\n href: 'http://infineon.com',\n icon: 'home-16'\n },\n argTypes: {\n copyrightText: {\n description: 'Sets the text for the copyright.',\n control: 'text',\n table: {\n category: 'ifx-footer props',\n }\n },\n icon: {\n description: 'Sets the icon for the footer.',\n options: Object.values(icons).map(i => i['name']),\n control: { type: 'select' },\n table: {\n category: 'ifx-icon props',\n type: {\n summary: 'string'\n }\n }\n },\n href: {\n description: 'Sets the link for the footer.',\n control: 'text',\n table: {\n category: 'ifx-link props',\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n return `\n <ifx-footer copyright-text=\"${args.copyrightText}\">\n <div slot=\"socials\">\n <ifx-link variant=\"title\" href=${args.href}>\n <ifx-icon icon=${args.icon}></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://facebook.com/infineon\">\n <ifx-icon icon=\"facebook\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://youtube.com/infineon\">\n <ifx-icon icon=\"youtube\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://instagram.com/infineon\">\n <ifx-icon icon=\"instagram\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://linkedin.com/infineon\">\n <ifx-icon icon=\"linkedin\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://twitter.com/infineon\">\n <ifx-icon icon=\"twitter\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://xing.com/infineon\">\n <ifx-icon icon=\"xing\"></ifx-icon>\n </ifx-link>\n </div>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n </ifx-footer>`;\n};\n\nexport const Medium = DefaultTemplate.bind({});\n\nconst SmallTemplate = () => `<ifx-footer>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n </ifx-footer>`;\n\nexport const Small = SmallTemplate.bind({});\n\nconst LargeTemplate = () =>\n `<ifx-footer>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link href=\"#\" variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <ifx-footer-column slot=\"col\">\n <h5 slot=\"title\">Title</h5>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n <ifx-link variant=\"underlined\" slot=\"link\">Footer Link</ifx-link>\n </ifx-footer-column>\n <div slot=\"socials\">\n <ifx-link variant=\"title\" href=\"http://facebook.com/infineon\">\n <ifx-icon icon=\"facebook\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://youtube.com/infineon\">\n <ifx-icon icon=\"youtube\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://instagram.com/infineon\">\n <ifx-icon icon=\"instagram\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://linkedin.com/infineon\">\n <ifx-icon icon=\"linkedin\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://twitter.com/infineon\">\n <ifx-icon icon=\"twitter\"></ifx-icon>\n </ifx-link>\n <ifx-link variant=\"title\" href=\"http://xing.com/infineon\">\n <ifx-icon icon=\"xing\"></ifx-icon>\n </ifx-link>\n </div>\n <div slot=\"info\">\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/terms\" target=\"_blank\">Terms</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/imprint\" target=\"_blank\">Imprint</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/privacy-policy\" target=\"_blank\">Privacy policy</ifx-link>\n <ifx-link variant=\"menu\" href=\"https://yourwebsite.com/glossary\" target=\"_blank\">Glossary</ifx-link>\n </div>\n</ifx-footer>`;\n\nexport const Large = LargeTemplate.bind({});\n"]}

package/dist/collection/components/icon/infineonIconStencil.stories.js CHANGED Viewed

@@ -8,16 +8,21 @@ export default {
     },
     argTypes: {
         icon: {
+            description: 'Set the icon.',
             options: Object.values(icons).map(i => i['name']),
             control: { type: 'select' },
+            table: {
+                category: 'ifx-icon props',
+            }
         },
         consoleError: {
             action: 'consoleError',
-            description: 'Custom event emitted when icon is invalid',
+            description: 'Custom event emitted when icon is invalid.',
             table: {
+                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
-                    detail: 'React: onConsoleError={handleChange}\nVue:@consoleError="handleChange"\nAngular:(consoleError)="handleChange()"\nVanillaJs:.addEventListener("consoleError", (event) => {//handle change});',
+                    detail: 'React: onConsoleError={handleError}\nVue:@consoleError="handleError"\nAngular:(consoleError)="handleError()"\nVanillaJs:.addEventListener("consoleError", (event) => {//handle error});',
                 },
             },
         },