@mgdis/mg-components 6.9.0 → 6.10.1
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.
- package/dist/cjs/events.utils-D5SAtkpQ.js +28 -0
- package/dist/cjs/events.utils-D5SAtkpQ.js.map +1 -0
- package/dist/cjs/index-CATFkm3O.js +4 -0
- package/dist/cjs/{index-CTU2m-sy.js → index-CL_COdxv.js} +20 -6
- package/dist/cjs/{index-CTU2m-sy.js.map → index-CL_COdxv.js.map} +1 -1
- package/dist/cjs/index.es-DaPqByCe.js +250 -0
- package/dist/cjs/index.es-DaPqByCe.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mg-action-more_37.cjs.entry.js +1929 -1913
- package/dist/cjs/mg-action-more_37.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-alert.cjs.entry.js +7 -7
- package/dist/cjs/mg-components.cjs.js +1 -1
- package/dist/cjs/mg-input-combobox.cjs.entry.js +774 -0
- package/dist/cjs/mg-input-combobox.cjs.entry.js.map +1 -0
- package/dist/cjs/mg-input-combobox.entry.cjs.js.map +1 -0
- package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +16 -14
- package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-input-rich-text-editor.entry.cjs.js.map +1 -1
- package/dist/cjs/mg-loader.cjs.entry.js +5 -5
- package/dist/cjs/mg-progress.cjs.entry.js +11 -11
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/atoms/mg-button/mg-button.js +3 -2
- package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.conf.js +0 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +38 -68
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.conf.js +2 -0
- package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.conf.js.map +1 -0
- package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.js +1443 -0
- package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.js.map +1 -0
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +2 -2
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/editor.scss +1 -0
- package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js +3 -3
- package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +1 -1
- package/dist/collection/components/molecules/menus/mg-menu/mg-menu.js +2 -2
- package/dist/collection/components/molecules/menus/mg-menu/mg-menu.js.map +1 -1
- package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.js +3 -3
- package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.js.map +1 -1
- package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +2 -2
- package/dist/collection/components/molecules/mg-action-more/mg-action-more.js.map +1 -1
- package/dist/collection/components/molecules/mg-alert/mg-alert.js +1 -1
- package/dist/collection/components/molecules/mg-details/mg-details.js +1 -1
- package/dist/collection/components/molecules/mg-form/mg-form.js +1 -1
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +1 -1
- package/dist/collection/components/molecules/mg-loader/mg-loader.js +1 -1
- package/dist/collection/components/molecules/mg-message/mg-message.js +2 -2
- package/dist/collection/components/molecules/mg-modal/mg-modal.js +2 -2
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +3 -3
- package/dist/collection/components/molecules/mg-panel/mg-panel.js +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.js +53 -129
- package/dist/collection/components/molecules/mg-popover/mg-popover.js.map +1 -1
- package/dist/collection/components/molecules/mg-progress/mg-progress.js +1 -1
- package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +1 -1
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +6 -5
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.js.map +1 -1
- package/dist/collection/locales/en/messages.json +8 -1
- package/dist/collection/locales/fr/messages.json +8 -1
- package/dist/collection/utils/behaviors.utils.js +3 -3
- package/dist/collection/utils/behaviors.utils.js.map +1 -1
- package/dist/collection/utils/events.utils.js +22 -0
- package/dist/collection/utils/events.utils.js.map +1 -0
- package/dist/components/events.utils.js +26 -0
- package/dist/components/events.utils.js.map +1 -0
- package/dist/components/index.es.js +129 -36
- package/dist/components/index.es.js.map +1 -1
- package/dist/components/index2.js +18 -4
- package/dist/components/index2.js.map +1 -1
- package/dist/components/mg-action-more.js +8 -8
- package/dist/components/mg-action-more.js.map +1 -1
- package/dist/components/mg-alert.js +6 -6
- package/dist/components/mg-badge2.js +6 -6
- package/dist/components/mg-button2.js +9 -8
- package/dist/components/mg-button2.js.map +1 -1
- package/dist/components/mg-character-left2.js +4 -4
- package/dist/components/mg-details.js +4 -4
- package/dist/components/mg-details.js.map +1 -1
- package/dist/components/mg-form.js +8 -8
- package/dist/components/mg-icon2.js +6 -6
- package/dist/components/mg-illustrated-message.js +6 -6
- package/dist/components/mg-input-checkbox.js +9 -9
- package/dist/components/mg-input-combobox.d.ts +11 -0
- package/dist/components/mg-input-combobox.js +897 -0
- package/dist/components/mg-input-combobox.js.map +1 -0
- package/dist/components/mg-input-date.js +18 -18
- package/dist/components/mg-input-date.js.map +1 -1
- package/dist/components/mg-input-numeric.js +16 -16
- package/dist/components/mg-input-numeric.js.map +1 -1
- package/dist/components/mg-input-password.js +5 -5
- package/dist/components/mg-input-password.js.map +1 -1
- package/dist/components/mg-input-radio.js +8 -8
- package/dist/components/mg-input-rich-text-editor.js +15 -13
- package/dist/components/mg-input-rich-text-editor.js.map +1 -1
- package/dist/components/mg-input-select2.js +9 -9
- package/dist/components/mg-input-select2.js.map +1 -1
- package/dist/components/mg-input-text2.js +11 -11
- package/dist/components/mg-input-text2.js.map +1 -1
- package/dist/components/mg-input-textarea.js +9 -9
- package/dist/components/mg-input-textarea.js.map +1 -1
- package/dist/components/mg-input-title2.js +4 -4
- package/dist/components/mg-input-toggle.js +7 -7
- package/dist/components/mg-input2.js +8 -8
- package/dist/components/mg-item-more2.js +12 -12
- package/dist/components/mg-item-more2.js.map +1 -1
- package/dist/components/mg-loader.js +1 -70
- package/dist/components/mg-loader.js.map +1 -1
- package/dist/components/mg-loader2.js +75 -0
- package/dist/components/mg-loader2.js.map +1 -0
- package/dist/components/mg-menu-item2.js +13 -13
- package/dist/components/mg-menu-item2.js.map +1 -1
- package/dist/components/mg-message2.js +6 -6
- package/dist/components/mg-modal.js +10 -10
- package/dist/components/mg-pagination2.js +9 -9
- package/dist/components/mg-panel.js +10 -10
- package/dist/components/mg-popover-content2.js +5 -5
- package/dist/components/mg-popover-content2.js.map +1 -1
- package/dist/components/mg-popover2.js +54 -128
- package/dist/components/mg-popover2.js.map +1 -1
- package/dist/components/mg-progress.js +11 -11
- package/dist/components/mg-skip-links.js +3 -3
- package/dist/components/mg-table.js +6 -6
- package/dist/components/mg-tabs.js +18 -17
- package/dist/components/mg-tabs.js.map +1 -1
- package/dist/components/mg-tag.js +4 -4
- package/dist/components/mg-tooltip-content2.js +1 -1
- package/dist/components/mg-tooltip-content2.js.map +1 -1
- package/dist/components/mg-tooltip2.js +42 -71
- package/dist/components/mg-tooltip2.js.map +1 -1
- package/dist/components/popper.js +1793 -0
- package/dist/components/popper.js.map +1 -0
- package/dist/esm/events.utils-yMGqY8YG.js +26 -0
- package/dist/esm/events.utils-yMGqY8YG.js.map +1 -0
- package/dist/esm/index-CAuxALt5.js +4 -0
- package/dist/esm/{index-SQlkEaXW.js → index-DALWFL9i.js} +20 -6
- package/dist/esm/{index-SQlkEaXW.js.map → index-DALWFL9i.js.map} +1 -1
- package/dist/esm/index.es-hNwGkhG6.js +223 -0
- package/dist/esm/index.es-hNwGkhG6.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mg-action-more_37.entry.js +1930 -1914
- package/dist/esm/mg-action-more_37.entry.js.map +1 -1
- package/dist/esm/mg-alert.entry.js +7 -7
- package/dist/esm/mg-components.js +1 -1
- package/dist/esm/mg-input-combobox.entry.js +772 -0
- package/dist/esm/mg-input-combobox.entry.js.map +1 -0
- package/dist/esm/mg-input-rich-text-editor.entry.js +17 -15
- package/dist/esm/mg-input-rich-text-editor.entry.js.map +1 -1
- package/dist/esm/{mg-input.conf-BtkqaBXm.js → mg-input.conf-CNgv8hc5.js} +3 -3
- package/dist/esm/{mg-input.conf-BtkqaBXm.js.map → mg-input.conf-CNgv8hc5.js.map} +1 -1
- package/dist/esm/mg-loader.entry.js +5 -5
- package/dist/esm/mg-progress.entry.js +11 -11
- package/dist/mg-components/locales/en/messages.json +8 -1
- package/dist/mg-components/locales/fr/messages.json +8 -1
- package/dist/mg-components/mg-components.esm.js +1 -1
- package/dist/mg-components/mg-input-combobox.entry.esm.js.map +1 -0
- package/dist/mg-components/mg-input-rich-text-editor.entry.esm.js.map +1 -1
- package/dist/mg-components/p-352cfc01.entry.js +2 -0
- package/dist/mg-components/{p-680948e3.entry.js.map → p-352cfc01.entry.js.map} +1 -1
- package/dist/mg-components/p-68f7de47.entry.js +2 -0
- package/dist/mg-components/p-68f7de47.entry.js.map +1 -0
- package/dist/mg-components/p-CNgv8hc5.js +2 -0
- package/dist/mg-components/{p-BtkqaBXm.js.map → p-CNgv8hc5.js.map} +1 -1
- package/dist/mg-components/p-Cg3R_y_o.js +2 -0
- package/dist/mg-components/{p-CqGbLOnN.js.map → p-Cg3R_y_o.js.map} +1 -1
- package/dist/mg-components/p-a52a168c.entry.js +2 -0
- package/dist/mg-components/{p-9acc6504.entry.js.map → p-a52a168c.entry.js.map} +1 -1
- package/dist/mg-components/{p-583b3769.entry.js → p-bf5de898.entry.js} +2 -2
- package/dist/mg-components/p-dcefa0b0.entry.js +2 -0
- package/dist/mg-components/p-dcefa0b0.entry.js.map +1 -0
- package/dist/mg-components/{p-650d6986.entry.js → p-e33557f9.entry.js} +3 -3
- package/dist/mg-components/p-e33557f9.entry.js.map +1 -0
- package/dist/mg-components/p-hNwGkhG6.js +2 -0
- package/dist/mg-components/p-hNwGkhG6.js.map +1 -0
- package/dist/mg-components/p-yMGqY8YG.js +2 -0
- package/dist/mg-components/p-yMGqY8YG.js.map +1 -0
- package/dist/types/components/atoms/mg-tooltip/mg-tooltip.conf.d.ts +0 -6
- package/dist/types/components/atoms/mg-tooltip/mg-tooltip.d.ts +6 -7
- package/dist/types/components/molecules/inputs/mg-input-combobox/mg-input-combobox.conf.d.ts +24 -0
- package/dist/types/components/molecules/inputs/mg-input-combobox/mg-input-combobox.d.ts +340 -0
- package/dist/types/components/molecules/mg-popover/mg-popover.d.ts +9 -27
- package/dist/types/components.d.ts +253 -10
- package/dist/types/utils/events.utils.d.ts +4 -0
- package/ide/intellij/web-types.json +400 -1
- package/ide/vscode/html-custom-data.json +332 -0
- package/package.json +15 -15
- package/dist/cjs/index.es-jXqiN1uw.js +0 -152
- package/dist/cjs/index.es-jXqiN1uw.js.map +0 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.conf.js +0 -2
- package/dist/collection/components/molecules/mg-popover/mg-popover.conf.js.map +0 -1
- package/dist/collection/utils/floating-ui.utils.js +0 -30
- package/dist/collection/utils/floating-ui.utils.js.map +0 -1
- package/dist/components/floating-ui.utils.js +0 -1677
- package/dist/components/floating-ui.utils.js.map +0 -1
- package/dist/esm/index.es-DDBtzymI.js +0 -130
- package/dist/esm/index.es-DDBtzymI.js.map +0 -1
- package/dist/mg-components/p-650d6986.entry.js.map +0 -1
- package/dist/mg-components/p-680948e3.entry.js +0 -2
- package/dist/mg-components/p-9acc6504.entry.js +0 -2
- package/dist/mg-components/p-BtkqaBXm.js +0 -2
- package/dist/mg-components/p-CqGbLOnN.js +0 -2
- package/dist/mg-components/p-DDBtzymI.js +0 -2
- package/dist/mg-components/p-DDBtzymI.js.map +0 -1
- package/dist/mg-components/p-c0fb6f62.entry.js +0 -2
- package/dist/mg-components/p-c0fb6f62.entry.js.map +0 -1
- package/dist/types/components/molecules/mg-popover/mg-popover.conf.d.ts +0 -6
- package/dist/types/utils/floating-ui.utils.d.ts +0 -20
- /package/dist/mg-components/{p-583b3769.entry.js.map → p-bf5de898.entry.js.map} +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { H as Ht, q as qe, X as Xt } from './index.es.js';
|
|
3
3
|
import { d as defineCustomElement$5, c as classReadonly, a as classDisabled, w as widths } from './mg-input2.js';
|
|
4
4
|
import { i as initLocales } from './index2.js';
|
|
5
5
|
import { d as defineCustomElement$7 } from './mg-character-left2.js';
|
|
@@ -8,7 +8,7 @@ import { d as defineCustomElement$4 } from './mg-input-title2.js';
|
|
|
8
8
|
import { d as defineCustomElement$3 } from './mg-tooltip2.js';
|
|
9
9
|
import { d as defineCustomElement$2 } from './mg-tooltip-content2.js';
|
|
10
10
|
|
|
11
|
-
const mgInputTextareaCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}";
|
|
11
|
+
const mgInputTextareaCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}";
|
|
12
12
|
|
|
13
13
|
const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea extends HTMLElement {
|
|
14
14
|
constructor() {
|
|
@@ -77,7 +77,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
77
77
|
/**
|
|
78
78
|
* Component classes
|
|
79
79
|
*/
|
|
80
|
-
this.classCollection = new
|
|
80
|
+
this.classCollection = new Ht(['mg-c-input--textarea']);
|
|
81
81
|
/**
|
|
82
82
|
* Handle input event
|
|
83
83
|
*/
|
|
@@ -93,7 +93,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
93
93
|
*/
|
|
94
94
|
this.handleFocus = () => {
|
|
95
95
|
this.classCollection.add(this.classFocus);
|
|
96
|
-
this.classCollection = new
|
|
96
|
+
this.classCollection = new Ht(this.classCollection.classes);
|
|
97
97
|
};
|
|
98
98
|
/**
|
|
99
99
|
* Handle blur event
|
|
@@ -101,7 +101,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
101
101
|
this.handleBlur = () => {
|
|
102
102
|
// Manage focus
|
|
103
103
|
this.classCollection.delete(this.classFocus);
|
|
104
|
-
this.classCollection = new
|
|
104
|
+
this.classCollection = new Ht(this.classCollection.classes);
|
|
105
105
|
// Display Error
|
|
106
106
|
this.handlerInProgress = 'blur';
|
|
107
107
|
this.displayError().finally(() => {
|
|
@@ -179,8 +179,8 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
179
179
|
this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
|
|
180
180
|
}
|
|
181
181
|
validatePattern(newValue) {
|
|
182
|
-
if (newValue !== undefined && !(
|
|
183
|
-
throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${
|
|
182
|
+
if (newValue !== undefined && !(qe(this.pattern) && qe(this.patternErrorMessage))) {
|
|
183
|
+
throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${Xt(this.pattern)}'" and "patternErrorMessage='${Xt(this.patternErrorMessage)}'".`);
|
|
184
184
|
}
|
|
185
185
|
}
|
|
186
186
|
validatecharacterLeftHide(newValue) {
|
|
@@ -222,7 +222,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
222
222
|
if (typeof valid !== 'boolean') {
|
|
223
223
|
throw new Error('<mg-input-textarea> method "setError()" param "valid" must be a boolean.');
|
|
224
224
|
}
|
|
225
|
-
else if (!
|
|
225
|
+
else if (!qe(errorMessage)) {
|
|
226
226
|
throw new Error('<mg-input-textarea> method "setError()" param "errorMessage" must be a string.');
|
|
227
227
|
}
|
|
228
228
|
else {
|
|
@@ -284,7 +284,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class MgInputTextarea
|
|
|
284
284
|
* @returns HTML Element
|
|
285
285
|
*/
|
|
286
286
|
render() {
|
|
287
|
-
return (h("mg-input", { key: '
|
|
287
|
+
return (h("mg-input", { key: '6ae7c6f9cfce48886d68e079ed6ac7e5b6e52eb4', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, this.value)) : (h("div", { class: "mg-c-input__with-character-left" }, h("textarea", { class: {
|
|
288
288
|
'mg-c-input__box': true,
|
|
289
289
|
'mg-c-input__box--width': true,
|
|
290
290
|
'mg-c-input__box--resizable': this.resizable === 'both',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"mg-input-textarea.js","mappings":"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","names":["MgInputTextarea","__stencil_proxyCustomElement","ClassList","isValidString","toString"],"sources":["../styles/dist/components/mg-input-textarea.css?tag=mg-input-textarea&encapsulation=shadow","src/components/molecules/inputs/mg-input-textarea/mg-input-textarea.tsx"],"sourcesContent":[".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}/*# sourceMappingURL=mg-input-textarea.css.map */\n","import { Component, Element, Event, h, Prop, EventEmitter, State, Method, Watch } from '@stencil/core';\nimport { ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\nimport { type TooltipPosition, type Width, type EventType, widths, classReadonly, classDisabled } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales';\n\n@Component({\n tag: 'mg-input-textarea',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-textarea.css',\n shadow: true,\n})\nexport class MgInputTextarea {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classFocus = 'mg-u-is-focused';\n private readonly classDisplayCharacterLeft = 'mg-c-input--display-character-left';\n\n // IDs\n private characterLeftId;\n\n // HTML selector\n private input: HTMLTextAreaElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputTextareaElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: string;\n @Watch('value')\n handleValue(newValue: string): void {\n this.checkValidity();\n this.valueChange.emit(newValue);\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop = false;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Input max length\n */\n @Prop() maxlength = 4000;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputTextarea['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n validateDisabled(newValue: MgInputTextarea['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth: Width = 'full';\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputTextarea['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Define input pattern to validate\n * Please refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n */\n @Prop() pattern?: string;\n\n /**\n * Define input pattern error message\n */\n @Prop() patternErrorMessage?: string;\n @Watch('pattern')\n @Watch('patternErrorMessage')\n validatePattern(newValue: string): void {\n if (newValue !== undefined && !(isValidString(this.pattern) && isValidString(this.patternErrorMessage))) {\n throw new Error(\n `<mg-input-textarea> props \"pattern\" and \"patternErrorMessage\" must be non-empty string and paired. Passed value: \"pattern='${toString(this.pattern)}'\" and \"patternErrorMessage='${toString(this.patternErrorMessage)}'\".`,\n );\n }\n }\n\n /**\n * Define the number of visible text lines for the control\n */\n @Prop() rows = 3;\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Define if component should display character left\n */\n @Prop() characterLeftHide = false;\n @Watch('characterLeftHide')\n validatecharacterLeftHide(newValue: boolean): void {\n if (newValue) {\n this.classCollection.delete(this.classDisplayCharacterLeft);\n } else {\n this.classCollection.add(this.classDisplayCharacterLeft);\n }\n }\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText?: string;\n\n /**\n * Define if input is resizable\n */\n @Prop() resizable: 'none' | 'both' | 'horizontal' | 'vertical' = 'none';\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--textarea']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<HTMLMgInputTextareaElement['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputTextareaElement['valid']>;\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputTextarea['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-textarea> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-textarea> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputTextarea['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n if (this.hasDisplayedError) {\n this.checkValidity();\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.classCollection.add(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Manage focus\n this.classCollection.delete(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n });\n };\n\n /**\n * Get pattern validity\n * Pattern is not defined on textarea field: https://developer.mozilla.org/fr/docs/Web/HTML/Element/Textarea\n * @returns is pattern valid\n */\n private getPatternValidity = (): boolean => this.pattern === undefined || new RegExp(`^${this.pattern}$`, 'u').test(this.value);\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || (this.input.checkValidity() && this.getPatternValidity()));\n };\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n // Does not match pattern\n if (!this.valid) {\n if (errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n } else if (!this.getPatternValidity()) {\n this.errorMessage = this.patternErrorMessage;\n }\n // required\n else if (this.input.validity.valueMissing) {\n this.errorMessage = this.messages.errors.required;\n }\n }\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n this.characterLeftId = `${this.identifier}-character-left`;\n // Validate\n this.validatecharacterLeftHide(this.characterLeftHide);\n this.validatePattern(this.pattern);\n this.validatePattern(this.patternErrorMessage);\n this.watchMgWidth(this.mgWidth);\n this.watchReadonly(this.readonly);\n this.validateDisabled(this.disabled);\n\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[this.characterLeftId]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.helpText}\n errorMessage={this.errorMessage}\n >\n {this.readonly ? (\n this.value && <b class=\"mg-c-input__readonly-value\">{this.value}</b>\n ) : (\n <div class=\"mg-c-input__with-character-left\">\n <textarea\n class={{\n 'mg-c-input__box': true,\n 'mg-c-input__box--width': true,\n 'mg-c-input__box--resizable': this.resizable === 'both',\n 'mg-c-input__box--resizable-horizontal': this.resizable === 'horizontal',\n 'mg-c-input__box--resizable-vertical': this.resizable === 'vertical',\n }}\n value={this.value}\n id={this.identifier}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n rows={this.rows}\n maxlength={this.maxlength}\n disabled={this.disabled}\n required={this.required}\n aria-invalid={(this.invalid === true).toString()}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLTextAreaElement) => {\n if (el !== null) this.input = el;\n }}\n ></textarea>\n {!this.characterLeftHide && this.maxlength > 0 && (\n <mg-character-left identifier={this.characterLeftId} characters={this.value} maxlength={this.maxlength}></mg-character-left>\n )}\n </div>\n )}\n </mg-input>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"mg-input-textarea.js","mappings":"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","names":["MgInputTextarea","__stencil_proxyCustomElement","ClassList","isValidString","toString"],"sources":["../styles/dist/components/mg-input-textarea.css?tag=mg-input-textarea&encapsulation=shadow","src/components/molecules/inputs/mg-input-textarea/mg-input-textarea.tsx"],"sourcesContent":[".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}/*# sourceMappingURL=mg-input-textarea.css.map */\n","import { Component, Element, Event, h, Prop, EventEmitter, State, Method, Watch } from '@stencil/core';\nimport { ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\nimport { type TooltipPosition, type Width, type EventType, widths, classReadonly, classDisabled } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales';\n\n@Component({\n tag: 'mg-input-textarea',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-textarea.css',\n shadow: true,\n})\nexport class MgInputTextarea {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classFocus = 'mg-u-is-focused';\n private readonly classDisplayCharacterLeft = 'mg-c-input--display-character-left';\n\n // IDs\n private characterLeftId;\n\n // HTML selector\n private input: HTMLTextAreaElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputTextareaElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: string;\n @Watch('value')\n handleValue(newValue: string): void {\n this.checkValidity();\n this.valueChange.emit(newValue);\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop = false;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Input max length\n */\n @Prop() maxlength = 4000;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputTextarea['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n validateDisabled(newValue: MgInputTextarea['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth: Width = 'full';\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputTextarea['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Define input pattern to validate\n * Please refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n */\n @Prop() pattern?: string;\n\n /**\n * Define input pattern error message\n */\n @Prop() patternErrorMessage?: string;\n @Watch('pattern')\n @Watch('patternErrorMessage')\n validatePattern(newValue: string): void {\n if (newValue !== undefined && !(isValidString(this.pattern) && isValidString(this.patternErrorMessage))) {\n throw new Error(\n `<mg-input-textarea> props \"pattern\" and \"patternErrorMessage\" must be non-empty string and paired. Passed value: \"pattern='${toString(this.pattern)}'\" and \"patternErrorMessage='${toString(this.patternErrorMessage)}'\".`,\n );\n }\n }\n\n /**\n * Define the number of visible text lines for the control\n */\n @Prop() rows = 3;\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Define if component should display character left\n */\n @Prop() characterLeftHide = false;\n @Watch('characterLeftHide')\n validatecharacterLeftHide(newValue: boolean): void {\n if (newValue) {\n this.classCollection.delete(this.classDisplayCharacterLeft);\n } else {\n this.classCollection.add(this.classDisplayCharacterLeft);\n }\n }\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText?: string;\n\n /**\n * Define if input is resizable\n */\n @Prop() resizable: 'none' | 'both' | 'horizontal' | 'vertical' = 'none';\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--textarea']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<HTMLMgInputTextareaElement['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputTextareaElement['valid']>;\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputTextarea['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-textarea> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-textarea> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputTextarea['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n if (this.hasDisplayedError) {\n this.checkValidity();\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.classCollection.add(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Manage focus\n this.classCollection.delete(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n });\n };\n\n /**\n * Get pattern validity\n * Pattern is not defined on textarea field: https://developer.mozilla.org/fr/docs/Web/HTML/Element/Textarea\n * @returns is pattern valid\n */\n private getPatternValidity = (): boolean => this.pattern === undefined || new RegExp(`^${this.pattern}$`, 'u').test(this.value);\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || (this.input.checkValidity() && this.getPatternValidity()));\n };\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n // Does not match pattern\n if (!this.valid) {\n if (errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n } else if (!this.getPatternValidity()) {\n this.errorMessage = this.patternErrorMessage;\n }\n // required\n else if (this.input.validity.valueMissing) {\n this.errorMessage = this.messages.errors.required;\n }\n }\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n this.characterLeftId = `${this.identifier}-character-left`;\n // Validate\n this.validatecharacterLeftHide(this.characterLeftHide);\n this.validatePattern(this.pattern);\n this.validatePattern(this.patternErrorMessage);\n this.watchMgWidth(this.mgWidth);\n this.watchReadonly(this.readonly);\n this.validateDisabled(this.disabled);\n\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[this.characterLeftId]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.helpText}\n errorMessage={this.errorMessage}\n >\n {this.readonly ? (\n this.value && <b class=\"mg-c-input__readonly-value\">{this.value}</b>\n ) : (\n <div class=\"mg-c-input__with-character-left\">\n <textarea\n class={{\n 'mg-c-input__box': true,\n 'mg-c-input__box--width': true,\n 'mg-c-input__box--resizable': this.resizable === 'both',\n 'mg-c-input__box--resizable-horizontal': this.resizable === 'horizontal',\n 'mg-c-input__box--resizable-vertical': this.resizable === 'vertical',\n }}\n value={this.value}\n id={this.identifier}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n rows={this.rows}\n maxlength={this.maxlength}\n disabled={this.disabled}\n required={this.required}\n aria-invalid={(this.invalid === true).toString()}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLTextAreaElement) => {\n if (el !== null) this.input = el;\n }}\n ></textarea>\n {!this.characterLeftHide && this.maxlength > 0 && (\n <mg-character-left identifier={this.characterLeftId} characters={this.value} maxlength={this.maxlength}></mg-character-left>\n )}\n </div>\n )}\n </mg-input>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { q as qe, D as Dt, X as Xt } from './index.es.js';
|
|
3
3
|
|
|
4
4
|
const mgInputTitleCss = ".mg-u-form-legacy.sc-mg-input-title{--mg-c-form-inputs-title-width:calc(100% / 3 - 20px)}.mg-u-is-asterisk.sc-mg-input-title{color:var(--mg-b-color-danger)}legend.mg-c-input-title.sc-mg-input-title{padding-right:0;padding-left:0}.mg-c-input-title__required.sc-mg-input-title{display:var(--mg-c-input-title-display, unset)}";
|
|
5
5
|
|
|
@@ -17,11 +17,11 @@ const MgInputTitle = /*@__PURE__*/ proxyCustomElement(class MgInputTitle extends
|
|
|
17
17
|
this.tagName = 'label';
|
|
18
18
|
}
|
|
19
19
|
validateIdentifier(newValue) {
|
|
20
|
-
if (!
|
|
20
|
+
if (!qe(newValue)) {
|
|
21
21
|
throw new Error('<mg-input-title> prop "identifier" is required.');
|
|
22
22
|
}
|
|
23
|
-
else if (!
|
|
24
|
-
console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${
|
|
23
|
+
else if (!Dt(newValue)) {
|
|
24
|
+
console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${Xt(newValue)}.`);
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
validateIsLegend(newValue) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { H as Ht, X as Xt, a as qt, q as qe } from './index.es.js';
|
|
3
3
|
import { d as defineCustomElement$5, c as classReadonly, a as classDisabled } from './mg-input2.js';
|
|
4
4
|
import { d as defineCustomElement$6 } from './mg-icon2.js';
|
|
5
5
|
import { d as defineCustomElement$4 } from './mg-input-title2.js';
|
|
@@ -64,7 +64,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class MgInputToggle ext
|
|
|
64
64
|
/**
|
|
65
65
|
* Component classes
|
|
66
66
|
*/
|
|
67
|
-
this.classCollection = new
|
|
67
|
+
this.classCollection = new Ht(['mg-c-input--toggle']);
|
|
68
68
|
/**
|
|
69
69
|
* Checked internal value
|
|
70
70
|
*/
|
|
@@ -125,10 +125,10 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class MgInputToggle ext
|
|
|
125
125
|
}
|
|
126
126
|
validateItems(newValue) {
|
|
127
127
|
if (typeof newValue === 'object' && this.items.length !== 2) {
|
|
128
|
-
throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${
|
|
128
|
+
throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${Xt(newValue)}.`);
|
|
129
129
|
}
|
|
130
130
|
// String array
|
|
131
|
-
else if (
|
|
131
|
+
else if (qt(newValue)) {
|
|
132
132
|
this.options = newValue.map(item => ({ title: item, value: item }));
|
|
133
133
|
}
|
|
134
134
|
// Object array
|
|
@@ -136,7 +136,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class MgInputToggle ext
|
|
|
136
136
|
this.options = newValue;
|
|
137
137
|
}
|
|
138
138
|
else {
|
|
139
|
-
throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${
|
|
139
|
+
throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${Xt(newValue)}.`);
|
|
140
140
|
}
|
|
141
141
|
}
|
|
142
142
|
watchIsOnOff(newValue) {
|
|
@@ -184,7 +184,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class MgInputToggle ext
|
|
|
184
184
|
if (typeof valid !== 'boolean') {
|
|
185
185
|
throw new Error('<mg-input-toggle> method "setError()" param "valid" must be a boolean.');
|
|
186
186
|
}
|
|
187
|
-
else if (!
|
|
187
|
+
else if (!qe(errorMessage)) {
|
|
188
188
|
throw new Error('<mg-input-toggle> method "setError()" param "errorMessage" must be a string.');
|
|
189
189
|
}
|
|
190
190
|
else {
|
|
@@ -251,7 +251,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class MgInputToggle ext
|
|
|
251
251
|
*/
|
|
252
252
|
render() {
|
|
253
253
|
const checkedItem = this.getCheckedItem(this.checked);
|
|
254
|
-
return (h("mg-input", { key: '
|
|
254
|
+
return (h("mg-input", { key: '3886ea7cfdb32db9bbc2b7d38760c91aac30c004', label: this.label, helpText: this.helpText, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: undefined, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, errorMessage: this.errorMessage }, this.readonly ? (checkedItem && h("b", { class: "mg-c-input__readonly-value" }, checkedItem.title)) : (h("button", { type: "button", role: "switch", "aria-checked": this.checked.toString(), "aria-readonly": this.disabled || this.readonly, id: this.identifier, class: "mg-c-input__button-toggle", disabled: this.disabled || this.readonly, onClick: this.toggleChecked }, h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-1" })), h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-2" }))))));
|
|
255
255
|
}
|
|
256
256
|
get element() { return this; }
|
|
257
257
|
static get watchers() { return {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { q as qe, X as Xt, D as Dt } from './index.es.js';
|
|
3
3
|
import { d as defineCustomElement$4 } from './mg-icon2.js';
|
|
4
4
|
import { d as defineCustomElement$3 } from './mg-input-title2.js';
|
|
5
5
|
import { d as defineCustomElement$2 } from './mg-tooltip2.js';
|
|
@@ -71,11 +71,11 @@ const MgInput = /*@__PURE__*/ proxyCustomElement(class MgInput extends HTMLEleme
|
|
|
71
71
|
this.renderTooltip = () => (h("mg-tooltip", { identifier: `${this.identifier}-tooltip`, message: this.tooltip }, h("mg-icon", { icon: "info-circle" })));
|
|
72
72
|
}
|
|
73
73
|
watchIdentifier(newValue) {
|
|
74
|
-
if (!
|
|
75
|
-
throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${
|
|
74
|
+
if (!qe(newValue)) {
|
|
75
|
+
throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${Xt(newValue)}.`);
|
|
76
76
|
}
|
|
77
|
-
else if (!
|
|
78
|
-
console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${
|
|
77
|
+
else if (!Dt(newValue)) {
|
|
78
|
+
console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${Xt(newValue)}.`);
|
|
79
79
|
}
|
|
80
80
|
else {
|
|
81
81
|
this.helpTextId = `${this.identifier}-help-text`;
|
|
@@ -97,7 +97,7 @@ const MgInput = /*@__PURE__*/ proxyCustomElement(class MgInput extends HTMLEleme
|
|
|
97
97
|
}
|
|
98
98
|
watchTooltipPosition(newValue) {
|
|
99
99
|
if (!tooltipPositions.includes(newValue)) {
|
|
100
|
-
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${
|
|
100
|
+
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${Xt(newValue)}.`);
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
103
|
watchErrorMessage(newValue) {
|
|
@@ -166,8 +166,8 @@ const MgInput = /*@__PURE__*/ proxyCustomElement(class MgInput extends HTMLEleme
|
|
|
166
166
|
*/
|
|
167
167
|
// eslint-disable-next-line @stencil-community/no-unused-watch
|
|
168
168
|
watchLabel() {
|
|
169
|
-
if (!
|
|
170
|
-
throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${
|
|
169
|
+
if (!qe(this.label)) {
|
|
170
|
+
throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${Xt(this.label)}.`);
|
|
171
171
|
}
|
|
172
172
|
else {
|
|
173
173
|
this.watchAriaDescribedbyIDs();
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { X as Xt } from './index.es.js';
|
|
3
3
|
import { d as defineCustomElement$4, a as directions, s as sizes } from './mg-menu-item2.js';
|
|
4
4
|
import { i as initLocales } from './index2.js';
|
|
5
5
|
import { d as defineCustomElement$8 } from './mg-badge2.js';
|
|
@@ -67,8 +67,8 @@ class OverflowBehavior {
|
|
|
67
67
|
else if (!this.isMoreElement(item) && item.parentElement !== this.parentElement)
|
|
68
68
|
this.parentElement.insertBefore(item, this.itemMoreElement);
|
|
69
69
|
};
|
|
70
|
-
if (
|
|
71
|
-
throw new Error('OverflowBehavior - all
|
|
70
|
+
if (this.parentElement === null || this.itemMoreElement === null || this.itemMoreContainerElement === null) {
|
|
71
|
+
throw new Error('OverflowBehavior - all constructor params are required');
|
|
72
72
|
}
|
|
73
73
|
const items = Array.from(this.parentElement.children);
|
|
74
74
|
this._resizeObserver = new ResizeObserver(entries => {
|
|
@@ -81,7 +81,7 @@ class OverflowBehavior {
|
|
|
81
81
|
let accWidth = 0;
|
|
82
82
|
items.forEach((item, index) => {
|
|
83
83
|
accWidth += item.offsetWidth;
|
|
84
|
-
if (index)
|
|
84
|
+
if (index > 0)
|
|
85
85
|
this.toggleItem(item, this.isOverflowElement(accWidth, item));
|
|
86
86
|
});
|
|
87
87
|
});
|
|
@@ -124,7 +124,7 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class MgMenu extends HTMLElement
|
|
|
124
124
|
var _a, _b;
|
|
125
125
|
const menuItems = Array.from(menu.children).filter(child => child.nodeName === 'MG-MENU-ITEM');
|
|
126
126
|
const itemMoreMenuItem = (_b = (_a = menu.querySelector('mg-item-more')) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('mg-menu-item');
|
|
127
|
-
if (itemMoreMenuItem) {
|
|
127
|
+
if (itemMoreMenuItem !== null && itemMoreMenuItem !== undefined) {
|
|
128
128
|
menuItems.push(itemMoreMenuItem);
|
|
129
129
|
}
|
|
130
130
|
return menuItems;
|
|
@@ -163,12 +163,12 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class MgMenu extends HTMLElement
|
|
|
163
163
|
}
|
|
164
164
|
validateLabel(newValue) {
|
|
165
165
|
if (newValue === undefined && !this.element.hasAttribute('aria-label')) {
|
|
166
|
-
throw new Error(`<${this.name}> prop "label" is required. Passed value: ${
|
|
166
|
+
throw new Error(`<${this.name}> prop "label" is required. Passed value: ${Xt(newValue)}.`);
|
|
167
167
|
}
|
|
168
168
|
}
|
|
169
169
|
validateDirection(newValue) {
|
|
170
170
|
if (![directions.VERTICAL, directions.HORIZONTAL].includes(newValue)) {
|
|
171
|
-
throw new Error(`<${this.name}> prop "direction" must be one of: ${directions.HORIZONTAL}, ${directions.VERTICAL}. Passed value: ${
|
|
171
|
+
throw new Error(`<${this.name}> prop "direction" must be one of: ${directions.HORIZONTAL}, ${directions.VERTICAL}. Passed value: ${Xt(newValue)}.`);
|
|
172
172
|
}
|
|
173
173
|
else {
|
|
174
174
|
this.updateMenuItems();
|
|
@@ -184,7 +184,7 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class MgMenu extends HTMLElement
|
|
|
184
184
|
}
|
|
185
185
|
validateSize(newValue) {
|
|
186
186
|
if (!sizes.includes(newValue)) {
|
|
187
|
-
throw new Error(`<${this.name}> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${
|
|
187
|
+
throw new Error(`<${this.name}> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${Xt(newValue)}.`);
|
|
188
188
|
}
|
|
189
189
|
}
|
|
190
190
|
/**
|
|
@@ -252,7 +252,7 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class MgMenu extends HTMLElement
|
|
|
252
252
|
* @returns HTML Element
|
|
253
253
|
*/
|
|
254
254
|
render() {
|
|
255
|
-
return (h(Host, { key: '
|
|
255
|
+
return (h(Host, { key: '027cd6b867d852c1d238ffedd9ea9c8d40eb82f0', role: "list", "aria-label": this.label }, h("slot", { key: 'cb6dfa4a26800f3dd3fc820954a45aad025cc4a3' })));
|
|
256
256
|
}
|
|
257
257
|
get element() { return this; }
|
|
258
258
|
static get watchers() { return {
|
|
@@ -355,17 +355,17 @@ const MgItemMore = /*@__PURE__*/ proxyCustomElement(class MgItemMore extends HTM
|
|
|
355
355
|
}
|
|
356
356
|
validateIcon(newValue) {
|
|
357
357
|
if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.icon !== 'string'))
|
|
358
|
-
throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${
|
|
358
|
+
throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${Xt(newValue)}.`);
|
|
359
359
|
}
|
|
360
360
|
validateSlotLabel(newValue) {
|
|
361
361
|
if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))
|
|
362
|
-
throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${
|
|
362
|
+
throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${Xt(newValue)}.`);
|
|
363
363
|
else if (typeof newValue.label !== 'string')
|
|
364
364
|
this.slotlabel.label = this.messages.menuLabel;
|
|
365
365
|
}
|
|
366
366
|
validateSize(newValue) {
|
|
367
367
|
if (newValue && !sizes.includes(newValue))
|
|
368
|
-
throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${
|
|
368
|
+
throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${Xt(newValue)}.`);
|
|
369
369
|
}
|
|
370
370
|
/*************
|
|
371
371
|
* Lifecycle *
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"mg-item-more2.js","mappings":"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","names":["__stencil_proxyCustomElement","toString"],"sources":["src/utils/behaviors.utils.ts","../styles/dist/components/mg-menu.css?tag=mg-menu&encapsulation=shadow","src/components/molecules/menus/mg-menu/mg-menu.tsx","../styles/dist/components/mg-item-more.css?tag=mg-item-more&encapsulation=shadow","src/components/molecules/internals/mg-item-more/mg-item-more.tsx"],"sourcesContent":["/**\n *\n */\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _availableWidth: number;\n\n constructor(\n private parentElement: HTMLElement,\n private itemMoreElement: HTMLElement,\n private itemMoreContainerElement: HTMLElement,\n ) {\n if (!this.parentElement || !this.itemMoreElement || !this.itemMoreContainerElement) {\n throw new Error('OverflowBehavior - all construtor params are required');\n }\n\n const items = Array.from(this.parentElement.children) as HTMLElement[];\n\n this._resizeObserver = new ResizeObserver(entries => {\n this._availableWidth = entries\n .map(entry => entry.contentRect.width)\n .sort((a, b) => a - b)\n .shift();\n // reset items\n items.forEach(item => this.toggleItem(item, false));\n\n let accWidth = 0;\n\n items.forEach((item, index) => {\n accWidth += item.offsetWidth;\n if (index) this.toggleItem(item, this.isOverflowElement(accWidth, item));\n });\n });\n this._resizeObserver.observe(this.parentElement);\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 * Utility method to know if element is HTMLMgItemMoreElement\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n */\n private isMoreElement = (element: HTMLElement): element is HTMLMgItemMoreElement => element === this.itemMoreElement;\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 * @returns truthy if element is overflow\n */\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement): boolean => {\n const displayMgItemMore = this.itemMoreContainerElement.children.length > 0;\n if (!this.isMoreElement(item)) {\n if (item.nextElementSibling.nodeName !== 'MG-ITEM-MORE' && !displayMgItemMore) return cumulateWidth + this.itemMoreElement.offsetWidth > this._availableWidth;\n else return cumulateWidth > this._availableWidth;\n } else return !displayMgItemMore;\n };\n\n /**\n * Toogle item from isHidden condition\n * @param item - item to update\n * @param isHidden - item is hidden\n */\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n if (this.isMoreElement(item) && isHidden) item.setAttribute('hidden', '');\n else if (this.isMoreElement(item) && !isHidden) item.removeAttribute('hidden');\n else if (!this.isMoreElement(item) && isHidden) this.itemMoreContainerElement.appendChild(item);\n else if (!this.isMoreElement(item) && item.parentElement !== this.parentElement) this.parentElement.insertBefore(item, this.itemMoreElement);\n };\n}\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}/*!\n * @prop --mg-c-menu-color-background: Defines the background color of the menu. Unset by default, fallback on `--mg-b-color-light`.\n */:host{display:inline-flex;width:100%;min-width:0;background-color:var(--mg-c-menu-color-background, var(--mg-b-color-light))}:host([direction=vertical]){display:flex;height:100%;flex-direction:column;overflow-y:auto}/*# sourceMappingURL=mg-menu.css.map */\n","import { Component, h, Prop, Element, Watch, Host, Listen } from '@stencil/core';\nimport { directions, sizes } from './mg-menu.conf';\nimport type { MenuSizeType, ItemMoreType } from './mg-menu.conf';\nimport { toString } from '@mgdis/stencil-helpers';\nimport { Direction } from '../../../../types';\n\n/**\n * @slot - Menu content\n */\n@Component({\n tag: 'mg-menu',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-menu.css',\n shadow: true,\n})\nexport class MgMenu {\n /************\n * Internal *\n ************/\n\n private readonly name = 'mg-menu';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgMenuElement;\n\n /**\n * Menu label. Include short menu description.\n * Required to define accessibility required attribute `aria-label`\n */\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgMenu['label']): void {\n if (newValue === undefined && !this.element.hasAttribute('aria-label')) {\n throw new Error(`<${this.name}> prop \"label\" is required. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Component display direction.\n */\n @Prop({ reflect: true }) direction: Direction = 'horizontal';\n @Watch('direction')\n validateDirection(newValue: MgMenu['direction']): void {\n if (![directions.VERTICAL, directions.HORIZONTAL].includes(newValue)) {\n throw new Error(`<${this.name}> prop \"direction\" must be one of: ${directions.HORIZONTAL}, ${directions.VERTICAL}. Passed value: ${toString(newValue)}.`);\n } else {\n this.updateMenuItems();\n }\n }\n\n /**\n * Customize \"mg-item-more\" element\n * Used with direction: 'vertical' to manage overflow\n */\n @Prop() itemmore?: ItemMoreType;\n @Watch('itemmore')\n validateItemMore(newValue: MgMenu['itemmore']): void {\n if (newValue !== undefined && this.direction !== directions.HORIZONTAL) {\n throw new Error(`<${this.name}> prop \"itemmore\" must be paired with direction ${directions.HORIZONTAL}.`);\n } else if (newValue !== undefined) {\n this.renderMgItemMore();\n }\n }\n\n /**\n * Define mg-menu size\n */\n @Prop() size: MenuSizeType = 'medium';\n @Watch('size')\n validateSize(newValue: MgMenu['size']): void {\n if (!sizes.includes(newValue)) {\n throw new Error(`<${this.name}> prop \"size\" must be one of: ${sizes.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define mg-menu-item listener when they are loaded\n * @param event - mg-item-loaded \"item-loaded\" custom event\n */\n @Listen('item-loaded')\n updateItemListener(event: CustomEvent & { target: HTMLMgMenuItemElement }): void {\n const itemToWatch = event.target.nodeName === 'MG-ITEM-MORE' ? event.target.shadowRoot.querySelector('mg-menu-item') : event.target;\n\n ['click', 'focus'].forEach(trigger => {\n itemToWatch.addEventListener(trigger, (): void => {\n const focusedItem: HTMLMgMenuItemElement = event.target.closest('mg-menu').querySelector('[data-has-focus]');\n // exit process if new focused item in the current menu children\n if (focusedItem === itemToWatch) return;\n\n // reset expanded on previous active menu item\n if (focusedItem !== null) focusedItem.removeAttribute('data-has-focus');\n\n // update focusedMenuItem with new value\n itemToWatch.setAttribute('data-has-focus', 'true');\n });\n });\n }\n\n /*************\n * Methods *\n *************/\n\n /**\n * Test if menu is a child menu\n * @returns truthy if menu is a child menu\n */\n private isChildMenu = (): boolean => this.element.closest('mg-menu-item') !== null;\n\n /**\n * Get menu children items\n * @returns menu children mg-menu-item\n */\n private getMenuItems = (menu = this.element): HTMLMgMenuItemElement[] => {\n const menuItems = Array.from(menu.children).filter(child => child.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n const itemMoreMenuItem = menu.querySelector('mg-item-more')?.shadowRoot?.querySelector('mg-menu-item');\n if (itemMoreMenuItem) {\n menuItems.push(itemMoreMenuItem);\n }\n return menuItems;\n };\n\n /**\n * Update menu items\n */\n private updateMenuItems = (): void => {\n this.getMenuItems().forEach(item => {\n item.dataset.styleDirection = this.direction;\n });\n\n // render mg-item-more to manage OverflowBehavior\n this.renderMgItemMore();\n };\n\n /**\n * render mg-item-more\n */\n private renderMgItemMore = (): void => {\n if (this.direction === directions.VERTICAL || (this.direction === directions.HORIZONTAL && this.isChildMenu()) || this.element.children.length <= 1) {\n return;\n }\n\n // Insert mg-item-more outside the mg-menu shadowdom\n let itemMoreElement = this.element.querySelector('mg-item-more');\n if (itemMoreElement === null) {\n itemMoreElement = document.createElement('mg-item-more');\n this.element.appendChild(itemMoreElement);\n }\n\n // update mg-item-more props\n for (const propertie in this.itemmore) {\n itemMoreElement[propertie] = this.itemmore[propertie];\n }\n if (this.itemmore?.size === undefined) itemMoreElement.size = this.size;\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Validate props\n */\n componentWillLoad(): void {\n this.validateDirection(this.direction);\n this.validateLabel(this.label);\n this.validateItemMore(this.itemmore);\n this.validateSize(this.size);\n }\n\n /**\n * Check if component slots configuration\n */\n componentDidLoad(): void {\n // set menu-items\n this.updateMenuItems();\n\n // add listener to close main menu when focus leave it\n if (!this.isChildMenu() && this.direction === directions.HORIZONTAL) {\n document.addEventListener('focusin', (event: FocusEvent & { target: HTMLElement }): void => {\n const isElementChild = (element: HTMLElement): boolean => {\n if (element === this.element) return true;\n else if (element.parentElement === null) return false;\n else return isElementChild(element.parentElement);\n };\n\n if (event.target.closest('mg-menu') === null || !isElementChild(event.target)) {\n const focusedItem = this.element.querySelector('[data-has-focus]');\n // reset expanded on previous active menu item\n if (focusedItem !== null) focusedItem.removeAttribute('data-has-focus');\n }\n });\n }\n // add mutation observer to improve global reactivity\n new MutationObserver(this.updateMenuItems).observe(this.element, { childList: true });\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"list\" aria-label={this.label}>\n <slot></slot>\n </Host>\n );\n }\n}\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host:not([hidden]){display:flex}/*# sourceMappingURL=mg-item-more.css.map */\n","import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { toString } from '@mgdis/stencil-helpers';\nimport type { IconType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport type { MessageType } from '../../../../locales/index.conf';\nimport { OverflowBehavior } from '../../../../utils/behaviors.utils';\nimport { directions, sizes } from '../../menus/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../../locales';\n\n/**\n * @internal\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 overflowBehavior: OverflowBehavior;\n private itemMoreContainer: HTMLMgMenuElement;\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. Passed value: ${toString(newValue)}.`);\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. Passed value: ${toString(newValue)}.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.menuLabel;\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 && !sizes.includes(newValue)) throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type. Passed value: ${toString(newValue)}.`);\n }\n\n /**\n * Define component parent menu.\n */\n @State() parentMenu: HTMLMgMenuElement;\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.itemMore as MessageType;\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 * @returns timeout\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.overflowBehavior === undefined) {\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.element, this.itemMoreContainer);\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 const menuItemIdentifier = 'mg-item-more';\n return (\n <Host role=\"listitem\" data-mg-popover-guard={`${menuItemIdentifier}-popover`}>\n {this.parentMenu && (\n <mg-menu-item data-overflow-more data-size={this.parentMenu.size} data-style-direction={directions.HORIZONTAL} identifier={menuItemIdentifier}>\n <mg-icon icon={this.icon.icon} size={this.size} 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\n direction={directions.VERTICAL}\n label={this.messages.menuLabel}\n size={this.size}\n ref={ref => {\n if (ref !== null) this.itemMoreContainer = ref;\n }}\n ></mg-menu>\n </mg-menu-item>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"mg-item-more2.js","mappings":";;;;;;;;;;;AAAA;;AAEG;MACU,gBAAgB,CAAA;AAK3B,IAAA,WAAA,CACU,aAA0B,EAC1B,eAA4B,EAC5B,wBAAqC,EAAA;QAFrC,IAAa,CAAA,aAAA,GAAb,aAAa;QACb,IAAe,CAAA,eAAA,GAAf,eAAe;QACf,IAAwB,CAAA,wBAAA,GAAxB,wBAAwB;AA0BlC;;AAEY;AAEZ;;AAEG;QACI,IAAU,CAAA,UAAA,GAAG,MAAW;AAC7B,YAAA,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE;AACnC,SAAC;AAED;;AAEc;AAEd;;;;AAIG;QACK,IAAa,CAAA,aAAA,GAAG,CAAC,OAAoB,KAAuC,OAAO,KAAK,IAAI,CAAC,eAAe;AAEpH;;;;;AAKG;AACK,QAAA,IAAA,CAAA,iBAAiB,GAAG,CAAC,aAAqB,EAAE,IAAiB,KAAa;YAChF,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC;YAC3E,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE;gBAC7B,IAAI,IAAI,CAAC,kBAAkB,CAAC,QAAQ,KAAK,cAAc,IAAI,CAAC,iBAAiB;oBAAE,OAAO,aAAa,GAAG,IAAI,CAAC,eAAe,CAAC,WAAW,GAAG,IAAI,CAAC,eAAe;;AACxJ,oBAAA,OAAO,aAAa,GAAG,IAAI,CAAC,eAAe;;;gBAC3C,OAAO,CAAC,iBAAiB;AAClC,SAAC;AAED;;;;AAIG;AACK,QAAA,IAAA,CAAA,UAAU,GAAG,CAAC,IAAiB,EAAE,QAAiB,KAAU;AAClE,YAAA,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,QAAQ;AAAE,gBAAA,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;iBACpE,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ;AAAE,gBAAA,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC;iBACzE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,QAAQ;AAAE,gBAAA,IAAI,CAAC,wBAAwB,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1F,iBAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,aAAa,KAAK,IAAI,CAAC,aAAa;gBAAE,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC;AAC9I,SAAC;AAtEC,QAAA,IAAI,IAAI,CAAC,aAAa,KAAK,IAAI,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,IAAI,IAAI,CAAC,wBAAwB,KAAK,IAAI,EAAE;AAC1G,YAAA,MAAM,IAAI,KAAK,CAAC,wDAAwD,CAAC;;AAG3E,QAAA,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAkB;QAEtE,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,OAAO,IAAG;YAClD,IAAI,CAAC,eAAe,GAAG;iBACpB,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,WAAW,CAAC,KAAK;iBACpC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC;AACpB,iBAAA,KAAK,EAAE;;AAEV,YAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;YAEnD,IAAI,QAAQ,GAAG,CAAC;YAEhB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC5B,gBAAA,QAAQ,IAAI,IAAI,CAAC,WAAW;gBAC5B,IAAI,KAAK,GAAG,CAAC;AAAE,oBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;AAC9E,aAAC,CAAC;AACJ,SAAC,CAAC;QACF,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC;;AAkDnD;;ACpFD,MAAM,SAAS,GAAG,4xBAA4xB;;MCcjyB,MAAM,iBAAAA,kBAAA,CAAA,MAAA,MAAA,SAAA,WAAA,CAAA;AALnB,IAAA,WAAA,GAAA;;;;AAME;;AAEc;AAEG,QAAA,IAAI,CAAA,IAAA,GAAG,SAAS;AAuBjC;;AAEG;AACsB,QAAA,IAAS,CAAA,SAAA,GAAc,YAAY;AAwB5D;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAiB,QAAQ;AA+BrC;;AAEe;AAEf;;;AAGG;AACK,QAAA,IAAA,CAAA,WAAW,GAAG,MAAe,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI;AAElF;;;AAGG;QACK,IAAY,CAAA,YAAA,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,OAAO,KAA6B;;YACtE,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,KAAK,cAAc,CAA4B;YACzH,MAAM,gBAAgB,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,0CAAE,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,aAAa,CAAC,cAAc,CAAC;YACtG,IAAI,gBAAgB,KAAK,IAAI,IAAI,gBAAgB,KAAK,SAAS,EAAE;AAC/D,gBAAA,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC;;AAElC,YAAA,OAAO,SAAS;AAClB,SAAC;AAED;;AAEG;AACK,QAAA,IAAe,CAAA,eAAA,GAAG,MAAW;YACnC,IAAI,CAAC,YAAY,EAAE,CAAC,OAAO,CAAC,IAAI,IAAG;gBACjC,IAAI,CAAC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;AAC9C,aAAC,CAAC;;YAGF,IAAI,CAAC,gBAAgB,EAAE;AACzB,SAAC;AAED;;AAEG;AACK,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAW;;AACpC,YAAA,IAAI,IAAI,CAAC,SAAS,KAAK,UAAU,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,KAAK,UAAU,CAAC,UAAU,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,EAAE;gBACnJ;;;YAIF,IAAI,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,cAAc,CAAC;AAChE,YAAA,IAAI,eAAe,KAAK,IAAI,EAAE;AAC5B,gBAAA,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,CAAC;AACxD,gBAAA,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,eAAe,CAAC;;;AAI3C,YAAA,KAAK,MAAM,SAAS,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACrC,eAAe,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;;AAEvD,YAAA,IAAI,CAAA,MAAA,IAAI,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,MAAK,SAAS;AAAE,gBAAA,eAAe,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI;AACzE,SAAC;AAsDF;AAhLC,IAAA,aAAa,CAAC,QAAyB,EAAA;AACrC,QAAA,IAAI,QAAQ,KAAK,SAAS,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,YAAY,CAAC,EAAE;AACtE,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAA6C,0CAAA,EAAAC,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;;AASpG,IAAA,iBAAiB,CAAC,QAA6B,EAAA;AAC7C,QAAA,IAAI,CAAC,CAAC,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;YACpE,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAAsC,mCAAA,EAAA,UAAU,CAAC,UAAU,KAAK,UAAU,CAAC,QAAQ,CAAmB,gBAAA,EAAAA,EAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;aACpJ;YACL,IAAI,CAAC,eAAe,EAAE;;;AAU1B,IAAA,gBAAgB,CAAC,QAA4B,EAAA;AAC3C,QAAA,IAAI,QAAQ,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,KAAK,UAAU,CAAC,UAAU,EAAE;AACtE,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAAA,gDAAA,EAAmD,UAAU,CAAC,UAAU,CAAA,CAAA,CAAG,CAAC;;AACpG,aAAA,IAAI,QAAQ,KAAK,SAAS,EAAE;YACjC,IAAI,CAAC,gBAAgB,EAAE;;;AAS3B,IAAA,YAAY,CAAC,QAAwB,EAAA;QACnC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;YAC7B,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,iCAAiC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAmB,gBAAA,EAAAA,EAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;;AAI3H;;;AAGG;AAEH,IAAA,kBAAkB,CAAC,KAAsD,EAAA;AACvE,QAAA,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,KAAK,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC,MAAM;QAEnI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,OAAO,CAAC,OAAO,IAAG;AACnC,YAAA,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,MAAW;AAC/C,gBAAA,MAAM,WAAW,GAA0B,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,aAAa,CAAC,kBAAkB,CAAC;;gBAE5G,IAAI,WAAW,KAAK,WAAW;oBAAE;;gBAGjC,IAAI,WAAW,KAAK,IAAI;AAAE,oBAAA,WAAW,CAAC,eAAe,CAAC,gBAAgB,CAAC;;AAGvE,gBAAA,WAAW,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC;AACpD,aAAC,CAAC;AACJ,SAAC,CAAC;;AA4DJ;;AAEe;AAEf;;AAEG;IACH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;AACtC,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC;AACpC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;;AAG9B;;AAEG;IACH,gBAAgB,GAAA;;QAEd,IAAI,CAAC,eAAe,EAAE;;AAGtB,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,IAAI,CAAC,SAAS,KAAK,UAAU,CAAC,UAAU,EAAE;YACnE,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,KAA2C,KAAU;AACzF,gBAAA,MAAM,cAAc,GAAG,CAAC,OAAoB,KAAa;AACvD,oBAAA,IAAI,OAAO,KAAK,IAAI,CAAC,OAAO;AAAE,wBAAA,OAAO,IAAI;AACpC,yBAAA,IAAI,OAAO,CAAC,aAAa,KAAK,IAAI;AAAE,wBAAA,OAAO,KAAK;;AAChD,wBAAA,OAAO,cAAc,CAAC,OAAO,CAAC,aAAa,CAAC;AACnD,iBAAC;AAED,gBAAA,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;oBAC7E,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kBAAkB,CAAC;;oBAElE,IAAI,WAAW,KAAK,IAAI;AAAE,wBAAA,WAAW,CAAC,eAAe,CAAC,gBAAgB,CAAC;;AAE3E,aAAC,CAAC;;;AAGJ,QAAA,IAAI,gBAAgB,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;;AAGvF;;;AAGG;IACH,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAA,YAAA,EAAa,IAAI,CAAC,KAAK,EAAA,EACtC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjNb,MAAM,aAAa,GAAG,udAAud;;MCgBhe,UAAU,iBAAAD,kBAAA,CAAA,MAAA,UAAA,SAAA,WAAA,CAAA;AALvB,IAAA,WAAA,GAAA;;;;AAME;;AAEc;AACG,QAAA,IAAI,CAAA,IAAA,GAAG,cAAc;AActC;;AAEG;QACK,IAAA,CAAA,IAAI,GAAc,EAAE,IAAI,EAAE,mBAAmB,EAAE;AAOvD;;AAEG;QACK,IAAA,CAAA,SAAS,GAAmB,EAAE,OAAO,EAAE,KAAK,EAAE;AA6FvD;AArGC,IAAA,YAAY,CAAC,QAA4B,EAAA;AACvC,QAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,CAAC,IAAI,KAAK,QAAQ,CAAC;AACrG,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAAmE,gEAAA,EAAAC,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;AAQ1H,IAAA,iBAAiB,CAAC,QAAiC,EAAA;AACjD,QAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,CAAC,OAAO,KAAK,SAAS,CAAC;AACzG,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAA6E,0EAAA,EAAAA,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;AAC7H,aAAA,IAAI,OAAO,QAAQ,CAAC,KAAK,KAAK,QAAQ;YAAE,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS;;AAQ7F,IAAA,YAAY,CAAC,QAA4B,EAAA;QACvC,IAAI,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC;AAAE,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAAmE,gEAAA,EAAAA,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;AAQnK;;AAEe;AAEf;;AAEG;IACH,iBAAiB,GAAA;;AAEf,QAAA,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,QAAuB;;AAG1E,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;AAC5B,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;AACtC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;;AAG9B;;;AAGG;IACH,gBAAgB,GAAA;;QAEd,OAAO,UAAU,CAAC,MAAK;YACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC;AACnD,SAAC,CAAC;;AAGJ;;AAEG;IACH,kBAAkB,GAAA;QAChB,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,gBAAgB,KAAK,SAAS,EAAE;AAC1D,YAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC;;;AAIvG;;AAEG;IACH,oBAAoB,GAAA;;QAClB,CAAA,EAAA,GAAA,IAAI,CAAC,gBAAgB,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE;;AAGrC;;;AAGG;IACH,MAAM,GAAA;QACJ,MAAM,kBAAkB,GAAG,cAAc;AACzC,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,IAAI,EAAC,UAAU,EAAA,uBAAA,EAAwB,CAAA,EAAG,kBAAkB,CAAA,QAAA,CAAU,EAAA,EACzE,IAAI,CAAC,UAAU,KACd,CAA4C,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,oBAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAwB,sBAAA,EAAA,UAAU,CAAC,UAAU,EAAE,UAAU,EAAE,kBAAkB,EAAA,EAC3I,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,EAAW,CAAA,EACvE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,EAAE,sBAAsB,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,EAAE,IAAI,EAAC,OAAO,EAAA,EAC3E,IAAI,CAAC,SAAS,CAAC,KAAK,CAChB,EACP,CACE,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,SAAS,EAAE,UAAU,CAAC,QAAQ,EAC9B,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,SAAS,EAC9B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,GAAG,IAAG;gBACT,IAAI,GAAG,KAAK,IAAI;AAAE,oBAAA,IAAI,CAAC,iBAAiB,GAAG,GAAG;AAChD,aAAC,EACQ,CAAA,CACE,CAChB,CACI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","toString"],"sources":["src/utils/behaviors.utils.ts","../styles/dist/components/mg-menu.css?tag=mg-menu&encapsulation=shadow","src/components/molecules/menus/mg-menu/mg-menu.tsx","../styles/dist/components/mg-item-more.css?tag=mg-item-more&encapsulation=shadow","src/components/molecules/internals/mg-item-more/mg-item-more.tsx"],"sourcesContent":["/**\n *\n */\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _availableWidth: number;\n\n constructor(\n private parentElement: HTMLElement,\n private itemMoreElement: HTMLElement,\n private itemMoreContainerElement: HTMLElement,\n ) {\n if (this.parentElement === null || this.itemMoreElement === null || this.itemMoreContainerElement === null) {\n throw new Error('OverflowBehavior - all constructor params are required');\n }\n\n const items = Array.from(this.parentElement.children) as HTMLElement[];\n\n this._resizeObserver = new ResizeObserver(entries => {\n this._availableWidth = entries\n .map(entry => entry.contentRect.width)\n .sort((a, b) => a - b)\n .shift();\n // reset items\n items.forEach(item => this.toggleItem(item, false));\n\n let accWidth = 0;\n\n items.forEach((item, index) => {\n accWidth += item.offsetWidth;\n if (index > 0) this.toggleItem(item, this.isOverflowElement(accWidth, item));\n });\n });\n this._resizeObserver.observe(this.parentElement);\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 * Utility method to know if element is HTMLMgItemMoreElement\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n */\n private isMoreElement = (element: HTMLElement): element is HTMLMgItemMoreElement => element === this.itemMoreElement;\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 * @returns truthy if element is overflow\n */\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement): boolean => {\n const displayMgItemMore = this.itemMoreContainerElement.children.length > 0;\n if (!this.isMoreElement(item)) {\n if (item.nextElementSibling.nodeName !== 'MG-ITEM-MORE' && !displayMgItemMore) return cumulateWidth + this.itemMoreElement.offsetWidth > this._availableWidth;\n else return cumulateWidth > this._availableWidth;\n } else return !displayMgItemMore;\n };\n\n /**\n * Toogle item from isHidden condition\n * @param item - item to update\n * @param isHidden - item is hidden\n */\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n if (this.isMoreElement(item) && isHidden) item.setAttribute('hidden', '');\n else if (this.isMoreElement(item) && !isHidden) item.removeAttribute('hidden');\n else if (!this.isMoreElement(item) && isHidden) this.itemMoreContainerElement.appendChild(item);\n else if (!this.isMoreElement(item) && item.parentElement !== this.parentElement) this.parentElement.insertBefore(item, this.itemMoreElement);\n };\n}\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}/*!\n * @prop --mg-c-menu-color-background: Defines the background color of the menu. Unset by default, fallback on `--mg-b-color-light`.\n */:host{display:inline-flex;width:100%;min-width:0;background-color:var(--mg-c-menu-color-background, var(--mg-b-color-light))}:host([direction=vertical]){display:flex;height:100%;flex-direction:column;overflow-y:auto}/*# sourceMappingURL=mg-menu.css.map */\n","import { Component, h, Prop, Element, Watch, Host, Listen } from '@stencil/core';\nimport { directions, sizes } from './mg-menu.conf';\nimport type { MenuSizeType, ItemMoreType } from './mg-menu.conf';\nimport { toString } from '@mgdis/stencil-helpers';\nimport { Direction } from '../../../../types';\n\n/**\n * @slot - Menu content\n */\n@Component({\n tag: 'mg-menu',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-menu.css',\n shadow: true,\n})\nexport class MgMenu {\n /************\n * Internal *\n ************/\n\n private readonly name = 'mg-menu';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgMenuElement;\n\n /**\n * Menu label. Include short menu description.\n * Required to define accessibility required attribute `aria-label`\n */\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgMenu['label']): void {\n if (newValue === undefined && !this.element.hasAttribute('aria-label')) {\n throw new Error(`<${this.name}> prop \"label\" is required. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Component display direction.\n */\n @Prop({ reflect: true }) direction: Direction = 'horizontal';\n @Watch('direction')\n validateDirection(newValue: MgMenu['direction']): void {\n if (![directions.VERTICAL, directions.HORIZONTAL].includes(newValue)) {\n throw new Error(`<${this.name}> prop \"direction\" must be one of: ${directions.HORIZONTAL}, ${directions.VERTICAL}. Passed value: ${toString(newValue)}.`);\n } else {\n this.updateMenuItems();\n }\n }\n\n /**\n * Customize \"mg-item-more\" element\n * Used with direction: 'vertical' to manage overflow\n */\n @Prop() itemmore?: ItemMoreType;\n @Watch('itemmore')\n validateItemMore(newValue: MgMenu['itemmore']): void {\n if (newValue !== undefined && this.direction !== directions.HORIZONTAL) {\n throw new Error(`<${this.name}> prop \"itemmore\" must be paired with direction ${directions.HORIZONTAL}.`);\n } else if (newValue !== undefined) {\n this.renderMgItemMore();\n }\n }\n\n /**\n * Define mg-menu size\n */\n @Prop() size: MenuSizeType = 'medium';\n @Watch('size')\n validateSize(newValue: MgMenu['size']): void {\n if (!sizes.includes(newValue)) {\n throw new Error(`<${this.name}> prop \"size\" must be one of: ${sizes.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define mg-menu-item listener when they are loaded\n * @param event - mg-item-loaded \"item-loaded\" custom event\n */\n @Listen('item-loaded')\n updateItemListener(event: CustomEvent & { target: HTMLMgMenuItemElement }): void {\n const itemToWatch = event.target.nodeName === 'MG-ITEM-MORE' ? event.target.shadowRoot.querySelector('mg-menu-item') : event.target;\n\n ['click', 'focus'].forEach(trigger => {\n itemToWatch.addEventListener(trigger, (): void => {\n const focusedItem: HTMLMgMenuItemElement = event.target.closest('mg-menu').querySelector('[data-has-focus]');\n // exit process if new focused item in the current menu children\n if (focusedItem === itemToWatch) return;\n\n // reset expanded on previous active menu item\n if (focusedItem !== null) focusedItem.removeAttribute('data-has-focus');\n\n // update focusedMenuItem with new value\n itemToWatch.setAttribute('data-has-focus', 'true');\n });\n });\n }\n\n /*************\n * Methods *\n *************/\n\n /**\n * Test if menu is a child menu\n * @returns truthy if menu is a child menu\n */\n private isChildMenu = (): boolean => this.element.closest('mg-menu-item') !== null;\n\n /**\n * Get menu children items\n * @returns menu children mg-menu-item\n */\n private getMenuItems = (menu = this.element): HTMLMgMenuItemElement[] => {\n const menuItems = Array.from(menu.children).filter(child => child.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n const itemMoreMenuItem = menu.querySelector('mg-item-more')?.shadowRoot?.querySelector('mg-menu-item');\n if (itemMoreMenuItem !== null && itemMoreMenuItem !== undefined) {\n menuItems.push(itemMoreMenuItem);\n }\n return menuItems;\n };\n\n /**\n * Update menu items\n */\n private updateMenuItems = (): void => {\n this.getMenuItems().forEach(item => {\n item.dataset.styleDirection = this.direction;\n });\n\n // render mg-item-more to manage OverflowBehavior\n this.renderMgItemMore();\n };\n\n /**\n * render mg-item-more\n */\n private renderMgItemMore = (): void => {\n if (this.direction === directions.VERTICAL || (this.direction === directions.HORIZONTAL && this.isChildMenu()) || this.element.children.length <= 1) {\n return;\n }\n\n // Insert mg-item-more outside the mg-menu shadowdom\n let itemMoreElement = this.element.querySelector('mg-item-more');\n if (itemMoreElement === null) {\n itemMoreElement = document.createElement('mg-item-more');\n this.element.appendChild(itemMoreElement);\n }\n\n // update mg-item-more props\n for (const propertie in this.itemmore) {\n itemMoreElement[propertie] = this.itemmore[propertie];\n }\n if (this.itemmore?.size === undefined) itemMoreElement.size = this.size;\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Validate props\n */\n componentWillLoad(): void {\n this.validateDirection(this.direction);\n this.validateLabel(this.label);\n this.validateItemMore(this.itemmore);\n this.validateSize(this.size);\n }\n\n /**\n * Check if component slots configuration\n */\n componentDidLoad(): void {\n // set menu-items\n this.updateMenuItems();\n\n // add listener to close main menu when focus leave it\n if (!this.isChildMenu() && this.direction === directions.HORIZONTAL) {\n document.addEventListener('focusin', (event: FocusEvent & { target: HTMLElement }): void => {\n const isElementChild = (element: HTMLElement): boolean => {\n if (element === this.element) return true;\n else if (element.parentElement === null) return false;\n else return isElementChild(element.parentElement);\n };\n\n if (event.target.closest('mg-menu') === null || !isElementChild(event.target)) {\n const focusedItem = this.element.querySelector('[data-has-focus]');\n // reset expanded on previous active menu item\n if (focusedItem !== null) focusedItem.removeAttribute('data-has-focus');\n }\n });\n }\n // add mutation observer to improve global reactivity\n new MutationObserver(this.updateMenuItems).observe(this.element, { childList: true });\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"list\" aria-label={this.label}>\n <slot></slot>\n </Host>\n );\n }\n}\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host:not([hidden]){display:flex}/*# sourceMappingURL=mg-item-more.css.map */\n","import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { toString } from '@mgdis/stencil-helpers';\nimport type { IconType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport type { MessageType } from '../../../../locales/index.conf';\nimport { OverflowBehavior } from '../../../../utils/behaviors.utils';\nimport { directions, sizes } from '../../menus/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../../locales';\n\n/**\n * @internal\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 overflowBehavior: OverflowBehavior;\n private itemMoreContainer: HTMLMgMenuElement;\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. Passed value: ${toString(newValue)}.`);\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. Passed value: ${toString(newValue)}.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.menuLabel;\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 && !sizes.includes(newValue)) throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type. Passed value: ${toString(newValue)}.`);\n }\n\n /**\n * Define component parent menu.\n */\n @State() parentMenu: HTMLMgMenuElement;\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.itemMore as MessageType;\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 * @returns timeout\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.overflowBehavior === undefined) {\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.element, this.itemMoreContainer);\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 const menuItemIdentifier = 'mg-item-more';\n return (\n <Host role=\"listitem\" data-mg-popover-guard={`${menuItemIdentifier}-popover`}>\n {this.parentMenu && (\n <mg-menu-item data-overflow-more data-size={this.parentMenu.size} data-style-direction={directions.HORIZONTAL} identifier={menuItemIdentifier}>\n <mg-icon icon={this.icon.icon} size={this.size} 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\n direction={directions.VERTICAL}\n label={this.messages.menuLabel}\n size={this.size}\n ref={ref => {\n if (ref !== null) this.itemMoreContainer = ref;\n }}\n ></mg-menu>\n </mg-menu-item>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|