npm - @mgdis/mg-components - Versions diffs - 5.23.0 → 5.23.2 - Mend

@mgdis/mg-components 5.23.0 → 5.23.2

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 (181) hide show

package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-menu-item.js","sourceRoot":"","sources":["../../../../../src/components/molecules/menu/mg-menu-item/mg-menu-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Host, Watch, Element, Event, EventEmitter } from '@stencil/core';\nimport { ClassList, createID, isValidString } from '@mgdis/stencil-helpers';\nimport { initLocales } from '../../../../locales';\nimport { Direction } from '../mg-menu/mg-menu.conf';\nimport { Status } from './mg-menu-item.conf';\nimport type { MessageType } from '../../mg-item-more/mg-item-more.conf';\nimport type { MenuSizeType } from '../mg-menu/mg-menu.conf';\nimport type { DirectionType } from './mg-menu-item.conf';\nimport type { MgPopover } from '../../mg-popover/mg-popover';\n\n@Component({\n tag: 'mg-menu-item',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-menu-item.css',\n shadow: true,\n})\nexport class MgMenuItem {\n /***********\n Internal \n *********/\n\n private readonly name = 'mg-menu-item';\n private readonly navigationButton = 'mg-c-menu-item__navigation-button';\n private badgeLabel: string;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgMenuItemElement;\n\n /**********\n Props \n *********/\n\n /\n * Identifier is used to control mg-popover\n /\n @Prop() identifier = createID('mg-menu-item');\n\n /\n Define menu-item href\n * when defined menu-item contain an anchor instead of button\n /\n @Prop() href: string;\n\n /\n Define menu-item status.\n /\n @Prop({ reflect: true, mutable: true }) status: Status = Status.VISIBLE;\n @Watch('status')\n validateStatus(newValue: MgMenuItem['status'], oldValue?: MgMenuItem['status']): void {\n if (oldValue !== undefined) {\n this.navigationButtonClassList.delete(`${this.navigationButton}--${oldValue}`);\n }\n this.navigationButtonClassList.add(`${this.navigationButton}--${newValue}`);\n this.statusChange.emit(newValue);\n }\n\n /\n Define menu-item content expanded.\n /\n @Prop({ mutable: true }) expanded = false;\n @Watch('expanded')\n validateExpanded(newValue: MgMenuItem['expanded']): void {\n if (typeof newValue !== 'boolean') throw new Error(`<${this.name}> prop \"expanded\" must be a boolean.`);\n\n // if menu-item has sub-menu we have to apply some updates:\n if (this.hasChildren) {\n const subItems = Array.from(this.element.querySelectorAll(this.name));\n if (!newValue) {\n // - when main menu item is NOT expanded we need NOT expanded sub-items and NOT expanded sub-content\n subItems.forEach(item => {\n item.expanded = false;\n });\n } else if (this.element.querySelector(`${this.name}[status=\"${Status.ACTIVE}\"]`) !== null) {\n // - when expanded and contain an active item parents are expended too\n subItems.forEach(item => {\n if (this.hasStatus(item, Status.ACTIVE)) {\n item.expanded = true;\n }\n });\n }\n }\n }\n\n /********\n Events \n ******/\n\n /\n * Emited event when status change\n /\n @Event({ eventName: 'status-change' }) statusChange: EventEmitter<HTMLMgMenuItemElement['status']>;\n\n /\n Emited event when item is loaded\n /\n @Event({ eventName: 'item-loaded' }) itemLoaded: EventEmitter<void>;\n\n /********\n States \n ******/\n\n /\n * Define menu-item size.\n /\n @State() size: MenuSizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgMenuItem['size'], oldValue?: MgMenuItem['size']): void {\n this.navigationButtonClassList.delete(`${this.navigationButton}--size-${oldValue}`);\n this.navigationButtonClassList.add(`${this.navigationButton}--size-${newValue}`);\n }\n\n /\n Component button classes\n /\n @State() navigationButtonClassList: ClassList = new ClassList([this.navigationButton]);\n\n /\n Parent menu direction\n /\n @State() direction: DirectionType;\n @Watch('direction')\n validateDirection(newValue: MgMenuItem['direction']): void {\n // manage menu items style depending to parent menu horientation\n this.element.setAttribute('data-style-direction', newValue);\n this.navigationButtonClassList.add(`${this.navigationButton}--${newValue}`);\n // manage all sub levels child menu-items level with data-level attribut\n if (this.isDirection(Direction.VERTICAL, newValue)) {\n Array.from(this.element.querySelectorAll('mg-menu-item')).forEach(item => {\n item.dataset.level = `${(Number(item.dataset.level) \|\| 1) + 1}`;\n });\n }\n }\n\n /\n Does component is in main menu\n /\n @State() isInMainMenu: boolean;\n\n /\n Does element is item-more\n /\n @State() isItemMore: boolean;\n\n /\n Does component have children.\n /\n @State() hasChildren = false;\n @Watch('hasChildren')\n validateHasChildren(newValue: boolean): void {\n if (newValue && this.element.href !== undefined) {\n throw new Error(`<${this.name}> prop \"href\" is unauthorizied when element is a parent.`);\n }\n }\n\n /\n Does component should display notification badge.\n /\n @State() displayNotificationBadge: boolean;\n\n /*********\n Methods \n *******/\n\n /\n * Toggle expanded prop value\n /\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Does an Element have given Status\n * @param mgMenuItemElement - to parse\n * @param status - to check\n * @returns true if element with status is found\n /\n private hasStatus = (mgMenuItemElement: HTMLMgMenuItemElement, status: MgMenuItem['status']): boolean => mgMenuItemElement.status === status;\n\n /\n Is component contextual direction match the given direction\n * @param direction - in parent menu\n * @param compareWith - direction to compare with. Default: `this.direction`\n * @returns true is direction match the direction propertie\n /\n private isDirection = (direction: MgMenuItem['direction'], compareWith = this.direction): boolean => direction === compareWith;\n\n /\n Update displayNotificationBadge\n * current component notification badge have priority over the slot badge when submenu contain badge\n /\n private updateDisplayNotificationBadge = (): void => {\n const childMenu = this.element.querySelector('mg-menu');\n this.displayNotificationBadge =\n childMenu !== null &&\n Array.from(childMenu.children).some((subItem: HTMLMgMenuItemElement) => subItem.querySelector('mg-badge') !== null && subItem.getAttribute('hidden') === null);\n };\n\n /\n Method to control if one of component children have active status\n * @returns truthy if component has active child\n /\n private hasActiveChild = (): boolean =>\n Array.from(this.element.querySelector('mg-menu')?.children \|\| []).some(\n (element: HTMLMgMenuItemElement) => element.nodeName === 'MG-MENU-ITEM' && this.hasStatus(element, Status.ACTIVE) && element.getAttribute('hidden') === null,\n );\n\n /\n Validate slots\n * @param guard - prevent action with guard. Default: false.\n /\n private validateSlot = (guard = false): void => {\n // slot title AND metadata validation\n // add title on label AND metada slots due to text-overflow on these element\n if (Array.from(this.element.children).find(child => child.getAttribute('slot') === 'label') === undefined) throw new Error(`<${this.name}> slot \"label\" is required.`);\n ['label', 'metadata'].forEach(slot => {\n Array.from(this.element.querySelectorAll(`[slot=\"${slot}\"]`)).forEach(element => {\n if (!isValidString(element.textContent)) throw new Error(`<${this.name}> slot \"${slot}\" must have text content.`);\n if ((guard && element.getAttribute('title') === null) \|\| !guard) element.setAttribute('title', element.textContent);\n });\n });\n };\n\n /\n Update status\n * @param guard - status to exclude from process in addition to [Status.HIDDEN, Status.DISABLED] . Default: [].\n /\n private updateStatus = (guard = []): void => {\n if (![Status.HIDDEN, Status.DISABLED, ...guard].includes(this.status)) {\n this.status = this.hasActiveChild() ? Status.ACTIVE : Status.VISIBLE;\n }\n };\n\n /\n Init event-listeners\n /\n private initListeners = (): void => {\n // manage first sub-level menu-items\n Array.from(this.element.querySelector('mg-menu')?.children \|\| []).forEach(item => {\n if (item.nodeName === 'MG-MENU-ITEM') {\n // manage child menu listener\n item.addEventListener('status-change', () => {\n this.updateStatus();\n });\n }\n });\n };\n\n /\n Get mg-popover identifier\n * @returns generated mg-popover identifier\n /\n private getPopoverIdentifier = (): MgPopover['identifier'] => `${this.identifier}-popover`;\n\n /\n Render popover clickoutside guard for content slot\n /\n private updatePopoverGuard(): void {\n if (this.displayPopover())\n Array.from(this.element.children)\n .filter((child: HTMLElement) => child.getAttribute('slot') === null && child.nodeName !== 'MG-MENU' && Boolean(child.dataset))\n .forEach((slot: HTMLElement) => (slot.dataset.mgPopoverGuard = this.getPopoverIdentifier()));\n }\n\n /\n Condition to know if component should display a mg-popover\n * @returns truthy if component display popover\n /\n private displayPopover = (): boolean => this.isDirection(Direction.HORIZONTAL) && this.hasChildren && this.href === undefined;\n\n /**********\n Handlers \n *********/\n\n /\n * Handle interacrtive element click\n * @param event - click on element\n /\n private handleElementCLick = (event: MouseEvent): void => {\n if ((this.hasChildren && !this.isInMainMenu) \|\| this.status === Status.DISABLED) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n // toggle expanded when mg-menu-item has child items\n if (this.hasChildren) this.toggleExpanded();\n };\n\n /\n Handle popover element display-change event\n * @param event - popover display event\n /\n private handlePopoverDisplay = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Validate props\n /\n componentWillLoad(): void {\n // has children items that is NOT [slot='image' \| 'information' \| 'label' \| 'metadata'] element\n // we store only matching elements\n this.hasChildren = Array.from(this.element.children).some(child => !['image', 'information', 'label', 'metadata'].includes(child.getAttribute('slot')));\n this.badgeLabel = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu.badgeLabel;\n this.isItemMore = this.element.dataset.overflowMore !== undefined;\n\n // Validate props\n this.validateStatus(this.status);\n this.validateExpanded(this.expanded);\n\n // Validate states\n this.validateSize(this.size);\n }\n\n /\n Check if component slots configuration\n * @returns timeout\n /\n componentDidLoad(): ReturnType<typeof setTimeout> {\n // validation\n this.validateSlot(true);\n\n // update props and states after componentDidLoad hook\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n // define menu-item context states\n const menu = this.element.closest('mg-menu');\n this.direction = this.isItemMore \|\| menu === null ? Direction.HORIZONTAL : menu.direction;\n this.isInMainMenu = menu !== null && this.element.parentElement.closest('mg-menu-item') === null;\n if (menu?.size !== undefined) this.size = menu.size;\n\n if (this.isItemMore) this.size = this.element.dataset.size as MgMenuItem['size'];\n\n // when main menu item contain an active item it will get the active style\n // AND if item is in vertical menu it will be expanded\n if (this.hasActiveChild() && this.isInMainMenu) this.expanded = this.isDirection(Direction.VERTICAL);\n\n this.updateStatus([Status.ACTIVE]);\n this.updateDisplayNotificationBadge();\n this.updatePopoverGuard();\n\n // manage child dom changes with mutationObserver and listzners\n this.initListeners();\n\n // emit loaded event when component is fully loaded\n this.itemLoaded.emit();\n\n new MutationObserver(mutationsList => {\n if (mutationsList.some(mutation => mutation.attributeName === 'hidden')) this.updateStatus();\n if (mutationsList.some(mutation => mutation.type === 'characterData')) this.validateSlot();\n this.updateDisplayNotificationBadge();\n }).observe(this.element, { attributes: true, childList: true, characterData: true, subtree: true });\n }, 0);\n }\n\n /\n Render ineractive element\n * @returns HTML Element\n /\n private renderInteractiveElement(): HTMLElement {\n const TagName: string = this.href !== undefined ? 'a' : 'button';\n return (\n <TagName\n href={this.href}\n class={this.navigationButtonClassList.join()}\n tabindex={[Status.DISABLED, Status.HIDDEN].includes(this.status) ? -1 : undefined}\n disabled={this.status === Status.DISABLED}\n hidden={this.status === Status.HIDDEN}\n aria-expanded={this.hasChildren && this.expanded.toString()}\n aria-current={this.status === Status.ACTIVE && 'page'}\n onClick={this.handleElementCLick}\n >\n <slot name=\"image\"></slot>\n <div class={`${this.navigationButton}-center`}>\n <div class={`${this.navigationButton}-text-content`}>\n <slot name=\"label\"></slot>\n {!this.displayNotificationBadge && <slot name=\"information\"></slot>}\n {this.displayNotificationBadge && (\n <span class={`${this.navigationButton}-text-content-notification`}>\n <mg-badge label={this.badgeLabel} value=\"!\" variant=\"text-color\" slot=\"information\"></mg-badge>\n </span>\n )}\n </div>\n {this.size !== 'regular' && <slot name=\"metadata\"></slot>}\n </div>\n {this.hasChildren && this.href === undefined && (\n <span\n class={{\n [`${this.navigationButton}-chevron`]: true,\n [`${this.navigationButton}-chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\" size=\"small\"></mg-icon>\n </span>\n )}\n </TagName>\n );\n }\n\n /\n Render slot\n * @returns HTML Element\n /\n private renderSlot = (): HTMLElement => <slot></slot>;\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getContainerClasses = () => ({\n ['mg-c-menu-item__collapse-container']: true,\n ['mg-c-menu-item__collapse-container--first-level']: (this.isInMainMenu \|\| this.isItemMore) && this.isDirection(Direction.HORIZONTAL),\n });\n\n return (\n <Host role={this.isItemMore ? 'presentation' : 'listitem'}>\n {this.displayPopover() ? (\n <mg-popover display={this.expanded} placement=\"bottom-start\" arrowHide={true} onDisplay-change={this.handlePopoverDisplay} identifier={this.getPopoverIdentifier()}>\n {this.renderInteractiveElement()}\n <div class={getContainerClasses()} slot=\"content\">\n {this.renderSlot()}\n </div>\n </mg-popover>\n ) : (\n [\n this.renderInteractiveElement(),\n <div key=\"vertical-container\" class={getContainerClasses()} hidden={!this.expanded}>\n {this.renderSlot()}\n </div>,\n ]\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-menu-item.js","sourceRoot":"","sources":["../../../../../src/components/molecules/menu/mg-menu-item/mg-menu-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Host, Watch, Element, Event, EventEmitter } from '@stencil/core';\nimport { ClassList, createID, isValidString } from '@mgdis/stencil-helpers';\nimport { initLocales } from '../../../../locales';\nimport { Direction } from '../mg-menu/mg-menu.conf';\nimport { Status } from './mg-menu-item.conf';\nimport type { MessageType } from '../../mg-item-more/mg-item-more.conf';\nimport type { MenuSizeType } from '../mg-menu/mg-menu.conf';\nimport type { DirectionType } from './mg-menu-item.conf';\nimport type { MgPopover } from '../../mg-popover/mg-popover';\n\n@Component({\n tag: 'mg-menu-item',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-menu-item.css',\n shadow: true,\n})\nexport class MgMenuItem {\n /***********\n Internal \n *********/\n\n private readonly name = 'mg-menu-item';\n private readonly navigationButton = 'mg-c-menu-item__navigation-button';\n private badgeLabel: string;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgMenuItemElement;\n\n /**********\n Props \n *********/\n\n /\n * Identifier is used to control mg-popover\n /\n @Prop() identifier = createID('mg-menu-item');\n\n /\n Define menu-item href\n * when defined menu-item contain an anchor instead of button\n /\n @Prop() href: string;\n\n /\n Define menu-item status.\n /\n @Prop({ reflect: true, mutable: true }) status: Status = Status.VISIBLE;\n @Watch('status')\n validateStatus(newValue: MgMenuItem['status'], oldValue?: MgMenuItem['status']): void {\n if (oldValue !== undefined) {\n this.navigationButtonClassList.delete(`${this.navigationButton}--${oldValue}`);\n }\n this.navigationButtonClassList.add(`${this.navigationButton}--${newValue}`);\n this.statusChange.emit(newValue);\n }\n\n /\n Define menu-item content expanded.\n /\n @Prop({ mutable: true }) expanded = false;\n @Watch('expanded')\n validateExpanded(newValue: MgMenuItem['expanded']): void {\n if (typeof newValue !== 'boolean') throw new Error(`<${this.name}> prop \"expanded\" must be a boolean.`);\n\n // if menu-item has sub-menu we have to apply some updates:\n if (this.hasChildren) {\n const subItems = Array.from(this.element.querySelectorAll(this.name));\n if (!newValue) {\n // - when main menu item is NOT expanded we need NOT expanded sub-items and NOT expanded sub-content\n subItems.forEach(item => {\n item.expanded = false;\n });\n } else if (this.element.querySelector(`${this.name}[status=\"${Status.ACTIVE}\"]`) !== null) {\n // - when expanded and contain an active item parents are expended too\n subItems.forEach(item => {\n if (this.hasStatus(item, Status.ACTIVE)) {\n item.expanded = true;\n }\n });\n }\n }\n }\n\n /********\n Events \n ******/\n\n /\n * Emited event when status change\n /\n @Event({ eventName: 'status-change' }) statusChange: EventEmitter<HTMLMgMenuItemElement['status']>;\n\n /\n Emited event when item is loaded\n /\n @Event({ eventName: 'item-loaded' }) itemLoaded: EventEmitter<void>;\n\n /********\n States \n ******/\n\n /\n * Define menu-item size.\n /\n @State() size: MenuSizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgMenuItem['size'], oldValue?: MgMenuItem['size']): void {\n this.navigationButtonClassList.delete(`${this.navigationButton}--size-${oldValue}`);\n this.navigationButtonClassList.add(`${this.navigationButton}--size-${newValue}`);\n }\n\n /\n Component button classes\n /\n @State() navigationButtonClassList: ClassList = new ClassList([this.navigationButton]);\n\n /\n Parent menu direction\n /\n @State() direction: DirectionType;\n @Watch('direction')\n validateDirection(newValue: MgMenuItem['direction']): void {\n // manage menu items style depending to parent menu horientation\n this.element.setAttribute('data-style-direction', newValue);\n this.navigationButtonClassList.add(`${this.navigationButton}--${newValue}`);\n // manage all sub levels child menu-items level with data-level attribut\n if (this.isDirection(Direction.VERTICAL, newValue)) {\n Array.from(this.element.querySelectorAll('mg-menu-item')).forEach(item => {\n item.dataset.level = `${(Number(item.dataset.level) \|\| 1) + 1}`;\n });\n }\n }\n\n /\n Does component is in main menu\n /\n @State() isInMainMenu: boolean;\n\n /\n Does element is item-more\n /\n @State() isItemMore: boolean;\n\n /\n Does component have children.\n /\n @State() hasChildren = false;\n @Watch('hasChildren')\n validateHasChildren(newValue: boolean): void {\n if (newValue && this.element.href !== undefined) {\n throw new Error(`<${this.name}> prop \"href\" is unauthorizied when element is a parent.`);\n }\n }\n\n /\n Does component should display notification badge.\n /\n @State() displayNotificationBadge: boolean;\n\n /*********\n Methods \n *******/\n\n /\n * Toggle expanded prop value\n /\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Does an Element have given Status\n * @param mgMenuItemElement - to parse\n * @param status - to check\n * @returns true if element with status is found\n /\n private hasStatus = (mgMenuItemElement: HTMLMgMenuItemElement, status: MgMenuItem['status']): boolean => mgMenuItemElement.status === status;\n\n /\n Is component contextual direction match the given direction\n * @param direction - in parent menu\n * @param compareWith - direction to compare with. Default: `this.direction`\n * @returns true is direction match the direction propertie\n /\n private isDirection = (direction: MgMenuItem['direction'], compareWith = this.direction): boolean => direction === compareWith;\n\n /\n Update displayNotificationBadge\n * current component notification badge have priority over the slot badge when submenu contain badge\n /\n private updateDisplayNotificationBadge = (): void => {\n const childMenu = this.element.querySelector('mg-menu');\n this.displayNotificationBadge =\n childMenu !== null &&\n Array.from(childMenu.children).some((subItem: HTMLMgMenuItemElement) => subItem.querySelector('mg-badge') !== null && subItem.getAttribute('hidden') === null);\n };\n\n /\n Method to control if one of component children have active status\n * @returns truthy if component has active child\n /\n private hasActiveChild = (): boolean =>\n Array.from(this.element.querySelector('mg-menu')?.children \|\| []).some(\n (element: HTMLMgMenuItemElement) => element.nodeName === 'MG-MENU-ITEM' && this.hasStatus(element, Status.ACTIVE) && element.getAttribute('hidden') === null,\n );\n\n /\n Validate slots\n * @param guard - prevent action with guard. Default: false.\n /\n private validateSlot = (guard = false): void => {\n // slot title AND metadata validation\n // add title on label AND metada slots due to text-overflow on these element\n if (Array.from(this.element.children).find(child => child.getAttribute('slot') === 'label') === undefined) throw new Error(`<${this.name}> slot \"label\" is required.`);\n ['label', 'metadata'].forEach(slot => {\n Array.from(this.element.querySelectorAll(`[slot=\"${slot}\"]`)).forEach(element => {\n if (!isValidString(element.textContent)) throw new Error(`<${this.name}> slot \"${slot}\" must have text content.`);\n if ((guard && element.getAttribute('title') === null) \|\| !guard) element.setAttribute('title', element.textContent);\n });\n });\n };\n\n /\n Update status\n * @param guard - status to exclude from process in addition to [Status.HIDDEN, Status.DISABLED] . Default: [].\n /\n private updateStatus = (guard = []): void => {\n if (![Status.HIDDEN, Status.DISABLED, ...guard].includes(this.status)) {\n this.status = this.hasActiveChild() ? Status.ACTIVE : Status.VISIBLE;\n }\n };\n\n /\n Init event-listeners\n /\n private initListeners = (): void => {\n // manage first sub-level menu-items\n Array.from(this.element.querySelector('mg-menu')?.children \|\| []).forEach(item => {\n if (item.nodeName === 'MG-MENU-ITEM') {\n // manage child menu listener\n item.addEventListener('status-change', () => {\n this.updateStatus();\n });\n }\n });\n };\n\n /\n Get mg-popover identifier\n * @returns generated mg-popover identifier\n /\n private getPopoverIdentifier = (): MgPopover['identifier'] => `${this.identifier}-popover`;\n\n /\n Render popover clickoutside guard for content slot\n /\n private updatePopoverGuard(): void {\n if (this.displayPopover())\n Array.from(this.element.children)\n .filter((child: HTMLElement) => child.getAttribute('slot') === null && child.nodeName !== 'MG-MENU' && Boolean(child.dataset))\n .forEach((slot: HTMLElement) => (slot.dataset.mgPopoverGuard = this.getPopoverIdentifier()));\n }\n\n /\n Condition to know if component should display a mg-popover\n * @returns truthy if component display popover\n /\n private displayPopover = (): boolean => this.isDirection(Direction.HORIZONTAL) && this.hasChildren && this.href === undefined;\n\n /**********\n Handlers \n *********/\n\n /\n * Handle interacrtive element click\n * @param event - click on element\n /\n private handleElementCLick = (event: MouseEvent): void => {\n if ((this.hasChildren && !this.isInMainMenu) \|\| this.status === Status.DISABLED) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n // toggle expanded when mg-menu-item has child items\n if (this.hasChildren) this.toggleExpanded();\n };\n\n /\n Handle popover element display-change event\n * @param event - popover display event\n /\n private handlePopoverDisplay = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Validate props\n /\n componentWillLoad(): void {\n // has children items that is NOT [slot='image' \| 'information' \| 'label' \| 'metadata'] element\n // we store only matching elements\n this.hasChildren = Array.from(this.element.children).some(child => !['image', 'information', 'label', 'metadata'].includes(child.getAttribute('slot')));\n this.badgeLabel = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu.badgeLabel;\n this.isItemMore = this.element.dataset.overflowMore !== undefined;\n\n // Validate props\n this.validateStatus(this.status);\n this.validateExpanded(this.expanded);\n\n // Validate states\n this.validateSize(this.size);\n }\n\n /\n Check if component slots configuration\n * @returns timeout\n /\n componentDidLoad(): ReturnType<typeof setTimeout> {\n // validation\n this.validateSlot(true);\n\n // update props and states after componentDidLoad hook\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n // define menu-item context states\n const menu = this.element.closest('mg-menu');\n this.direction = this.isItemMore \|\| menu === null ? Direction.HORIZONTAL : menu.direction;\n this.isInMainMenu = menu !== null && this.element.parentElement.closest('mg-menu-item') === null;\n if (menu?.size !== undefined) this.size = menu.size;\n\n if (this.isItemMore) this.size = this.element.dataset.size as MgMenuItem['size'];\n\n // when main menu item contain an active item it will get the active style\n // AND if item is in vertical menu it will be expanded\n if (this.hasActiveChild() && this.isInMainMenu) this.expanded = this.isDirection(Direction.VERTICAL);\n\n this.updateStatus([Status.ACTIVE]);\n this.updateDisplayNotificationBadge();\n this.updatePopoverGuard();\n\n // manage child dom changes with mutationObserver and listzners\n this.initListeners();\n\n // emit loaded event when component is fully loaded\n this.itemLoaded.emit();\n\n new MutationObserver(mutationsList => {\n if (mutationsList.some(mutation => mutation.attributeName === 'hidden')) this.updateStatus();\n if (mutationsList.some(mutation => mutation.type === 'characterData')) this.validateSlot();\n this.updateDisplayNotificationBadge();\n }).observe(this.element, { attributes: true, childList: true, characterData: true, subtree: true });\n }, 0);\n }\n\n /\n Render ineractive element\n * @returns HTML Element\n /\n private renderInteractiveElement(): HTMLElement {\n const TagName: string = this.href !== undefined ? 'a' : 'button';\n return (\n <TagName\n href={this.href}\n class={this.navigationButtonClassList.join()}\n tabindex={[Status.DISABLED, Status.HIDDEN].includes(this.status) ? -1 : undefined}\n disabled={this.status === Status.DISABLED}\n hidden={this.status === Status.HIDDEN}\n aria-expanded={this.hasChildren && this.expanded.toString()}\n aria-current={this.status === Status.ACTIVE && 'page'}\n onClick={this.handleElementCLick}\n >\n <slot name=\"image\"></slot>\n <div class={`${this.navigationButton}-center`}>\n <div class={`${this.navigationButton}-text-content`}>\n <slot name=\"label\"></slot>\n {!this.displayNotificationBadge && <slot name=\"information\"></slot>}\n {this.displayNotificationBadge && (\n <span class={`${this.navigationButton}-text-content-notification`}>\n <mg-badge label={this.badgeLabel} value=\"!\" variant=\"text-color\" slot=\"information\"></mg-badge>\n </span>\n )}\n </div>\n {this.size !== 'regular' && <slot name=\"metadata\"></slot>}\n </div>\n {this.hasChildren && this.href === undefined && (\n <span\n class={{\n [`${this.navigationButton}-chevron`]: true,\n [`${this.navigationButton}-chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\" size=\"small\"></mg-icon>\n </span>\n )}\n </TagName>\n );\n }\n\n /\n Render slot\n * @returns HTML Element\n /\n private renderSlot = (): HTMLElement => <slot></slot>;\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getContainerClasses = () => ({\n ['mg-c-menu-item__collapse-container']: true,\n ['mg-c-menu-item__collapse-container--first-level']: (this.isInMainMenu \|\| this.isItemMore) && this.isDirection(Direction.HORIZONTAL),\n });\n\n return (\n <Host role={this.isItemMore ? 'presentation' : 'listitem'}>\n {this.displayPopover() ? (\n <mg-popover display={this.expanded} placement=\"bottom-start\" arrowHide={true} onDisplay-change={this.handlePopoverDisplay} identifier={this.getPopoverIdentifier()}>\n {this.renderInteractiveElement()}\n <div class={getContainerClasses()} slot=\"content\">\n {this.renderSlot()}\n </div>\n </mg-popover>\n ) : (\n [\n this.renderInteractiveElement(),\n <div key=\"vertical-container\" class={getContainerClasses()} hidden={!this.expanded}>\n {this.renderSlot()}\n </div>,\n ]\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-action-more/mg-action-more.js CHANGED Viewed

@@ -119,12 +119,12 @@ export class MgActionMore {
         const buttonLabel = this.button.label || this.messages.label;
         const buttonContent = [buttonLabel];
         if (!this.button.isIcon && this.displayChevron) {
-            buttonContent.push(h("span", { class: {
+            buttonContent.push(h("span", { key: 'f96c9e7fc99997a3eb3720ebac5803787a69c00d', class: {
                     [`${this.classBase}__chevron`]: true,
                     [`${this.classBase}__chevron--rotate`]: this.expanded === true,
-                } }, h("mg-icon", { icon: "chevron-down", size: "small" })));
+                } }, h("mg-icon", { key: '54bc38e860c770b15a736fa1ee61df2c2688a82d', icon: "chevron-down", size: "small" })));
         }
-        return (h(Host, { "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { class: "mg-action-more" }, h("mg-popover", { identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({}, this.icon)), !this.button.isIcon && buttonContent), h("div", { slot: "content" }, h("mg-menu", { direction: Direction.VERTICAL, label: this.messages.label }, this.items.map(item => {
+        return (h(Host, { key: 'fe5774abbf2421fa73a7dbac85f6eb0153efd13a', "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { key: 'ea3a898f62fea432231c2925b711af3607f2f6f1', class: "mg-action-more" }, h("mg-popover", { key: 'efe6b86dd602e0e4d77ae27c61541a81e3cc6d3a', identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { key: '48c8d385af91f17eb26809ffece1dcb95d30a644', variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({}, this.icon)), !this.button.isIcon && buttonContent), h("div", { key: 'cbc5f675b6b7f66e0a8c3f5b1ba5375816c0d065', slot: "content" }, h("mg-menu", { key: 'e6b0abe44a108b5125c46816a705c5198b62267d', direction: Direction.VERTICAL, label: this.messages.label }, this.items.map(item => {
             var _a;
             return (
             // eslint-disable-next-line react/jsx-no-bind

package/dist/collection/components/molecules/mg-action-more/mg-action-more.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-action-more.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-action-more/mg-action-more.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreMessageType } from './mg-action-more.conf';\nimport { initLocales } from '../../../locales';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport { createID } from '@mgdis/stencil-helpers';\n\n/*\n MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n const items = prop as MgActionMoreItemType[];\n return typeof items === 'object' && items.every(item => typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function');\n};\n\n/\n MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n const button = prop as MgActionMoreButtonType;\n return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/\n MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n const icon = prop as MgActionMoreIconType;\n return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n tag: 'mg-action-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n shadow: true,\n})\nexport class MgActionMore {\n /**********\n Internal \n *********/\n\n private readonly name = 'mg-action-more';\n private readonly classBase = 'mg-c-action-more';\n private readonly mgPopoverIdentifier = createID(this.name);\n private messages: MgActionMoreMessageType;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgActionMoreElement;\n\n /\n Define displayed icon\n /\n @Prop({ mutable: true }) icon: MgActionMoreIconType;\n @Watch('icon')\n validateIcon(newValue: MgActionMore['icon']): void {\n if (newValue && !isMgActionMoreIcon(newValue)) {\n throw new Error(`<${this.name}> prop icon must match MgActionMoreIconType.`);\n } else if (!newValue?.icon && Boolean(this.button.isIcon)) {\n this.icon = { icon: 'ellipsis' };\n }\n }\n\n /\n Define button properties\n /\n @Prop() button: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n @Watch('button')\n validateButton(newValue: MgActionMore['button']): void {\n if (newValue && !isMgActionMoreButton(newValue)) {\n throw new Error(`<${this.name}> prop button must match MgActionMoreButtonType.`);\n }\n }\n\n /\n Define the menu-items elements\n /\n @Prop() items!: MgActionMoreItemType[];\n @Watch('items')\n validateItems(newValue: MgActionMore['items']): void {\n if (!isMgActionMoreItems(newValue)) {\n throw new Error(`<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType.`);\n }\n }\n\n /\n Define if chevron is display\n /\n @Prop() displayChevron: boolean;\n @Watch('displayChevron')\n validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n if (newValue && this.button.isIcon === true) {\n throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n }\n }\n /\n Menu expanded state\n /\n @State() expanded = false;\n\n /**********\n Methods \n ********/\n\n /\n * Toggle expanded props\n /\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Handle popover display change value\n * @param event - display change updated value\n /\n private handleDisplayChange = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /\n Button click handler\n /\n private handleButton = (): void => {\n this.toggleExpanded();\n };\n\n /\n Item click handler\n * @param event - click event\n * @param customHandler - item['mouseEventHandler']\n /\n private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n this.expanded = false;\n customHandler(event);\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Validate props\n /\n componentWillLoad(): void {\n this.messages = initLocales(this.element).messages.actionMore as MgActionMoreMessageType;\n this.validateItems(this.items);\n this.validateButton(this.button);\n this.validateIcon(this.icon);\n this.validateDisplayChevron(this.displayChevron);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const buttonLabel = this.button.label \|\| this.messages.label;\n const buttonContent = [buttonLabel];\n\n if (!this.button.isIcon && this.displayChevron) {\n buttonContent.push(\n <span\n class={{\n [`${this.classBase}__chevron`]: true,\n [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\" size=\"small\"></mg-icon>\n </span>,\n );\n }\n\n return (\n <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n <span class=\"mg-action-more\">\n <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n {this.icon && <mg-icon {...this.icon}></mg-icon>}\n {!this.button.isIcon && buttonContent}\n </mg-button>\n <div slot=\"content\">\n <mg-menu direction={Direction.VERTICAL} label={this.messages.label}>\n {this.items.map(item => (\n // eslint-disable-next-line react/jsx-no-bind\n <mg-menu-item key={item.label} status={item.status \|\| Status.VISIBLE} onClick={e => this.handleItemClick(e, item.mouseEventHandler)} href={item.href}>\n {item.icon && <mg-icon icon={item.icon} slot=\"image\"></mg-icon>}\n <span slot=\"label\">{item.label}</span>\n {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n </mg-menu-item>\n ))}\n </mg-menu>\n </div>\n </mg-popover>\n </span>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-action-more.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-action-more/mg-action-more.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreMessageType } from './mg-action-more.conf';\nimport { initLocales } from '../../../locales';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport { createID } from '@mgdis/stencil-helpers';\n\n/*\n MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n const items = prop as MgActionMoreItemType[];\n return typeof items === 'object' && items.every(item => typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function');\n};\n\n/\n MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n const button = prop as MgActionMoreButtonType;\n return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/\n MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n /\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n const icon = prop as MgActionMoreIconType;\n return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n tag: 'mg-action-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n shadow: true,\n})\nexport class MgActionMore {\n /**********\n Internal \n *********/\n\n private readonly name = 'mg-action-more';\n private readonly classBase = 'mg-c-action-more';\n private readonly mgPopoverIdentifier = createID(this.name);\n private messages: MgActionMoreMessageType;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgActionMoreElement;\n\n /\n Define displayed icon\n /\n @Prop({ mutable: true }) icon: MgActionMoreIconType;\n @Watch('icon')\n validateIcon(newValue: MgActionMore['icon']): void {\n if (newValue && !isMgActionMoreIcon(newValue)) {\n throw new Error(`<${this.name}> prop icon must match MgActionMoreIconType.`);\n } else if (!newValue?.icon && Boolean(this.button.isIcon)) {\n this.icon = { icon: 'ellipsis' };\n }\n }\n\n /\n Define button properties\n /\n @Prop() button: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n @Watch('button')\n validateButton(newValue: MgActionMore['button']): void {\n if (newValue && !isMgActionMoreButton(newValue)) {\n throw new Error(`<${this.name}> prop button must match MgActionMoreButtonType.`);\n }\n }\n\n /\n Define the menu-items elements\n /\n @Prop() items!: MgActionMoreItemType[];\n @Watch('items')\n validateItems(newValue: MgActionMore['items']): void {\n if (!isMgActionMoreItems(newValue)) {\n throw new Error(`<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType.`);\n }\n }\n\n /\n Define if chevron is display\n /\n @Prop() displayChevron: boolean;\n @Watch('displayChevron')\n validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n if (newValue && this.button.isIcon === true) {\n throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n }\n }\n /\n Menu expanded state\n /\n @State() expanded = false;\n\n /**********\n Methods \n ********/\n\n /\n * Toggle expanded props\n /\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Handle popover display change value\n * @param event - display change updated value\n /\n private handleDisplayChange = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /\n Button click handler\n /\n private handleButton = (): void => {\n this.toggleExpanded();\n };\n\n /\n Item click handler\n * @param event - click event\n * @param customHandler - item['mouseEventHandler']\n /\n private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n this.expanded = false;\n customHandler(event);\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Validate props\n /\n componentWillLoad(): void {\n this.messages = initLocales(this.element).messages.actionMore as MgActionMoreMessageType;\n this.validateItems(this.items);\n this.validateButton(this.button);\n this.validateIcon(this.icon);\n this.validateDisplayChevron(this.displayChevron);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const buttonLabel = this.button.label \|\| this.messages.label;\n const buttonContent = [buttonLabel];\n\n if (!this.button.isIcon && this.displayChevron) {\n buttonContent.push(\n <span\n class={{\n [`${this.classBase}__chevron`]: true,\n [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\" size=\"small\"></mg-icon>\n </span>,\n );\n }\n\n return (\n <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n <span class=\"mg-action-more\">\n <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n {this.icon && <mg-icon {...this.icon}></mg-icon>}\n {!this.button.isIcon && buttonContent}\n </mg-button>\n <div slot=\"content\">\n <mg-menu direction={Direction.VERTICAL} label={this.messages.label}>\n {this.items.map(item => (\n // eslint-disable-next-line react/jsx-no-bind\n <mg-menu-item key={item.label} status={item.status \|\| Status.VISIBLE} onClick={e => this.handleItemClick(e, item.mouseEventHandler)} href={item.href}>\n {item.icon && <mg-icon icon={item.icon} slot=\"image\"></mg-icon>}\n <span slot=\"label\">{item.label}</span>\n {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n </mg-menu-item>\n ))}\n </mg-menu>\n </div>\n </mg-popover>\n </span>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-details/mg-details.js CHANGED Viewed

@@ -36,7 +36,7 @@ export class MgDetails {
      * @returns HTML Element
      */
     render() {
-        return (h("details", { class: "mg-c-details", onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", null, h("slot", { name: "summary" }), h("span", { class: "mg-c-details__toggle" }, h("mg-icon", { icon: "chevron-up", size: "small", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { class: "mg-c-details__details" }, h("slot", { name: "details" }))));
+        return (h("details", { key: '21565155c214af9779d1a18822f53a991460176a', class: "mg-c-details", onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", { key: '9206eb7628f8363fdb8f495cd482911a20bf5a2b' }, h("slot", { key: 'b802325ea921079bf640da9c8e30f19738deb43f', name: "summary" }), h("span", { key: '7a1d0e60ace5e83cd8300937e2ac6155e976ee58', class: "mg-c-details__toggle" }, h("mg-icon", { key: '1b12014f3cc8be340a4667a4fa754ad464be5dd1', icon: "chevron-up", size: "small", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { key: 'c273ce19819bc58a3c6387c7677b45516d431f7b', class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { key: 'd1e6666b6b019d0a5cededf269f3591f459f6bc1', class: "mg-c-details__details" }, h("slot", { key: '557858c76e718877ba7949b187a6b4b1e5f9c3be', name: "details" }))));
     }
     static get is() { return "mg-details"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/mg-details/mg-details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-details.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-details/mg-details.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAOvD,MAAM,OAAO,SAAS;;QAgDpB;;WAEG;QACK,iBAAY,GAAG,GAAS,EAAE;YAChC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;QACpC,CAAC,CAAC;;;2BArBoB,KAAK;wBAKS,KAAK;;IAdzC,cAAc,CAAC,QAAgB;QAC7B,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,MAAM,IAAI,KAAK,CAAC,sEAAsE,CAAC,CAAC;QAC1F,CAAC;IACH,CAAC;IAYD,cAAc,CAAC,QAAiB;QAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrC,CAAC;IAcD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACvC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACzC,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,~~eAAS~~,KAAK,EAAC,cAAc,EAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAsB,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;YAClI;gBACE,~~YAAM~~,IAAI,EAAC,SAAS,GAAQ;gBAC5B,~~YAAM~~,KAAK,EAAC,sBAAsB;oBAChC,~~eAAS~~,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,2BAA2B,EAAE,IAAI,EAAE,oCAAoC,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAY;oBACtJ,~~YAAM~~,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,WAAW,EAAE,IAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAQ,CACpH,CACC;YACV,~~WAAK~~,KAAK,EAAC,uBAAuB;gBAChC,~~YAAM~~,IAAI,EAAC,SAAS,GAAQ,CACxB,CACE,CACX,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-details',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-details.css',\n shadow: true,\n})\nexport class MgDetails {\n /***********\n Internal \n *********/\n\n // HTML selector\n private details: HTMLDetailsElement;\n\n /***********\n Decorators \n ***********/\n\n /\n * Displayed title when details are closed\n /\n @Prop() toggleClosed!: string;\n\n /\n Displayed title when details are opened\n /\n @Prop() toggleOpened!: string;\n @Watch('toggleClosed')\n @Watch('toggleOpened')\n validateTitles(newValue: string): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-details> prop \"toggleClosed\" and \"toggleOpened\" must be defined.');\n }\n }\n\n /\n Hide summary element\n /\n @Prop() hideSummary = false;\n\n /\n Define if details are diplayed\n /\n @Prop({ mutable: true }) expanded = false;\n @Watch('expanded')\n handleExpanded(newValue: boolean): void {\n this.expandedChange.emit(newValue);\n }\n\n /\n Emmited event when expanded change\n /\n @Event({ eventName: 'expanded-change' }) expandedChange: EventEmitter<HTMLMgDetailsElement['expanded']>;\n\n /\n Handle details toggle\n /\n private handleToggle = (): void => {\n this.expanded = this.details.open;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n this.validateTitles(this.toggleClosed);\n this.validateTitles(this.toggleOpened);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <details class=\"mg-c-details\" onToggle={this.handleToggle} open={this.expanded} ref={(el: HTMLDetailsElement) => (this.details = el)}>\n <summary>\n <slot name=\"summary\"></slot>\n <span class=\"mg-c-details__toggle\">\n <mg-icon icon=\"chevron-up\" size=\"small\" class={{ 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded }}></mg-icon>\n <span class={{ 'mg-u-visually-hidden': this.hideSummary }}>{this.expanded ? this.toggleOpened : this.toggleClosed}</span>\n </span>\n </summary>\n <div class=\"mg-c-details__details\">\n <slot name=\"details\"></slot>\n </div>\n </details>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-details.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-details/mg-details.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAOvD,MAAM,OAAO,SAAS;;QAgDpB;;WAEG;QACK,iBAAY,GAAG,GAAS,EAAE;YAChC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;QACpC,CAAC,CAAC;;;2BArBoB,KAAK;wBAKS,KAAK;;IAdzC,cAAc,CAAC,QAAgB;QAC7B,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,MAAM,IAAI,KAAK,CAAC,sEAAsE,CAAC,CAAC;QAC1F,CAAC;IACH,CAAC;IAYD,cAAc,CAAC,QAAiB;QAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrC,CAAC;IAcD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACvC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACzC,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,gEAAS,KAAK,EAAC,cAAc,EAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAsB,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;YAClI;gBACE,6DAAM,IAAI,EAAC,SAAS,GAAQ;gBAC5B,6DAAM,KAAK,EAAC,sBAAsB;oBAChC,gEAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,2BAA2B,EAAE,IAAI,EAAE,oCAAoC,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAY;oBACtJ,6DAAM,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,WAAW,EAAE,IAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAQ,CACpH,CACC;YACV,4DAAK,KAAK,EAAC,uBAAuB;gBAChC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACE,CACX,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-details',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-details.css',\n shadow: true,\n})\nexport class MgDetails {\n /***********\n Internal \n *********/\n\n // HTML selector\n private details: HTMLDetailsElement;\n\n /***********\n Decorators \n ***********/\n\n /\n * Displayed title when details are closed\n /\n @Prop() toggleClosed!: string;\n\n /\n Displayed title when details are opened\n /\n @Prop() toggleOpened!: string;\n @Watch('toggleClosed')\n @Watch('toggleOpened')\n validateTitles(newValue: string): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-details> prop \"toggleClosed\" and \"toggleOpened\" must be defined.');\n }\n }\n\n /\n Hide summary element\n /\n @Prop() hideSummary = false;\n\n /\n Define if details are diplayed\n /\n @Prop({ mutable: true }) expanded = false;\n @Watch('expanded')\n handleExpanded(newValue: boolean): void {\n this.expandedChange.emit(newValue);\n }\n\n /\n Emmited event when expanded change\n /\n @Event({ eventName: 'expanded-change' }) expandedChange: EventEmitter<HTMLMgDetailsElement['expanded']>;\n\n /\n Handle details toggle\n /\n private handleToggle = (): void => {\n this.expanded = this.details.open;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n this.validateTitles(this.toggleClosed);\n this.validateTitles(this.toggleOpened);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <details class=\"mg-c-details\" onToggle={this.handleToggle} open={this.expanded} ref={(el: HTMLDetailsElement) => (this.details = el)}>\n <summary>\n <slot name=\"summary\"></slot>\n <span class=\"mg-c-details__toggle\">\n <mg-icon icon=\"chevron-up\" size=\"small\" class={{ 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded }}></mg-icon>\n <span class={{ 'mg-u-visually-hidden': this.hideSummary }}>{this.expanded ? this.toggleOpened : this.toggleClosed}</span>\n </span>\n </summary>\n <div class=\"mg-c-details__details\">\n <slot name=\"details\"></slot>\n </div>\n </details>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-form/mg-form.js CHANGED Viewed

@@ -164,7 +164,7 @@ export class MgForm {
      * @returns HTML Element
      */
     render() {
-        return (h("form", { class: this.classCollection.join(), id: this.identifier, name: this.name, onSubmit: this.handleFormSubmit, role: this.ariaRole }, this.requiredMessageText && h("p", { innerHTML: this.requiredMessageText }), h("slot", null), !this.readonly && !this.disabled && h("slot", { name: "actions" })));
+        return (h("form", { key: 'b398087ca0ce5b911130a473669540daf267c214', class: this.classCollection.join(), id: this.identifier, name: this.name, onSubmit: this.handleFormSubmit, role: this.ariaRole }, this.requiredMessageText && h("p", { innerHTML: this.requiredMessageText }), h("slot", { key: 'ee961f5fe0138af53826b8a2e415873316015497' }), !this.readonly && !this.disabled && h("slot", { name: "actions" })));
     }
     static get is() { return "mg-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/mg-form/mg-form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-form.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-form/mg-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { createID, ClassList } from '@mgdis/stencil-helpers';\nimport { initLocales } from '../../../locales';\nimport { HTMLMgInputsElement } from '../inputs/MgInput.conf';\nimport { AriaRoleType, requiredMessageStatus, RequiredMessageStatusType, roles } from './mg-form.conf';\n\n@Component({\n tag: 'mg-form',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-form.css',\n shadow: true,\n})\nexport class MgForm {\n /***********\n Internal \n *********/\n\n private mgInputs: HTMLMgInputsElement[];\n private mgButtons: HTMLMgButtonElement[];\n\n // Classes\n private readonly classAllRequired = 'mg-c-form--all-required';\n\n // Locales\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgFormElement;\n\n /\n Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n * If not set, it will be created.\n /\n @Prop() identifier: string = createID('mg-form');\n\n /\n Input name\n * If not set the value equals the identifier\n /\n @Prop() name: string = this.identifier;\n\n /\n Define if form is readonly\n /\n @Prop() readonly = false;\n\n /\n Define when required message is display.\n * When it is unset, component use it internal logic to manage \"required message\" help text display.\n * When you set the prop to `default`, you override the component internal logique to torce it display \"required message\" help text.\n * When you set the prop to `hide`, it will prevent the rendering of the message in the component's DOM.\n * As this element is an accessibility requirement in the view,\n * you MUST* re-implement this message on your own and display it when your form contains required inputs.\n /\n @Prop() requiredMessage: RequiredMessageStatusType;\n @Watch('requiredMessage')\n validateRequiredMessage(newValue): void {\n if (newValue && !requiredMessageStatus.includes(newValue)) throw new Error(`<mg-form> prop \"requiredMessage\" must be one of: ${requiredMessageStatus.join(', ')}.`);\n }\n\n /\n Define `<form/>` element aria role\n * see more about aria roles use case: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles\n /\n @Prop() ariaRole: AriaRoleType;\n @Watch('ariaRole')\n validateAriaRole(newValue: MgForm['ariaRole']) {\n if (newValue && !roles.includes(newValue)) throw new Error(`<mg-form> prop \"ariaRole\" must be one of: ${roles.join(', ')}.`);\n }\n\n /\n Define if form is disabled\n /\n @Prop() disabled = false;\n @Watch('readonly')\n @Watch('disabled')\n @Watch('requiredMessage')\n handleAttributeChange(): void {\n this.setMgInputs();\n this.setRequiredMessage();\n }\n\n /\n Define form valid state\n /\n @Prop({ mutable: true }) valid: boolean;\n\n /\n Define form invalid state\n /\n @Prop({ mutable: true }) invalid: boolean;\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-form']);\n\n /\n Required message\n /\n @State() requiredMessageText: string;\n\n /\n Emitted event on form validity check\n * Tells if form is valid or not\n /\n @Event({ eventName: 'form-valid' }) formValid: EventEmitter<HTMLMgFormElement['valid']>;\n\n /\n Emitted event on form submit\n /\n @Event({ eventName: 'form-submit' }) formSubmit: EventEmitter<boolean>;\n\n /\n Display input error if it exists.\n /\n @Method()\n async displayError(): Promise<void> {\n if (!this.readonly) {\n this.mgInputs.forEach(input => {\n input.displayError?.();\n });\n this.checkValidity();\n }\n }\n\n /\n Define required message based on mg-inputs required elements\n /\n private setRequiredMessage = (): void => {\n // init required message\n this.requiredMessageText = null;\n this.classCollection.delete(this.classAllRequired);\n\n if (this.requiredMessage === 'hide') return;\n else if (this.requiredMessage === 'default') {\n this.requiredMessageText = this.messages.form.required;\n return;\n }\n\n // If the form is disabled or readonly none of them are required\n // Check if all fields are not editable (readonly or disabled)\n const isEditable = input => !(input.disabled \|\| input.readonly);\n const isMgInputToggle = input => input.nodeName === 'MG-INPUT-TOGGLE';\n if (!this.disabled && !this.readonly && this.mgInputs.some(input => isEditable(input) && !isMgInputToggle(input))) {\n // Get editable inputs\n const editableInputs: HTMLMgInputsElement[] = this.mgInputs.filter(isEditable);\n // Get required inputs\n // mg-input-toggle can not be required\n const requiredInputs: HTMLMgInputsElement[] = editableInputs.filter(input => !isMgInputToggle(input) && input.required);\n // All inputs are required\n if (\n [requiredInputs.length, editableInputs.length].every(length => length === 1) \|\|\n (requiredInputs.length > 1 && requiredInputs.length === editableInputs.filter(input => !isMgInputToggle(input)).length)\n ) {\n this.requiredMessageText = this.getRequiredMessageBasedOnCount(requiredInputs, 'allRequiredSingle', 'allRequired');\n this.classCollection.add(this.classAllRequired);\n }\n // Some fields are required\n else if (requiredInputs.length > 0) {\n this.requiredMessageText = this.getRequiredMessageBasedOnCount(requiredInputs, 'requiredSingle', 'required');\n }\n }\n };\n\n /\n Returns a required message based on the count of required inputs.\n * @param requiredInputs - An array of required input elements.\n * @param keySingle - The key for the singular message format.\n * @param keyPlural - The key for the plural message format.\n * @returns The appropriate required message based on the count of required inputs.\n /\n private getRequiredMessageBasedOnCount = (requiredInputs: HTMLMgInputsElement[], keySingle: string, keyPlural: string) =>\n this.messages.form[requiredInputs.length === 1 ? keySingle : keyPlural];\n\n /\n Check if form is valid\n /\n private checkValidity = (): void => {\n // Update required on input event\n this.setRequiredMessage();\n\n this.valid = !this.mgInputs.some(input => input.invalid);\n this.invalid = !this.valid;\n // We need to send valid event if it is the same value\n this.formValid.emit(this.valid);\n };\n\n /\n Handle Form Submit\n * @param event - submit event\n /\n private handleFormSubmit = (event: SubmitEvent): void => {\n event.preventDefault();\n this.formSubmit.emit();\n };\n\n /\n Set mgInputs\n /\n private setMgInputs = (): void => {\n // Get slotted mgInputs\n this.mgInputs = Array.from(this.element.querySelectorAll('')).filter((node: Node) => node.nodeName.startsWith('MG-INPUT-')) as HTMLMgInputsElement[];\n // Set inputs readonly or disabled based on form configuration\n // Othewise listen to events\n this.mgInputs.forEach(input => {\n if (this.readonly) input.readonly = true;\n else if (this.disabled) input.disabled = true;\n else input.addEventListener('input-valid', this.checkValidity);\n });\n };\n\n /************\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n\n this.validateAriaRole(this.ariaRole);\n this.validateRequiredMessage(this.requiredMessage);\n\n // Get slotted mgButtons\n this.mgButtons = Array.from(this.element.querySelectorAll('mg-button'));\n\n // Set button form identifier\n this.mgButtons.forEach(mgButton => {\n mgButton.setAttribute('form', this.identifier);\n });\n\n // Set mgInputs\n this.setMgInputs();\n\n // Check validity when slotted mgInputs are ready\n Promise.all(\n this.mgInputs.map(async input => {\n try {\n await input.componentOnReady();\n } catch {} // prevent error with VueJS first render\n }),\n ).then(() => {\n // Define required message and check validity\n this.checkValidity();\n });\n }\n\n /\n Add slot listeners\n /\n componentDidLoad(): void {\n // Update mgInputs when mgForm content change\n new MutationObserver(() => {\n this.setMgInputs();\n }).observe(this.element, { childList: true });\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <form class={this.classCollection.join()} id={this.identifier} name={this.name} onSubmit={this.handleFormSubmit} role={this.ariaRole}>\n {this.requiredMessageText && <p innerHTML={this.requiredMessageText}></p>}\n <slot></slot>\n {!this.readonly && !this.disabled && <slot name=\"actions\"></slot>}\n </form>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-form.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-form/mg-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { createID, ClassList } from '@mgdis/stencil-helpers';\nimport { initLocales } from '../../../locales';\nimport { HTMLMgInputsElement } from '../inputs/MgInput.conf';\nimport { AriaRoleType, requiredMessageStatus, RequiredMessageStatusType, roles } from './mg-form.conf';\n\n@Component({\n tag: 'mg-form',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-form.css',\n shadow: true,\n})\nexport class MgForm {\n /***********\n Internal \n *********/\n\n private mgInputs: HTMLMgInputsElement[];\n private mgButtons: HTMLMgButtonElement[];\n\n // Classes\n private readonly classAllRequired = 'mg-c-form--all-required';\n\n // Locales\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgFormElement;\n\n /\n Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n * If not set, it will be created.\n /\n @Prop() identifier: string = createID('mg-form');\n\n /\n Input name\n * If not set the value equals the identifier\n /\n @Prop() name: string = this.identifier;\n\n /\n Define if form is readonly\n /\n @Prop() readonly = false;\n\n /\n Define when required message is display.\n * When it is unset, component use it internal logic to manage \"required message\" help text display.\n * When you set the prop to `default`, you override the component internal logique to torce it display \"required message\" help text.\n * When you set the prop to `hide`, it will prevent the rendering of the message in the component's DOM.\n * As this element is an accessibility requirement in the view,\n * you MUST* re-implement this message on your own and display it when your form contains required inputs.\n /\n @Prop() requiredMessage: RequiredMessageStatusType;\n @Watch('requiredMessage')\n validateRequiredMessage(newValue): void {\n if (newValue && !requiredMessageStatus.includes(newValue)) throw new Error(`<mg-form> prop \"requiredMessage\" must be one of: ${requiredMessageStatus.join(', ')}.`);\n }\n\n /\n Define `<form/>` element aria role\n * see more about aria roles use case: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles\n /\n @Prop() ariaRole: AriaRoleType;\n @Watch('ariaRole')\n validateAriaRole(newValue: MgForm['ariaRole']) {\n if (newValue && !roles.includes(newValue)) throw new Error(`<mg-form> prop \"ariaRole\" must be one of: ${roles.join(', ')}.`);\n }\n\n /\n Define if form is disabled\n /\n @Prop() disabled = false;\n @Watch('readonly')\n @Watch('disabled')\n @Watch('requiredMessage')\n handleAttributeChange(): void {\n this.setMgInputs();\n this.setRequiredMessage();\n }\n\n /\n Define form valid state\n /\n @Prop({ mutable: true }) valid: boolean;\n\n /\n Define form invalid state\n /\n @Prop({ mutable: true }) invalid: boolean;\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-form']);\n\n /\n Required message\n /\n @State() requiredMessageText: string;\n\n /\n Emitted event on form validity check\n * Tells if form is valid or not\n /\n @Event({ eventName: 'form-valid' }) formValid: EventEmitter<HTMLMgFormElement['valid']>;\n\n /\n Emitted event on form submit\n /\n @Event({ eventName: 'form-submit' }) formSubmit: EventEmitter<boolean>;\n\n /\n Display input error if it exists.\n /\n @Method()\n async displayError(): Promise<void> {\n if (!this.readonly) {\n this.mgInputs.forEach(input => {\n input.displayError?.();\n });\n this.checkValidity();\n }\n }\n\n /\n Define required message based on mg-inputs required elements\n /\n private setRequiredMessage = (): void => {\n // init required message\n this.requiredMessageText = null;\n this.classCollection.delete(this.classAllRequired);\n\n if (this.requiredMessage === 'hide') return;\n else if (this.requiredMessage === 'default') {\n this.requiredMessageText = this.messages.form.required;\n return;\n }\n\n // If the form is disabled or readonly none of them are required\n // Check if all fields are not editable (readonly or disabled)\n const isEditable = input => !(input.disabled \|\| input.readonly);\n const isMgInputToggle = input => input.nodeName === 'MG-INPUT-TOGGLE';\n if (!this.disabled && !this.readonly && this.mgInputs.some(input => isEditable(input) && !isMgInputToggle(input))) {\n // Get editable inputs\n const editableInputs: HTMLMgInputsElement[] = this.mgInputs.filter(isEditable);\n // Get required inputs\n // mg-input-toggle can not be required\n const requiredInputs: HTMLMgInputsElement[] = editableInputs.filter(input => !isMgInputToggle(input) && input.required);\n // All inputs are required\n if (\n [requiredInputs.length, editableInputs.length].every(length => length === 1) \|\|\n (requiredInputs.length > 1 && requiredInputs.length === editableInputs.filter(input => !isMgInputToggle(input)).length)\n ) {\n this.requiredMessageText = this.getRequiredMessageBasedOnCount(requiredInputs, 'allRequiredSingle', 'allRequired');\n this.classCollection.add(this.classAllRequired);\n }\n // Some fields are required\n else if (requiredInputs.length > 0) {\n this.requiredMessageText = this.getRequiredMessageBasedOnCount(requiredInputs, 'requiredSingle', 'required');\n }\n }\n };\n\n /\n Returns a required message based on the count of required inputs.\n * @param requiredInputs - An array of required input elements.\n * @param keySingle - The key for the singular message format.\n * @param keyPlural - The key for the plural message format.\n * @returns The appropriate required message based on the count of required inputs.\n /\n private getRequiredMessageBasedOnCount = (requiredInputs: HTMLMgInputsElement[], keySingle: string, keyPlural: string) =>\n this.messages.form[requiredInputs.length === 1 ? keySingle : keyPlural];\n\n /\n Check if form is valid\n /\n private checkValidity = (): void => {\n // Update required on input event\n this.setRequiredMessage();\n\n this.valid = !this.mgInputs.some(input => input.invalid);\n this.invalid = !this.valid;\n // We need to send valid event if it is the same value\n this.formValid.emit(this.valid);\n };\n\n /\n Handle Form Submit\n * @param event - submit event\n /\n private handleFormSubmit = (event: SubmitEvent): void => {\n event.preventDefault();\n this.formSubmit.emit();\n };\n\n /\n Set mgInputs\n /\n private setMgInputs = (): void => {\n // Get slotted mgInputs\n this.mgInputs = Array.from(this.element.querySelectorAll('')).filter((node: Node) => node.nodeName.startsWith('MG-INPUT-')) as HTMLMgInputsElement[];\n // Set inputs readonly or disabled based on form configuration\n // Othewise listen to events\n this.mgInputs.forEach(input => {\n if (this.readonly) input.readonly = true;\n else if (this.disabled) input.disabled = true;\n else input.addEventListener('input-valid', this.checkValidity);\n });\n };\n\n /************\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n\n this.validateAriaRole(this.ariaRole);\n this.validateRequiredMessage(this.requiredMessage);\n\n // Get slotted mgButtons\n this.mgButtons = Array.from(this.element.querySelectorAll('mg-button'));\n\n // Set button form identifier\n this.mgButtons.forEach(mgButton => {\n mgButton.setAttribute('form', this.identifier);\n });\n\n // Set mgInputs\n this.setMgInputs();\n\n // Check validity when slotted mgInputs are ready\n Promise.all(\n this.mgInputs.map(async input => {\n try {\n await input.componentOnReady();\n } catch {} // prevent error with VueJS first render\n }),\n ).then(() => {\n // Define required message and check validity\n this.checkValidity();\n });\n }\n\n /\n Add slot listeners\n /\n componentDidLoad(): void {\n // Update mgInputs when mgForm content change\n new MutationObserver(() => {\n this.setMgInputs();\n }).observe(this.element, { childList: true });\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <form class={this.classCollection.join()} id={this.identifier} name={this.name} onSubmit={this.handleFormSubmit} role={this.ariaRole}>\n {this.requiredMessageText && <p innerHTML={this.requiredMessageText}></p>}\n <slot></slot>\n {!this.readonly && !this.disabled && <slot name=\"actions\"></slot>}\n </form>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js CHANGED Viewed

@@ -27,13 +27,13 @@ export class MgIllustratedMessage {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { class: {
+        return (h("div", { key: '2fdba6c8f99b0db0955f4f6e85c90e6b73aeb506', class: {
                 'mg-c-illustrated-message': true,
                 'mg-c-illustrated-message--horizontal': this.direction === 'horizontal',
-            } }, h("div", { class: {
+            } }, h("div", { key: 'c41ca15c897ae3f855ce0e922e1afc6f0475c014', class: {
                 'mg-c-illustrated-message__illustration': true,
                 'mg-c-illustrated-message__illustration--small': this.size === 'small',
-            } }, h("slot", { name: "illustration" })), h("div", { class: "mg-c-illustrated-message__slots" }, h("div", { class: "mg-c-illustrated-message__title" }, h("slot", { name: "title" })), h("div", { class: "mg-c-illustrated-message__details" }, h("slot", { name: "details" })))));
+            } }, h("slot", { key: 'c0f9308201945fae94d13afc45596ba45efdd890', name: "illustration" })), h("div", { key: '5c020c6c0154a527485662dd47eda0ad141e2efc', class: "mg-c-illustrated-message__slots" }, h("div", { key: 'e5ff38b7a081232af9382c6bda756bdd31360f86', class: "mg-c-illustrated-message__title" }, h("slot", { key: '39b3ff01828d05780bd18f04a9971acc0b47a684', name: "title" })), h("div", { key: 'f0cc3464ff7c28ad6a26445ffeca1a0dc40d51ce', class: "mg-c-illustrated-message__details" }, h("slot", { key: '32f4165453cc3dba7b78d1ad0addc63cf35d246d', name: "details" })))));
     }
     static get is() { return "mg-illustrated-message"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-illustrated-message.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-illustrated-message/mg-illustrated-message.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAOnD,MAAM,OAAO,oBAAoB;;oBAaK,SAAS;yBAKE,UAAU;;IAEzD;;mBAEe;IAEf;;OAEG;IACH,gBAAgB;QACd,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;QACzD,MAAM,oBAAoB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;QAEpF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,WAAW,CAAC,EAAE,CAAC;YAC1E,MAAM,IAAI,KAAK,CAAC,6DAA6D,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACzG,CAAC;aAAM,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC7C,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC,CAAC;QAC/F,CAAC;QAED,oBAAoB,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC9D,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,~~WACE~~,KAAK,EAAE;gBACL,0BAA0B,EAAE,IAAI;gBAChC,sCAAsC,EAAE,IAAI,CAAC,SAAS,KAAK,YAAY;aACxE;YAED,~~WACE~~,KAAK,EAAE;oBACL,wCAAwC,EAAE,IAAI;oBAC9C,+CAA+C,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;iBACvE;gBAED,~~YAAM~~,IAAI,EAAC,cAAc,GAAQ,CAC7B;YACN,~~WAAK~~,KAAK,EAAC,iCAAiC;gBAC1C,~~WAAK~~,KAAK,EAAC,iCAAiC;oBAC1C,~~YAAM~~,IAAI,EAAC,OAAO,GAAQ,CACtB;gBACN,~~WAAK~~,KAAK,EAAC,mCAAmC;oBAC5C,~~YAAM~~,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Prop } from '@stencil/core';\nimport { isTagName } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-illustrated-message',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-illustrated-message.css',\n shadow: true,\n})\nexport class MgIllustratedMessage {\n /*************\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgIllustratedMessageElement;\n\n /\n Define illustration size\n /\n @Prop() size: 'regular' \| 'small' = 'regular';\n\n /\n Define component orientation\n /\n @Prop() direction: 'vertical' \| 'horizontal' = 'vertical';\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentDidLoad(): void {\n const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n const slottedIllustrations = this.element.querySelectorAll('[slot=\"illustration\"]');\n\n if (!isTagName(this.element.querySelector('[slot=\"title\"]'), headingTags)) {\n throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}`);\n } else if (slottedIllustrations.length !== 1) {\n throw new Error('<mg-illustrated-message> Slotted illustration must be present and unique.');\n }\n\n slottedIllustrations[0].setAttribute('aria-hidden', 'true');\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div\n class={{\n 'mg-c-illustrated-message': true,\n 'mg-c-illustrated-message--horizontal': this.direction === 'horizontal',\n }}\n >\n <div\n class={{\n 'mg-c-illustrated-message__illustration': true,\n 'mg-c-illustrated-message__illustration--small': this.size === 'small',\n }}\n >\n <slot name=\"illustration\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__slots\">\n <div class=\"mg-c-illustrated-message__title\">\n <slot name=\"title\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__details\">\n <slot name=\"details\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-illustrated-message.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-illustrated-message/mg-illustrated-message.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAOnD,MAAM,OAAO,oBAAoB;;oBAaK,SAAS;yBAKE,UAAU;;IAEzD;;mBAEe;IAEf;;OAEG;IACH,gBAAgB;QACd,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;QACzD,MAAM,oBAAoB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;QAEpF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,WAAW,CAAC,EAAE,CAAC;YAC1E,MAAM,IAAI,KAAK,CAAC,6DAA6D,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACzG,CAAC;aAAM,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC7C,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC,CAAC;QAC/F,CAAC;QAED,oBAAoB,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC9D,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAE;gBACL,0BAA0B,EAAE,IAAI;gBAChC,sCAAsC,EAAE,IAAI,CAAC,SAAS,KAAK,YAAY;aACxE;YAED,4DACE,KAAK,EAAE;oBACL,wCAAwC,EAAE,IAAI;oBAC9C,+CAA+C,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;iBACvE;gBAED,6DAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B;YACN,4DAAK,KAAK,EAAC,iCAAiC;gBAC1C,4DAAK,KAAK,EAAC,iCAAiC;oBAC1C,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB;gBACN,4DAAK,KAAK,EAAC,mCAAmC;oBAC5C,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Prop } from '@stencil/core';\nimport { isTagName } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-illustrated-message',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-illustrated-message.css',\n shadow: true,\n})\nexport class MgIllustratedMessage {\n /*************\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgIllustratedMessageElement;\n\n /\n Define illustration size\n /\n @Prop() size: 'regular' \| 'small' = 'regular';\n\n /\n Define component orientation\n /\n @Prop() direction: 'vertical' \| 'horizontal' = 'vertical';\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentDidLoad(): void {\n const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n const slottedIllustrations = this.element.querySelectorAll('[slot=\"illustration\"]');\n\n if (!isTagName(this.element.querySelector('[slot=\"title\"]'), headingTags)) {\n throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}`);\n } else if (slottedIllustrations.length !== 1) {\n throw new Error('<mg-illustrated-message> Slotted illustration must be present and unique.');\n }\n\n slottedIllustrations[0].setAttribute('aria-hidden', 'true');\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div\n class={{\n 'mg-c-illustrated-message': true,\n 'mg-c-illustrated-message--horizontal': this.direction === 'horizontal',\n }}\n >\n <div\n class={{\n 'mg-c-illustrated-message__illustration': true,\n 'mg-c-illustrated-message__illustration--small': this.size === 'small',\n }}\n >\n <slot name=\"illustration\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__slots\">\n <div class=\"mg-c-illustrated-message__title\">\n <slot name=\"title\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__details\">\n <slot name=\"details\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-item-more/mg-item-more.js CHANGED Viewed

@@ -105,7 +105,7 @@ export class MgItemMore {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { role: "listitem" }, this.parentMenu && (h("mg-menu-item", { "data-overflow-more": true, "data-size": this.parentMenu.size, ref: el => {
+        return (h(Host, { key: '2dfe9d844f42403de5120e0db85f3617d9d580a8', role: "listitem" }, this.parentMenu && (h("mg-menu-item", { "data-overflow-more": true, "data-size": this.parentMenu.size, ref: el => {
                 if (el)
                     this.moreElementMenuItem = el;
             } }, h("mg-icon", { icon: this.icon.icon, slot: "image" }), h("span", { class: { 'mg-u-visually-hidden': !this.slotlabel.display }, slot: "label" }, this.slotlabel.label), h("mg-menu", { direction: Direction.VERTICAL, label: this.messages.moreLabel, size: this.size })))));

package/dist/collection/components/molecules/mg-item-more/mg-item-more.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-item-more.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-item-more/mg-item-more.tsx"],"names":[],"mappings":"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~~IAAC~~,IAAI,EAAC,UAAU,IAClB,IAAI,CAAC,UAAU,IAAI,CAClB,6DAEa,IAAI,CAAC,UAAU,CAAC,IAAI,EAC/B,GAAG,EAAE,EAAE,CAAC,EAAE;gBACR,IAAI,EAAE;oBAAE,IAAI,CAAC,mBAAmB,GAAG,EAAE,CAAC;YACxC,CAAC;YAED,eAAS,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,GAAW;YACtD,YAAM,KAAK,EAAE,EAAE,sBAAsB,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,EAAE,IAAI,EAAC,OAAO,IAC3E,IAAI,CAAC,SAAS,CAAC,KAAK,CAChB;YACP,eAAS,SAAS,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,CACtF,CAChB,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { OverflowBehavior } from '../../../utils/behaviors.utils';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport type { IconType, MessageType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-item-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-item-more.css',\n shadow: true,\n})\nexport class MgItemMore {\n /***********\n Internal \n *********/\n private readonly name = 'mg-item-more';\n private messages: MessageType;\n private parentMenuItems: HTMLMgMenuItemElement[];\n private moreElementMenuItem: HTMLMgMenuItemElement;\n private overflowBehavior: OverflowBehavior;\n private canRenderMgMenuItemOverflowElement = true;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgItemMoreElement;\n\n /\n Define icon\n /\n @Prop() icon: IconType = { icon: 'ellipsis-vertical' };\n @Watch('icon')\n validateIcon(newValue: MgItemMore['icon']): void {\n if (typeof newValue !== 'object' \|\| (typeof newValue === 'object' && typeof newValue.icon !== 'string'))\n throw new Error(`<${this.name}> prop \"icon\" must match MgItemMore['icon'] type.`);\n }\n\n /\n Define slot label element\n /\n @Prop() slotlabel: SlotLabelType = { display: false };\n @Watch('slotlabel')\n validateSlotLabel(newValue: MgItemMore['slotlabel']): void {\n if (typeof newValue !== 'object' \|\| (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))\n throw new Error(`<${this.name}> prop \"slotlabel\" must match MgItemMore['slotlabel'] type.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.moreLabel;\n }\n\n /\n Define component child menu size.\n /\n @Prop() size: SizeType;\n @Watch('size')\n validateSize(newValue: MgItemMore['size']): void {\n if (newValue && typeof newValue !== 'string') throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type.`);\n }\n\n /\n Define component parent menu.\n /\n @State() parentMenu: HTMLMgMenuElement;\n\n /*********\n Methods \n ********/\n\n /\n * render mg-item-more overflow element\n * @returns mg-item-more element\n /\n private renderMgMenuItemOverflowElement = (): HTMLMgItemMoreElement => {\n // create menu items proxy element from item clones\n this.parentMenuItems.forEach((child: HTMLMgMenuItemElement) => {\n this.moreElementMenuItem.querySelector('mg-menu').appendChild(child.cloneNode(true));\n });\n\n const allMenuItem = Array.from(this.parentMenu.querySelectorAll('mg-menu-item:not([data-overflow-more])'));\n\n Array.from(this.moreElementMenuItem.querySelectorAll('mg-menu-item:not([data-overflow-more])')).forEach((proxy, index) => {\n // manage click on proxy to mirror it on initial element\n proxy.addEventListener('click', () => {\n // be carefull to use element.click() method instead of dispatchEvent to ensure bubbles outside shadowDom\n const navElement = allMenuItem[index].shadowRoot.querySelector('a, button');\n if (navElement instanceof HTMLButtonElement \|\| navElement instanceof HTMLAnchorElement) navElement.click();\n });\n\n // add id suffix to prevent duplicate key. default html id is: '';\n if (isValidString(proxy.id)) proxy.id = `${proxy.id}-proxy`;\n\n // manage status change miror in proxy\n allMenuItem[index].addEventListener('status-change', (event: CustomEvent) => {\n proxy.setAttribute('status', event.detail);\n });\n });\n\n return this.element;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Set variables and validate props\n /\n componentWillLoad(): void {\n // init variables\n this.messages = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu;\n\n // validate props\n this.validateIcon(this.icon);\n this.validateSlotLabel(this.slotlabel);\n this.validateSize(this.size);\n }\n\n /\n Ensure parent DOM is fully rendered with timeout method before parse elements\n /\n componentDidLoad(): ReturnType<typeof setTimeout> {\n // ensure parent menu is fully rendered\n return setTimeout(() => {\n this.parentMenu = this.element.closest('mg-menu');\n });\n }\n\n /\n Set OverflowBehavior when parentMenu state is upate AND defined\n /\n componentDidUpdate(): void {\n if (this.parentMenu && this.canRenderMgMenuItemOverflowElement) {\n this.parentMenuItems = Array.from(this.parentMenu.children).filter(item => item.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.renderMgMenuItemOverflowElement);\n this.canRenderMgMenuItemOverflowElement = false;\n }\n }\n\n /\n Disconnect overflow ResizeObserver\n /\n disconnectedCallback(): void {\n this.overflowBehavior?.disconnect();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"listitem\">\n {this.parentMenu && (\n <mg-menu-item\n data-overflow-more\n data-size={this.parentMenu.size}\n ref={el => {\n if (el) this.moreElementMenuItem = el;\n }}\n >\n <mg-icon icon={this.icon.icon} slot=\"image\"></mg-icon>\n <span class={{ 'mg-u-visually-hidden': !this.slotlabel.display }} slot=\"label\">\n {this.slotlabel.label}\n </span>\n <mg-menu direction={Direction.VERTICAL} label={this.messages.moreLabel} size={this.size}></mg-menu>\n </mg-menu-item>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-item-more.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-item-more/mg-item-more.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { OverflowBehavior } from '../../../utils/behaviors.utils';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport type { IconType, MessageType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-item-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-item-more.css',\n shadow: true,\n})\nexport class MgItemMore {\n /***********\n Internal \n *********/\n private readonly name = 'mg-item-more';\n private messages: MessageType;\n private parentMenuItems: HTMLMgMenuItemElement[];\n private moreElementMenuItem: HTMLMgMenuItemElement;\n private overflowBehavior: OverflowBehavior;\n private canRenderMgMenuItemOverflowElement = true;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgItemMoreElement;\n\n /\n Define icon\n /\n @Prop() icon: IconType = { icon: 'ellipsis-vertical' };\n @Watch('icon')\n validateIcon(newValue: MgItemMore['icon']): void {\n if (typeof newValue !== 'object' \|\| (typeof newValue === 'object' && typeof newValue.icon !== 'string'))\n throw new Error(`<${this.name}> prop \"icon\" must match MgItemMore['icon'] type.`);\n }\n\n /\n Define slot label element\n /\n @Prop() slotlabel: SlotLabelType = { display: false };\n @Watch('slotlabel')\n validateSlotLabel(newValue: MgItemMore['slotlabel']): void {\n if (typeof newValue !== 'object' \|\| (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))\n throw new Error(`<${this.name}> prop \"slotlabel\" must match MgItemMore['slotlabel'] type.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.moreLabel;\n }\n\n /\n Define component child menu size.\n /\n @Prop() size: SizeType;\n @Watch('size')\n validateSize(newValue: MgItemMore['size']): void {\n if (newValue && typeof newValue !== 'string') throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type.`);\n }\n\n /\n Define component parent menu.\n /\n @State() parentMenu: HTMLMgMenuElement;\n\n /*********\n Methods \n ********/\n\n /\n * render mg-item-more overflow element\n * @returns mg-item-more element\n /\n private renderMgMenuItemOverflowElement = (): HTMLMgItemMoreElement => {\n // create menu items proxy element from item clones\n this.parentMenuItems.forEach((child: HTMLMgMenuItemElement) => {\n this.moreElementMenuItem.querySelector('mg-menu').appendChild(child.cloneNode(true));\n });\n\n const allMenuItem = Array.from(this.parentMenu.querySelectorAll('mg-menu-item:not([data-overflow-more])'));\n\n Array.from(this.moreElementMenuItem.querySelectorAll('mg-menu-item:not([data-overflow-more])')).forEach((proxy, index) => {\n // manage click on proxy to mirror it on initial element\n proxy.addEventListener('click', () => {\n // be carefull to use element.click() method instead of dispatchEvent to ensure bubbles outside shadowDom\n const navElement = allMenuItem[index].shadowRoot.querySelector('a, button');\n if (navElement instanceof HTMLButtonElement \|\| navElement instanceof HTMLAnchorElement) navElement.click();\n });\n\n // add id suffix to prevent duplicate key. default html id is: '';\n if (isValidString(proxy.id)) proxy.id = `${proxy.id}-proxy`;\n\n // manage status change miror in proxy\n allMenuItem[index].addEventListener('status-change', (event: CustomEvent) => {\n proxy.setAttribute('status', event.detail);\n });\n });\n\n return this.element;\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Set variables and validate props\n /\n componentWillLoad(): void {\n // init variables\n this.messages = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu;\n\n // validate props\n this.validateIcon(this.icon);\n this.validateSlotLabel(this.slotlabel);\n this.validateSize(this.size);\n }\n\n /\n Ensure parent DOM is fully rendered with timeout method before parse elements\n /\n componentDidLoad(): ReturnType<typeof setTimeout> {\n // ensure parent menu is fully rendered\n return setTimeout(() => {\n this.parentMenu = this.element.closest('mg-menu');\n });\n }\n\n /\n Set OverflowBehavior when parentMenu state is upate AND defined\n /\n componentDidUpdate(): void {\n if (this.parentMenu && this.canRenderMgMenuItemOverflowElement) {\n this.parentMenuItems = Array.from(this.parentMenu.children).filter(item => item.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.renderMgMenuItemOverflowElement);\n this.canRenderMgMenuItemOverflowElement = false;\n }\n }\n\n /\n Disconnect overflow ResizeObserver\n /\n disconnectedCallback(): void {\n this.overflowBehavior?.disconnect();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"listitem\">\n {this.parentMenu && (\n <mg-menu-item\n data-overflow-more\n data-size={this.parentMenu.size}\n ref={el => {\n if (el) this.moreElementMenuItem = el;\n }}\n >\n <mg-icon icon={this.icon.icon} slot=\"image\"></mg-icon>\n <span class={{ 'mg-u-visually-hidden': !this.slotlabel.display }} slot=\"label\">\n {this.slotlabel.label}\n </span>\n <mg-menu direction={Direction.VERTICAL} label={this.messages.moreLabel} size={this.size}></mg-menu>\n </mg-menu-item>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-message/mg-message.js CHANGED Viewed

@@ -154,7 +154,7 @@ export class MgMessage {
         let role;
         if (!this.noAriaRole)
             role = this.variant === 'info' ? 'status' : 'alert';
-        return (h("div", { id: this.identifier, class: this.classCollection.join(), role: role }, h("mg-card", { variant: this.variant, "variant-style": "bar-left" }, h("span", { class: "mg-c-message__icon" }, h("mg-icon", { icon: this.getIcon() })), h("div", { class: "mg-c-message__content" }, h("span", { class: "mg-c-message__content-slot" }, h("slot", null)), this.hasActions && h("span", { class: "mg-c-message__content-separator" }), this.hasActions && (h("span", { class: "mg-c-message__content-actions-slot" }, h("slot", { name: "actions" })))), this.closeButton && (h("span", { class: "mg-c-message__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.message.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))))));
+        return (h("div", { key: 'e322f37d30825ef3a35487c0073d88690468a3c5', id: this.identifier, class: this.classCollection.join(), role: role }, h("mg-card", { key: 'fde621ad12803042b0521f663e046fa9e8554123', variant: this.variant, "variant-style": "bar-left" }, h("span", { key: '7b58b099e831bd6c21c9d2e5227f348982164e56', class: "mg-c-message__icon" }, h("mg-icon", { key: '213105901e4bbd702464a458dab131824a70904b', icon: this.getIcon() })), h("div", { key: '0084693dfc77abb64296ce4d85e1e30b24122623', class: "mg-c-message__content" }, h("span", { key: '8b17d62709ebde902e2ca52764ed7d053cbd0c51', class: "mg-c-message__content-slot" }, h("slot", { key: '0f63025c6b86b318b60b6a32bc75af366d439536' })), this.hasActions && h("span", { class: "mg-c-message__content-separator" }), this.hasActions && (h("span", { class: "mg-c-message__content-actions-slot" }, h("slot", { name: "actions" })))), this.closeButton && (h("span", { class: "mg-c-message__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.message.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))))));
     }
     static get is() { return "mg-message"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/mg-message/mg-message.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-message.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-message/mg-message.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\nimport { createID, ClassList } from '@mgdis/stencil-helpers';\nimport { variants, VariantType } from './mg-message.conf';\nimport { initLocales } from '../../../locales';\nimport { type MgIcon } from '../../atoms/mg-icon/mg-icon';\n\n@Component({\n tag: 'mg-message',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-message.css',\n shadow: true,\n})\nexport class MgMessage {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classHide = 'mg-c-message--hide';\n\n // IDs\n private closeButtonId = '';\n\n // Stored timer setted when hide action is run from setTimeOut\n private storedTimer: ReturnType<typeof setTimeout> = null;\n\n // Manage hover\n private isFocused = false;\n private isHovered = false;\n\n // Locales\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgMessageElement;\n\n /\n Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n * If not set, it will be created.\n /\n @Prop() identifier: string = createID('mg-message');\n\n /\n Add a delay to hide/close message when it passed\n * Value is defined in seconds and must greater than 2 seconds (PDA9-314 RG-06)\n /\n @Prop() delay: number;\n @Watch('delay')\n validateDelay(newValue: MgMessage['delay']): void {\n if (newValue !== undefined && newValue < 2) {\n throw new Error(`<mg-message> prop \"delay\" must be greater than 2 seconds.`);\n }\n }\n\n /\n Message variant\n /\n @Prop() variant: VariantType = variants[0]; // info\n @Watch('variant')\n validateVariant(newValue: MgMessage['variant'], oldValue?: MgMessage['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-message> prop \"variant\" must be one of: ${variants.join(', ')}`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-message--${oldValue}`);\n }\n this.classCollection.add(`mg-c-message--${newValue}`);\n }\n }\n\n /\n Define if message has a cross button\n * RG 01: https://jira.mgdis.fr/browse/PDA9-140\n /\n @Prop({ mutable: true }) closeButton = false;\n @Watch('closeButton')\n validateCloseButton(newValue: MgMessage['closeButton']): void {\n if (newValue && this.hasActions) {\n this.closeButton = false;\n throw new Error('<mg-message> prop \"close-button\" can\\'t be used with the actions slot.');\n }\n }\n\n /\n Define if message is hidden\n /\n @Prop({ mutable: true }) hide = false;\n @Watch('hide')\n validateHide(newValue: MgMessage['hide']): void {\n if (newValue) {\n this.componentHide.emit();\n this.classCollection.add(this.classHide);\n // Remove event Listener\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.removeEventListener(event, this.timerEvents);\n });\n // Clear Timer\n this.clearTimer();\n } else {\n this.componentShow.emit();\n this.classCollection.delete(this.classHide);\n // If delay is set\n if (this.delay > 1) {\n // Start timer\n this.setTimer();\n // Stop timer when get focus or mouse enter\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.addEventListener(event, this.timerEvents);\n });\n }\n }\n }\n\n /\n Define if aria role is unset\n * For a11y reasons, `<mg-message />` was design for `alert` needs with attached semantic role: `status`, `alert`.\n * By toggle this props to `true`, you can unset the role to benefit from the template without any semantic role.\n * Be careful to set the mode according to the context needs.\n /\n @Prop() noAriaRole: boolean;\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-message']);\n\n /\n Define if component is using actions slot\n /\n @State() hasActions = false;\n\n /\n Emited event when message is diplayed\n /\n @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n /\n Emited event when message is hidden\n /\n @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n /\n Set timer\n /\n private setTimer = (): void => {\n this.storedTimer = setTimeout(() => (this.hide = true), this.delay 1000);\n };\n\n /*\n Clear timer\n /\n private clearTimer = (): void => {\n clearTimeout(this.storedTimer);\n };\n\n /\n Event to add on element\n * @param event - event\n /\n private timerEvents = (event: MouseEvent \| FocusEvent): void => {\n this.clearTimer();\n const isMouseEvent: boolean = event.type === 'mouseenter';\n // Needed to ensure we don't start the timer\n this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n // Restart timer when loose focus AND mouse leave\n this.element.addEventListener(\n isMouseEvent ? 'mouseleave' : 'focusout',\n eventOut => {\n this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n // Start timer if needed\n if (!this.isFocused && !this.isHovered) this.setTimer();\n },\n { once: true },\n );\n };\n\n /\n Handle close button\n /\n private handleClose = (): void => {\n this.hide = true;\n };\n\n /\n Get icon corresponding to variant\n * @returns icon\n /\n private getIcon = (): MgIcon['icon'] => {\n switch (this.variant) {\n case 'info':\n return 'info-circle';\n case 'warning':\n return 'exclamation-triangle';\n case 'success':\n return 'check-circle';\n case 'danger':\n return 'exclamation-circle';\n default:\n break;\n }\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.validateVariant(this.variant);\n // Check if close button is an can be activated\n this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n this.validateCloseButton(this.closeButton);\n if (this.closeButton) {\n this.classCollection.add('mg-c-message--close-button');\n this.closeButtonId = `${this.identifier}-close-button`;\n }\n this.validateDelay(this.delay);\n this.validateHide(this.hide);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n let role;\n\n if (!this.noAriaRole) role = this.variant === 'info' ? 'status' : 'alert';\n\n return (\n <div id={this.identifier} class={this.classCollection.join()} role={role}>\n <mg-card variant={this.variant} variant-style=\"bar-left\">\n <span class=\"mg-c-message__icon\">\n <mg-icon icon={this.getIcon()}></mg-icon>\n </span>\n <div class=\"mg-c-message__content\">\n <span class=\"mg-c-message__content-slot\">\n <slot></slot>\n </span>\n {this.hasActions && <span class=\"mg-c-message__content-separator\"></span>}\n {this.hasActions && (\n <span class=\"mg-c-message__content-actions-slot\">\n <slot name=\"actions\"></slot>\n </span>\n )}\n </div>\n {this.closeButton && (\n <span class=\"mg-c-message__close-button\">\n <mg-button identifier={this.closeButtonId} is-icon variant=\"flat\" label={this.messages.message.closeButton} onClick={this.handleClose}>\n <mg-icon icon=\"cross\"></mg-icon>\n </mg-button>\n </span>\n )}\n </mg-card>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-message.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-message/mg-message.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\nimport { createID, ClassList } from '@mgdis/stencil-helpers';\nimport { variants, VariantType } from './mg-message.conf';\nimport { initLocales } from '../../../locales';\nimport { type MgIcon } from '../../atoms/mg-icon/mg-icon';\n\n@Component({\n tag: 'mg-message',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-message.css',\n shadow: true,\n})\nexport class MgMessage {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classHide = 'mg-c-message--hide';\n\n // IDs\n private closeButtonId = '';\n\n // Stored timer setted when hide action is run from setTimeOut\n private storedTimer: ReturnType<typeof setTimeout> = null;\n\n // Manage hover\n private isFocused = false;\n private isHovered = false;\n\n // Locales\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgMessageElement;\n\n /\n Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n * If not set, it will be created.\n /\n @Prop() identifier: string = createID('mg-message');\n\n /\n Add a delay to hide/close message when it passed\n * Value is defined in seconds and must greater than 2 seconds (PDA9-314 RG-06)\n /\n @Prop() delay: number;\n @Watch('delay')\n validateDelay(newValue: MgMessage['delay']): void {\n if (newValue !== undefined && newValue < 2) {\n throw new Error(`<mg-message> prop \"delay\" must be greater than 2 seconds.`);\n }\n }\n\n /\n Message variant\n /\n @Prop() variant: VariantType = variants[0]; // info\n @Watch('variant')\n validateVariant(newValue: MgMessage['variant'], oldValue?: MgMessage['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-message> prop \"variant\" must be one of: ${variants.join(', ')}`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-message--${oldValue}`);\n }\n this.classCollection.add(`mg-c-message--${newValue}`);\n }\n }\n\n /\n Define if message has a cross button\n * RG 01: https://jira.mgdis.fr/browse/PDA9-140\n /\n @Prop({ mutable: true }) closeButton = false;\n @Watch('closeButton')\n validateCloseButton(newValue: MgMessage['closeButton']): void {\n if (newValue && this.hasActions) {\n this.closeButton = false;\n throw new Error('<mg-message> prop \"close-button\" can\\'t be used with the actions slot.');\n }\n }\n\n /\n Define if message is hidden\n /\n @Prop({ mutable: true }) hide = false;\n @Watch('hide')\n validateHide(newValue: MgMessage['hide']): void {\n if (newValue) {\n this.componentHide.emit();\n this.classCollection.add(this.classHide);\n // Remove event Listener\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.removeEventListener(event, this.timerEvents);\n });\n // Clear Timer\n this.clearTimer();\n } else {\n this.componentShow.emit();\n this.classCollection.delete(this.classHide);\n // If delay is set\n if (this.delay > 1) {\n // Start timer\n this.setTimer();\n // Stop timer when get focus or mouse enter\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.addEventListener(event, this.timerEvents);\n });\n }\n }\n }\n\n /\n Define if aria role is unset\n * For a11y reasons, `<mg-message />` was design for `alert` needs with attached semantic role: `status`, `alert`.\n * By toggle this props to `true`, you can unset the role to benefit from the template without any semantic role.\n * Be careful to set the mode according to the context needs.\n /\n @Prop() noAriaRole: boolean;\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-message']);\n\n /\n Define if component is using actions slot\n /\n @State() hasActions = false;\n\n /\n Emited event when message is diplayed\n /\n @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n /\n Emited event when message is hidden\n /\n @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n /\n Set timer\n /\n private setTimer = (): void => {\n this.storedTimer = setTimeout(() => (this.hide = true), this.delay 1000);\n };\n\n /*\n Clear timer\n /\n private clearTimer = (): void => {\n clearTimeout(this.storedTimer);\n };\n\n /\n Event to add on element\n * @param event - event\n /\n private timerEvents = (event: MouseEvent \| FocusEvent): void => {\n this.clearTimer();\n const isMouseEvent: boolean = event.type === 'mouseenter';\n // Needed to ensure we don't start the timer\n this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n // Restart timer when loose focus AND mouse leave\n this.element.addEventListener(\n isMouseEvent ? 'mouseleave' : 'focusout',\n eventOut => {\n this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n // Start timer if needed\n if (!this.isFocused && !this.isHovered) this.setTimer();\n },\n { once: true },\n );\n };\n\n /\n Handle close button\n /\n private handleClose = (): void => {\n this.hide = true;\n };\n\n /\n Get icon corresponding to variant\n * @returns icon\n /\n private getIcon = (): MgIcon['icon'] => {\n switch (this.variant) {\n case 'info':\n return 'info-circle';\n case 'warning':\n return 'exclamation-triangle';\n case 'success':\n return 'check-circle';\n case 'danger':\n return 'exclamation-circle';\n default:\n break;\n }\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.validateVariant(this.variant);\n // Check if close button is an can be activated\n this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n this.validateCloseButton(this.closeButton);\n if (this.closeButton) {\n this.classCollection.add('mg-c-message--close-button');\n this.closeButtonId = `${this.identifier}-close-button`;\n }\n this.validateDelay(this.delay);\n this.validateHide(this.hide);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n let role;\n\n if (!this.noAriaRole) role = this.variant === 'info' ? 'status' : 'alert';\n\n return (\n <div id={this.identifier} class={this.classCollection.join()} role={role}>\n <mg-card variant={this.variant} variant-style=\"bar-left\">\n <span class=\"mg-c-message__icon\">\n <mg-icon icon={this.getIcon()}></mg-icon>\n </span>\n <div class=\"mg-c-message__content\">\n <span class=\"mg-c-message__content-slot\">\n <slot></slot>\n </span>\n {this.hasActions && <span class=\"mg-c-message__content-separator\"></span>}\n {this.hasActions && (\n <span class=\"mg-c-message__content-actions-slot\">\n <slot name=\"actions\"></slot>\n </span>\n )}\n </div>\n {this.closeButton && (\n <span class=\"mg-c-message__close-button\">\n <mg-button identifier={this.closeButtonId} is-icon variant=\"flat\" label={this.messages.message.closeButton} onClick={this.handleClose}>\n <mg-icon icon=\"cross\"></mg-icon>\n </mg-button>\n </span>\n )}\n </mg-card>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/mg-modal/mg-modal.js CHANGED Viewed

@@ -152,14 +152,14 @@ export class MgModal {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { role: this.dialogRole, id: this.identifier, class: this.classCollection.join(), tabindex: "-1", "aria-labelledby": this.titleId, "aria-modal": "true", "aria-hidden": this.hide }, h("mg-card", null, h("div", { class: "mg-c-modal__dialog" }, h("header", { class: "mg-c-modal__header" }, this.closeButton && (h("span", { class: "mg-c-modal__close-button" }, h("mg-button", { identifier: `${this.identifier}-close-button`, "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose, ref: (el) => {
+        return (h("div", { key: '0175582c259397c75a0c859db678e59318be9f64', role: this.dialogRole, id: this.identifier, class: this.classCollection.join(), tabindex: "-1", "aria-labelledby": this.titleId, "aria-modal": "true", "aria-hidden": this.hide }, h("mg-card", { key: '6ba0b633bed3c94e0931ea9123b891f3439bf5db' }, h("div", { key: '111e1557f32cbe74868254a91684d4df302b4724', class: "mg-c-modal__dialog" }, h("header", { key: '0f5c843e91f2f5d9ccffe5235c799517edd71f08', class: "mg-c-modal__header" }, this.closeButton && (h("span", { class: "mg-c-modal__close-button" }, h("mg-button", { identifier: `${this.identifier}-close-button`, "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose, ref: (el) => {
                 if (el !== null) {
                     // store closeButton Element
                     this.closeButtonElement = el;
                     // add close button element to modalFocusableElements when it is render
                     this.modalFocusableElements.unshift(this.closeButtonElement);
                 }
-            } }, h("mg-icon", { icon: "cross" })))), h("h1", { class: "mg-c-modal__title", id: this.titleId }, this.modalTitle)), this.hasContent && (h("article", { class: "mg-c-modal__content" }, h("slot", { name: "content" }))), this.hasActions && (h("footer", { class: "mg-c-modal__footer" }, h("slot", { name: "actions" })))))));
+            } }, h("mg-icon", { icon: "cross" })))), h("h1", { key: 'a53e0fbf3aa30611f1713b7a54f7fb30a6a3efe2', class: "mg-c-modal__title", id: this.titleId }, this.modalTitle)), this.hasContent && (h("article", { class: "mg-c-modal__content" }, h("slot", { name: "content" }))), this.hasActions && (h("footer", { class: "mg-c-modal__footer" }, h("slot", { name: "actions" })))))));
     }
     static get is() { return "mg-modal"; }
     static get encapsulation() { return "shadow"; }