npm - @infineon/infineon-design-system-stencil - Versions diffs - 30.1.1--canary.1640.e4770f238d16196b9059daf4898d2d6ef7cdcbdd.0 → 30.2.0--canary.1641.2fa3dc92b1652a9ad0c0488d80e396bc04aab9d2.0 - Mend

@infineon/infineon-design-system-stencil 30.1.1--canary.1640.e4770f238d16196b9059daf4898d2d6ef7cdcbdd.0 → 30.2.0--canary.1641.2fa3dc92b1652a9ad0c0488d80e396bc04aab9d2.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 (324) hide show

package/dist/collection/components/navigation/sidebar/sidebar-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-item.js","sourceRoot":"","sources":["../../../../src/components/navigation/sidebar/sidebar-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-sidebar-item',\n styleUrl: 'sidebar-item.scss',\n shadow: true\n})\nexport class SidebarItem {\n @Element() el;\n @Prop() icon: string = \"\"\n @State() showIcon: boolean = true;\n @State() showIconWrapper: boolean = false;\n @Prop() href: string = \"\";\n @State() internalHref: string = \"\";\n @Prop() target: string = \"_self\";\n @State() isExpandable: boolean = false;\n @State() isNested: boolean = true;\n @State() isSubMenuItem: boolean = false;\n @Prop() numberIndicator: string;\n @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n\n @State() internalActiveState: boolean = false;\n\n @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n\n @Prop() value: string = \"\"\n @Prop() handleItemClick: (item: HTMLElement) => void;\n\n\n @Watch('active')\n handleActiveChange(newValue: boolean, oldValue: boolean) {\n // If the item is an action item, ignore the active prop\n if (this.isActionItem) {\n this.internalActiveState = false;\n return;\n }\n this.internalActiveState = newValue;\n if (newValue !== oldValue) {\n let labelElement = this.getNavItem(this.el.shadowRoot)\n if (!this.isExpandable && !newValue) {\n this.handleClassList(labelElement, 'remove', 'active');\n }\n if (!this.isExpandable && newValue) {\n this.handleClassList(labelElement, 'add', 'active');\n }\n }\n }\n\n\n\n @Listen('consoleError')\n handleConsoleError(event: CustomEvent<boolean>) {\n if (event.detail) {\n this.showIcon = false;\n } else {\n this.showIcon = true;\n }\n }\n\n handleEventEmission() {\n // Get the active item section\n this.ifxSidebarMenu.emit(this.el)\n }\n\n handleClassList(el, type, className) {\n el.classList[type](className)\n if (type === 'contains') {\n return el.classList.contains(className)\n }\n }\n\n getExpandableMenu() {\n const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n return expandableSubmenu\n }\n\n getNavItem(el) {\n return el?.querySelector('.sidebar__nav-item')\n }\n\n\n\n getSidebarMenuItems(el = this.el) {\n const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n if (sidebarItems.length === 0) {\n return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n }\n return sidebarItems;\n }\n\n getSidebarMenuItem() {\n const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n return sidebarItem;\n }\n\n\n toggleSubmenu() {\n if (this.isExpandable) {\n const menuItem = this.getSidebarMenuItem();\n const expandableMenu = this.getExpandableMenu();\n this.handleClassList(expandableMenu, 'toggle', 'open');\n this.handleClassList(menuItem, 'toggle', 'open');\n // Emit an event with the current component\n this.handleEventEmission();\n } else {\n // If the sidebar item is not expandable, it's a leaf item without a submenu.\n // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n return;\n } else { //its a navigation item which becomes active after clicking it\n this.handleActiveChange(true, this.internalActiveState)\n this.ifxSidebarNavigationItem.emit(this.el);\n }\n // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n if (this.handleItemClick) {\n this.handleItemClick(this.el);\n }\n }\n // // Emit an event with the current component\n // this.handleEventEmission();\n }\n\n\n\n handleExpandableMenu(sidebarItems) {\n const sidebarExpandableMenu = this.getExpandableMenu();\n sidebarItems.forEach((el: HTMLElement) => {\n const li = document.createElement('li')\n li.appendChild(el)\n sidebarExpandableMenu.appendChild(li)\n })\n }\n\n parentElementIsSidebar() {\n const parentElement = this.el.parentElement;\n if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n return true;\n } else return false;\n }\n\n checkIfMenuItemIsNested() {\n const parentIsSidebar = this.parentElementIsSidebar()\n if (parentIsSidebar) {\n this.isNested = false;\n }\n }\n\n checkIfMenuItemIsSubMenu() {\n const parentElement = this.el.parentElement;\n const navItem = this.getNavItem(parentElement.shadowRoot);\n if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n this.isSubMenuItem = true;\n }else {\n this.isSubMenuItem = false;\n }\n }\n\n isActive(iteratedComponent) {\n const activeAttributeValue = iteratedComponent.getAttribute('active');\n const isActive = activeAttributeValue === 'true';\n return isActive\n }\n\n getParentSection(el: HTMLElement) {\n let parentElement = el.parentElement;\n\n while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n return parentElement;\n }\n parentElement = parentElement.parentElement;\n }\n\n return null;\n }\n\n\n\n handleBorderIndicatorDisplacement(menuItem) {\n // Recursive function to handle each item\n const handleItem = (item, menuItem) => {\n const isActive = this.isActive(item);\n if (isActive) {\n const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n const activeMenuItemSection = this.getActiveItemSection();\n if (!isOpen) {\n this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n } else {\n this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n }\n }\n\n // Process each child item\n const children = this.getSidebarMenuItems(item);\n children.forEach((child) => handleItem(child, menuItem));\n }\n\n // Start with the top-level items\n const topLevelItems = this.getSidebarMenuItems();\n topLevelItems.forEach((item) => handleItem(item, menuItem));\n }\n\n\n setHref() {\n if (this.href.toLowerCase().trim() === \"\") {\n this.internalHref = undefined;\n } else this.internalHref = this.href;\n }\n\n getActiveItemSection() {\n const parentIsSidebar = this.parentElementIsSidebar()\n if (parentIsSidebar) {\n const labelElement = this.getNavItem(this.el.shadowRoot)\n return labelElement;\n } else {\n const labelElement = this.getNavItem(this.el.shadowRoot)\n return labelElement;\n }\n }\n\n @Method()\n async setActiveClasses() {\n const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n this.handleClassList(activeMenuItem, 'add', 'active')\n }\n\n @Method()\n async expandMenu(ac: boolean){\n const menuItem = this.getSidebarMenuItem();\n const expandableMenu = this.getExpandableMenu();\n this.handleClassList(expandableMenu, 'add', 'open');\n this.handleClassList(menuItem, 'add', 'open');\n if(ac){\n this.handleClassList(expandableMenu, 'remove', 'active-section')\n this.handleClassList(menuItem, 'remove', 'active-section')\n }\n }\n \n @Method()\n async isItemExpandable(){\n return this.isExpandable;\n }\n\n handleActiveState() {\n if (this.internalActiveState) {\n this.setActiveClasses()\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter') {\n this.toggleSubmenu()\n }\n }\n\n componentDidLoad() {\n this.handleActiveState();\n if (this.isExpandable) {\n const sidebarItems = this.getSidebarMenuItems();\n this.handleExpandableMenu(sidebarItems)\n }\n }\n \n componentWillLoad() {\n this.internalActiveState = this.active;\n this.checkIfMenuItemIsNested();\n this.checkIfMenuItemIsSubMenu();\n this.setHref()\n const sidebarItems = this.getSidebarMenuItems();\n if (sidebarItems.length !== 0) {\n this.isExpandable = true;\n } else {\n this.isExpandable = false;\n }\n }\n\n componentWillUpdate() {\n // If the active prop has been set to true and the internalActiveState has not been set to true yet\n if (this.active && !this.internalActiveState) {\n // Set the internal active state to true\n this.internalActiveState = this.active;\n\n // Emit the event to notify the parent Sidebar\n this.ifxSidebarNavigationItem.emit(this.el);\n }\n }\n\n\n render() {\n return (\n <div>\n <a tabIndex={1} onKeyDown={(event) => this.handleKeyDown(event)} href={this.internalHref} onClick={() => this.toggleSubmenu()} target={this.target} class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}>\n {this.icon &&\n <div class={`sidebar__nav-item-icon-wrapper ${!this.showIcon ? 'noIcon' : \"\"}`}>\n <ifx-icon icon={this.icon}></ifx-icon>\n </div>}\n <div class=\"sidebar__nav-item-label\">\n <slot />\n </div>\n {\n (this.isExpandable \|\| this.numberIndicator?.trim()) && \n <div class=\"sidebar__nav-item-indicator\">\n {this.isExpandable &&\n <span class='item__arrow-wrapper'>\n <ifx-icon icon=\"chevron-down-12\" />\n </span>\n }\n\n {this.numberIndicator?.trim() && !this.isExpandable && !this.isNested &&\n <span class='item__number-indicator'>\n <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n </span>}\n\n </div>\n }\n </a>\n {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"sidebar-item.js","sourceRoot":"","sources":["../../../../src/components/navigation/sidebar/sidebar-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-sidebar-item',\n styleUrl: 'sidebar-item.scss',\n shadow: true\n})\nexport class SidebarItem {\n @Element() el;\n @Prop() icon: string = \"\"\n @State() hasIcon: boolean = true;\n @State() hasIconWrapper: boolean = false;\n @Prop() href: string = \"\";\n @State() internalHref: string = \"\";\n @Prop() target: string = \"_self\";\n @State() isExpandable: boolean = false;\n @State() isNested: boolean = true;\n @State() isSubMenuItem: boolean = false;\n @Prop() numberIndicator: string;\n @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n\n @State() internalActiveState: boolean = false;\n\n @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n\n @Prop() value: string = \"\"\n @Prop() handleItemClick: (item: HTMLElement) => void;\n\n\n @Watch('active')\n handleActiveChange(newValue: boolean, oldValue: boolean) {\n // If the item is an action item, ignore the active prop\n if (this.isActionItem) {\n this.internalActiveState = false;\n return;\n }\n this.internalActiveState = newValue;\n if (newValue !== oldValue) {\n let labelElement = this.getNavItem(this.el.shadowRoot)\n if (!this.isExpandable && !newValue) {\n this.handleClassList(labelElement, 'remove', 'active');\n }\n if (!this.isExpandable && newValue) {\n this.handleClassList(labelElement, 'add', 'active');\n }\n }\n }\n\n\n\n @Listen('consoleError')\n handleConsoleError(event: CustomEvent<boolean>) {\n if (event.detail) {\n this.hasIcon = false;\n } else {\n this.hasIcon = true;\n }\n }\n\n handleEventEmission() {\n // Get the active item section\n this.ifxSidebarMenu.emit(this.el)\n }\n\n handleClassList(el, type, className) {\n el.classList[type](className)\n if (type === 'contains') {\n return el.classList.contains(className)\n }\n }\n\n getExpandableMenu() {\n const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n return expandableSubmenu\n }\n\n getNavItem(el) {\n return el?.querySelector('.sidebar__nav-item')\n }\n\n\n\n getSidebarMenuItems(el = this.el) {\n const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n if (sidebarItems.length === 0) {\n return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n }\n return sidebarItems;\n }\n\n getSidebarMenuItem() {\n const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n return sidebarItem;\n }\n\n\n toggleSubmenu() {\n if (this.isExpandable) {\n const menuItem = this.getSidebarMenuItem();\n const expandableMenu = this.getExpandableMenu();\n this.handleClassList(expandableMenu, 'toggle', 'open');\n this.handleClassList(menuItem, 'toggle', 'open');\n // Emit an event with the current component\n this.handleEventEmission();\n } else {\n // If the sidebar item is not expandable, it's a leaf item without a submenu.\n // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n return;\n } else { //its a navigation item which becomes active after clicking it\n this.handleActiveChange(true, this.internalActiveState)\n this.ifxSidebarNavigationItem.emit(this.el);\n }\n // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n if (this.handleItemClick) {\n this.handleItemClick(this.el);\n }\n }\n // // Emit an event with the current component\n // this.handleEventEmission();\n }\n\n\n\n handleExpandableMenu(sidebarItems) {\n const sidebarExpandableMenu = this.getExpandableMenu();\n sidebarItems.forEach((el: HTMLElement) => {\n const li = document.createElement('li')\n li.appendChild(el)\n sidebarExpandableMenu.appendChild(li)\n })\n }\n\n parentElementIsSidebar() {\n const parentElement = this.el.parentElement;\n if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n return true;\n } else return false;\n }\n\n checkIfMenuItemIsNested() {\n const parentIsSidebar = this.parentElementIsSidebar()\n if (parentIsSidebar) {\n this.isNested = false;\n }\n }\n\n checkIfMenuItemIsSubMenu() {\n const parentElement = this.el.parentElement;\n const navItem = this.getNavItem(parentElement.shadowRoot);\n if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n this.isSubMenuItem = true;\n }else {\n this.isSubMenuItem = false;\n }\n }\n\n isActive(iteratedComponent) {\n const activeAttributeValue = iteratedComponent.getAttribute('active');\n const isActive = activeAttributeValue === 'true';\n return isActive\n }\n\n getParentSection(el: HTMLElement) {\n let parentElement = el.parentElement;\n\n while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n return parentElement;\n }\n parentElement = parentElement.parentElement;\n }\n\n return null;\n }\n\n\n\n handleBorderIndicatorDisplacement(menuItem) {\n // Recursive function to handle each item\n const handleItem = (item, menuItem) => {\n const isActive = this.isActive(item);\n if (isActive) {\n const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n const activeMenuItemSection = this.getActiveItemSection();\n if (!isOpen) {\n this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n } else {\n this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n }\n }\n\n // Process each child item\n const children = this.getSidebarMenuItems(item);\n children.forEach((child) => handleItem(child, menuItem));\n }\n\n // Start with the top-level items\n const topLevelItems = this.getSidebarMenuItems();\n topLevelItems.forEach((item) => handleItem(item, menuItem));\n }\n\n\n setHref() {\n if (this.href.toLowerCase().trim() === \"\") {\n this.internalHref = undefined;\n } else this.internalHref = this.href;\n }\n\n getActiveItemSection() {\n const parentIsSidebar = this.parentElementIsSidebar()\n if (parentIsSidebar) {\n const labelElement = this.getNavItem(this.el.shadowRoot)\n return labelElement;\n } else {\n const labelElement = this.getNavItem(this.el.shadowRoot)\n return labelElement;\n }\n }\n\n @Method()\n async setActiveClasses() {\n const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n this.handleClassList(activeMenuItem, 'add', 'active')\n }\n\n @Method()\n async expandMenu(ac: boolean){\n const menuItem = this.getSidebarMenuItem();\n const expandableMenu = this.getExpandableMenu();\n this.handleClassList(expandableMenu, 'add', 'open');\n this.handleClassList(menuItem, 'add', 'open');\n if(ac){\n this.handleClassList(expandableMenu, 'remove', 'active-section')\n this.handleClassList(menuItem, 'remove', 'active-section')\n }\n }\n \n @Method()\n async isItemExpandable(){\n return this.isExpandable;\n }\n\n handleActiveState() {\n if (this.internalActiveState) {\n this.setActiveClasses()\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Enter') {\n this.toggleSubmenu()\n }\n }\n\n componentDidLoad() {\n this.handleActiveState();\n if (this.isExpandable) {\n const sidebarItems = this.getSidebarMenuItems();\n this.handleExpandableMenu(sidebarItems)\n }\n }\n \n componentWillLoad() {\n this.internalActiveState = this.active;\n this.checkIfMenuItemIsNested();\n this.checkIfMenuItemIsSubMenu();\n this.setHref()\n const sidebarItems = this.getSidebarMenuItems();\n if (sidebarItems.length !== 0) {\n this.isExpandable = true;\n } else {\n this.isExpandable = false;\n }\n }\n\n componentWillUpdate() {\n // If the active prop has been set to true and the internalActiveState has not been set to true yet\n if (this.active && !this.internalActiveState) {\n // Set the internal active state to true\n this.internalActiveState = this.active;\n\n // Emit the event to notify the parent Sidebar\n this.ifxSidebarNavigationItem.emit(this.el);\n }\n }\n\n\n render() {\n return (\n <div>\n <a tabIndex={1} onKeyDown={(event) => this.handleKeyDown(event)} href={this.internalHref} onClick={() => this.toggleSubmenu()} target={this.target} class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}>\n {this.icon &&\n <div class={`sidebar__nav-item-icon-wrapper ${!this.hasIcon ? 'noIcon' : \"\"}`}>\n <ifx-icon icon={this.icon}></ifx-icon>\n </div>}\n <div class=\"sidebar__nav-item-label\">\n <slot />\n </div>\n {\n (this.isExpandable \|\| this.numberIndicator?.trim()) && \n <div class=\"sidebar__nav-item-indicator\">\n {this.isExpandable &&\n <span class='item__arrow-wrapper'>\n <ifx-icon icon=\"chevron-down-12\" />\n </span>\n }\n\n {this.numberIndicator?.trim() && !this.isExpandable && !this.isNested &&\n <span class='item__number-indicator'>\n <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n </span>}\n\n </div>\n }\n </a>\n {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/navigation/sidebar/sidebar.stories.js CHANGED Viewed

@@ -1,10 +1,9 @@
 import { action } from "@storybook/addon-actions";
-import { icons } from "@infineon/infineon-icons";
 export default {
     title: 'Components/Navigation/Sidebar',
     // tags: ['autodocs'],
     args: {
-        icon: 'image-16',
+        icon: true,
         applicationName: 'Application Name',
         showFooter: true,
         showHeader: true,
@@ -15,118 +14,26 @@ export default {
         copyrightText: `© 1999 - ${new Date().getFullYear()} Infineon Technologies AG`,
     },
     argTypes: {
-        applicationName: {
-            description: 'The name of the application to display at the top of the sidebar.',
-            table: {
-                category: 'ifx-sidebar props'
-            }
-        },
-        showHeader: {
-            description: 'Determines whether the header is displayed in the sidebar.',
-            table: {
-                category: 'ifx-sidebar props',
-                defaultValue: {
-                    summary: true
-                }
-            }
-        },
-        showFooter: {
-            description: 'Determines whether the footer is displayed in the sidebar.',
-            table: {
-                category: 'ifx-sidebar props',
-                defaultValue: {
-                    summary: true
-                }
-            }
-        },
-        initialCollapse: {
-            description: 'Determines if the sidebar should be collapsed by default when it first loads.',
-            table: {
-                category: 'ifx-sidebar props',
-                defaultValue: {
-                    summary: true
-                }
-            }
-        },
-        imprint: {
-            description: 'The URL link for the "Imprint" section in the sidebar footer.',
-            if: { arg: 'showFooter', eq: true },
-            table: {
-                category: 'ifx-sidebar props'
-            }
-        },
-        termsOfUse: {
-            description: 'The URL link for the "Terms of Use" section in the sidebar footer.',
-            if: { arg: 'showFooter', eq: true },
-            table: {
-                category: 'ifx-sidebar props'
-            }
-        },
-        privacyPolicy: {
-            description: 'The URL link for the "Privacy Policy" section in the sidebar footer.',
-            if: { arg: 'showFooter', eq: true },
-            table: {
-                category: 'ifx-sidebar props'
-            }
-        },
-        copyrightText: {
-            description: 'The copyright text to display at the bottom of the sidebar.',
-            table: {
-                category: 'ifx-sidebar props'
-            }
-        },
-        icon: {
-            description: 'The icon to display for the sidebar items. Choose ***none*** to display no icon.',
-            options: ['none', ...Object.values(icons).map(i => i['name'])],
-            control: 'select',
-            table: {
-                category: 'ifx-sidebar-item props',
-                defaultValue: {
-                    summary: 'image-16'
-                }
-            }
-        },
         ifxSidebarNavigationItem: {
             action: 'ifxSidebarNavigationItem',
             description: 'Custom event emitted when a navigation item becomes active on selection',
-            table: {
-                category: 'custom events',
-                type: {
-                    summary: 'Framework integration',
-                    detail: `React: onIfxSidebarNavigationItem={handleChange}
-          Vue: @ifxSidebarNavigationItem="handleChange"
-          Angular: (ifxSidebarNavigationItem)="handleChange()"
-          VanillaJs: .addEventListener("ifxSidebarNavigationItem", (event) => {/*handle change*/});`
-                }
-            }
         },
         ifxSidebarActionItem: {
             action: 'ifxSidebarActionItem',
             description: 'Custom event emitted when an action item is selected',
-            table: {
-                category: 'custom events',
-                type: {
-                    summary: 'Framework integration',
-                    detail: `React: onIfxSidebarActionItem={handleAction}
-          Vue: @ifxSidebarActionItem="handleAction"
-          Angular: (ifxSidebarActionItem)="handleAction()"
-          VanillaJs: .addEventListener("ifxSidebarActionItem", (event) => {/*handle action*/});`
-                },
-            }
         },
         ifxSidebarMenu: {
             action: 'ifxSidebarMenu',
             description: 'Custom event emitted when a menu is expanded or closed',
-            table: {
-                category: 'custom events',
-                type: {
-                    summary: 'Framework integration',
-                    detail: `React: onIfxSidebarMenu={handleMenu}
-          Vue: @ifxSidebarMenu="handleMenu"
-          Angular: (ifxSidebarMenu)="handleMenu()"
-          VanillaJs: .addEventListener("ifxSidebarMenu", (event) => {/*handle menu*/});`
-                },
-            },
+        },
+        imprint: {
+            if: { arg: 'showFooter', eq: true },
+        },
+        termsOfUse: {
+            if: { arg: 'showFooter', eq: true },
+        },
+        privacyPolicy: {
+            if: { arg: 'showFooter', eq: true },
         },
     },
 };
@@ -146,13 +53,13 @@ const DefaultTemplate = args => {
     sidebarElement.setAttribute('copyright-text', args.copyrightText);
     sidebarElement.innerHTML = `
     <ifx-sidebar-title>Menu Items</ifx-sidebar-title>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Menu Item</ifx-sidebar-item>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Menu Item</ifx-sidebar-item>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Menu Item</ifx-sidebar-item>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Menu Item</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>
     <ifx-sidebar-item>
     Section
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Menu Item</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>
     <ifx-sidebar-item icon='image-16'>
     Menu Item
     <ifx-sidebar-item>Sub menu item</ifx-sidebar-item>
@@ -163,8 +70,8 @@ const DefaultTemplate = args => {
     <ifx-sidebar-item href='https://google.com' target='_blank'>Menu Item</ifx-sidebar-item>
     </ifx-sidebar-item>
     <ifx-sidebar-title>Items group</ifx-sidebar-title>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Item 1</ifx-sidebar-item>
-    <ifx-sidebar-item href='https://google.com' target='_blank' icon="${args.icon === 'none' ? '' : args.icon}">Item 2</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Item 1</ifx-sidebar-item>
+    <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Item 2</ifx-sidebar-item>
   `;
     return sidebarElement;
 };

package/dist/collection/components/navigation/sidebar/sidebar.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar.stories.js","sourceRoot":"","sources":["../../../../src/components/navigation/sidebar/sidebar.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/Navigation/Sidebar',\n // tags: ['autodocs'],\n\n args: {\n icon: 'image-16',\n applicationName: 'Application Name',\n showFooter: true,\n showHeader: true,\n initialCollapse: true,\n termsOfUse: 'https://yourwebsite.com/terms',\n imprint: 'https://yourwebsite.com/imprint',\n privacyPolicy: 'https://yourwebsite.com/privacy-policy',\n copyrightText: `© 1999 - ${new Date().getFullYear()} Infineon Technologies AG`,\n },\n\n argTypes: {\n applicationName: {\n description: 'The name of the application to display at the top of the sidebar.',\n table: {\n category: 'ifx-sidebar props'\n }\n },\n showHeader: {\n description: 'Determines whether the header is displayed in the sidebar.',\n table: {\n category: 'ifx-sidebar props',\n defaultValue: {\n summary: true\n }\n }\n },\n showFooter: {\n description: 'Determines whether the footer is displayed in the sidebar.',\n table: {\n category: 'ifx-sidebar props',\n defaultValue: {\n summary: true\n }\n }\n },\n initialCollapse: {\n description: 'Determines if the sidebar should be collapsed by default when it first loads.',\n table: {\n category: 'ifx-sidebar props',\n defaultValue: {\n summary: true\n }\n }\n },\n imprint: {\n description: 'The URL link for the \"Imprint\" section in the sidebar footer.',\n if: { arg: 'showFooter', eq: true },\n table: {\n category: 'ifx-sidebar props'\n }\n },\n termsOfUse: {\n description: 'The URL link for the \"Terms of Use\" section in the sidebar footer.',\n if: { arg: 'showFooter', eq: true },\n table: {\n category: 'ifx-sidebar props'\n }\n },\n privacyPolicy: {\n description: 'The URL link for the \"Privacy Policy\" section in the sidebar footer.',\n if: { arg: 'showFooter', eq: true },\n table: {\n category: 'ifx-sidebar props'\n }\n },\n copyrightText: {\n description: 'The copyright text to display at the bottom of the sidebar.',\n table: {\n category: 'ifx-sidebar props'\n }\n },\n icon: {\n description: 'The icon to display for the sidebar items. Choose *none* to display no icon.',\n options: ['none', ...Object.values(icons).map(i => i['name'])],\n control: 'select',\n table: {\n category: 'ifx-sidebar-item props',\n defaultValue: {\n summary: 'image-16'\n }\n }\n },\n ifxSidebarNavigationItem: {\n action: 'ifxSidebarNavigationItem',\n description: 'Custom event emitted when a navigation item becomes active on selection',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail: \n `React: onIfxSidebarNavigationItem={handleChange}\n Vue: @ifxSidebarNavigationItem=\"handleChange\"\n Angular: (ifxSidebarNavigationItem)=\"handleChange()\"\n VanillaJs: .addEventListener(\"ifxSidebarNavigationItem\", (event) => {/handle change/});`\n }\n }\n },\n ifxSidebarActionItem: {\n action: 'ifxSidebarActionItem',\n description: 'Custom event emitted when an action item is selected',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail: \n `React: onIfxSidebarActionItem={handleAction}\n Vue: @ifxSidebarActionItem=\"handleAction\"\n Angular: (ifxSidebarActionItem)=\"handleAction()\"\n VanillaJs: .addEventListener(\"ifxSidebarActionItem\", (event) => {/handle action/});`\n },\n }\n },\n ifxSidebarMenu: {\n action: 'ifxSidebarMenu',\n description: 'Custom event emitted when a menu is expanded or closed',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail: \n `React: onIfxSidebarMenu={handleMenu}\n Vue: @ifxSidebarMenu=\"handleMenu\"\n Angular: (ifxSidebarMenu)=\"handleMenu()\"\n VanillaJs: .addEventListener(\"ifxSidebarMenu\", (event) => {/handle menu/});`\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n // Create the sidebar element and attach event listener\n const sidebarElement = document.createElement('ifx-sidebar') as HTMLIfxSidebarElement;\n sidebarElement.setAttribute('application-name', args.applicationName);\n sidebarElement.addEventListener('ifxSidebarNavigationItem', action(`ifxSidebarNavigationItem`));\n sidebarElement.addEventListener('ifxSidebarActionItem', action(`ifxSidebarActionItem`));\n sidebarElement.addEventListener('ifxSidebarMenu', action(`ifxSidebarMenu`));\n\n sidebarElement.setAttribute('show-header', args.showHeader);\n sidebarElement.setAttribute('show-footer', args.showFooter);\n sidebarElement.setAttribute('initial-collapse', args.initialCollapse);\n sidebarElement.setAttribute('terms-of-use', args.termsOfUse);\n sidebarElement.setAttribute('imprint', args.imprint);\n sidebarElement.setAttribute('privacy-policy', args.privacyPolicy);\n sidebarElement.setAttribute('copyright-text', args.copyrightText);\n\n sidebarElement.innerHTML = `\n <ifx-sidebar-title>Menu Items</ifx-sidebar-title>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item>\n Section\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon='image-16'>\n Menu Item\n <ifx-sidebar-item>Sub menu item</ifx-sidebar-item>\n <ifx-sidebar-item active=true>Sub menu item</ifx-sidebar-item>\n <ifx-sidebar-item>Sub menu item</ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank'>Menu Item</ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-title>Items group</ifx-sidebar-title>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Item 1</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon=\"${args.icon === 'none' ? '' : args.icon}\">Item 2</ifx-sidebar-item>\n `\n return sidebarElement;\n};\n\nexport const Default = DefaultTemplate.bind({});\n\nconst SubmenuTemplate = args => {\n // Create the sidebar element and attach event listener\n const sidebarElement = document.createElement('ifx-sidebar') as HTMLIfxSidebarElement;\n sidebarElement.setAttribute('application-name', args.applicationName);\n sidebarElement.addEventListener('ifxSidebarNavigationItem', action('ifxSidebarNavigationItem'));\n sidebarElement.addEventListener('ifxSidebarActionItem', action('ifxSidebarActionItem'));\n sidebarElement.addEventListener('ifxSidebarMenu', action('ifxSidebarMenu'));\n sidebarElement.setAttribute('initial-collapse', args.initialCollapse);\n\n // Create 3 sections\n for (let i = 0; i < 3; i++) {\n const sectionElement = document.createElement('ifx-sidebar-item');\n sectionElement.textContent = `Header Section ${i + 1}`;\n\n // In each section, create 3 menu items\n for (let j = 0; j < 3; j++) {\n const menuItemElement = document.createElement('ifx-sidebar-item');\n menuItemElement.setAttribute('icon', args.icon ? 'image-16' : '');\n menuItemElement.textContent = `Menu Item ${j + 1}`;\n\n // In the first menu item of each section, create 3 submenu items\n if (j === 0) {\n for (let k = 0; k < 3; k++) {\n const subMenuItemElement = document.createElement('ifx-sidebar-item');\n subMenuItemElement.textContent = `Sub Menu Item ${k + 1}`;\n menuItemElement.appendChild(subMenuItemElement);\n }\n }\n\n sectionElement.appendChild(menuItemElement);\n }\n sidebarElement.appendChild(sectionElement);\n }\n const firstSection = sidebarElement.querySelectorAll('ifx-sidebar-item')[0];\n const firstMenuItem = firstSection.querySelectorAll('ifx-sidebar-item')[0];\n\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[0].setAttribute('active', 'true'); //first submenu item\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[0].setAttribute('is-action-item', 'false');\n\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[1].setAttribute('is-action-item', 'true'); //2nd submenu item\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[2].setAttribute('is-action-item', 'true'); //3rd sub menu item\n\n return sidebarElement;\n};\n\nexport const WithSubmenu = SubmenuTemplate.bind({});\n\nconst NumberIndicatorTemplate = () =>\n `<ifx-sidebar application-name=\"Application name\">\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"5\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"1\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"23\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item active=\"false\">\n Header Section\n <ifx-sidebar-item icon=\"image-16\" active=\"false\" >\n Second layer\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\">\n 3rd layer Menu Item\n </ifx-sidebar-item>\n\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\" value=\"thisPage\">\n This Page\n </ifx-sidebar-item>\n\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\">\n 3rd layer Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n <ifx-sidebar-item icon=\"image-16\" active=\"false\">\n Second layer\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\" active=\"false\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n <ifx-sidebar-item icon=\"image-16\" active=\"false\">\n Second layer\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\" active=\"false\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n \n\n <ifx-sidebar-item>\n Header Section\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item active=\"false\" is-action-item=\"false\" target=\"_blank\" icon=\"image-16\">\n Sub Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item is-action-item=\"true\" icon=\"image-16\" value=\"thisPage\">\n This one too\n </ifx-sidebar-item>\n <ifx-sidebar-item is-action-item=\"false\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n\n <ifx-sidebar-item>\n Header Section\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n</ifx-sidebar>`;\n\nexport const WithNumberIndicator = NumberIndicatorTemplate.bind({});\n"]}
1	+ {"version":3,"file":"sidebar.stories.js","sourceRoot":"","sources":["../../../../src/components/navigation/sidebar/sidebar.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Navigation/Sidebar',\n // tags: ['autodocs'],\n\n args: {\n icon: true,\n applicationName: 'Application Name',\n showFooter: true,\n showHeader: true,\n initialCollapse: true,\n termsOfUse: 'https://yourwebsite.com/terms',\n imprint: 'https://yourwebsite.com/imprint',\n privacyPolicy: 'https://yourwebsite.com/privacy-policy',\n copyrightText: `© 1999 - ${new Date().getFullYear()} Infineon Technologies AG`,\n },\n\n argTypes: {\n ifxSidebarNavigationItem: {\n action: 'ifxSidebarNavigationItem',\n description: 'Custom event emitted when a navigation item becomes active on selection',\n },\n ifxSidebarActionItem: {\n action: 'ifxSidebarActionItem',\n description: 'Custom event emitted when an action item is selected',\n },\n ifxSidebarMenu: {\n action: 'ifxSidebarMenu',\n description: 'Custom event emitted when a menu is expanded or closed',\n },\n imprint: {\n if: { arg: 'showFooter', eq: true },\n },\n termsOfUse: {\n if: { arg: 'showFooter', eq: true },\n },\n privacyPolicy: {\n if: { arg: 'showFooter', eq: true },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n // Create the sidebar element and attach event listener\n const sidebarElement = document.createElement('ifx-sidebar') as HTMLIfxSidebarElement;\n sidebarElement.setAttribute('application-name', args.applicationName);\n sidebarElement.addEventListener('ifxSidebarNavigationItem', action(`ifxSidebarNavigationItem`));\n sidebarElement.addEventListener('ifxSidebarActionItem', action(`ifxSidebarActionItem`));\n sidebarElement.addEventListener('ifxSidebarMenu', action(`ifxSidebarMenu`));\n\n sidebarElement.setAttribute('show-header', args.showHeader);\n sidebarElement.setAttribute('show-footer', args.showFooter);\n sidebarElement.setAttribute('initial-collapse', args.initialCollapse);\n sidebarElement.setAttribute('terms-of-use', args.termsOfUse);\n sidebarElement.setAttribute('imprint', args.imprint);\n sidebarElement.setAttribute('privacy-policy', args.privacyPolicy);\n sidebarElement.setAttribute('copyright-text', args.copyrightText);\n \n sidebarElement.innerHTML = `\n <ifx-sidebar-title>Menu Items</ifx-sidebar-title>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item>\n Section\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon='image-16'>\n Menu Item\n <ifx-sidebar-item>Sub menu item</ifx-sidebar-item>\n <ifx-sidebar-item active=true>Sub menu item</ifx-sidebar-item>\n <ifx-sidebar-item>Sub menu item</ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank'>Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank'>Menu Item</ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-title>Items group</ifx-sidebar-title>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Item 1</ifx-sidebar-item>\n <ifx-sidebar-item href='https://google.com' target='_blank' icon='image-16'>Item 2</ifx-sidebar-item>\n `\n return sidebarElement;\n};\n\nexport const Default = DefaultTemplate.bind({});\n\nconst SubmenuTemplate = args => {\n // Create the sidebar element and attach event listener\n const sidebarElement = document.createElement('ifx-sidebar') as HTMLIfxSidebarElement;\n sidebarElement.setAttribute('application-name', args.applicationName);\n sidebarElement.addEventListener('ifxSidebarNavigationItem', action('ifxSidebarNavigationItem'));\n sidebarElement.addEventListener('ifxSidebarActionItem', action('ifxSidebarActionItem'));\n sidebarElement.addEventListener('ifxSidebarMenu', action('ifxSidebarMenu'));\n sidebarElement.setAttribute('initial-collapse', args.initialCollapse);\n\n // Create 3 sections\n for (let i = 0; i < 3; i++) {\n const sectionElement = document.createElement('ifx-sidebar-item');\n sectionElement.textContent = `Header Section ${i + 1}`;\n\n // In each section, create 3 menu items\n for (let j = 0; j < 3; j++) {\n const menuItemElement = document.createElement('ifx-sidebar-item');\n menuItemElement.setAttribute('icon', args.icon ? 'image-16' : '');\n menuItemElement.textContent = `Menu Item ${j + 1}`;\n\n // In the first menu item of each section, create 3 submenu items\n if (j === 0) {\n for (let k = 0; k < 3; k++) {\n const subMenuItemElement = document.createElement('ifx-sidebar-item');\n subMenuItemElement.textContent = `Sub Menu Item ${k + 1}`;\n menuItemElement.appendChild(subMenuItemElement);\n }\n }\n\n sectionElement.appendChild(menuItemElement);\n }\n sidebarElement.appendChild(sectionElement);\n }\n const firstSection = sidebarElement.querySelectorAll('ifx-sidebar-item')[0];\n const firstMenuItem = firstSection.querySelectorAll('ifx-sidebar-item')[0];\n\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[0].setAttribute('active', 'true'); //first submenu item\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[0].setAttribute('is-action-item', 'false');\n\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[1].setAttribute('is-action-item', 'true'); //2nd submenu item\n firstMenuItem.querySelectorAll('ifx-sidebar-item')[2].setAttribute('is-action-item', 'true'); //3rd sub menu item\n\n return sidebarElement;\n};\n\nexport const WithSubmenu = SubmenuTemplate.bind({});\n\nconst NumberIndicatorTemplate = () =>\n `<ifx-sidebar application-name=\"Application name\">\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"5\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"1\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\" number-indicator=\"23\">Menu Item</ifx-sidebar-item>\n <ifx-sidebar-item active=\"false\">\n Header Section\n <ifx-sidebar-item icon=\"image-16\" active=\"false\" >\n Second layer\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\">\n 3rd layer Menu Item\n </ifx-sidebar-item>\n\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\" value=\"thisPage\">\n This Page\n </ifx-sidebar-item>\n\n <ifx-sidebar-item target=\"_blank\" active=\"false\" icon=\"image-16\">\n 3rd layer Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n <ifx-sidebar-item icon=\"image-16\" active=\"false\">\n Second layer\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\" active=\"false\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n <ifx-sidebar-item icon=\"image-16\" active=\"false\">\n Second layer\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\" active=\"false\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n \n\n <ifx-sidebar-item>\n Header Section\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item active=\"false\" is-action-item=\"false\" target=\"_blank\" icon=\"image-16\">\n Sub Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item is-action-item=\"true\" icon=\"image-16\" value=\"thisPage\">\n This one too\n </ifx-sidebar-item>\n <ifx-sidebar-item is-action-item=\"false\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n\n\n <ifx-sidebar-item>\n Header Section\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n <ifx-sidebar-item icon=\"image-16\">\n Menu Item\n <ifx-sidebar-item href=\"http://google.com\" target=\"_blank\" icon=\"image-16\">\n Menu Item\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n </ifx-sidebar-item>\n</ifx-sidebar>`;\n\nexport const WithNumberIndicator = NumberIndicatorTemplate.bind({});\n"]}

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

@@ -12,85 +12,38 @@ export default {
     },
     argTypes: {
         content: {
-            name: 'Content',
             description: 'Text inside the notification is passed as slot.',
-            table: {
-                category: 'story controls',
-                type: {
-                    summary: null
-                }
-            }
         },
         variant: {
             description: 'Variant of the notification.',
             options: ['success', 'warning', 'error'],
             control: { type: 'radio' },
-            table: {
-                category: 'ifx-notification props',
-                defaultValue: {
-                    summary: 'success'
-                },
-                type: {
-                    summary: 'success | warning | error'
-                }
-            }
         },
         icon: {
-            description: 'The icon to be displayed in the notification. Choose "none" to display no icon.',
-            options: ['none', ...Object.values(icons).map(i => i['name'])],
+            description: 'The icon to be displayed in the notification.',
+            options: Object.values(icons).map(i => i['name']),
             control: { type: 'select' },
-            table: {
-                category: 'ifx-notification props',
-                type: {
-                    summary: 'string'
-                }
-            }
         },
         linkText: {
             description: 'Text for the link.',
-            table: {
-                category: 'ifx-notification props',
-                type: {
-                    summary: 'string'
-                }
-            }
         },
         linkHref: {
             description: 'URL for the link.',
-            table: {
-                category: 'ifx-notification props',
-                type: {
-                    summary: 'string'
-                }
-            }
         },
         linkTarget: {
             options: ['_blank', '_self', '_parent'],
             control: { type: 'radio' },
-            description: 'Specifies where to open the linked document.',
-            table: {
-                category: 'ifx-notification props',
-                defaultValue: {
-                    summary: '_blank'
-                },
-                type: {
-                    summary: '_blank | _self | _parent'
-                }
-            }
         },
     },
 };
-const DefaultTemplate = args => {
-    const icon = args.icon === 'none' ? '' : args.icon;
-    return `<ifx-notification
-  icon = "${icon}"
+const DefaultTemplate = args => `<ifx-notification
+  icon="${args.icon}"
   variant="${args.variant}"
   link-text="${args.linkText}"
   link-href="${args.linkHref}"
   link-target="${args.linkTarget}">
   ${args.content}
 </ifx-notification>`;
-};
 export const Default = DefaultTemplate.bind({});
 Default.argTypes = {};
 //# sourceMappingURL=notification.stories.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"notification.stories.js","sourceRoot":"","sources":["../../../src/components/notification/notification.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAEjD,eAAe;IACb,KAAK,EAAE,yBAAyB;IAChC,IAAI,EAAE,CAAC,UAAU,CAAC;IAElB,IAAI,EAAE;QACJ,OAAO,EAAE,qBAAqB;QAC9B,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,YAAY;QAClB,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,yBAAyB;QACnC,UAAU,EAAE,QAAQ;KACrB;IACD,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,~~IAAI,EAAE,SAAS;YACf,~~WAAW,EAAE,iDAAiD;~~YAC9D,KAAK,EAAE~~;~~gBACL,QAAQ,EAAE,gBAAgB;gBAC1B,IAAI,EAAE;oBACJ,OAAO,EAAE,IAAI;iBACd;aACF;SACF;~~QACD,OAAO,EAAE;YACP,WAAW,EAAE,8BAA8B;YAC3C,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC;YACxC,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;~~YAC1B,KAAK,EAAE~~;~~gBACL,QAAQ,EAAE,wBAAwB;gBAClC,YAAY,EAAE;oBACZ,OAAO,EAAE,SAAS;iBACnB;gBACD,IAAI,EAAE;oBACJ,OAAO,EAAE,2BAA2B;iBACrC;aACF;SACF;~~QACD,IAAI,EAAE;YACJ,WAAW,EAAE~~,iFAAiF~~;~~YAC9F~~,OAAO,EAAE,~~CAAC,~~MAAM,~~EAAE,GAAG,MAAM,~~CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC~~,CAAC~~;~~YAC9D~~,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;~~YAC3B,KAAK,EAAE~~;~~gBACL,QAAQ,EAAE,wBAAwB;gBAClC,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;~~QACD,QAAQ,EAAE;YACR,WAAW,EAAE,oBAAoB;~~YACjC,KAAK,EAAE~~;~~gBACL,QAAQ,EAAE,wBAAwB;gBAClC,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;~~QACD,QAAQ,EAAE;YACR,WAAW,EAAE,mBAAmB;~~YAChC,KAAK,EAAE~~;~~gBACL,QAAQ,EAAE,wBAAwB;gBAClC,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;~~QACD,UAAU,~~EAAE~~;~~YACV~~,OAAO,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC;YACvC,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;~~YAC1B,WAAW,EAAE,8CAA8C~~;~~YAC3D,KAAK,EAAE;gBACL,QAAQ,EAAE,wBAAwB;gBAClC,YAAY,EAAE;oBACZ,OAAO,EAAE,QAAQ;iBAClB;gBACD,IAAI,EAAE;oBACJ,OAAO,EAAE,0BAA0B;iBACpC;aACF;SACF;~~KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE~~;IAC7B~~,~~MAAM,IAAI,GAAG,IAAI,~~CAAC,IAAI,~~KAAK,MAAM,~~CAAC,~~CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,~~IAAI~~,CAAC,IAAI,CAAC~~;~~IAEnD~~,~~OAAO;YACG,~~IAAI~~;aACH~~,~~IAAI,~~CAAC,OAAO;eACV,IAAI,CAAC,QAAQ;eACb,IAAI,CAAC,QAAQ;iBACX,IAAI,CAAC,UAAU;IAC5B,IAAI,CAAC,OAAO;oBACI,CAAC;~~AACrB~~,~~CAAC,CAAA;AAED,~~MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["import { icons } from '@infineon/infineon-icons';\n\nexport default {\n title: 'Components/Notification',\n tags: ['autodocs'],\n\n args: {\n content: \"Sample Notification\",\n variant: 'success',\n icon: 'c-check-16',\n linkText: 'Link',\n linkHref: 'https://www.example.com',\n linkTarget: '_blank',\n },\n argTypes: {\n content: {\n ~~name: 'Content',\n~~ description: 'Text inside the notification is passed as slot.',\n ~~table: {\n category: 'story controls',\n type: {\n summary: null\n }\n }\n~~ },\n variant: {\n description: 'Variant of the notification.',\n options: ['success', 'warning', 'error'],\n control: { type: 'radio' },\n table: {\n category: 'ifx-notification props',\n defaultValue: {\n summary: 'success'\n },\n type: {\n summary: 'success \| warning \| error'\n }\n }\n },\n icon: {\n description: 'The icon to be displayed in the notification. ~~Choose \"none\" to display no icon.~~',\n options: ~~['none', ...~~Object.values(icons).map(i => i['name'])],\n control: { type: 'select' },\n ~~table: {\n category: 'ifx-notification props',\n type: {\n summary: 'string'\n }\n }\n~~ },\n linkText: {\n description: 'Text for the link.',\n ~~table: {\n category: 'ifx-notification props',\n type: {\n summary: 'string'\n }\n }\n~~ },\n linkHref: {\n description: 'URL for the link.',\n ~~table: {\n category: 'ifx-notification props',\n type: {\n summary: 'string'\n }\n }\n~~ },\n linkTarget: {\n options: ['_blank', '_self', '_parent'],\n control: { type: 'radio' },\n description: 'Specifies where to open the linked document.',\n table: {\n category: 'ifx-notification props',\n defaultValue: {\n summary: '_blank'\n },\n type: {\n summary: '_blank \| _self \| _parent'\n }\n }\n },\n },\n};\n\nconst DefaultTemplate = args => ~~{\n const icon = args.icon === 'none' ? '' : args.icon;\n\n return~~ `<ifx-notification \n icon ~~= \~~"${icon}\"\n variant=\"${args.variant}\" \n link-text=\"${args.linkText}\" \n link-href=\"${args.linkHref}\"\n link-target=\"${args.linkTarget}\">\n ${args.content}\n</ifx-notification>`;\n}\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}
1	+ {"version":3,"file":"notification.stories.js","sourceRoot":"","sources":["../../../src/components/notification/notification.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAEjD,eAAe;IACb,KAAK,EAAE,yBAAyB;IAChC,IAAI,EAAE,CAAC,UAAU,CAAC;IAElB,IAAI,EAAE;QACJ,OAAO,EAAE,qBAAqB;QAC9B,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,YAAY;QAClB,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,yBAAyB;QACnC,UAAU,EAAE,QAAQ;KACrB;IACD,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,WAAW,EAAE,iDAAiD;SAC/D;QACD,OAAO,EAAE;YACP,WAAW,EAAE,8BAA8B;YAC3C,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC;YACxC,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SAC3B;QACD,IAAI,EAAE;YACJ,WAAW,EAAE,+CAA+C;YAC5D,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;SAC5B;QACD,QAAQ,EAAE;YACR,WAAW,EAAE,oBAAoB;SAClC;QACD,QAAQ,EAAE;YACR,WAAW,EAAE,mBAAmB;SACjC;QACD,UAAU,EAAC;YACT,OAAO,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC;YACvC,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SAC3B;KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC;UACtB,IAAI,CAAC,IAAI;aACN,IAAI,CAAC,OAAO;eACV,IAAI,CAAC,QAAQ;eACb,IAAI,CAAC,QAAQ;iBACX,IAAI,CAAC,UAAU;IAC5B,IAAI,CAAC,OAAO;oBACI,CAAC;AAErB,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["import { icons } from '@infineon/infineon-icons';\n\nexport default {\n title: 'Components/Notification',\n tags: ['autodocs'],\n\n args: {\n content: \"Sample Notification\",\n variant: 'success',\n icon: 'c-check-16',\n linkText: 'Link',\n linkHref: 'https://www.example.com',\n linkTarget: '_blank',\n },\n argTypes: {\n content: {\n description: 'Text inside the notification is passed as slot.',\n },\n variant: {\n description: 'Variant of the notification.',\n options: ['success', 'warning', 'error'],\n control: { type: 'radio' },\n },\n icon: {\n description: 'The icon to be displayed in the notification.',\n options: Object.values(icons).map(i => i['name']),\n control: { type: 'select' },\n },\n linkText: {\n description: 'Text for the link.',\n },\n linkHref: {\n description: 'URL for the link.',\n },\n linkTarget:{\n options: ['_blank', '_self', '_parent'],\n control: { type: 'radio' },\n },\n },\n};\n\nconst DefaultTemplate = args => `<ifx-notification \n icon=\"${args.icon}\" \n variant=\"${args.variant}\" \n link-text=\"${args.linkText}\" \n link-href=\"${args.linkHref}\"\n link-target=\"${args.linkTarget}\">\n ${args.content}\n</ifx-notification>`;\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}

package/dist/collection/components/number-indicator/number-indicator.stories.js CHANGED Viewed

@@ -5,25 +5,6 @@ export default {
         label: 1,
         inverted: false,
     },
-    argTypes: {
-        label: {
-            name: 'Label of Number Indicator',
-            description: 'Specifies the number to be displayed within the indicator.',
-            table: {
-                category: 'story controls'
-            }
-        },
-        inverted: {
-            description: 'Toggles the color scheme of the number indicator.',
-            control: 'boolean',
-            table: {
-                category: 'ifx-number-indicator props',
-                defaultValue: {
-                    summary: false
-                }
-            }
-        }
-    }
 };
 const DefaultTemplate = args => `<ifx-number-indicator inverted="${args.inverted}">${args.label}</ifx-number-indicator>`;
 export const Default = DefaultTemplate.bind({});

package/dist/collection/components/number-indicator/number-indicator.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"number-indicator.stories.js","sourceRoot":"","sources":["../../../src/components/number-indicator/number-indicator.stories.ts"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,6BAA6B;IACpC,IAAI,EAAE,CAAC,UAAU,CAAC;IAElB,IAAI,EAAE;QACJ,KAAK,EAAE,CAAC;QACR,QAAQ,EAAE,KAAK;KAChB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,IAAI,EAAE,2BAA2B;YACjC,WAAW,EAAE,4DAA4D;YACzE,KAAK,EAAE;gBACL,QAAQ,EAAE,gBAAgB;aAC3B;SACF;QACD,QAAQ,EAAE;YACR,WAAW,EAAE,mDAAmD;YAChE,OAAO,EAAE,SAAS;YAClB,KAAK,EAAE;gBACL,QAAQ,EAAE,4BAA4B;gBACtC,YAAY,EAAE;oBACZ,OAAO,EAAE,KAAK;iBACf;aACF;SACF;KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,mCAAmC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,yBAAyB,CAAC;AAEzH,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["export default {\n title: 'Components/Number Indicator',\n tags: ['autodocs'],\n\n args: {\n label: 1,\n inverted: false,\n },\n argTypes: {\n label: {\n name: 'Label of Number Indicator',\n description: 'Specifies the number to be displayed within the indicator.',\n table: {\n category: 'story controls'\n }\n },\n inverted: {\n description: 'Toggles the color scheme of the number indicator.',\n control: 'boolean',\n table: {\n category: 'ifx-number-indicator props',\n defaultValue: {\n summary: false\n }\n }\n }\n }\n};\n\nconst DefaultTemplate = args => `<ifx-number-indicator inverted=\"${args.inverted}\">${args.label}</ifx-number-indicator>`;\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}
1	+ {"version":3,"file":"number-indicator.stories.js","sourceRoot":"","sources":["../../../src/components/number-indicator/number-indicator.stories.ts"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,6BAA6B;IACpC,IAAI,EAAE,CAAC,UAAU,CAAC;IAElB,IAAI,EAAE;QACJ,KAAK,EAAE,CAAC;QACR,QAAQ,EAAE,KAAK;KAChB;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,mCAAmC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,yBAAyB,CAAC;AAEzH,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["export default {\n title: 'Components/Number Indicator',\n tags: ['autodocs'],\n\n args: {\n label: 1,\n inverted: false,\n },\n};\n\nconst DefaultTemplate = args => `<ifx-number-indicator inverted=\"${args.inverted}\">${args.label}</ifx-number-indicator>`;\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}

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

@@ -7,35 +7,10 @@ export default {
         currentPage: 1,
     },
     argTypes: {
-        currentPage: {
-            description: 'Current page number.',
-            table: {
-                category: 'Ifx-pagination props',
-                defaultValue: {
-                    'summary': '0'
-                },
-                type: {
-                    summary: 'number',
-                },
-            },
-        },
-        total: {
-            description: 'Total number of items.',
-            table: {
-                category: 'Ifx-pagination props',
-                defaultValue: {
-                    'summary': '1'
-                },
-                type: {
-                    summary: 'number',
-                },
-            },
-        },
         ifxPageChange: {
             action: 'ifxPageChange',
-            description: 'Custom event emitted page is changed.',
+            description: 'Custom event emitted page is changed',
             table: {
-                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxPageChange={handlePageChange}\nVue:@ifxPageChange="handlePageChange"\nAngular:(ifxPageChange)="handlePageChange()"\nVanillaJs:.addEventListener("ifxPageChange", (event) => {//handle page change});',
@@ -44,9 +19,8 @@ export default {
         },
         ifxNextPage: {
             action: 'ifxNextPage',
-            description: 'Custom event emitted when next page button clicked.',
+            description: 'Custom event emitted when next page button clicked',
             table: {
-                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxNextPage={handlePageChange}\nVue:@ifxNextPage="handlePageChange"\nAngular:(ifxNextPage)="handlePageChange()"\nVanillaJs:.addEventListener("ifxNextPage", (event) => {//handle page change});',
@@ -55,9 +29,8 @@ export default {
         },
         ifxPrevPage: {
             action: 'ifxPrevPage',
-            description: 'Custom event emitted when previous page button clicked.',
+            description: 'Custom event emitted when previous page button clicked',
             table: {
-                category: 'custom events',
                 type: {
                     summary: 'Framework integration',
                     detail: 'React: onIfxPrevPage={handlePageChange}\nVue:@ifxPrevPage="handlePageChange"\nAngular:(ifxPrevPage)="handlePageChange()"\nVanillaJs:.addEventListener("ifxPrevPage", (event) => {//handle page change});',

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

	@@ -1 +1 @@
1	- {"version":3,"file":"pagination.stories.js","sourceRoot":"","sources":["../../../src/components/pagination/pagination.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,sBAAsB;IAEtB,IAAI,EAAE;QACJ,KAAK,EAAE,EAAE;QACT,WAAW,EAAE,CAAC;KACf;IACD,QAAQ,EAAE;QACR,WAAW,EAAE;YACX,WAAW,EAAE,sBAAsB;YACnC,KAAK,EAAE;gBACL,QAAQ,EAAE,sBAAsB;gBAChC,YAAY,EAAE;oBACZ,SAAS,EAAE,GAAG;iBACf;gBACD,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;QAED,KAAK,EAAE;YACL,WAAW,EAAE,wBAAwB;YACrC,KAAK,EAAE;gBACL,QAAQ,EAAE,sBAAsB;gBAChC,YAAY,EAAE;oBACZ,SAAS,EAAE,GAAG;iBACf;gBACD,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;aACF;SACF;QAED,aAAa,EAAE;YACb,MAAM,EAAE,eAAe;YACvB,WAAW,EAAE,~~uCAAuC~~;~~YACpD~~,KAAK,EAAE;gBACL,~~QAAQ,EAAE,eAAe;gBACzB,~~IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,kNAAkN;iBACrN;aACF;SACF;QACD,WAAW,EAAE;YACX,MAAM,EAAE,aAAa;YACrB,WAAW,EAAE,~~qDAAqD~~;~~YAClE~~,KAAK,EAAE;gBACL,~~QAAQ,EAAE,eAAe;gBACzB,~~IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,0MAA0M;iBAC7M;aACF;SACF;QACD,WAAW,EAAE;YACX,MAAM,EAAE,aAAa;YACrB,WAAW,EAAE,~~yDAAyD~~;~~YACtE~~,KAAK,EAAE;gBACL,~~QAAQ,EAAE,eAAe;gBACzB,~~IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,0MAA0M;iBAC7M;aACF;SACF;KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE;IAC7B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACzD,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1C,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IACvD,OAAO,CAAC,gBAAgB,CAAC,eAAe,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC;IACnE,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Pagination',\n // tags: ['autodocs'],\n\n args: {\n total: 50,\n currentPage: 1,\n },\n argTypes: {\n currentPage: {\n description: 'Current page number.',\n table: {\n category: 'Ifx-pagination props',\n defaultValue: {\n 'summary': '0'\n },\n type: {\n summary: 'number',\n },\n },\n },\n\n total: {\n description: 'Total number of items.',\n table: {\n category: 'Ifx-pagination props',\n defaultValue: {\n 'summary': '1'\n },\n type: {\n summary: 'number',\n },\n },\n },\n\n ifxPageChange: {\n action: 'ifxPageChange',\n description: 'Custom event emitted page is changed.',\n table: {\n ~~category: 'custom events',\n~~ type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxPageChange={handlePageChange}\\nVue:@ifxPageChange=\"handlePageChange\"\\nAngular:(ifxPageChange)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxPageChange\", (event) => {//handle page change});',\n },\n },\n },\n ifxNextPage: {\n action: 'ifxNextPage',\n description: 'Custom event emitted when next page button clicked.',\n table: {\n ~~category: 'custom events',\n~~ type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxNextPage={handlePageChange}\\nVue:@ifxNextPage=\"handlePageChange\"\\nAngular:(ifxNextPage)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxNextPage\", (event) => {//handle page change});',\n },\n },\n },\n ifxPrevPage: {\n action: 'ifxPrevPage',\n description: 'Custom event emitted when previous page button clicked.',\n table: {\n ~~category: 'custom events',\n~~ type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxPrevPage={handlePageChange}\\nVue:@ifxPrevPage=\"handlePageChange\"\\nAngular:(ifxPrevPage)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxPrevPage\", (event) => {//handle page change});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n const element = document.createElement('ifx-pagination');\n element.setAttribute('total', args.total);\n element.setAttribute('current-page', args.currentPage);\n element.addEventListener('ifxPageChange', action('ifxPageChange'));\n return element;\n};\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}
1	+ {"version":3,"file":"pagination.stories.js","sourceRoot":"","sources":["../../../src/components/pagination/pagination.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,sBAAsB;IAEtB,IAAI,EAAE;QACJ,KAAK,EAAE,EAAE;QACT,WAAW,EAAE,CAAC;KACf;IACD,QAAQ,EAAE;QACR,aAAa,EAAE;YACb,MAAM,EAAE,eAAe;YACvB,WAAW,EAAE,sCAAsC;YACnD,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,kNAAkN;iBACrN;aACF;SACF;QACD,WAAW,EAAE;YACX,MAAM,EAAE,aAAa;YACrB,WAAW,EAAE,oDAAoD;YACjE,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,0MAA0M;iBAC7M;aACF;SACF;QACD,WAAW,EAAE;YACX,MAAM,EAAE,aAAa;YACrB,WAAW,EAAE,wDAAwD;YACrE,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,uBAAuB;oBAChC,MAAM,EACJ,0MAA0M;iBAC7M;aACF;SACF;KACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE;IAC7B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACzD,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1C,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IACvD,OAAO,CAAC,gBAAgB,CAAC,eAAe,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC;IACnE,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,QAAQ,GAAG,EAAE,CAAC","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Pagination',\n // tags: ['autodocs'],\n\n args: {\n total: 50,\n currentPage: 1,\n },\n argTypes: {\n ifxPageChange: {\n action: 'ifxPageChange',\n description: 'Custom event emitted page is changed',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxPageChange={handlePageChange}\\nVue:@ifxPageChange=\"handlePageChange\"\\nAngular:(ifxPageChange)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxPageChange\", (event) => {//handle page change});',\n },\n },\n },\n ifxNextPage: {\n action: 'ifxNextPage',\n description: 'Custom event emitted when next page button clicked',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxNextPage={handlePageChange}\\nVue:@ifxNextPage=\"handlePageChange\"\\nAngular:(ifxNextPage)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxNextPage\", (event) => {//handle page change});',\n },\n },\n },\n ifxPrevPage: {\n action: 'ifxPrevPage',\n description: 'Custom event emitted when previous page button clicked',\n table: {\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxPrevPage={handlePageChange}\\nVue:@ifxPrevPage=\"handlePageChange\"\\nAngular:(ifxPrevPage)=\"handlePageChange()\"\\nVanillaJs:.addEventListener(\"ifxPrevPage\", (event) => {//handle page change});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = args => {\n const element = document.createElement('ifx-pagination');\n element.setAttribute('total', args.total);\n element.setAttribute('current-page', args.currentPage);\n element.addEventListener('ifxPageChange', action('ifxPageChange'));\n return element;\n};\n\nexport const Default = DefaultTemplate.bind({});\nDefault.argTypes = {};\n"]}