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

@mgdis/mg-components 5.21.1 → 5.23.0

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

Files changed (248) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-popover.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-popover/mg-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, Watch, EventEmitter, Event } from '@stencil/core';\nimport { createID, getWindows } from '../../../utils/components.utils';\nimport { Instance as PopperInstance, createPopper, Placement } from '@popperjs/core';\n\n@Component({\n tag: 'mg-popover',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-popover.css',\n shadow: true,\n})\nexport class MgPopover {\n /***********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgPopover: HTMLElement;\n private mgPopoverContent: HTMLMgPopoverContentElement;\n private windows: Window[];\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgPopoverElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-popover');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderPopoverContent to update popover-content id\n this.renderPopoverContent();\n }\n\n /\n Popover placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Hide popover arrow\n /\n @Prop() arrowHide = false;\n @Watch('arrowHide')\n validateArrowHide(newValue: MgPopover['arrowHide']): void {\n if (newValue) this.mgPopoverContent.dataset.arrowHide = '';\n else delete this.mgPopoverContent.dataset.arrowHide;\n }\n\n /\n Define if popover has a cross button\n /\n @Prop() closeButton = false;\n @Watch('closeButton')\n validateCloseButton(newValue: MgPopover['closeButton']): void {\n this.mgPopoverContent.closeButton = newValue;\n }\n\n /\n Display popover\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: boolean): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n this.displayChange.emit(newValue);\n }\n\n /\n Disable popover\n /\n @Prop() disabled = false;\n\n /\n Emited event when display value change\n /\n @Event({ eventName: 'display-change' }) displayChange: EventEmitter<HTMLMgPopoverElement['display']>;\n\n /\n Check if clicked outside of component\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (!this.disabled && event.target.closest('mg-popover') !== this.element && !event.target.closest(`[data-mg-popover-guard=\"${this.identifier}\"]`)) this.display = false;\n };\n\n /\n Show popover\n /\n private show = (): void => {\n // Make the popover visible\n this.mgPopover.dataset.show = '';\n // Enable the event listeners\n this.setPopperListeners(true);\n // hide when click outside\n // setTimeout is used to prevent event to trigger after creation\n setTimeout(() => {\n this.manageClickOutsideListeners('addEventListener');\n });\n };\n\n /\n Hide popover\n /\n private hide = (): void => {\n // Hide the popover\n this.mgPopover.removeAttribute('data-show');\n // Disable the event listeners\n this.setPopperListeners(false);\n // Remove event listener\n this.manageClickOutsideListeners('removeEventListener');\n };\n\n /\n Set popper listeners\n * @param newValue - if true enable popper listners\n /\n private setPopperListeners = (newValue: boolean): void => {\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: newValue }],\n }));\n };\n\n /\n Manage all clickOustside listeners\n * @param action top process on elements listeners\n /\n private manageClickOutsideListeners = (action: 'removeEventListener' \| 'addEventListener'): void => {\n // clickOutside listeners need to bind windows\n // AND as shawdowDom content is not include on windows listeners `event.target` we need to include popover guard content DOM if it's a web-component\n // by doing this we can get and parse all needeed document DOM elements in clickOutside callback event.details.\n // This result in the givern junction :\n // Windows > document > [data-mg-popover-guard] + [data-mg-popover-guard] > shadowRoot = Windows > document > [data-mg-popover-guard] > shadowRoot\n const guardChildren = Array.from(document.querySelector(`[data-mg-popover-guard=\"${this.identifier}\"]`)?.shadowRoot?.children \|\| new Set());\n [...guardChildren, ...this.windows].forEach((element: Window \| HTMLElement) => {\n element[action]('click', this.clickOutside, false);\n });\n };\n\n /\n Handle content hide event\n /\n private handleHideContent = (): void => {\n this.display = false;\n };\n\n /\n Render popover content element\n /\n private renderPopoverContent = (): void => {\n const mgPopoverContent = this.element.querySelector('mg-popover-content');\n if (mgPopoverContent === null) {\n this.mgPopoverContent = document.createElement('mg-popover-content');\n this.mgPopoverContent.setAttribute('slot', 'content');\n this.mgPopoverContent.setAttribute('id', this.identifier);\n this.mgPopoverContent.addEventListener('hide-content', this.handleHideContent);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n this.mgPopoverContent.appendChild(arrow);\n\n // insert elements in DOM\n ['[slot=\"title\"]', '[slot=\"content\"]:not(mg-popover-content)'].forEach(slotType => {\n Array.from(this.element.querySelectorAll(slotType)).forEach(slot => {\n this.mgPopoverContent.appendChild(slot);\n });\n });\n this.element.appendChild(this.mgPopoverContent);\n } else {\n mgPopoverContent.setAttribute('id', this.identifier);\n }\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n // render mg-popover-content slot\n this.renderPopoverContent();\n this.validateCloseButton(this.closeButton);\n this.validateIdentifier();\n this.validateArrowHide(this.arrowHide);\n }\n\n /\n Check if component props are well configured on init\n /\n componentDidLoad(): void {\n // Get popover content\n this.mgPopover = this.element.querySelector(`#${this.identifier}`);\n\n //Get interactive element (first element without slot attribute)\n const interactiveElement: HTMLElement = this.element.querySelector(':not([slot])');\n // Add aria attributes\n interactiveElement.setAttribute('aria-controls', this.identifier);\n interactiveElement.setAttribute('aria-expanded', `${this.display}`);\n\n // Create popperjs popover\n this.popper = createPopper(interactiveElement, this.mgPopover, {\n placement: this.placement,\n strategy: 'fixed',\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 0],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // add resize observer\n [interactiveElement, this.element.querySelector('mg-popover-content')].forEach(element => {\n new ResizeObserver(() => {\n this.popper.update();\n }).observe(element);\n });\n\n // Add events to toggle display\n interactiveElement.addEventListener('click', () => {\n if (!this.disabled) this.display = !this.display;\n });\n\n // Add events to hide popover\n this.element.addEventListener('keydown', e => {\n if (!this.disabled && e.code === 'Escape') {\n this.display = false;\n interactiveElement.focus();\n }\n });\n\n this.handleDisplay(this.display);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-popover.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-popover/mg-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, Watch, EventEmitter, Event } from '@stencil/core';\nimport { createID, getWindows } from '@mgdis/stencil-helpers';\nimport { Instance as PopperInstance, createPopper, Placement } from '@popperjs/core';\n\n@Component({\n tag: 'mg-popover',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-popover.css',\n shadow: true,\n})\nexport class MgPopover {\n /***********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgPopover: HTMLElement;\n private mgPopoverContent: HTMLMgPopoverContentElement;\n private windows: Window[];\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgPopoverElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-popover');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderPopoverContent to update popover-content id\n this.renderPopoverContent();\n }\n\n /\n Popover placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Hide popover arrow\n /\n @Prop() arrowHide = false;\n @Watch('arrowHide')\n validateArrowHide(newValue: MgPopover['arrowHide']): void {\n if (newValue) this.mgPopoverContent.dataset.arrowHide = '';\n else delete this.mgPopoverContent.dataset.arrowHide;\n }\n\n /\n Define if popover has a cross button\n /\n @Prop() closeButton = false;\n @Watch('closeButton')\n validateCloseButton(newValue: MgPopover['closeButton']): void {\n this.mgPopoverContent.closeButton = newValue;\n }\n\n /\n Display popover\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: boolean): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n this.displayChange.emit(newValue);\n }\n\n /\n Disable popover\n /\n @Prop() disabled = false;\n\n /\n Emited event when display value change\n /\n @Event({ eventName: 'display-change' }) displayChange: EventEmitter<HTMLMgPopoverElement['display']>;\n\n /\n Check if clicked outside of component\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (!this.disabled && event.target.closest('mg-popover') !== this.element && !event.target.closest(`[data-mg-popover-guard=\"${this.identifier}\"]`)) this.display = false;\n };\n\n /\n Show popover\n /\n private show = (): void => {\n // Make the popover visible\n this.mgPopover.dataset.show = '';\n // Enable the event listeners\n this.setPopperListeners(true);\n // hide when click outside\n // setTimeout is used to prevent event to trigger after creation\n setTimeout(() => {\n this.manageClickOutsideListeners('addEventListener');\n });\n };\n\n /\n Hide popover\n /\n private hide = (): void => {\n // Hide the popover\n this.mgPopover.removeAttribute('data-show');\n // Disable the event listeners\n this.setPopperListeners(false);\n // Remove event listener\n this.manageClickOutsideListeners('removeEventListener');\n };\n\n /\n Set popper listeners\n * @param newValue - if true enable popper listners\n /\n private setPopperListeners = (newValue: boolean): void => {\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: newValue }],\n }));\n };\n\n /\n Manage all clickOustside listeners\n * @param action top process on elements listeners\n /\n private manageClickOutsideListeners = (action: 'removeEventListener' \| 'addEventListener'): void => {\n // clickOutside listeners need to bind windows\n // AND as shawdowDom content is not include on windows listeners `event.target` we need to include popover guard content DOM if it's a web-component\n // by doing this we can get and parse all needeed document DOM elements in clickOutside callback event.details.\n // This result in the givern junction :\n // Windows > document > [data-mg-popover-guard] + [data-mg-popover-guard] > shadowRoot = Windows > document > [data-mg-popover-guard] > shadowRoot\n const guardChildren = Array.from(document.querySelector(`[data-mg-popover-guard=\"${this.identifier}\"]`)?.shadowRoot?.children \|\| new Set());\n [...guardChildren, ...this.windows].forEach((element: Window \| HTMLElement) => {\n element[action]('click', this.clickOutside, false);\n });\n };\n\n /\n Handle content hide event\n /\n private handleHideContent = (): void => {\n this.display = false;\n };\n\n /\n Render popover content element\n /\n private renderPopoverContent = (): void => {\n const mgPopoverContent = this.element.querySelector('mg-popover-content');\n if (mgPopoverContent === null) {\n this.mgPopoverContent = document.createElement('mg-popover-content');\n this.mgPopoverContent.setAttribute('slot', 'content');\n this.mgPopoverContent.setAttribute('id', this.identifier);\n this.mgPopoverContent.addEventListener('hide-content', this.handleHideContent);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n this.mgPopoverContent.appendChild(arrow);\n\n // insert elements in DOM\n ['[slot=\"title\"]', '[slot=\"content\"]:not(mg-popover-content)'].forEach(slotType => {\n Array.from(this.element.querySelectorAll(slotType)).forEach(slot => {\n this.mgPopoverContent.appendChild(slot);\n });\n });\n this.element.appendChild(this.mgPopoverContent);\n } else {\n mgPopoverContent.setAttribute('id', this.identifier);\n }\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n // render mg-popover-content slot\n this.renderPopoverContent();\n this.validateCloseButton(this.closeButton);\n this.validateIdentifier();\n this.validateArrowHide(this.arrowHide);\n }\n\n /\n Check if component props are well configured on init\n /\n componentDidLoad(): void {\n // Get popover content\n this.mgPopover = this.element.querySelector(`#${this.identifier}`);\n\n //Get interactive element (first element without slot attribute)\n const interactiveElement: HTMLElement = this.element.querySelector(':not([slot])');\n // Add aria attributes\n interactiveElement.setAttribute('aria-controls', this.identifier);\n interactiveElement.setAttribute('aria-expanded', `${this.display}`);\n\n // Create popperjs popover\n this.popper = createPopper(interactiveElement, this.mgPopover, {\n placement: this.placement,\n strategy: 'fixed',\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 0],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // add resize observer\n [interactiveElement, this.element.querySelector('mg-popover-content')].forEach(element => {\n new ResizeObserver(() => {\n this.popper.update();\n }).observe(element);\n });\n\n // Add events to toggle display\n interactiveElement.addEventListener('click', () => {\n if (!this.disabled) this.display = !this.display;\n });\n\n // Add events to hide popover\n this.element.addEventListener('keydown', e => {\n if (!this.disabled && e.code === 'Escape') {\n this.display = false;\n interactiveElement.focus();\n }\n });\n\n this.handleDisplay(this.display);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}

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

@@ -1,7 +1,7 @@
 /* eslint-disable jsx-a11y/no-redundant-roles */
 import { h } from "@stencil/core";
 import { initLocales } from "../../../locales";
-import { isValidString } from "../../../utils/components.utils";
+import { isValidString } from "@mgdis/stencil-helpers";
 export class MgSkipLinks {
     constructor() {
         /***********

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

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-skip-links.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-skip-links/mg-skip-links.tsx"],"names":[],"mappings":"AAAA,gDAAgD;AAChD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAExF,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,~~iCAAiC~~,CAAC;~~AAOhE~~,MAAM,OAAO,WAAW;;QAgCtB;;oBAEY;QAEZ;;;WAGG;QACK,oBAAe,GAAG,CAAC,KAAkD,EAAQ,EAAE;YACrF,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;YAC3B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC;;;IAtBF,aAAa,CAAC,KAAiB;QAC7B,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;~~YAC1J~~,MAAM,IAAI,KAAK,CAAC,yIAAyI,CAAC,CAAC;~~SAC5J~~;IACH,CAAC;IAoBD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC;IACrD,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,WAAK,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,YAAY,gBAAa,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,QAAQ;YACzF,UAAI,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,MAAM,IAC1C,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACtB,UAAI,GAAG,EAAE,IAAI,CAAC,IAAI;gBAChB,SAAG,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe,IAC5E,IAAI,CAAC,KAAK,CACT,CACD,CACN,CAAC,CACC,CACD,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles /\nimport { Component, Element, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { SkipLink } from './mg-skip-links.conf';\nimport { initLocales } from '../../../locales';\nimport { isValidString } from '~~../../../utils~~/~~components.utils~~';\n\n@Component({\n tag: 'mg-skip-links',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-skip-links.css',\n shadow: true,\n})\nexport class MgSkipLinks {\n /**********\n Internal \n *********/\n\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgSkipLinksElement;\n\n /\n Skip links\n /\n @Prop() links: SkipLink[];\n @Watch('links')\n validateLinks(links: SkipLink[]): void {\n if (links === undefined \|\| links.length === 0 \|\| links.some(link => !isValidString(link.href) \|\| !link.href.startsWith('#') \|\| !isValidString(link.label))) {\n throw new Error(`<mg-skip-links> prop \"links\": Cannot be empty and each link must contains an href starting with a \"#\" and a non empty label attributes.`);\n }\n }\n\n /\n Emited event when link is clicked\n /\n @Event({ eventName: 'go-to-anchor' }) goToAnchor: EventEmitter<string>;\n\n /*********\n Methods \n *******/\n\n /\n * Handle link click and emit go-to-anchor event\n * @param event - mouse event\n /\n private handleLinkCLick = (event: MouseEvent & { currentTarget: HTMLElement }): void => {\n event.currentTarget.blur();\n this.goToAnchor.emit(event.currentTarget.getAttribute('href'));\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateLinks(this.links);\n this.messages = initLocales(this.element).messages;\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <nav class=\"mg-c-skip-links\" role=\"navigation\" aria-label={this.messages.skipLinks.navLabel}>\n <ul class=\"mg-c-skip-links__list\" role=\"list\">\n {this.links.map(link => (\n <li key={link.href}>\n <a class=\"mg-c-skip-links__link\" href={link.href} onClick={this.handleLinkCLick}>\n {link.label}\n </a>\n </li>\n ))}\n </ul>\n </nav>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-skip-links.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-skip-links/mg-skip-links.tsx"],"names":[],"mappings":"AAAA,gDAAgD;AAChD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAExF,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAOvD,MAAM,OAAO,WAAW;;QAgCtB;;oBAEY;QAEZ;;;WAGG;QACK,oBAAe,GAAG,CAAC,KAAkD,EAAQ,EAAE;YACrF,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;YAC3B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC;;;IAtBF,aAAa,CAAC,KAAiB;QAC7B,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;YAC3J,MAAM,IAAI,KAAK,CAAC,yIAAyI,CAAC,CAAC;QAC7J,CAAC;IACH,CAAC;IAoBD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC;IACrD,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,WAAK,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,YAAY,gBAAa,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,QAAQ;YACzF,UAAI,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,MAAM,IAC1C,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACtB,UAAI,GAAG,EAAE,IAAI,CAAC,IAAI;gBAChB,SAAG,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe,IAC5E,IAAI,CAAC,KAAK,CACT,CACD,CACN,CAAC,CACC,CACD,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles /\nimport { Component, Element, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { SkipLink } from './mg-skip-links.conf';\nimport { initLocales } from '../../../locales';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-skip-links',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-skip-links.css',\n shadow: true,\n})\nexport class MgSkipLinks {\n /**********\n Internal \n *********/\n\n private messages;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgSkipLinksElement;\n\n /\n Skip links\n /\n @Prop() links: SkipLink[];\n @Watch('links')\n validateLinks(links: SkipLink[]): void {\n if (links === undefined \|\| links.length === 0 \|\| links.some(link => !isValidString(link.href) \|\| !link.href.startsWith('#') \|\| !isValidString(link.label))) {\n throw new Error(`<mg-skip-links> prop \"links\": Cannot be empty and each link must contains an href starting with a \"#\" and a non empty label attributes.`);\n }\n }\n\n /\n Emited event when link is clicked\n /\n @Event({ eventName: 'go-to-anchor' }) goToAnchor: EventEmitter<string>;\n\n /*********\n Methods \n *******/\n\n /\n * Handle link click and emit go-to-anchor event\n * @param event - mouse event\n /\n private handleLinkCLick = (event: MouseEvent & { currentTarget: HTMLElement }): void => {\n event.currentTarget.blur();\n this.goToAnchor.emit(event.currentTarget.getAttribute('href'));\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateLinks(this.links);\n this.messages = initLocales(this.element).messages;\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <nav class=\"mg-c-skip-links\" role=\"navigation\" aria-label={this.messages.skipLinks.navLabel}>\n <ul class=\"mg-c-skip-links__list\" role=\"list\">\n {this.links.map(link => (\n <li key={link.href}>\n <a class=\"mg-c-skip-links__link\" href={link.href} onClick={this.handleLinkCLick}>\n {link.label}\n </a>\n </li>\n ))}\n </ul>\n </nav>\n );\n }\n}\n"]}

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

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { createID, ClassList, allItemsAreString, isValidString, nextTick } from "../../../utils/components.utils";
+import { createID, ClassList, allItemsAreString, isValidString, nextTick } from "@mgdis/stencil-helpers";
 import { sizes, Status } from "./mg-tabs.conf";
 /**
  * type TabItem validation function

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

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tabs.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-tabs/mg-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, State, Element, Watch } from '@stencil/core';\nimport { createID, ClassList, allItemsAreString, isValidString, nextTick } from '../../../utils/components.utils';\nimport { TabItem, sizes, Status, SizeType } from './mg-tabs.conf';\n\n/*\n type TabItem validation function\n * @param tab - tab item\n * @returns tab item type is valid\n /\nconst isTabItem = (tab: unknown): tab is TabItem => typeof tab === 'object' && typeof (tab as TabItem).label === 'string';\n\n@Component({\n tag: 'mg-tabs',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tabs.css',\n shadow: true,\n})\nexport class MgTabs {\n /**********\n Internal \n *********/\n\n // classes\n private readonly tabPanel = 'panel';\n private readonly buttonTabBaseClass = 'mg-c-tabs__navigation-button';\n\n // variables\n private tabFocus: number;\n private startIndex = 1;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTabsElement;\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-tabs');\n\n /\n Tabs label. Include short tabs description.\n * Required for accessibility\n /\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgTabs['label']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-tabs> prop \"label\" is required.');\n }\n }\n\n /\n Define tabs size\n /\n @Prop() size: SizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgTabs['size']): void {\n if (!sizes.includes(newValue)) {\n throw new Error(`<mg-tabs> prop \"size\" must be one of: ${sizes.join(', ')}`);\n }\n this.classCollection.add(`mg-c-tabs--size-${this.size}`);\n }\n\n /\n Tabs items\n /\n @Prop() items!: string[] \| TabItem[];\n @Watch('items')\n validateItems(newValue: MgTabs['items']): void {\n // String array\n if (allItemsAreString(newValue)) this.tabs = newValue.map(item => ({ label: item, status: Status.VISIBLE }));\n // Object array\n else if (Array.isArray(newValue) && newValue.length > 0 && newValue.every(isTabItem)) this.tabs = newValue;\n else throw new Error('<mg-tabs> prop \"items\" is required and all items must be the same type: TabItem.');\n }\n\n /\n Active tab number\n /\n @Prop({ reflect: true, mutable: true }) activeTab: number;\n @Watch('activeTab')\n validateActiveTab(newValue: MgTabs['activeTab']): void {\n // when `active-tab` is undefined we set default value by searching an item with `Status.ACTIVE` or we use the `startIndex` has fallback value\n // after setting new value to `active-tab` the validate will be triggered again with the updated value and process the tab update\n if (newValue === undefined) {\n this.activeTab = this.tabs.some(tab => this.tabHasStatus(tab, Status.ACTIVE))\n ? this.getTabItemIndex(this.tabs.findIndex(tab => this.tabHasStatus(tab, Status.ACTIVE)))\n : this.startIndex;\n } else if (typeof newValue === 'number' && newValue >= this.startIndex && newValue <= this.tabs.length && this.isActivableTab(this.tabs[newValue - this.startIndex])) {\n // if new 'active-tab' is activable we update tab status to ACTIVE and toggle past ACTIVE to VISIBLE\n this.tabs.forEach((tab, index) => {\n const isNewActiveTab = index === newValue - this.startIndex;\n // reset active tabs\n if (this.tabHasStatus(tab, Status.ACTIVE) && !isNewActiveTab) tab.status = Status.VISIBLE;\n // set active tab from given tab key\n else if (this.isActivableTab(tab) && isNewActiveTab) tab.status = Status.ACTIVE;\n });\n // emit change active tab key event\n this.activeTabChange.emit(newValue);\n } else {\n throw new Error(`<mg-tabs> prop \"activeTab\" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be \"activable\".`);\n }\n }\n\n /\n Component tabs\n /\n @State() tabs: TabItem[] = [];\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-tabs']);\n\n /\n Emited event when active tab change\n /\n @Event({ eventName: 'active-tab-change' }) activeTabChange: EventEmitter<HTMLMgTabsElement['activeTab']>;\n\n /\n Validate that new tab status can be `Status.ACTIVE`\n * @param tab - tab item\n * @returns true when tab match condition to get a `Status.ACTIVE`\n /\n private isActivableTab = (tab: TabItem): boolean => [undefined, Status.ACTIVE, Status.VISIBLE].includes(tab.status);\n\n /\n Method to know if given tab has the given status\n * @param tab - item tab key to set to ACTIVE status\n * @param status - status to valide\n * @returns status comparaison\n /\n private tabHasStatus = (tab: TabItem, status: Status): boolean => tab.status === status;\n\n /\n Method to get element id from index\n * @param element - to get id\n * @param index - to generate id\n * @returns generated element id\n /\n private getElementId = (element: string, index: number): string => `${element}-${this.getTabItemIndex(index)}`;\n\n /\n Method to get tab item index\n * @param index - to get\n * @returns index\n /\n private getTabItemIndex = (index: number): number => index + this.startIndex;\n\n /\n Handle click events on tabs\n * @param event - mouse event\n /\n private handleClick = (event: MouseEvent & { currentTarget: HTMLElement }): void => {\n const tabId = event.currentTarget.dataset.index;\n if (!this.isActivableTab(this.tabs[Number(tabId) - this.startIndex])) {\n event.preventDefault();\n } else {\n this.activeTab = Number(tabId);\n this.tabFocus = undefined;\n }\n };\n\n /\n get navigation button class from given status\n * @param status - button tab status\n * @returns button class/selector variant\n /\n private getNavigationButtonClass = (status: Status): string => `${this.buttonTabBaseClass}--${status}`;\n\n /\n Handle keyboard event on tabs\n * @param event - mouse event\n /\n private handleKeydown = (event: KeyboardEvent & { target: HTMLElement }): void => {\n const parent = event.target.parentElement;\n if (['ArrowRight', 'ArrowLeft'].includes(event.key)) {\n this.tabFocus = Number(event.target.dataset.index);\n parent.querySelector(`[data-index=\"${this.tabFocus}\"]`).setAttribute('tabindex', '-1');\n\n // Move right\n if (event.key === 'ArrowRight') {\n this.tabFocus++;\n // If we're at the end, go to the start\n if (this.tabFocus > this.tabs.length) this.tabFocus = this.startIndex;\n // Move left\n } else if (event.key === 'ArrowLeft') {\n this.tabFocus--;\n // If we're at the start, move to the end\n if (this.tabFocus < this.startIndex) this.tabFocus = this.tabs.length;\n }\n\n const parentButtonElement: HTMLButtonElement = parent.querySelector(`[data-index=\"${this.tabFocus}\"]`);\n // if focus item is ['hidden'] we recursively repeat action\n if (this.tabHasStatus(this.tabs[this.tabFocus - 1], Status.HIDDEN)) {\n parentButtonElement.dispatchEvent(new KeyboardEvent('keydown', { key: event.key, bubbles: true }));\n // else run focus methods on tabFocus element\n } else {\n parentButtonElement.setAttribute('tabindex', '0');\n parentButtonElement.focus();\n }\n } else if (event.key === 'Tab') {\n this.resetFocus();\n }\n };\n\n /\n Method to reset focus behavior\n /\n private resetFocus = (): void => {\n // update asynchronously tabindex to prevent get focus on new tabindex at then end of event process\n nextTick(() => {\n this.tabFocus = undefined;\n Array.from(this.element.shadowRoot.querySelectorAll('[data-index]')).forEach((tab, index) => {\n tab.setAttribute('tabindex', this.activeTab - this.startIndex !== index ? '-1' : '0');\n });\n });\n };\n\n /\n Validate slots setting\n /\n private validateSlots = (): void => {\n const slots = Array.from(this.element.children).filter(slot => slot.getAttribute('slot')?.includes('tab_content-'));\n if (slots.length !== this.tabs.length) throw new Error('<mg-tabs> Must have slots counts equal to tabs count.');\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Check tabs format\n this.validateLabel(this.label);\n this.validateItems(this.items);\n this.validateActiveTab(this.activeTab);\n this.validateSize(this.size);\n this.validateSlots();\n }\n\n /\n add listners\n /\n componentDidLoad(): void {\n document.addEventListener(\n 'click',\n (event: MouseEvent & { target: HTMLElement }) => {\n if (event.target.closest('mg-tabs') !== this.element) this.resetFocus();\n },\n false,\n );\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class={this.classCollection.join()}>\n <header role=\"tablist\" aria-label={this.label} class=\"mg-c-tabs__header\">\n {this.tabs.map((tab, index) => (\n <button\n key={tab.label}\n role=\"tab\"\n id={this.getElementId(this.identifier, index)}\n class={{\n [`${this.buttonTabBaseClass}`]: true,\n [`${this.buttonTabBaseClass}--horizontal`]: true,\n [`${this.getNavigationButtonClass(Status.ACTIVE)}`]: this.tabHasStatus(tab, Status.ACTIVE),\n [`${this.getNavigationButtonClass(Status.DISABLED)}`]: this.tabHasStatus(tab, Status.DISABLED),\n [`${this.getNavigationButtonClass(Status.HIDDEN)}`]: this.tabHasStatus(tab, Status.HIDDEN),\n }}\n tabindex={this.tabHasStatus(tab, Status.ACTIVE) ? 0 : -1}\n aria-selected={this.tabHasStatus(tab, Status.ACTIVE).toString()}\n aria-controls={this.getElementId(this.tabPanel, index)}\n aria-disabled={this.tabHasStatus(tab, Status.DISABLED)}\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown}\n data-index={this.getTabItemIndex(index)}\n >\n {tab.icon !== undefined && <mg-icon icon={tab.icon}></mg-icon>}\n {tab.label}\n {tab.badge !== undefined && <mg-badge variant=\"text-color\" value={tab.badge.value} label={tab.badge.label} outline={tab.badge.role === 'information'}></mg-badge>}\n </button>\n ))}\n </header>\n {this.tabs.map((tab, index) => (\n <article\n key={tab.label}\n role=\"tabpanel\"\n id={this.getElementId(this.tabPanel, index)}\n hidden={!this.tabHasStatus(tab, Status.ACTIVE)}\n aria-labelledby={this.getElementId(this.identifier, index)}\n tabindex={this.tabHasStatus(tab, Status.ACTIVE) ? 0 : -1}\n class=\"mg-c-tabs__content-container\"\n >\n <slot name={this.getElementId('tab_content', index)}></slot>\n </article>\n ))}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tabs.js","sourceRoot":"","sources":["../../../../src/components/molecules/mg-tabs/mg-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, State, Element, Watch } from '@stencil/core';\nimport { createID, ClassList, allItemsAreString, isValidString, nextTick } from '@mgdis/stencil-helpers';\nimport { TabItem, sizes, Status, SizeType } from './mg-tabs.conf';\n\n/*\n type TabItem validation function\n * @param tab - tab item\n * @returns tab item type is valid\n /\nconst isTabItem = (tab: unknown): tab is TabItem => typeof tab === 'object' && typeof (tab as TabItem).label === 'string';\n\n@Component({\n tag: 'mg-tabs',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tabs.css',\n shadow: true,\n})\nexport class MgTabs {\n /**********\n Internal \n *********/\n\n // classes\n private readonly tabPanel = 'panel';\n private readonly buttonTabBaseClass = 'mg-c-tabs__navigation-button';\n\n // variables\n private tabFocus: number;\n private startIndex = 1;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTabsElement;\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-tabs');\n\n /\n Tabs label. Include short tabs description.\n * Required for accessibility\n /\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgTabs['label']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-tabs> prop \"label\" is required.');\n }\n }\n\n /\n Define tabs size\n /\n @Prop() size: SizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgTabs['size']): void {\n if (!sizes.includes(newValue)) {\n throw new Error(`<mg-tabs> prop \"size\" must be one of: ${sizes.join(', ')}`);\n }\n this.classCollection.add(`mg-c-tabs--size-${this.size}`);\n }\n\n /\n Tabs items\n /\n @Prop() items!: string[] \| TabItem[];\n @Watch('items')\n validateItems(newValue: MgTabs['items']): void {\n // String array\n if (allItemsAreString(newValue)) this.tabs = newValue.map(item => ({ label: item, status: Status.VISIBLE }));\n // Object array\n else if (Array.isArray(newValue) && newValue.length > 0 && newValue.every(isTabItem)) this.tabs = newValue;\n else throw new Error('<mg-tabs> prop \"items\" is required and all items must be the same type: TabItem.');\n }\n\n /\n Active tab number\n /\n @Prop({ reflect: true, mutable: true }) activeTab: number;\n @Watch('activeTab')\n validateActiveTab(newValue: MgTabs['activeTab']): void {\n // when `active-tab` is undefined we set default value by searching an item with `Status.ACTIVE` or we use the `startIndex` has fallback value\n // after setting new value to `active-tab` the validate will be triggered again with the updated value and process the tab update\n if (newValue === undefined) {\n this.activeTab = this.tabs.some(tab => this.tabHasStatus(tab, Status.ACTIVE))\n ? this.getTabItemIndex(this.tabs.findIndex(tab => this.tabHasStatus(tab, Status.ACTIVE)))\n : this.startIndex;\n } else if (typeof newValue === 'number' && newValue >= this.startIndex && newValue <= this.tabs.length && this.isActivableTab(this.tabs[newValue - this.startIndex])) {\n // if new 'active-tab' is activable we update tab status to ACTIVE and toggle past ACTIVE to VISIBLE\n this.tabs.forEach((tab, index) => {\n const isNewActiveTab = index === newValue - this.startIndex;\n // reset active tabs\n if (this.tabHasStatus(tab, Status.ACTIVE) && !isNewActiveTab) tab.status = Status.VISIBLE;\n // set active tab from given tab key\n else if (this.isActivableTab(tab) && isNewActiveTab) tab.status = Status.ACTIVE;\n });\n // emit change active tab key event\n this.activeTabChange.emit(newValue);\n } else {\n throw new Error(`<mg-tabs> prop \"activeTab\" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be \"activable\".`);\n }\n }\n\n /\n Component tabs\n /\n @State() tabs: TabItem[] = [];\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-tabs']);\n\n /\n Emited event when active tab change\n /\n @Event({ eventName: 'active-tab-change' }) activeTabChange: EventEmitter<HTMLMgTabsElement['activeTab']>;\n\n /\n Validate that new tab status can be `Status.ACTIVE`\n * @param tab - tab item\n * @returns true when tab match condition to get a `Status.ACTIVE`\n /\n private isActivableTab = (tab: TabItem): boolean => [undefined, Status.ACTIVE, Status.VISIBLE].includes(tab.status);\n\n /\n Method to know if given tab has the given status\n * @param tab - item tab key to set to ACTIVE status\n * @param status - status to valide\n * @returns status comparaison\n /\n private tabHasStatus = (tab: TabItem, status: Status): boolean => tab.status === status;\n\n /\n Method to get element id from index\n * @param element - to get id\n * @param index - to generate id\n * @returns generated element id\n /\n private getElementId = (element: string, index: number): string => `${element}-${this.getTabItemIndex(index)}`;\n\n /\n Method to get tab item index\n * @param index - to get\n * @returns index\n /\n private getTabItemIndex = (index: number): number => index + this.startIndex;\n\n /\n Handle click events on tabs\n * @param event - mouse event\n /\n private handleClick = (event: MouseEvent & { currentTarget: HTMLElement }): void => {\n const tabId = event.currentTarget.dataset.index;\n if (!this.isActivableTab(this.tabs[Number(tabId) - this.startIndex])) {\n event.preventDefault();\n } else {\n this.activeTab = Number(tabId);\n this.tabFocus = undefined;\n }\n };\n\n /\n get navigation button class from given status\n * @param status - button tab status\n * @returns button class/selector variant\n /\n private getNavigationButtonClass = (status: Status): string => `${this.buttonTabBaseClass}--${status}`;\n\n /\n Handle keyboard event on tabs\n * @param event - mouse event\n /\n private handleKeydown = (event: KeyboardEvent & { target: HTMLElement }): void => {\n const parent = event.target.parentElement;\n if (['ArrowRight', 'ArrowLeft'].includes(event.key)) {\n this.tabFocus = Number(event.target.dataset.index);\n parent.querySelector(`[data-index=\"${this.tabFocus}\"]`).setAttribute('tabindex', '-1');\n\n // Move right\n if (event.key === 'ArrowRight') {\n this.tabFocus++;\n // If we're at the end, go to the start\n if (this.tabFocus > this.tabs.length) this.tabFocus = this.startIndex;\n // Move left\n } else if (event.key === 'ArrowLeft') {\n this.tabFocus--;\n // If we're at the start, move to the end\n if (this.tabFocus < this.startIndex) this.tabFocus = this.tabs.length;\n }\n\n const parentButtonElement: HTMLButtonElement = parent.querySelector(`[data-index=\"${this.tabFocus}\"]`);\n // if focus item is ['hidden'] we recursively repeat action\n if (this.tabHasStatus(this.tabs[this.tabFocus - 1], Status.HIDDEN)) {\n parentButtonElement.dispatchEvent(new KeyboardEvent('keydown', { key: event.key, bubbles: true }));\n // else run focus methods on tabFocus element\n } else {\n parentButtonElement.setAttribute('tabindex', '0');\n parentButtonElement.focus();\n }\n } else if (event.key === 'Tab') {\n this.resetFocus();\n }\n };\n\n /\n Method to reset focus behavior\n /\n private resetFocus = (): void => {\n // update asynchronously tabindex to prevent get focus on new tabindex at then end of event process\n nextTick(() => {\n this.tabFocus = undefined;\n Array.from(this.element.shadowRoot.querySelectorAll('[data-index]')).forEach((tab, index) => {\n tab.setAttribute('tabindex', this.activeTab - this.startIndex !== index ? '-1' : '0');\n });\n });\n };\n\n /\n Validate slots setting\n /\n private validateSlots = (): void => {\n const slots = Array.from(this.element.children).filter(slot => slot.getAttribute('slot')?.includes('tab_content-'));\n if (slots.length !== this.tabs.length) throw new Error('<mg-tabs> Must have slots counts equal to tabs count.');\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n // Check tabs format\n this.validateLabel(this.label);\n this.validateItems(this.items);\n this.validateActiveTab(this.activeTab);\n this.validateSize(this.size);\n this.validateSlots();\n }\n\n /\n add listners\n /\n componentDidLoad(): void {\n document.addEventListener(\n 'click',\n (event: MouseEvent & { target: HTMLElement }) => {\n if (event.target.closest('mg-tabs') !== this.element) this.resetFocus();\n },\n false,\n );\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class={this.classCollection.join()}>\n <header role=\"tablist\" aria-label={this.label} class=\"mg-c-tabs__header\">\n {this.tabs.map((tab, index) => (\n <button\n key={tab.label}\n role=\"tab\"\n id={this.getElementId(this.identifier, index)}\n class={{\n [`${this.buttonTabBaseClass}`]: true,\n [`${this.buttonTabBaseClass}--horizontal`]: true,\n [`${this.getNavigationButtonClass(Status.ACTIVE)}`]: this.tabHasStatus(tab, Status.ACTIVE),\n [`${this.getNavigationButtonClass(Status.DISABLED)}`]: this.tabHasStatus(tab, Status.DISABLED),\n [`${this.getNavigationButtonClass(Status.HIDDEN)}`]: this.tabHasStatus(tab, Status.HIDDEN),\n }}\n tabindex={this.tabHasStatus(tab, Status.ACTIVE) ? 0 : -1}\n aria-selected={this.tabHasStatus(tab, Status.ACTIVE).toString()}\n aria-controls={this.getElementId(this.tabPanel, index)}\n aria-disabled={this.tabHasStatus(tab, Status.DISABLED)}\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown}\n data-index={this.getTabItemIndex(index)}\n >\n {tab.icon !== undefined && <mg-icon icon={tab.icon}></mg-icon>}\n {tab.label}\n {tab.badge !== undefined && <mg-badge variant=\"text-color\" value={tab.badge.value} label={tab.badge.label} outline={tab.badge.role === 'information'}></mg-badge>}\n </button>\n ))}\n </header>\n {this.tabs.map((tab, index) => (\n <article\n key={tab.label}\n role=\"tabpanel\"\n id={this.getElementId(this.tabPanel, index)}\n hidden={!this.tabHasStatus(tab, Status.ACTIVE)}\n aria-labelledby={this.getElementId(this.identifier, index)}\n tabindex={this.tabHasStatus(tab, Status.ACTIVE) ? 0 : -1}\n class=\"mg-c-tabs__content-container\"\n >\n <slot name={this.getElementId('tab_content', index)}></slot>\n </article>\n ))}\n </div>\n );\n }\n}\n"]}

package/dist/collection/locales/en/messages.json CHANGED Viewed

@@ -2,7 +2,7 @@
   "errors": {
     "required": "This field is required.",
     "date": {
-      "badInput": "The date format must be <span aria-hidden=\"true\">mm/dd/yyyy</span><span class=\"mg-u-visually-hidden\">m m / d d / y y y y</span> and the date must be greater than {min}",
+      "badInput": "The date format must be {pattern} and the date must be greater than {min}",
       "min": "The date cannot be earlier than {min}",
       "max": "The date cannot be later than {max}",
       "minMax": "The date must be between {min} and {max}"
@@ -33,14 +33,24 @@
         "selected": {
           "title": "Selected",
           "titlePlurial": "Selected",
-          "action": "Unselect all"
+          "action": "Unselect all",
+          "tooltip": "Unselect all current search results"
         },
         "notSelected": {
           "title": "Not selected",
           "titlePlurial": "Not selected",
-          "action": "Select all"
+          "action": "Select all",
+          "tooltip": "Select all current search results"
         }
       }
+    },
+    "date": {
+      "helpText": "Expected format: {pattern} (ex: {date})",
+      "pattern": {
+        "dd": "dd",
+        "mm": "mm",
+        "yyyy": "yyyy"
+      }
     }
   },
   "form": {

package/dist/collection/locales/fr/messages.json CHANGED Viewed

@@ -2,7 +2,7 @@
   "errors": {
     "required": "Ce champ est obligatoire.",
     "date": {
-      "badInput": "Le format de la date doit être du type <span aria-hidden=\"true\">jj/mm/aaaa</span><span class=\"mg-u-visually-hidden\">j j / m m / a a a a</span> et la date supérieure au {min}",
+      "badInput": "Le format de la date doit être du type {pattern} et la date supérieure au {min}",
       "min": "La date ne peut pas être antérieure au {min}",
       "max": "La date ne peut pas être postérieure au {max}",
       "minMax": "La date doit être comprise entre le {min} et le {max}"
@@ -33,14 +33,24 @@
         "selected": {
           "title": "Sélectionné",
           "titlePlurial": "Sélectionnés",
-          "action": "Tout désélectionner"
+          "action": "Tout désélectionner",
+          "tooltip": "Désélectionne tous les résultats de la recherche en cours"
         },
         "notSelected": {
           "title": "Non sélectionné",
           "titlePlurial": "Non sélectionnés",
-          "action": "Tout sélectionner"
+          "action": "Tout sélectionner",
+          "tooltip": "Sélectionne tous les résultats de la recherche en cours"
         }
       }
+    },
+    "date": {
+      "helpText": "Format attendu&nbsp;: {pattern} (ex&nbsp;: {date})",
+      "pattern": {
+        "dd": "jj",
+        "mm": "mm",
+        "yyyy": "aaaa"
+      }
     }
   },
   "form": {

package/dist/collection/locales/index.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import en from "./en/messages.json";
 import fr from "./fr/messages.json";
-import { getLocaleMessages } from "../utils/locale.utils";
+import { defineLocales } from "@mgdis/stencil-helpers";
 const defaultLocale = 'en';
 const messages = { en, fr };
 /**
@@ -8,5 +8,5 @@ const messages = { en, fr };
  * @param element - element we need to get the language
  * @returns messages object
  */
-export const initLocales = (element) => getLocaleMessages(element, messages, defaultLocale);
+export const initLocales = defineLocales(messages, defaultLocale);
 //# sourceMappingURL=index.js.map

package/dist/collection/locales/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/locales/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACpC,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACpC,OAAO,EAAE,~~iBAAiB~~,EAAE,MAAM,~~uBAAuB~~,CAAC;~~AAE1D~~,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;AAE5B;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,~~CAAC~~,~~OAAoB,EAAyD,EAAE,~~CAAC,~~iBAAiB,CAAC,OAAO,EAAE,~~QAAQ,EAAE,aAAa,CAAC,CAAC","sourcesContent":["import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { ~~getLocaleMessages~~ } from '~~../utils~~/~~locale.utils~~';\n\nconst defaultLocale = 'en';\nconst messages = { en, fr };\n\n/*\n Get Intl object\n * @param element - element we need to get the language\n * @returns messages object\n */\nexport const initLocales = (~~element: HTMLElement): { locale: string;~~ messages~~: Record<string~~, ~~unknown> } => getLocaleMessages(element, messages,~~ defaultLocale);\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/locales/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACpC,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;AAE5B;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC","sourcesContent":["import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { defineLocales } from '@mgdis/stencil-helpers';\n\nconst defaultLocale = 'en';\nconst messages = { en, fr };\n\n/*\n Get Intl object\n * @param element - element we need to get the language\n * @returns messages object\n */\nexport const initLocales = defineLocales(messages, defaultLocale);\n"]}

package/dist/collection/utils/behaviors.utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"behaviors.utils.js","sourceRoot":"","sources":["../../src/utils/behaviors.utils.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,YAAY,GAAG,CAAC,OAAoB,EAAoC,EAAE,CAAC,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;AAErH,MAAM,CAAN,IAAY,wBAGX;AAHD,WAAY,wBAAwB;IAClC,mEAAuC,CAAA;IACvC,qEAAyC,CAAA;AAC3C,CAAC,EAHW,wBAAwB,KAAxB,wBAAwB,QAGnC;AAED,MAAM,OAAO,gBAAgB;IAO3B,YACU,OAAgB,EAChB,MAAyB;QADzB,YAAO,GAAP,OAAO,CAAS;QAChB,WAAM,GAAN,MAAM,CAAmB;QAcnC;;oBAEY;QAEZ;;WAEG;QACI,eAAU,GAAG,GAAS,EAAE;YAC7B,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC;QACpC,CAAC,CAAC;QAEF;;sBAEc;QAEd;;;WAGG;QACK,QAAG,GAAG,CAAC,KAAc,EAAQ,EAAE;YACrC,IAAI,IAAI,CAAC,YAAY,KAAK,SAAS,EAAE;~~gBACnC~~,kBAAkB;gBAClB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;gBAElC,eAAe;gBACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;gBAC5D,IAAI,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;~~oBACnC~~,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC;~~iBACvG~~;gBAED,kBAAkB;gBAClB,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;oBAC1C,KAAK,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;oBACpE,2BAA2B;oBAC3B,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,wBAAwB,CAAC,WAAW,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;gBAC5F,CAAC,CAAC,CAAC;~~aACJ~~;YAED,IAAI,KAAK,KAAK,SAAS;gBAAE,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;QAC5D,CAAC,CAAC;QAEF;;;;WAIG;QACK,wBAAmB,GAAG,CAAC,OAAgB,EAAE,EAAE,WACjD,OAAA,CAAC,CAAA,MAAA,OAAO,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA,EAAA,CAAC;QAEjJ;;;WAGG;QACK,yBAAoB,GAAG,CAAC,cAAsB,EAAQ,EAAE;YAC9D,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,MAAM,GAAG,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;YAChD,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,KAAoD,EAAE,EAAE;gBAC1G,GAAG,CAAC,QAAQ,IAAI,KAAK,CAAC,WAAW,CAAC;gBAClC,MAAM,eAAe,GAAG,GAAG,CAAC,YAAY,KAAK,IAAI,CAAC;gBAClD,MAAM,oBAAoB,GAAG,eAAe,IAAI,GAAG,CAAC,YAAY,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;gBACjG,sEAAsE;gBACtE,8CAA8C;gBAC9C,qHAAqH;gBACrH,iCAAiC;gBACjC,IAAI,CAAC,UAAU,CACb,KAAK,EACL,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAC5K,CAAC;gBAEF,yCAAyC;gBACzC,GAAG,CAAC,YAAY,GAAG,KAAK,CAAC;YAC3B,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF;;;;;;WAMG;QACK,sBAAiB,GAAG,CAAC,aAAqB,EAAE,IAAiB,EAAE,cAAsB,EAAW,EAAE;YACxG,IAAI,IAAI,CAAC,sBAAsB,KAAK,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;gBAAE,OAAO,KAAK,CAAC;iBAC9E,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC;gBAAE,OAAO,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;;gBACxH,OAAO,aAAa,GAAG,cAAc,CAAC;QAC7C,CAAC,CAAC;QAEF;;;;WAIG;QACK,kBAAa,GAAG,CAAC,OAAgB,EAAW,EAAE,CAAC,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;QAE3F;;;;WAIG;QACK,eAAU,GAAG,CAAC,IAAiB,EAAE,QAAiB,EAAQ,EAAE;YAClE,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,CAAC,CAAC,CAAC;YACzF,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;gBAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;iBACzE,IAAI,iBAAiB,IAAI,CAAC,EAAE;~~gBAC/B~~,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;gBACnC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;~~aACvE~~;QACH,CAAC,CAAC;QAEF;;;;WAIG;QACK,kBAAa,GAAG,CAAC,OAAgB,EAAE,QAAiB,EAAQ,EAAE;YACpE,IAAI,QAAQ;gBAAE,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;;gBAC5C,OAAO,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QACzC,CAAC,CAAC;QAEF;;WAEG;QACK,iBAAY,GAAG,GAAS,EAAE;YAChC,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC7F,CAAC,CAAC;QAvIA,IAAI,IAAI,CAAC,eAAe,KAAK,SAAS,EAAE;~~YACtC~~,sBAAsB;YACtB,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;gBAClD,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;oBACtB,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;~~SAC5C~~;QACD,IAAI,CAAC,GAAG,EAAE,CAAC;IACb,CAAC;CA8HF","sourcesContent":["/*\n MgItemMore type guard\n * @param element - element to control type\n * @returns truthy if element is mg-item-more\n /\nconst isMgItemMore = (element: HTMLElement): element is HTMLMgItemMoreElement => element.nodeName === 'MG-ITEM-MORE';\n\nexport enum OverflowBehaviorElements {\n BASE_INDEX = 'data-overflow-base-index',\n PROXY_INDEX = 'data-overflow-proxy-index',\n}\n\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _moreElement: HTMLElement;\n private _baseChildren: Element[];\n private _proxyChildren: Element[];\n\n constructor(\n private element: Element,\n private render: () => HTMLElement,\n ) {\n if (this._resizeObserver === undefined) {\n // add resize observer\n this._resizeObserver = new ResizeObserver(entries => {\n entries.forEach(entry => {\n this.run(entry.contentRect.width);\n });\n });\n this._resizeObserver.observe(this.element);\n }\n this.run();\n }\n\n /********\n Public \n *******/\n\n /\n * Disconnect ResizeObserver\n /\n public disconnect = (): void => {\n this._resizeObserver.disconnect();\n };\n\n /**********\n Internal \n *********/\n\n /\n * run overflow behavior\n * @param width - width of the container. Optional.\n /\n private run = (width?: number): void => {\n if (this._moreElement === undefined) {\n // set moreElement\n this._moreElement = this.render();\n\n // set children\n this._baseChildren = this.getInteractiveItems(this.element);\n if (isMgItemMore(this._moreElement)) {\n this._proxyChildren = this.getInteractiveItems(this._moreElement.shadowRoot.querySelector('mg-menu'));\n }\n\n // update children\n this._baseChildren.forEach((child, index) => {\n child.setAttribute(OverflowBehaviorElements.BASE_INDEX, `${index}`);\n // set moreElement children\n this._proxyChildren[index].setAttribute(OverflowBehaviorElements.PROXY_INDEX, `${index}`);\n });\n }\n\n if (width !== undefined) this.updateDisplayedItems(width);\n };\n\n /\n Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']\n * @param element - element to parse\n * @returns children\n /\n private getInteractiveItems = (element: Element) =>\n (element.children?.length > 0 ? Array.from(element.children) : []).filter(element => ['MG-MENU-ITEM', 'MG-BUTTON'].includes(element.nodeName));\n\n /\n Update displayed items in container from a given available space\n * @param availableWidth - available width in container to display child items\n /\n private updateDisplayedItems = (availableWidth: number): void => {\n this.restoreItems();\n const acc = { accWidth: 0, previousItem: null };\n [...this._baseChildren, this._moreElement].forEach((child: HTMLMgMenuItemElement \| HTMLMgItemMoreElement) => {\n acc.accWidth += child.offsetWidth;\n const hasPreviuosItem = acc.previousItem !== null;\n const isPreviousItemHidden = hasPreviuosItem && acc.previousItem.getAttribute('hidden') !== null;\n // if previous item is hidden AND is NOT more element we hidde current\n // OR if item has an overflow we hidde current\n // OR if current item is more element AND have NOT previous hidden items, current more element item is an hidden item\n // ELSE current is a display item\n this.toggleItem(\n child,\n (isPreviousItemHidden && !this.isMoreElement(child)) \|\| this.isOverflowElement(acc.accWidth, child, availableWidth) \|\| (this.isMoreElement(child) && !isPreviousItemHidden),\n );\n\n // update previous item with current item\n acc.previousItem = child;\n });\n };\n\n /\n Utility method to know if item overflow partialy or totaly in the container\n * @param cumulateWidth - previous sibling elements cumulate width + item width\n * @param item - item HTML element\n * @param availableWidth - container available width\n * @returns truthy if element is overflow\n /\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement, availableWidth: number): boolean => {\n if (item.previousElementSibling === null \|\| this.isMoreElement(item)) return false;\n else if (!this.isMoreElement(item.nextElementSibling)) return cumulateWidth + this._moreElement.offsetWidth > availableWidth;\n else return cumulateWidth > availableWidth;\n };\n\n /\n Utility method to know if a given element is the 'MORE' element\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n /\n private isMoreElement = (element: Element): boolean => element.nodeName === 'MG-ITEM-MORE';\n\n /\n Toggle display item element\n * @param item - item to control\n * @param isHidden - is item hidden\n /\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n const mgActionMenuindex = Number(item.getAttribute(OverflowBehaviorElements.BASE_INDEX));\n if (this.isMoreElement(item)) this.toggleElement(this._moreElement, isHidden);\n else if (mgActionMenuindex >= 0) {\n this.toggleElement(item, isHidden);\n this.toggleElement(this._proxyChildren[mgActionMenuindex], !isHidden);\n }\n };\n\n /\n Toggle element's hidde attribute\n * @param element - element to toggle\n * @param isHidden - element is hidden\n /\n private toggleElement = (element: Element, isHidden: boolean): void => {\n if (isHidden) element.setAttribute('hidden', '');\n else element.removeAttribute('hidden');\n };\n\n /\n Remove hidden attributes on all items\n */\n private restoreItems = (): void => {\n [...this._baseChildren, this._moreElement].forEach(item => item.removeAttribute('hidden'));\n };\n}\n"]}
1	+ {"version":3,"file":"behaviors.utils.js","sourceRoot":"","sources":["../../src/utils/behaviors.utils.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,YAAY,GAAG,CAAC,OAAoB,EAAoC,EAAE,CAAC,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;AAErH,MAAM,CAAN,IAAY,wBAGX;AAHD,WAAY,wBAAwB;IAClC,mEAAuC,CAAA;IACvC,qEAAyC,CAAA;AAC3C,CAAC,EAHW,wBAAwB,KAAxB,wBAAwB,QAGnC;AAED,MAAM,OAAO,gBAAgB;IAO3B,YACU,OAAgB,EAChB,MAAyB;QADzB,YAAO,GAAP,OAAO,CAAS;QAChB,WAAM,GAAN,MAAM,CAAmB;QAcnC;;oBAEY;QAEZ;;WAEG;QACI,eAAU,GAAG,GAAS,EAAE;YAC7B,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC;QACpC,CAAC,CAAC;QAEF;;sBAEc;QAEd;;;WAGG;QACK,QAAG,GAAG,CAAC,KAAc,EAAQ,EAAE;YACrC,IAAI,IAAI,CAAC,YAAY,KAAK,SAAS,EAAE,CAAC;gBACpC,kBAAkB;gBAClB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;gBAElC,eAAe;gBACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;gBAC5D,IAAI,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;oBACpC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC;gBACxG,CAAC;gBAED,kBAAkB;gBAClB,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;oBAC1C,KAAK,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;oBACpE,2BAA2B;oBAC3B,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,wBAAwB,CAAC,WAAW,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;gBAC5F,CAAC,CAAC,CAAC;YACL,CAAC;YAED,IAAI,KAAK,KAAK,SAAS;gBAAE,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;QAC5D,CAAC,CAAC;QAEF;;;;WAIG;QACK,wBAAmB,GAAG,CAAC,OAAgB,EAAE,EAAE,WACjD,OAAA,CAAC,CAAA,MAAA,OAAO,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA,EAAA,CAAC;QAEjJ;;;WAGG;QACK,yBAAoB,GAAG,CAAC,cAAsB,EAAQ,EAAE;YAC9D,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,MAAM,GAAG,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;YAChD,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,KAAoD,EAAE,EAAE;gBAC1G,GAAG,CAAC,QAAQ,IAAI,KAAK,CAAC,WAAW,CAAC;gBAClC,MAAM,eAAe,GAAG,GAAG,CAAC,YAAY,KAAK,IAAI,CAAC;gBAClD,MAAM,oBAAoB,GAAG,eAAe,IAAI,GAAG,CAAC,YAAY,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;gBACjG,sEAAsE;gBACtE,8CAA8C;gBAC9C,qHAAqH;gBACrH,iCAAiC;gBACjC,IAAI,CAAC,UAAU,CACb,KAAK,EACL,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAC5K,CAAC;gBAEF,yCAAyC;gBACzC,GAAG,CAAC,YAAY,GAAG,KAAK,CAAC;YAC3B,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF;;;;;;WAMG;QACK,sBAAiB,GAAG,CAAC,aAAqB,EAAE,IAAiB,EAAE,cAAsB,EAAW,EAAE;YACxG,IAAI,IAAI,CAAC,sBAAsB,KAAK,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;gBAAE,OAAO,KAAK,CAAC;iBAC9E,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC;gBAAE,OAAO,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;;gBACxH,OAAO,aAAa,GAAG,cAAc,CAAC;QAC7C,CAAC,CAAC;QAEF;;;;WAIG;QACK,kBAAa,GAAG,CAAC,OAAgB,EAAW,EAAE,CAAC,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;QAE3F;;;;WAIG;QACK,eAAU,GAAG,CAAC,IAAiB,EAAE,QAAiB,EAAQ,EAAE;YAClE,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,CAAC,CAAC,CAAC;YACzF,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;gBAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;iBACzE,IAAI,iBAAiB,IAAI,CAAC,EAAE,CAAC;gBAChC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;gBACnC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;YACxE,CAAC;QACH,CAAC,CAAC;QAEF;;;;WAIG;QACK,kBAAa,GAAG,CAAC,OAAgB,EAAE,QAAiB,EAAQ,EAAE;YACpE,IAAI,QAAQ;gBAAE,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;;gBAC5C,OAAO,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QACzC,CAAC,CAAC;QAEF;;WAEG;QACK,iBAAY,GAAG,GAAS,EAAE;YAChC,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC7F,CAAC,CAAC;QAvIA,IAAI,IAAI,CAAC,eAAe,KAAK,SAAS,EAAE,CAAC;YACvC,sBAAsB;YACtB,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;gBAClD,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;oBACtB,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC7C,CAAC;QACD,IAAI,CAAC,GAAG,EAAE,CAAC;IACb,CAAC;CA8HF","sourcesContent":["/*\n MgItemMore type guard\n * @param element - element to control type\n * @returns truthy if element is mg-item-more\n /\nconst isMgItemMore = (element: HTMLElement): element is HTMLMgItemMoreElement => element.nodeName === 'MG-ITEM-MORE';\n\nexport enum OverflowBehaviorElements {\n BASE_INDEX = 'data-overflow-base-index',\n PROXY_INDEX = 'data-overflow-proxy-index',\n}\n\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _moreElement: HTMLElement;\n private _baseChildren: Element[];\n private _proxyChildren: Element[];\n\n constructor(\n private element: Element,\n private render: () => HTMLElement,\n ) {\n if (this._resizeObserver === undefined) {\n // add resize observer\n this._resizeObserver = new ResizeObserver(entries => {\n entries.forEach(entry => {\n this.run(entry.contentRect.width);\n });\n });\n this._resizeObserver.observe(this.element);\n }\n this.run();\n }\n\n /********\n Public \n *******/\n\n /\n * Disconnect ResizeObserver\n /\n public disconnect = (): void => {\n this._resizeObserver.disconnect();\n };\n\n /**********\n Internal \n *********/\n\n /\n * run overflow behavior\n * @param width - width of the container. Optional.\n /\n private run = (width?: number): void => {\n if (this._moreElement === undefined) {\n // set moreElement\n this._moreElement = this.render();\n\n // set children\n this._baseChildren = this.getInteractiveItems(this.element);\n if (isMgItemMore(this._moreElement)) {\n this._proxyChildren = this.getInteractiveItems(this._moreElement.shadowRoot.querySelector('mg-menu'));\n }\n\n // update children\n this._baseChildren.forEach((child, index) => {\n child.setAttribute(OverflowBehaviorElements.BASE_INDEX, `${index}`);\n // set moreElement children\n this._proxyChildren[index].setAttribute(OverflowBehaviorElements.PROXY_INDEX, `${index}`);\n });\n }\n\n if (width !== undefined) this.updateDisplayedItems(width);\n };\n\n /\n Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']\n * @param element - element to parse\n * @returns children\n /\n private getInteractiveItems = (element: Element) =>\n (element.children?.length > 0 ? Array.from(element.children) : []).filter(element => ['MG-MENU-ITEM', 'MG-BUTTON'].includes(element.nodeName));\n\n /\n Update displayed items in container from a given available space\n * @param availableWidth - available width in container to display child items\n /\n private updateDisplayedItems = (availableWidth: number): void => {\n this.restoreItems();\n const acc = { accWidth: 0, previousItem: null };\n [...this._baseChildren, this._moreElement].forEach((child: HTMLMgMenuItemElement \| HTMLMgItemMoreElement) => {\n acc.accWidth += child.offsetWidth;\n const hasPreviuosItem = acc.previousItem !== null;\n const isPreviousItemHidden = hasPreviuosItem && acc.previousItem.getAttribute('hidden') !== null;\n // if previous item is hidden AND is NOT more element we hidde current\n // OR if item has an overflow we hidde current\n // OR if current item is more element AND have NOT previous hidden items, current more element item is an hidden item\n // ELSE current is a display item\n this.toggleItem(\n child,\n (isPreviousItemHidden && !this.isMoreElement(child)) \|\| this.isOverflowElement(acc.accWidth, child, availableWidth) \|\| (this.isMoreElement(child) && !isPreviousItemHidden),\n );\n\n // update previous item with current item\n acc.previousItem = child;\n });\n };\n\n /\n Utility method to know if item overflow partialy or totaly in the container\n * @param cumulateWidth - previous sibling elements cumulate width + item width\n * @param item - item HTML element\n * @param availableWidth - container available width\n * @returns truthy if element is overflow\n /\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement, availableWidth: number): boolean => {\n if (item.previousElementSibling === null \|\| this.isMoreElement(item)) return false;\n else if (!this.isMoreElement(item.nextElementSibling)) return cumulateWidth + this._moreElement.offsetWidth > availableWidth;\n else return cumulateWidth > availableWidth;\n };\n\n /\n Utility method to know if a given element is the 'MORE' element\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n /\n private isMoreElement = (element: Element): boolean => element.nodeName === 'MG-ITEM-MORE';\n\n /\n Toggle display item element\n * @param item - item to control\n * @param isHidden - is item hidden\n /\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n const mgActionMenuindex = Number(item.getAttribute(OverflowBehaviorElements.BASE_INDEX));\n if (this.isMoreElement(item)) this.toggleElement(this._moreElement, isHidden);\n else if (mgActionMenuindex >= 0) {\n this.toggleElement(item, isHidden);\n this.toggleElement(this._proxyChildren[mgActionMenuindex], !isHidden);\n }\n };\n\n /\n Toggle element's hidde attribute\n * @param element - element to toggle\n * @param isHidden - element is hidden\n /\n private toggleElement = (element: Element, isHidden: boolean): void => {\n if (isHidden) element.setAttribute('hidden', '');\n else element.removeAttribute('hidden');\n };\n\n /\n Remove hidden attributes on all items\n */\n private restoreItems = (): void => {\n [...this._baseChildren, this._moreElement].forEach(item => item.removeAttribute('hidden'));\n };\n}\n"]}

package/dist/collection/utils/behaviors.utils.spec.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { MgItemMore } from "../components/molecules/mg-item-more/mg-item-more";
 import { MgMenuItem } from "../components/molecules/menu/mg-menu-item/mg-menu-item";
 import { MgMenu } from "../components/molecules/menu/mg-menu/mg-menu";
 import { OverflowBehavior } from "./behaviors.utils";
-import { setupMutationObserverMock, setupResizeObserverMock } from "./unit.test.utils";
+import { setupMutationObserverMock, setupResizeObserverMock } from "@mgdis/stencil-helpers";
 const getPage = render => newSpecPage({
     components: [MgMenu, MgMenuItem, MgItemMore],
     template: () => render,

package/dist/collection/utils/behaviors.utils.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"behaviors.utils.spec.js","sourceRoot":"","sources":["../../src/utils/behaviors.utils.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,wBAAwB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,mDAAmD,CAAC;AAC/E,OAAO,EAAE,UAAU,EAAE,MAAM,wDAAwD,CAAC;AACpF,OAAO,EAAE,MAAM,EAAE,MAAM,8CAA8C,CAAC;AACtE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,~~mBAAmB~~,CAAC;~~AAEvF~~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","sourcesContent":["import { h } from '@stencil/core/internal';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgItemMore } from '../components/molecules/mg-item-more/mg-item-more';\nimport { MgMenuItem } from '../components/molecules/menu/mg-menu-item/mg-menu-item';\nimport { MgMenu } from '../components/molecules/menu/mg-menu/mg-menu';\nimport { OverflowBehavior } from './behaviors.utils';\nimport { setupMutationObserverMock, setupResizeObserverMock } from '~~./unit.test.utils~~';\n\nconst getPage = render =>\n newSpecPage({\n components: [MgMenu, MgMenuItem, MgItemMore],\n template: () => render,\n });\n\ndescribe('behavior.utils', () => {\n describe('OverflowBehavior', () => {\n let fireRo;\n beforeEach(() => {\n jest.useFakeTimers({ legacyFakeTimers: true });\n setupResizeObserverMock({\n observe: function () {\n fireRo = this.cb;\n },\n disconnect: () => null,\n });\n setupMutationObserverMock({\n disconnect: () => null,\n observe: () => null,\n takeRecords: () => null,\n });\n });\n afterEach(() => jest.runOnlyPendingTimers());\n\n describe('render menu', () => {\n test.each([50, 80, 100, 250])('should manage resize with observer, case %s', async width => {\n const args = { label: 'batman' };\n const page = await getPage(\n <mg-menu {...args}>\n <mg-menu-item>\n <span slot=\"label\">Batman</span>\n </mg-menu-item>\n <mg-menu-item>\n <span slot=\"label\">Joker</span>\n </mg-menu-item>\n <mg-menu-item>\n <span slot=\"label\">Bane</span>\n </mg-menu-item>\n </mg-menu>,\n );\n\n // initial menu render\n jest.runAllTimers();\n await page.waitForChanges();\n\n // more-item render\n jest.runAllTimers();\n await page.waitForChanges();\n\n const items = Array.from(page.doc.querySelectorAll('mg-menu-item'));\n items.forEach(item => {\n Object.defineProperty(item, 'offsetWidth', {\n get: jest.fn(() => 80),\n });\n });\n\n Object.defineProperty(page.doc.querySelector('mg-item-more'), 'offsetWidth', {\n get: jest.fn(() => 50),\n });\n\n fireRo([{ contentRect: { width } }]);\n\n expect(page.root).toMatchSnapshot();\n });\n });\n\n test('Should fire disconnect callback', () => {\n const behavior = new OverflowBehavior(<div></div>, () => <span></span>);\n const spy = jest.spyOn((behavior as unknown as { _resizeObserver: never })._resizeObserver, 'disconnect');\n behavior.disconnect();\n\n expect(spy).toHaveBeenCalled();\n });\n });\n});\n"]}
1	+ {"version":3,"file":"behaviors.utils.spec.js","sourceRoot":"","sources":["../../src/utils/behaviors.utils.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core/internal';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgItemMore } from '../components/molecules/mg-item-more/mg-item-more';\nimport { MgMenuItem } from '../components/molecules/menu/mg-menu-item/mg-menu-item';\nimport { MgMenu } from '../components/molecules/menu/mg-menu/mg-menu';\nimport { OverflowBehavior } from './behaviors.utils';\nimport { setupMutationObserverMock, setupResizeObserverMock } from '@mgdis/stencil-helpers';\n\nconst getPage = render =>\n newSpecPage({\n components: [MgMenu, MgMenuItem, MgItemMore],\n template: () => render,\n });\n\ndescribe('behavior.utils', () => {\n describe('OverflowBehavior', () => {\n let fireRo;\n beforeEach(() => {\n jest.useFakeTimers({ legacyFakeTimers: true });\n setupResizeObserverMock({\n observe: function () {\n fireRo = this.cb;\n },\n disconnect: () => null,\n });\n setupMutationObserverMock({\n disconnect: () => null,\n observe: () => null,\n takeRecords: () => null,\n });\n });\n afterEach(() => jest.runOnlyPendingTimers());\n\n describe('render menu', () => {\n test.each([50, 80, 100, 250])('should manage resize with observer, case %s', async width => {\n const args = { label: 'batman' };\n const page = await getPage(\n <mg-menu {...args}>\n <mg-menu-item>\n <span slot=\"label\">Batman</span>\n </mg-menu-item>\n <mg-menu-item>\n <span slot=\"label\">Joker</span>\n </mg-menu-item>\n <mg-menu-item>\n <span slot=\"label\">Bane</span>\n </mg-menu-item>\n </mg-menu>,\n );\n\n // initial menu render\n jest.runAllTimers();\n await page.waitForChanges();\n\n // more-item render\n jest.runAllTimers();\n await page.waitForChanges();\n\n const items = Array.from(page.doc.querySelectorAll('mg-menu-item'));\n items.forEach(item => {\n Object.defineProperty(item, 'offsetWidth', {\n get: jest.fn(() => 80),\n });\n });\n\n Object.defineProperty(page.doc.querySelector('mg-item-more'), 'offsetWidth', {\n get: jest.fn(() => 50),\n });\n\n fireRo([{ contentRect: { width } }]);\n\n expect(page.root).toMatchSnapshot();\n });\n });\n\n test('Should fire disconnect callback', () => {\n const behavior = new OverflowBehavior(<div></div>, () => <span></span>);\n const spy = jest.spyOn((behavior as unknown as { _resizeObserver: never })._resizeObserver, 'disconnect');\n behavior.disconnect();\n\n expect(spy).toHaveBeenCalled();\n });\n });\n});\n"]}

package/dist/collection/utils/unit.test.utils.js CHANGED Viewed

@@ -1,92 +1,3 @@
-/* eslint-disable jsdoc/require-jsdoc */
-import { MockCustomEvent } from "@stencil/core/mock-doc";
-/**
- * Clone Deep function
- * @param obj - object to clone
- * @returns cloned json
- */
-export const cloneDeep = (obj) => JSON.parse(JSON.stringify(obj));
-export const setupMutationObserverMock = ({ disconnect, observe, takeRecords }) => {
-    class MockMutationObserver {
-        constructor(fn) {
-            this.disconnect = disconnect;
-            this.observe = observe;
-            this.takeRecords = takeRecords;
-            this.cb = fn;
-        }
-    }
-    [window, global].forEach(element => {
-        Object.defineProperty(element, 'MutationObserver', {
-            writable: true,
-            configurable: true,
-            value: MockMutationObserver,
-        });
-    });
-    return MockMutationObserver;
-};
-/**
- * Utility function that mocks the `ResizeObserver` API. Recommended to execute inside `beforeEach`.
- * @param resizeObserverMock - Parameter that is sent to the `Object.defineProperty`
- * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only
- * mock the resize observer, but its methods.
- * You can manually fire an intersection entry:
- * @param resizeObserverMock - configuration object
- * @returns Mocked ResizeObserver
- * @example
- * ```
- * let fireRo;
- * setupResizeObserverMock({
- *   observe: function () {
- *     fireRo = this.cb;
- *   },
- * });
- * ...
- * fireRo([{
- *  borderBoxSize: ResizeObserverSize[],
- *  contentBoxSize: ResizeObserverSize[],
- *  contentRect: DOMRectReadOnly,
- *  devicePixelContentBoxSize: ResizeObserverSize[],
- *  target: yourMockElemenet
- * }]);;
- * ```
- */
-export const setupResizeObserverMock = ({ disconnect, observe }) => {
-    class MockResizeObserver {
-        constructor(fn) {
-            this.disconnect = disconnect;
-            this.observe = observe;
-            this.cb = fn;
-        }
-    }
-    [window, global].forEach(element => {
-        Object.defineProperty(element, 'ResizeObserver', {
-            writable: true,
-            configurable: true,
-            value: MockResizeObserver,
-        });
-    });
-    return MockResizeObserver;
-};
-/**
- * Utility function that mocks the `SubmitEvent` API. Recommended to execute inside `beforeEach`.
- * @example
- * ```
- * setupSubmitEventMock();
- * ```
- * @returns custom event mock
- */
-export const setupSubmitEventMock = () => {
-    class SubmitEvent extends MockCustomEvent {
-    }
-    [window, global].forEach(element => {
-        Object.defineProperty(element, 'SubmitEvent', {
-            writable: true,
-            configurable: true,
-            value: SubmitEvent,
-        });
-    });
-    return SubmitEvent;
-};
 /**
  * force popover id when component use randomed identifier
  * @param component - element wich include mg-popover
@@ -100,21 +11,6 @@ export const forcePopoverId = (component, id, interactiveElement = 'button') =>
         component.shadowRoot.querySelector(interactiveElement).setAttribute('aria-controls', id);
     }
 };
-/**
- * fix popper console.error in test
- * it is generated in `@popperjs/core/dist/cjs/popper.js l.1859`
- * this is due to internal function isHTMLElement(), so we can not mock it directly.
- * this function check if test DOM element mockHTMLElement instance is 'instanceof HTMLElement'
- * so we only override the console.error side effect for this error
- */
-export const mockConsoleError = () => {
-    const errorFunction = console.error;
-    const mock = jest.spyOn(console, 'error');
-    mock.mockImplementation(error => {
-        if (!error.includes('Popper'))
-            errorFunction(error);
-    });
-};
 /**
  * Add missing window.frames property to test context
  * usefull for component with iframe listeners, ex: mg-popover

package/dist/collection/utils/unit.test.utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"unit.test.utils.js","sourceRoot":"","sources":["../../src/utils/unit.test.utils.ts"],"names":[],"mappings":"AAAA,wCAAwC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD;;;;GAIG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,GAAY,EAAW,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;AAuBpF,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAAmC,EAA2B,EAAE;IAC1I,MAAM,oBAAoB;QAKxB,YAAY,EAAE;YAJd,eAAU,GAAe,UAAU,CAAC;YACpC,YAAO,GAA2D,OAAO,CAAC;YAC1E,gBAAW,GAA2B,WAAW,CAAC;YAGhD,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACf,CAAC;KACF;IAED,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QACjC,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,kBAAkB,EAAE;YACjD,QAAQ,EAAE,IAAI;YACd,YAAY,EAAE,IAAI;YAClB,KAAK,EAAE,oBAAoB;SAC5B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,oBAAoB,CAAC;AAC9B,CAAC,CAAC;AAIF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAiC,EAAyB,EAAE;IACvH,MAAM,kBAAkB;QAKtB,YAAY,EAAE;YAJd,eAAU,GAAe,UAAU,CAAC;YACpC,YAAO,GAA+D,OAAO,CAAC;YAI5E,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACf,CAAC;KACF;IAED,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QACjC,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,gBAAgB,EAAE;YAC/C,QAAQ,EAAE,IAAI;YACd,YAAY,EAAE,IAAI;YAClB,KAAK,EAAE,kBAAkB;SAC1B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,kBAAkB,CAAC;AAC5B,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAA2B,EAAE;IAC/D,MAAM,WAAY,SAAQ,eAAe;KAAG;IAE5C,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QACjC,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,aAAa,EAAE;YAC5C,QAAQ,EAAE,IAAI;YACd,YAAY,EAAE,IAAI;YAClB,KAAK,EAAE,WAAW;SACnB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAkB,EAAE,EAAU,EAAE,kBAAkB,GAAG,QAAQ,EAAQ,EAAE;IACpG,MAAM,OAAO,GAAG,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IACjE,IAAI,OAAO,KAAK,IAAI,EAAE;~~QACpB~~,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACnE,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,YAAY,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;~~KAC1F;AACH~~,CAAC~~,CAAC~~;~~AAEF;;;;;;GAMG;~~AACH,~~MAAM,~~CAAC,~~MAAM,gBAAgB,GAAG,GAAS,EAAE;IACzC,MAAM,aAAa,GAAG,OAAO,~~CAAC~~,KAAK,CAAC~~;IACpC,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAC1C,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE;QAC9B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IACtD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAS,EAAE;IACzC,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,QAAQ,EAAE;QACtC,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;KACrB,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["~~/* eslint-disable jsdoc/require-jsdoc /\nimport { MockCustomEvent } from '@stencil/core/mock-doc';\n\n~~/\n Clone Deep function\n * @param obj - object to clone\n * @returns cloned json\n /\nexport const cloneDeep = (obj: unknown): unknown => JSON.parse(JSON.stringify(obj));\n\n/\n Utility function that mocks the `MutationObserver` API. Recommended to execute inside `beforeEach`.\n * @param mutationObserverMock - Parameter that is sent to the `Object.defineProperty`\n * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only\n * mock the mutation observer, but its methods.\n * You can manually fire an intersection entry:\n * @param mutationObserverMock - configuration object\n * @returns Mocked MutationObserver\n * @example\n * ```\n * let fireMo;\n * setupMutationObserverMock({\n * observe: function () {\n * fireMo = this.cb;\n * },\n * });\n * ...\n * fireMo([{ type: 'childList', addedNodes: [AMockElemenet, AnotherMockElemenet], target: yourMockElemenet }]);;\n * ```\n /\ntype SetupMutationObserverMockParams = { disconnect: MutationObserver['disconnect']; observe: MutationObserver['observe']; takeRecords: MutationObserver['takeRecords'] };\nexport const setupMutationObserverMock = ({ disconnect, observe, takeRecords }: SetupMutationObserverMockParams): typeof MutationObserver => {\n class MockMutationObserver implements MutationObserver {\n disconnect: () => void = disconnect;\n observe: (target: Node, options?: MutationObserverInit) => void = observe;\n takeRecords: () => MutationRecord[] = takeRecords;\n cb: () => unknown;\n constructor(fn) {\n this.cb = fn;\n }\n }\n\n [window, global].forEach(element => {\n Object.defineProperty(element, 'MutationObserver', {\n writable: true,\n configurable: true,\n value: MockMutationObserver,\n });\n });\n\n return MockMutationObserver;\n};\n\ntype setupResizeObserverMockParams = { disconnect: ResizeObserver['disconnect']; observe: ResizeObserver['observe'] };\n\n/\n Utility function that mocks the `ResizeObserver` API. Recommended to execute inside `beforeEach`.\n * @param resizeObserverMock - Parameter that is sent to the `Object.defineProperty`\n * overwrite method. `jest.fn()` mock functions can be passed here if the goal is to not only\n * mock the resize observer, but its methods.\n * You can manually fire an intersection entry:\n * @param resizeObserverMock - configuration object\n * @returns Mocked ResizeObserver\n * @example\n * ```\n * let fireRo;\n * setupResizeObserverMock({\n * observe: function () {\n * fireRo = this.cb;\n * },\n * });\n * ...\n * fireRo([{\n * borderBoxSize: ResizeObserverSize[],\n * contentBoxSize: ResizeObserverSize[],\n * contentRect: DOMRectReadOnly,\n * devicePixelContentBoxSize: ResizeObserverSize[],\n * target: yourMockElemenet\n * }]);;\n * ```\n /\nexport const setupResizeObserverMock = ({ disconnect, observe }: setupResizeObserverMockParams): typeof ResizeObserver => {\n class MockResizeObserver implements ResizeObserver {\n disconnect: () => void = disconnect;\n observe: (target: Element, options?: ResizeObserverOptions) => void = observe;\n unobserve: () => void;\n cb: () => unknown;\n constructor(fn) {\n this.cb = fn;\n }\n }\n\n [window, global].forEach(element => {\n Object.defineProperty(element, 'ResizeObserver', {\n writable: true,\n configurable: true,\n value: MockResizeObserver,\n });\n });\n\n return MockResizeObserver;\n};\n\n/\n Utility function that mocks the `SubmitEvent` API. Recommended to execute inside `beforeEach`.\n * @example\n * ```\n * setupSubmitEventMock();\n * ```\n * @returns custom event mock\n /\nexport const setupSubmitEventMock = (): typeof MockCustomEvent => {\n class SubmitEvent extends MockCustomEvent {}\n\n [window, global].forEach(element => {\n Object.defineProperty(element, 'SubmitEvent', {\n writable: true,\n configurable: true,\n value: SubmitEvent,\n });\n });\n\n return SubmitEvent;\n};\n\n/\n force popover id when component use randomed identifier\n * @param component - element wich include mg-popover\n * @param id - new fixed id\n * @param interactiveElement - element where attribute 'aria-controls' is set\n /\nexport const forcePopoverId = (component: Element, id: string, interactiveElement = 'button'): void => {\n const popover = component.shadowRoot.querySelector('mg-popover');\n if (popover !== null) {\n popover.querySelector('mg-popover-content').setAttribute('id', id);\n component.shadowRoot.querySelector(interactiveElement).setAttribute('aria-controls', id);\n }\n};\n\n/\n fix popper console.error in test\n * it is generated in `@popperjs/core/dist/cjs/popper.js l.1859`\n * this is due to internal function isHTMLElement(), so we can not mock it directly.\n * this function check if test DOM element mockHTMLElement instance is 'instanceof HTMLElement'\n * so we only override the console.error side effect for this error\n /\nexport const mockConsoleError = (): void => {\n const errorFunction = console.error;\n const mock = jest.spyOn(console, 'error');\n mock.mockImplementation(error => {\n if (!error.includes('Popper')) errorFunction(error);\n });\n};\n\n/\n Add missing window.frames property to test context\n * usefull for component with iframe listeners, ex: mg-popover\n */\nexport const mockWindowFrames = (): void => {\n Object.defineProperty(window, 'frames', {\n value: { length: 0 },\n });\n};\n"]}
1	+ {"version":3,"file":"unit.test.utils.js","sourceRoot":"","sources":["../../src/utils/unit.test.utils.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAkB,EAAE,EAAU,EAAE,kBAAkB,GAAG,QAAQ,EAAQ,EAAE;IACpG,MAAM,OAAO,GAAG,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IACjE,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;QACrB,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACnE,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,YAAY,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;IAC3F,CAAC;AACH,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAS,EAAE;IACzC,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,QAAQ,EAAE;QACtC,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;KACrB,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["/*\n force popover id when component use randomed identifier\n * @param component - element wich include mg-popover\n * @param id - new fixed id\n * @param interactiveElement - element where attribute 'aria-controls' is set\n /\nexport const forcePopoverId = (component: Element, id: string, interactiveElement = 'button'): void => {\n const popover = component.shadowRoot.querySelector('mg-popover');\n if (popover !== null) {\n popover.querySelector('mg-popover-content').setAttribute('id', id);\n component.shadowRoot.querySelector(interactiveElement).setAttribute('aria-controls', id);\n }\n};\n\n/\n Add missing window.frames property to test context\n * usefull for component with iframe listeners, ex: mg-popover\n */\nexport const mockWindowFrames = (): void => {\n Object.defineProperty(window, 'frames', {\n value: { length: 0 },\n });\n};\n"]}

package/dist/components/MgInput.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h } from '@stencil/core/internal/client';
-import { i as isValidString } from './components.utils.js';
+import { H as He } from './index.es.js';
 /**
  * Possible input width
@@ -67,10 +67,10 @@ const MgInput = (props, children, utils) => {
     /**
      * Check required properties
      */
-    if (!isValidString(props.identifier)) {
+    if (!He(props.identifier)) {
         throw new Error('<mg-input> prop "identifier" is required.');
     }
-    if (!isValidString(props.label)) {
+    if (!He(props.label)) {
         throw new Error('<mg-input> prop "label" is required.');
     }
     if (props.labelOnTop && props.labelHide) {