@mgdis/mg-components 6.7.0 → 6.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +17 -78
- package/dist/cjs/app-globals-V2Kpy_OQ.js +8 -0
- package/dist/cjs/app-globals-V2Kpy_OQ.js.map +1 -0
- package/dist/cjs/{index-1a5a1081.js → index-CATFkm3O.js} +244 -196
- package/dist/cjs/index-CATFkm3O.js.map +1 -0
- package/dist/cjs/{index-b7923724.js → index-CTU2m-sy.js} +87 -42
- package/dist/cjs/index-CTU2m-sy.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -0
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/index.es-jXqiN1uw.js +152 -0
- package/dist/cjs/index.es-jXqiN1uw.js.map +1 -0
- package/dist/cjs/loader.cjs.js +4 -5
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/{mg-action-more_36.cjs.entry.js → mg-action-more_37.cjs.entry.js} +842 -826
- package/dist/cjs/mg-action-more_37.cjs.entry.js.map +1 -0
- package/dist/cjs/mg-alert.cjs.entry.js +21 -15
- package/dist/cjs/mg-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-alert.entry.cjs.js.map +1 -0
- package/dist/cjs/mg-components.cjs.js +8 -7
- package/dist/cjs/mg-components.cjs.js.map +1 -1
- package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +21524 -6868
- 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 -0
- package/dist/cjs/{mg-input.conf-5bbcea79.js → mg-input.conf-WTsvDfpC.js} +2 -1
- package/dist/cjs/mg-input.conf-WTsvDfpC.js.map +1 -0
- package/dist/cjs/mg-loader.cjs.entry.js +12 -10
- package/dist/cjs/mg-loader.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-loader.entry.cjs.js.map +1 -0
- package/dist/cjs/mg-progress.cjs.entry.js +13 -15
- package/dist/cjs/mg-progress.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-progress.entry.cjs.js.map +1 -0
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/atoms/mg-badge/mg-badge.js +9 -4
- package/dist/collection/components/atoms/mg-badge/mg-badge.js.map +1 -1
- package/dist/collection/components/atoms/mg-button/mg-button.js +14 -14
- package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
- package/dist/collection/components/atoms/mg-icon/mg-icon.js +21 -6
- package/dist/collection/components/atoms/mg-icon/mg-icon.js.map +1 -1
- package/dist/collection/components/atoms/mg-tag/mg-tag.js +17 -7
- package/dist/collection/components/atoms/mg-tag/mg-tag.js.map +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +1 -2
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input/mg-input.js +12 -8
- package/dist/collection/components/molecules/inputs/mg-input/mg-input.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +19 -6
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +16 -5
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +53 -21
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +64 -30
- 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 +12 -7
- package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js +44 -39
- 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 +8 -3
- package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js +7 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +89 -53
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +28 -23
- package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +8 -3
- package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js.map +1 -1
- package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.conf.js.map +1 -1
- package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js +2 -2
- package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js.map +1 -1
- package/dist/collection/components/molecules/menus/mg-menu/mg-menu.conf.js.map +1 -0
- package/dist/collection/components/molecules/{menu → menus}/mg-menu/mg-menu.js +9 -9
- package/dist/collection/components/molecules/menus/mg-menu/mg-menu.js.map +1 -0
- package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.conf.js.map +1 -0
- package/dist/collection/components/molecules/{menu → menus}/mg-menu-item/mg-menu-item.js +7 -7
- package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.js.map +1 -0
- package/dist/collection/components/molecules/mg-action-more/mg-action-more.conf.js.map +1 -1
- package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +9 -4
- 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 +13 -3
- package/dist/collection/components/molecules/mg-alert/mg-alert.js.map +1 -1
- package/dist/collection/components/molecules/mg-details/mg-details.js +3 -2
- package/dist/collection/components/molecules/mg-details/mg-details.js.map +1 -1
- package/dist/collection/components/molecules/mg-form/mg-form.js +8 -3
- package/dist/collection/components/molecules/mg-form/mg-form.js.map +1 -1
- package/dist/collection/components/molecules/mg-loader/mg-loader.js +10 -3
- package/dist/collection/components/molecules/mg-loader/mg-loader.js.map +1 -1
- package/dist/collection/components/molecules/mg-modal/mg-modal.js +4 -4
- package/dist/collection/components/molecules/mg-modal/mg-modal.js.map +1 -1
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +17 -7
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js.map +1 -1
- package/dist/collection/components/molecules/mg-panel/mg-panel.js +12 -7
- package/dist/collection/components/molecules/mg-panel/mg-panel.js.map +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.js +2 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.js.map +1 -1
- package/dist/collection/components/molecules/mg-table/mg-table.conf.js +13 -0
- package/dist/collection/components/molecules/mg-table/mg-table.conf.js.map +1 -0
- package/dist/collection/components/molecules/mg-table/mg-table.js +364 -0
- package/dist/collection/components/molecules/mg-table/mg-table.js.map +1 -0
- package/dist/collection/locales/en/messages.json +37 -16
- package/dist/collection/locales/fr/messages.json +40 -19
- package/dist/collection/utils/playwright.fixture.js +2 -3
- package/dist/collection/utils/playwright.fixture.js.map +1 -1
- package/dist/components/floating-ui.utils.js +2 -421
- package/dist/components/floating-ui.utils.js.map +1 -1
- package/dist/components/index.es.js +68 -67
- package/dist/components/index.es.js.map +1 -1
- package/dist/components/index.js +1 -0
- package/dist/components/index2.js +86 -41
- package/dist/components/index2.js.map +1 -1
- package/dist/components/mg-action-more.js +13 -9
- package/dist/components/mg-action-more.js.map +1 -1
- package/dist/components/mg-alert.js +16 -8
- package/dist/components/mg-alert.js.map +1 -1
- package/dist/components/mg-badge.js +1 -0
- package/dist/components/mg-badge2.js +14 -10
- package/dist/components/mg-badge2.js.map +1 -1
- package/dist/components/mg-button.js +1 -0
- package/dist/components/mg-button2.js +19 -19
- package/dist/components/mg-button2.js.map +1 -1
- package/dist/components/mg-card.js +1 -0
- package/dist/components/mg-card2.js +2 -2
- package/dist/components/mg-card2.js.map +1 -1
- package/dist/components/mg-character-left.js +1 -0
- package/dist/components/mg-character-left2.js +6 -6
- package/dist/components/mg-character-left2.js.map +1 -1
- package/dist/components/mg-details.js +7 -6
- package/dist/components/mg-details.js.map +1 -1
- package/dist/components/mg-divider.js +1 -0
- package/dist/components/mg-divider2.js +2 -2
- package/dist/components/mg-divider2.js.map +1 -1
- package/dist/components/mg-form.js +14 -10
- package/dist/components/mg-form.js.map +1 -1
- package/dist/components/mg-icon.js +1 -0
- package/dist/components/mg-icon2.js +29 -14
- package/dist/components/mg-icon2.js.map +1 -1
- package/dist/components/mg-illustrated-message.js +7 -7
- package/dist/components/mg-illustrated-message.js.map +1 -1
- package/dist/components/mg-input-checkbox-paginated.js +2 -1
- package/dist/components/mg-input-checkbox-paginated2.js +15 -3
- package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
- package/dist/components/mg-input-checkbox.js +23 -14
- package/dist/components/mg-input-checkbox.js.map +1 -1
- package/dist/components/mg-input-date.js +64 -32
- package/dist/components/mg-input-date.js.map +1 -1
- package/dist/components/mg-input-numeric.js +76 -43
- package/dist/components/mg-input-numeric.js.map +1 -1
- package/dist/components/mg-input-password.js +12 -8
- package/dist/components/mg-input-password.js.map +1 -1
- package/dist/components/mg-input-radio.js +10 -10
- package/dist/components/mg-input-radio.js.map +1 -1
- package/dist/components/mg-input-rich-text-editor.js +21525 -6867
- package/dist/components/mg-input-rich-text-editor.js.map +1 -1
- package/dist/components/mg-input-select.js +1 -0
- package/dist/components/mg-input-select2.js +15 -11
- package/dist/components/mg-input-select2.js.map +1 -1
- package/dist/components/mg-input-text.js +1 -0
- package/dist/components/mg-input-text2.js +67 -27
- package/dist/components/mg-input-text2.js.map +1 -1
- package/dist/components/mg-input-textarea.js +16 -12
- package/dist/components/mg-input-textarea.js.map +1 -1
- package/dist/components/mg-input-title.js +1 -0
- package/dist/components/mg-input-title2.js +6 -6
- package/dist/components/mg-input-title2.js.map +1 -1
- package/dist/components/mg-input-toggle.js +14 -10
- package/dist/components/mg-input-toggle.js.map +1 -1
- package/dist/components/mg-input.js +1 -0
- package/dist/components/mg-input2.js +20 -14
- package/dist/components/mg-input2.js.map +1 -1
- package/dist/components/mg-item-more.js +2 -1
- package/dist/components/mg-item-more2.js +18 -19
- package/dist/components/mg-item-more2.js.map +1 -1
- package/dist/components/mg-loader.js +10 -6
- package/dist/components/mg-loader.js.map +1 -1
- package/dist/components/mg-menu-item.js +1 -0
- package/dist/components/mg-menu-item2.js +16 -16
- package/dist/components/mg-menu-item2.js.map +1 -1
- package/dist/components/mg-menu.js +2 -1
- package/dist/components/mg-message.js +1 -0
- package/dist/components/mg-message2.js +6 -6
- package/dist/components/mg-message2.js.map +1 -1
- package/dist/components/mg-modal.js +13 -13
- package/dist/components/mg-modal.js.map +1 -1
- package/dist/components/mg-pagination.js +1 -0
- package/dist/components/mg-pagination2.js +19 -11
- package/dist/components/mg-pagination2.js.map +1 -1
- package/dist/components/mg-panel.js +18 -14
- package/dist/components/mg-panel.js.map +1 -1
- package/dist/components/mg-popover-content.js +1 -0
- package/dist/components/mg-popover-content2.js +5 -5
- package/dist/components/mg-popover-content2.js.map +1 -1
- package/dist/components/mg-popover.js +1 -0
- package/dist/components/mg-popover2.js +9 -9
- package/dist/components/mg-popover2.js.map +1 -1
- package/dist/components/mg-progress.js +12 -12
- package/dist/components/mg-progress.js.map +1 -1
- package/dist/components/mg-skip-links.js +4 -4
- package/dist/components/mg-skip-links.js.map +1 -1
- package/dist/components/mg-table.d.ts +11 -0
- package/dist/components/mg-table.js +320 -0
- package/dist/components/mg-table.js.map +1 -0
- package/dist/components/mg-tabs.js +14 -14
- package/dist/components/mg-tabs.js.map +1 -1
- package/dist/components/mg-tag.js +16 -8
- package/dist/components/mg-tag.js.map +1 -1
- package/dist/components/mg-tooltip-content.js +1 -0
- package/dist/components/mg-tooltip-content2.js +2 -2
- package/dist/components/mg-tooltip-content2.js.map +1 -1
- package/dist/components/mg-tooltip.js +1 -0
- package/dist/components/mg-tooltip2.js +13 -13
- package/dist/components/mg-tooltip2.js.map +1 -1
- package/dist/esm/app-globals-DQuL1Twl.js +6 -0
- package/dist/esm/app-globals-DQuL1Twl.js.map +1 -0
- package/dist/esm/{index-5059254f.js → index-CAuxALt5.js} +242 -174
- package/dist/esm/index-CAuxALt5.js.map +1 -0
- package/dist/esm/{index-a58f8b91.js → index-SQlkEaXW.js} +87 -42
- package/dist/esm/index-SQlkEaXW.js.map +1 -0
- package/dist/esm/index.es-DDBtzymI.js +130 -0
- package/dist/esm/index.es-DDBtzymI.js.map +1 -0
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +5 -4
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/{mg-action-more_36.entry.js → mg-action-more_37.entry.js} +842 -825
- package/dist/esm/mg-action-more_37.entry.js.map +1 -0
- package/dist/esm/mg-alert.entry.js +21 -13
- package/dist/esm/mg-alert.entry.js.map +1 -1
- package/dist/esm/mg-components.js +7 -5
- package/dist/esm/mg-components.js.map +1 -1
- package/dist/esm/mg-input-rich-text-editor.entry.js +21527 -6869
- package/dist/esm/mg-input-rich-text-editor.entry.js.map +1 -1
- package/dist/esm/{mg-input.conf-712c7bb6.js → mg-input.conf-BtkqaBXm.js} +2 -1
- package/dist/esm/mg-input.conf-BtkqaBXm.js.map +1 -0
- package/dist/esm/mg-loader.entry.js +12 -8
- package/dist/esm/mg-loader.entry.js.map +1 -1
- package/dist/esm/mg-progress.entry.js +13 -13
- package/dist/esm/mg-progress.entry.js.map +1 -1
- package/dist/mg-components/index.esm.js.map +1 -1
- package/dist/mg-components/loader.esm.js.map +1 -0
- package/dist/mg-components/locales/en/messages.json +37 -16
- package/dist/mg-components/locales/fr/messages.json +40 -19
- package/dist/mg-components/mg-alert.entry.esm.js.map +1 -0
- package/dist/mg-components/mg-components.esm.js +1 -1
- package/dist/mg-components/mg-components.esm.js.map +1 -1
- package/dist/mg-components/mg-input-rich-text-editor.entry.esm.js.map +1 -0
- package/dist/mg-components/mg-loader.entry.esm.js.map +1 -0
- package/dist/mg-components/mg-progress.entry.esm.js.map +1 -0
- package/dist/mg-components/p-583b3769.entry.js +2 -0
- package/dist/mg-components/p-583b3769.entry.js.map +1 -0
- package/dist/mg-components/p-650d6986.entry.js +11 -0
- package/dist/mg-components/p-650d6986.entry.js.map +1 -0
- package/dist/mg-components/p-680948e3.entry.js +2 -0
- package/dist/mg-components/p-680948e3.entry.js.map +1 -0
- package/dist/mg-components/p-9acc6504.entry.js +2 -0
- package/dist/mg-components/p-9acc6504.entry.js.map +1 -0
- package/dist/mg-components/{p-2884f369.js → p-BtkqaBXm.js} +1 -1
- package/dist/mg-components/p-BtkqaBXm.js.map +1 -0
- package/dist/mg-components/p-CAuxALt5.js +3 -0
- package/dist/mg-components/p-CAuxALt5.js.map +1 -0
- package/dist/mg-components/p-CqGbLOnN.js +2 -0
- package/dist/mg-components/p-CqGbLOnN.js.map +1 -0
- package/dist/mg-components/p-DDBtzymI.js +2 -0
- package/dist/mg-components/p-DDBtzymI.js.map +1 -0
- package/dist/mg-components/p-DQuL1Twl.js +2 -0
- package/dist/mg-components/p-DQuL1Twl.js.map +1 -0
- package/dist/mg-components/p-c0fb6f62.entry.js +2 -0
- package/dist/mg-components/p-c0fb6f62.entry.js.map +1 -0
- package/dist/types/components/atoms/mg-button/mg-button.d.ts +1 -1
- package/dist/types/components/atoms/mg-tag/mg-tag.d.ts +2 -2
- package/dist/types/components/atoms/mg-tooltip/mg-tooltip.d.ts +0 -1
- package/dist/types/components/molecules/inputs/mg-input/mg-input.d.ts +1 -4
- package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.d.ts +2 -2
- package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.d.ts +2 -2
- package/dist/types/components/molecules/inputs/mg-input-date/mg-input-date.conf.d.ts +1 -0
- package/dist/types/components/molecules/inputs/mg-input-date/mg-input-date.d.ts +1 -1
- package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.d.ts +7 -6
- package/dist/types/components/molecules/inputs/mg-input-password/mg-input-password.d.ts +2 -2
- package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.d.ts +9 -9
- package/dist/types/components/molecules/inputs/mg-input-select/mg-input-select.d.ts +1 -1
- package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.conf.d.ts +4 -2
- package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.d.ts +16 -10
- package/dist/types/components/molecules/inputs/mg-input-textarea/mg-input-textarea.d.ts +5 -5
- package/dist/types/components/molecules/inputs/mg-input-toggle/mg-input-toggle.d.ts +1 -1
- package/dist/types/components/molecules/internals/mg-item-more/mg-item-more.conf.d.ts +1 -1
- package/dist/types/components/molecules/mg-action-more/mg-action-more.conf.d.ts +1 -1
- package/dist/types/components/molecules/mg-action-more/mg-action-more.d.ts +1 -1
- package/dist/types/components/molecules/mg-form/mg-form.d.ts +1 -1
- package/dist/types/components/molecules/mg-loader/mg-loader.d.ts +1 -1
- package/dist/types/components/molecules/mg-pagination/mg-pagination.d.ts +2 -2
- package/dist/types/components/molecules/mg-panel/mg-panel.d.ts +1 -1
- package/dist/types/components/molecules/mg-popover/mg-popover.d.ts +1 -0
- package/dist/types/components/molecules/mg-table/mg-table.conf.d.ts +19 -0
- package/dist/types/components/molecules/mg-table/mg-table.d.ts +58 -0
- package/dist/types/components.d.ts +66 -27
- package/dist/types/stencil-public-runtime.d.ts +1 -0
- package/ide/intellij/web-types.json +157 -49
- package/ide/vscode/html-custom-data.json +111 -27
- package/package.json +25 -25
- package/dist/cjs/app-globals-3a1e7e63.js +0 -7
- package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
- package/dist/cjs/index-1a5a1081.js.map +0 -1
- package/dist/cjs/index-b7923724.js.map +0 -1
- package/dist/cjs/index.es-903492c5.js +0 -151
- package/dist/cjs/index.es-903492c5.js.map +0 -1
- package/dist/cjs/mg-action-more_36.cjs.entry.js.map +0 -1
- package/dist/cjs/mg-input.conf-5bbcea79.js.map +0 -1
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.conf.js.map +0 -1
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js.map +0 -1
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.conf.js.map +0 -1
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js.map +0 -1
- package/dist/esm/app-globals-0f993ce5.js +0 -5
- package/dist/esm/app-globals-0f993ce5.js.map +0 -1
- package/dist/esm/index-5059254f.js.map +0 -1
- package/dist/esm/index-a58f8b91.js.map +0 -1
- package/dist/esm/index.es-b80b758c.js +0 -129
- package/dist/esm/index.es-b80b758c.js.map +0 -1
- package/dist/esm/mg-action-more_36.entry.js.map +0 -1
- package/dist/esm/mg-input.conf-712c7bb6.js.map +0 -1
- package/dist/mg-components/p-2884f369.js.map +0 -1
- package/dist/mg-components/p-2a633b29.entry.js +0 -2
- package/dist/mg-components/p-2a633b29.entry.js.map +0 -1
- package/dist/mg-components/p-361cc090.entry.js +0 -2
- package/dist/mg-components/p-361cc090.entry.js.map +0 -1
- package/dist/mg-components/p-3afebdab.entry.js +0 -2
- package/dist/mg-components/p-3afebdab.entry.js.map +0 -1
- package/dist/mg-components/p-3c6710be.js +0 -2
- package/dist/mg-components/p-3c6710be.js.map +0 -1
- package/dist/mg-components/p-ac8a5083.js +0 -2
- package/dist/mg-components/p-ac8a5083.js.map +0 -1
- package/dist/mg-components/p-bc6ec847.entry.js +0 -2
- package/dist/mg-components/p-bc6ec847.entry.js.map +0 -1
- package/dist/mg-components/p-e1255160.js +0 -2
- package/dist/mg-components/p-e1255160.js.map +0 -1
- package/dist/mg-components/p-e39791fa.js +0 -3
- package/dist/mg-components/p-e39791fa.js.map +0 -1
- package/dist/mg-components/p-f2e6e7ae.entry.js +0 -2
- package/dist/mg-components/p-f2e6e7ae.entry.js.map +0 -1
- package/loader/package.json +0 -11
- /package/dist/collection/components/molecules/{menu → menus}/mg-menu/mg-menu.conf.js +0 -0
- /package/dist/collection/components/molecules/{menu → menus}/mg-menu-item/mg-menu-item.conf.js +0 -0
- /package/dist/types/components/molecules/{menu → menus}/mg-menu/mg-menu.conf.d.ts +0 -0
- /package/dist/types/components/molecules/{menu → menus}/mg-menu/mg-menu.d.ts +0 -0
- /package/dist/types/components/molecules/{menu → menus}/mg-menu-item/mg-menu-item.conf.d.ts +0 -0
- /package/dist/types/components/molecules/{menu → menus}/mg-menu-item/mg-menu-item.d.ts +0 -0
|
@@ -1,18 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { J as Jt } from './index.es.js';
|
|
2
2
|
|
|
3
3
|
const errors$1 = {
|
|
4
|
-
required: "This field is required."
|
|
5
|
-
date: {
|
|
6
|
-
badInput: "The date is incorrect, the format must be {pattern}",
|
|
7
|
-
min: "The date cannot be earlier than {min}",
|
|
8
|
-
max: "The date cannot be later than {max}",
|
|
9
|
-
minMax: "The date must be between {min} and {max}"
|
|
10
|
-
},
|
|
11
|
-
numeric: {
|
|
12
|
-
min: "The value cannot be less than {min}",
|
|
13
|
-
max: "The value cannot be greater than {max}",
|
|
14
|
-
minMax: "The value must be between {min} and {max}"
|
|
15
|
-
}
|
|
4
|
+
required: "This field is required."
|
|
16
5
|
};
|
|
17
6
|
const nbCharLeft$1 = "{counter} characters left.";
|
|
18
7
|
const input$1 = {
|
|
@@ -33,29 +22,58 @@ const input$1 = {
|
|
|
33
22
|
sections: {
|
|
34
23
|
selected: {
|
|
35
24
|
title: "Selected",
|
|
36
|
-
|
|
25
|
+
titlePlural: "Selected",
|
|
37
26
|
action: "Unselect all",
|
|
38
27
|
tooltip: "Unselect all current search results"
|
|
39
28
|
},
|
|
40
29
|
notSelected: {
|
|
41
30
|
title: "Not selected",
|
|
42
|
-
|
|
31
|
+
titlePlural: "Not selected",
|
|
43
32
|
action: "Select all",
|
|
44
33
|
tooltip: "Select all current search results"
|
|
45
34
|
}
|
|
46
35
|
}
|
|
47
36
|
},
|
|
48
37
|
date: {
|
|
49
|
-
helpText: "Expected format: {pattern} (ex: {date})",
|
|
50
38
|
pattern: {
|
|
51
39
|
dd: "dd",
|
|
52
40
|
mm: "mm",
|
|
53
41
|
yyyy: "yyyy"
|
|
42
|
+
},
|
|
43
|
+
helpText: {
|
|
44
|
+
expectedFormat: "Expected format: {pattern} (ex: {date})",
|
|
45
|
+
min: "The date must be after {min}",
|
|
46
|
+
max: "The date must be before {max}",
|
|
47
|
+
minMax: "The date must be between {min} and {max}"
|
|
48
|
+
},
|
|
49
|
+
error: {
|
|
50
|
+
badInput: "The date is inexistent or incorrect, the expected format is {pattern} (ex: {date})"
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
numeric: {
|
|
54
|
+
helpText: {
|
|
55
|
+
min: "The value must be greater than {min}",
|
|
56
|
+
max: "The value must be less than {max}",
|
|
57
|
+
minMax: "The value must be between {min} and {max}"
|
|
54
58
|
}
|
|
55
59
|
},
|
|
56
60
|
password: {
|
|
57
61
|
display: "Display password value",
|
|
58
62
|
hide: "Hide password value"
|
|
63
|
+
},
|
|
64
|
+
text: {
|
|
65
|
+
helpText: {
|
|
66
|
+
email: "Expected format: name@example.com",
|
|
67
|
+
emails: "Expected format: first@example.com, second@example.com",
|
|
68
|
+
url: "Expected format: https://example.com"
|
|
69
|
+
},
|
|
70
|
+
errors: {
|
|
71
|
+
typeMismatch: {
|
|
72
|
+
email: "The value is incorrect, the expected format is name@example.com",
|
|
73
|
+
emails: "The value is incorrect, the expected format is first@example.com, second@example.com",
|
|
74
|
+
url: "The value is incorrect, the expected format is https://example.com"
|
|
75
|
+
}
|
|
76
|
+
}
|
|
59
77
|
}
|
|
60
78
|
};
|
|
61
79
|
const form$1 = {
|
|
@@ -102,9 +120,12 @@ const actionMore$1 = {
|
|
|
102
120
|
label: "Actions"
|
|
103
121
|
};
|
|
104
122
|
const loader$1 = {
|
|
105
|
-
|
|
123
|
+
inProgress: "Loading in progress…"
|
|
124
|
+
};
|
|
125
|
+
const table$1 = {
|
|
126
|
+
sortableCaption: "(column headers with buttons are sortable)"
|
|
106
127
|
};
|
|
107
|
-
|
|
128
|
+
var en = {
|
|
108
129
|
errors: errors$1,
|
|
109
130
|
nbCharLeft: nbCharLeft$1,
|
|
110
131
|
input: input$1,
|
|
@@ -118,22 +139,12 @@ const en = {
|
|
|
118
139
|
menuItem: menuItem$1,
|
|
119
140
|
itemMore: itemMore$1,
|
|
120
141
|
actionMore: actionMore$1,
|
|
121
|
-
loader: loader$1
|
|
142
|
+
loader: loader$1,
|
|
143
|
+
table: table$1
|
|
122
144
|
};
|
|
123
145
|
|
|
124
146
|
const errors = {
|
|
125
|
-
required: "Ce champ est obligatoire."
|
|
126
|
-
date: {
|
|
127
|
-
badInput: "La date est incorrecte, le format doit être du type {pattern}",
|
|
128
|
-
min: "La date ne peut pas être antérieure au {min}",
|
|
129
|
-
max: "La date ne peut pas être postérieure au {max}",
|
|
130
|
-
minMax: "La date doit être comprise entre le {min} et le {max}"
|
|
131
|
-
},
|
|
132
|
-
numeric: {
|
|
133
|
-
min: "La valeur ne peut pas être inférieure à {min}",
|
|
134
|
-
max: "La valeur ne peut pas être supérieure à {max}",
|
|
135
|
-
minMax: "La valeur doit être comprise entre {min} et {max}"
|
|
136
|
-
}
|
|
147
|
+
required: "Ce champ est obligatoire."
|
|
137
148
|
};
|
|
138
149
|
const nbCharLeft = "{counter} caractères disponibles.";
|
|
139
150
|
const input = {
|
|
@@ -141,42 +152,71 @@ const input = {
|
|
|
141
152
|
placeholder: "Sélectionnez une valeur"
|
|
142
153
|
},
|
|
143
154
|
checkbox: {
|
|
144
|
-
selectedValues: "{nb} valeurs
|
|
145
|
-
selectedValue: "{nb} valeur
|
|
155
|
+
selectedValues: "{nb} valeurs sélectionnées",
|
|
156
|
+
selectedValue: "{nb} valeur sélectionnée",
|
|
146
157
|
editButton: "Modifier",
|
|
147
158
|
selectButton: "Sélectionner des valeurs",
|
|
148
159
|
showButton: "Voir",
|
|
149
160
|
label: "Saisissez une valeur",
|
|
150
161
|
result: "résultat",
|
|
151
162
|
results: "résultats",
|
|
152
|
-
searchResults: "
|
|
163
|
+
searchResults: "Liste de résultat(s) de la recherche.",
|
|
153
164
|
noResult: "Aucun résultat.",
|
|
154
165
|
sections: {
|
|
155
166
|
selected: {
|
|
156
167
|
title: "Sélectionné",
|
|
157
|
-
|
|
168
|
+
titlePlural: "Sélectionnés",
|
|
158
169
|
action: "Tout désélectionner",
|
|
159
170
|
tooltip: "Désélectionne tous les résultats de la recherche en cours"
|
|
160
171
|
},
|
|
161
172
|
notSelected: {
|
|
162
173
|
title: "Non sélectionné",
|
|
163
|
-
|
|
174
|
+
titlePlural: "Non sélectionnés",
|
|
164
175
|
action: "Tout sélectionner",
|
|
165
176
|
tooltip: "Sélectionne tous les résultats de la recherche en cours"
|
|
166
177
|
}
|
|
167
178
|
}
|
|
168
179
|
},
|
|
169
180
|
date: {
|
|
170
|
-
helpText: "Format attendu : {pattern} (ex : {date})",
|
|
171
181
|
pattern: {
|
|
172
182
|
dd: "jj",
|
|
173
183
|
mm: "mm",
|
|
174
184
|
yyyy: "aaaa"
|
|
185
|
+
},
|
|
186
|
+
helpText: {
|
|
187
|
+
expectedFormat: "Format attendu : {pattern} (ex : {date})",
|
|
188
|
+
min: "La date doit être postérieure au {min}",
|
|
189
|
+
max: "La date doit être antérieure au {max}",
|
|
190
|
+
minMax: "La date doit être comprise entre le {min} et le {max}"
|
|
191
|
+
},
|
|
192
|
+
error: {
|
|
193
|
+
badInput: "La date est inexistante ou incorrecte, le format attendu est {pattern} (ex : {date})"
|
|
194
|
+
}
|
|
195
|
+
},
|
|
196
|
+
numeric: {
|
|
197
|
+
helpText: {
|
|
198
|
+
min: "La valeur doit être supérieure à {min}",
|
|
199
|
+
max: "La valeur doit être inférieure à {max}",
|
|
200
|
+
minMax: "La valeur doit être comprise entre {min} et {max}"
|
|
175
201
|
}
|
|
176
202
|
},
|
|
177
203
|
password: {
|
|
178
204
|
display: "Afficher le mot de passe",
|
|
179
205
|
hide: "Masquer le mot de passe"
|
|
206
|
+
},
|
|
207
|
+
text: {
|
|
208
|
+
helpText: {
|
|
209
|
+
email: "Format attendu : nom@exemple.fr",
|
|
210
|
+
emails: "Format attendu : premier@exemple.fr, second@exemple.fr",
|
|
211
|
+
url: "Format attendu : https://exemple.fr"
|
|
212
|
+
},
|
|
213
|
+
errors: {
|
|
214
|
+
typeMismatch: {
|
|
215
|
+
email: "La valeur est incorrecte, le format attendu est nom@exemple.fr",
|
|
216
|
+
emails: "La valeur est incorrecte, le format attendu est premier@exemple.fr, second@exemple.fr",
|
|
217
|
+
url: "La valeur est incorrecte, le format attendu est https://exemple.fr"
|
|
218
|
+
}
|
|
219
|
+
}
|
|
180
220
|
}
|
|
181
221
|
};
|
|
182
222
|
const form = {
|
|
@@ -223,9 +263,12 @@ const actionMore = {
|
|
|
223
263
|
label: "Actions"
|
|
224
264
|
};
|
|
225
265
|
const loader = {
|
|
226
|
-
|
|
266
|
+
inProgress: "Chargement en cours…"
|
|
267
|
+
};
|
|
268
|
+
const table = {
|
|
269
|
+
sortableCaption: "(les en-têtes de colonnes avec des boutons peuvent être triés)"
|
|
227
270
|
};
|
|
228
|
-
|
|
271
|
+
var fr = {
|
|
229
272
|
errors: errors,
|
|
230
273
|
nbCharLeft: nbCharLeft,
|
|
231
274
|
input: input,
|
|
@@ -239,7 +282,8 @@ const fr = {
|
|
|
239
282
|
menuItem: menuItem,
|
|
240
283
|
itemMore: itemMore,
|
|
241
284
|
actionMore: actionMore,
|
|
242
|
-
loader: loader
|
|
285
|
+
loader: loader,
|
|
286
|
+
table: table
|
|
243
287
|
};
|
|
244
288
|
|
|
245
289
|
const defaultLocale = 'en';
|
|
@@ -249,8 +293,9 @@ const messages = { en, fr };
|
|
|
249
293
|
* @param element - element we need to get the language
|
|
250
294
|
* @returns messages object
|
|
251
295
|
*/
|
|
252
|
-
const initLocales =
|
|
296
|
+
const initLocales = Jt(messages, defaultLocale);
|
|
253
297
|
|
|
254
298
|
export { initLocales as i };
|
|
299
|
+
//# sourceMappingURL=index2.js.map
|
|
255
300
|
|
|
256
301
|
//# sourceMappingURL=index2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"index2.js","mappings":"
|
|
1
|
+
{"file":"index2.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,aAAa,GAAG,IAAI;AAC1B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE;AAE3B;;;;AAIG;AACU,MAAA,WAAW,GAAGA,EAAa,CAAC,QAAQ,EAAE,aAAa;;;;","names":["defineLocales"],"sources":["src/locales/index.ts"],"sourcesContent":["import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { defineLocales } from '@mgdis/stencil-helpers';\n\nconst defaultLocale = 'en';\nconst messages = { en, fr };\n\n/**\n * Get Intl object\n * @param element - element we need to get the language\n * @returns messages object\n */\nexport const initLocales = defineLocales(messages, defaultLocale);\n"],"version":3}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { x as xt, z as zt } from './index.es.js';
|
|
3
3
|
import { d as defineCustomElement$4, a as directions, S as Status } from './mg-menu-item2.js';
|
|
4
4
|
import { i as initLocales } from './index2.js';
|
|
5
5
|
import { d as defineCustomElement$b } from './mg-badge2.js';
|
|
@@ -7,12 +7,11 @@ import { d as defineCustomElement$a } from './mg-button2.js';
|
|
|
7
7
|
import { d as defineCustomElement$9 } from './mg-card2.js';
|
|
8
8
|
import { d as defineCustomElement$8 } from './mg-divider2.js';
|
|
9
9
|
import { d as defineCustomElement$7 } from './mg-icon2.js';
|
|
10
|
-
import {
|
|
10
|
+
import { b as defineCustomElement$5, d as defineCustomElement$6 } from './mg-item-more2.js';
|
|
11
11
|
import { d as defineCustomElement$3 } from './mg-popover2.js';
|
|
12
12
|
import { d as defineCustomElement$2 } from './mg-popover-content2.js';
|
|
13
13
|
|
|
14
14
|
const mgActionMoreCss = ".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{--mg-c-popover-padding-vertical:var(--mg-b-size-8);--mg-c-popover-padding-horizontal:0;--mg-c-popover-max-width:unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical:var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}";
|
|
15
|
-
const MgActionMoreStyle0 = mgActionMoreCss;
|
|
16
15
|
|
|
17
16
|
/**
|
|
18
17
|
* MgActionMore['items'] type guard
|
|
@@ -58,11 +57,15 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
|
|
|
58
57
|
************/
|
|
59
58
|
this.name = 'mg-action-more';
|
|
60
59
|
this.classBase = 'mg-c-action-more';
|
|
61
|
-
this.mgPopoverIdentifier =
|
|
60
|
+
this.mgPopoverIdentifier = xt(this.name);
|
|
62
61
|
/**
|
|
63
62
|
* Define button properties
|
|
64
63
|
*/
|
|
65
64
|
this.button = { variant: 'flat', isIcon: true };
|
|
65
|
+
/**
|
|
66
|
+
* Define if chevron is display
|
|
67
|
+
*/
|
|
68
|
+
this.displayChevron = false;
|
|
66
69
|
/**
|
|
67
70
|
* Menu expanded state
|
|
68
71
|
*/
|
|
@@ -101,15 +104,15 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
|
|
|
101
104
|
}
|
|
102
105
|
validateItems(newValue) {
|
|
103
106
|
if (!isMgActionMoreItems(newValue)) {
|
|
104
|
-
throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${
|
|
107
|
+
throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${zt(newValue)}.`);
|
|
105
108
|
}
|
|
106
109
|
else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {
|
|
107
|
-
throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${
|
|
110
|
+
throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${zt(newValue)}.`);
|
|
108
111
|
}
|
|
109
112
|
}
|
|
110
113
|
validateIcon(newValue) {
|
|
111
114
|
if (newValue && !isMgActionMoreIcon(newValue)) {
|
|
112
|
-
throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${
|
|
115
|
+
throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${zt(newValue)}.`);
|
|
113
116
|
}
|
|
114
117
|
else if ((newValue === null || newValue === void 0 ? void 0 : newValue.icon) === undefined && Boolean(this.button.isIcon)) {
|
|
115
118
|
this.icon = { icon: 'ellipsis' };
|
|
@@ -117,7 +120,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
|
|
|
117
120
|
}
|
|
118
121
|
validateButton(newValue) {
|
|
119
122
|
if (newValue && !isMgActionMoreButton(newValue)) {
|
|
120
|
-
throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${
|
|
123
|
+
throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${zt(newValue)}.`);
|
|
121
124
|
}
|
|
122
125
|
}
|
|
123
126
|
validateDisplayChevron(newValue) {
|
|
@@ -165,7 +168,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
|
|
|
165
168
|
"button": ["validateButton"],
|
|
166
169
|
"displayChevron": ["validateDisplayChevron"]
|
|
167
170
|
}; }
|
|
168
|
-
static get style() { return
|
|
171
|
+
static get style() { return mgActionMoreCss; }
|
|
169
172
|
}, [1, "mg-action-more", {
|
|
170
173
|
"items": [16],
|
|
171
174
|
"icon": [1040],
|
|
@@ -247,5 +250,6 @@ const MgActionMore = MgActionMore$1;
|
|
|
247
250
|
const defineCustomElement = defineCustomElement$1;
|
|
248
251
|
|
|
249
252
|
export { MgActionMore, defineCustomElement };
|
|
253
|
+
//# sourceMappingURL=mg-action-more.js.map
|
|
250
254
|
|
|
251
255
|
//# sourceMappingURL=mg-action-more.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"mg-action-more.js","mappings":"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","names":["MgActionMore","createID","toString"],"sources":["../styles/dist/components/mg-action-more.css?tag=mg-action-more&encapsulation=shadow","src/components/molecules/mg-action-more/mg-action-more.tsx"],"sourcesContent":[".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{--mg-c-popover-padding-vertical: var(--mg-b-size-8);--mg-c-popover-padding-horizontal: 0;--mg-c-popover-max-width: unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical: var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}/*# sourceMappingURL=mg-action-more.css.map */\n","import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { createID, toString } from '@mgdis/stencil-helpers';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { directions } from '../menu/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../locales';\nimport type { MessageType } from '../../../locales/index.conf';\nimport type { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreDividerType } from './mg-action-more.conf';\n\n/**\n * MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n const items = prop as MgActionMoreItemType[];\n return (\n typeof items === 'object' &&\n items.every(item => (typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function') || isMgActionMoreDivider(item))\n );\n};\n\n/**\n * MgActionMoreDividerType type guard\n * @param item - component item\n * @returns return true if type is valid\n */\nconst isMgActionMoreDivider = (item: unknown): item is MgActionMoreDividerType => typeof item === 'object' && (item as MgActionMoreDividerType).isDivider;\n\n/**\n * MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n const button = prop as MgActionMoreButtonType;\n return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/**\n * MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n const icon = prop as MgActionMoreIconType;\n return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n tag: 'mg-action-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n shadow: true,\n})\nexport class MgActionMore {\n /************\n * Internal *\n ************/\n\n private readonly name = 'mg-action-more';\n private readonly classBase = 'mg-c-action-more';\n private readonly mgPopoverIdentifier = createID(this.name);\n private messages: MessageType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgActionMoreElement;\n\n /**\n * Define the menu-items elements\n */\n @Prop() items!: (MgActionMoreItemType | MgActionMoreDividerType)[];\n @Watch('items')\n validateItems(newValue: MgActionMore['items']): void {\n if (!isMgActionMoreItems(newValue)) {\n throw new Error(\n `<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${toString(newValue)}.`,\n );\n } else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {\n throw new Error(`<${this.name}> prop \"items\" can’t have a divider at the beginning or the end of the array. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define displayed icon\n */\n @Prop({ mutable: true }) icon?: MgActionMoreIconType;\n @Watch('icon')\n validateIcon(newValue: MgActionMore['icon']): void {\n if (newValue && !isMgActionMoreIcon(newValue)) {\n throw new Error(`<${this.name}> prop \"icon\" must match MgActionMoreIconType. Passed value: ${toString(newValue)}.`);\n } else if (newValue?.icon === undefined && Boolean(this.button.isIcon)) {\n this.icon = { icon: 'ellipsis' };\n }\n }\n\n /**\n * Define button properties\n */\n @Prop() button?: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n @Watch('button')\n validateButton(newValue: MgActionMore['button']): void {\n if (newValue && !isMgActionMoreButton(newValue)) {\n throw new Error(`<${this.name}> prop \"button\" must match MgActionMoreButtonType. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define if chevron is display\n */\n @Prop() displayChevron?: boolean;\n @Watch('displayChevron')\n validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n if (newValue && this.button.isIcon === true) {\n throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n }\n }\n /**\n * Menu expanded state\n */\n @State() expanded = false;\n\n /************\n * Methods *\n ***********/\n\n /**\n * Toggle expanded props\n */\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Handle popover display change value\n * @param event - display change updated value\n */\n private handleDisplayChange = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /**\n * Button click handler\n */\n private handleButton = (): void => {\n this.toggleExpanded();\n };\n\n /**\n * Item click handler\n * @param event - click event\n * @param customHandler - item['mouseEventHandler']\n */\n private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n this.expanded = false;\n customHandler(event);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Validate props\n */\n componentWillLoad(): void {\n this.messages = initLocales(this.element).messages.actionMore as MessageType;\n this.validateItems(this.items);\n this.validateButton(this.button);\n this.validateIcon(this.icon);\n this.validateDisplayChevron(this.displayChevron);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const buttonLabel = this.button.label || this.messages.label;\n const buttonContent = [buttonLabel];\n\n if (!this.button.isIcon && this.displayChevron) {\n buttonContent.push(\n <span\n class={{\n [`${this.classBase}__chevron`]: true,\n [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\"></mg-icon>\n </span>,\n );\n }\n\n return (\n <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n <span class={this.classBase}>\n <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n {this.icon && <mg-icon {...this.icon}></mg-icon>}\n {!this.button.isIcon && buttonContent}\n </mg-button>\n <div slot=\"content\">\n <mg-menu direction={directions.VERTICAL} label={this.messages.label}>\n {this.items.map(item =>\n isMgActionMoreDivider(item) ? (\n <mg-divider class=\"mg-c-action-more__divider\" key=\"divider\"></mg-divider>\n ) : (\n <mg-menu-item\n key={item.label}\n status={item.status || Status.VISIBLE}\n target={item.target}\n href={item.href}\n // eslint-disable-next-line react/jsx-no-bind\n onClick={e => this.handleItemClick(e, item.mouseEventHandler)}\n >\n {item.icon?.icon && <mg-icon icon={item.icon.icon} variant={item.icon.variant} variantStyle={item.icon.variantStyle} slot=\"image\"></mg-icon>}\n <span slot=\"label\">{item.label}</span>\n {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n </mg-menu-item>\n ),\n )}\n </mg-menu>\n </div>\n </mg-popover>\n </span>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"mg-action-more.js","mappings":"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","names":["MgActionMore","__stencil_proxyCustomElement","createID","toString"],"sources":["../styles/dist/components/mg-action-more.css?tag=mg-action-more&encapsulation=shadow","src/components/molecules/mg-action-more/mg-action-more.tsx"],"sourcesContent":[".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{--mg-c-popover-padding-vertical: var(--mg-b-size-8);--mg-c-popover-padding-horizontal: 0;--mg-c-popover-max-width: unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical: var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}/*# sourceMappingURL=mg-action-more.css.map */\n","import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { createID, toString } from '@mgdis/stencil-helpers';\nimport { Status } from '../menus/mg-menu-item/mg-menu-item.conf';\nimport { directions } from '../menus/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../locales';\nimport type { MessageType } from '../../../locales/index.conf';\nimport type { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreDividerType } from './mg-action-more.conf';\n\n/**\n * MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n const items = prop as MgActionMoreItemType[];\n return (\n typeof items === 'object' &&\n items.every(item => (typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function') || isMgActionMoreDivider(item))\n );\n};\n\n/**\n * MgActionMoreDividerType type guard\n * @param item - component item\n * @returns return true if type is valid\n */\nconst isMgActionMoreDivider = (item: unknown): item is MgActionMoreDividerType => typeof item === 'object' && (item as MgActionMoreDividerType).isDivider;\n\n/**\n * MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n const button = prop as MgActionMoreButtonType;\n return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/**\n * MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n const icon = prop as MgActionMoreIconType;\n return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n tag: 'mg-action-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n shadow: true,\n})\nexport class MgActionMore {\n /************\n * Internal *\n ************/\n\n private readonly name = 'mg-action-more';\n private readonly classBase = 'mg-c-action-more';\n private readonly mgPopoverIdentifier = createID(this.name);\n private messages: MessageType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgActionMoreElement;\n\n /**\n * Define the menu-items elements\n */\n @Prop() items!: (MgActionMoreItemType | MgActionMoreDividerType)[];\n @Watch('items')\n validateItems(newValue: MgActionMore['items']): void {\n if (!isMgActionMoreItems(newValue)) {\n throw new Error(\n `<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${toString(newValue)}.`,\n );\n } else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {\n throw new Error(`<${this.name}> prop \"items\" can’t have a divider at the beginning or the end of the array. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define displayed icon\n */\n @Prop({ mutable: true }) icon?: MgActionMoreIconType;\n @Watch('icon')\n validateIcon(newValue: MgActionMore['icon']): void {\n if (newValue && !isMgActionMoreIcon(newValue)) {\n throw new Error(`<${this.name}> prop \"icon\" must match MgActionMoreIconType. Passed value: ${toString(newValue)}.`);\n } else if (newValue?.icon === undefined && Boolean(this.button.isIcon)) {\n this.icon = { icon: 'ellipsis' };\n }\n }\n\n /**\n * Define button properties\n */\n @Prop() button?: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n @Watch('button')\n validateButton(newValue: MgActionMore['button']): void {\n if (newValue && !isMgActionMoreButton(newValue)) {\n throw new Error(`<${this.name}> prop \"button\" must match MgActionMoreButtonType. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define if chevron is display\n */\n @Prop() displayChevron = false;\n @Watch('displayChevron')\n validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n if (newValue && this.button.isIcon === true) {\n throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n }\n }\n /**\n * Menu expanded state\n */\n @State() expanded = false;\n\n /************\n * Methods *\n ***********/\n\n /**\n * Toggle expanded props\n */\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Handle popover display change value\n * @param event - display change updated value\n */\n private handleDisplayChange = (event: CustomEvent): void => {\n this.expanded = event.detail;\n };\n\n /**\n * Button click handler\n */\n private handleButton = (): void => {\n this.toggleExpanded();\n };\n\n /**\n * Item click handler\n * @param event - click event\n * @param customHandler - item['mouseEventHandler']\n */\n private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n this.expanded = false;\n customHandler(event);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Validate props\n */\n componentWillLoad(): void {\n this.messages = initLocales(this.element).messages.actionMore as MessageType;\n this.validateItems(this.items);\n this.validateButton(this.button);\n this.validateIcon(this.icon);\n this.validateDisplayChevron(this.displayChevron);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const buttonLabel = this.button.label || this.messages.label;\n const buttonContent = [buttonLabel];\n\n if (!this.button.isIcon && this.displayChevron) {\n buttonContent.push(\n <span\n class={{\n [`${this.classBase}__chevron`]: true,\n [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n }}\n >\n <mg-icon icon=\"chevron-down\"></mg-icon>\n </span>,\n );\n }\n\n return (\n <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n <span class={this.classBase}>\n <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n {this.icon && <mg-icon {...this.icon}></mg-icon>}\n {!this.button.isIcon && buttonContent}\n </mg-button>\n <div slot=\"content\">\n <mg-menu direction={directions.VERTICAL} label={this.messages.label}>\n {this.items.map(item =>\n isMgActionMoreDivider(item) ? (\n <mg-divider class=\"mg-c-action-more__divider\" key=\"divider\"></mg-divider>\n ) : (\n <mg-menu-item\n key={item.label}\n status={item.status || Status.VISIBLE}\n target={item.target}\n href={item.href}\n // eslint-disable-next-line react/jsx-no-bind\n onClick={e => this.handleItemClick(e, item.mouseEventHandler)}\n >\n {item.icon?.icon && <mg-icon icon={item.icon.icon} variant={item.icon.variant} variantStyle={item.icon.variantStyle} slot=\"image\"></mg-icon>}\n <span slot=\"label\">{item.label}</span>\n {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n </mg-menu-item>\n ),\n )}\n </mg-menu>\n </div>\n </mg-popover>\n </span>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
|
|
2
|
-
import {
|
|
2
|
+
import { k as kt, z as zt } from './index.es.js';
|
|
3
3
|
import { i as initLocales } from './index2.js';
|
|
4
4
|
import { d as defineCustomElement$5 } from './mg-button2.js';
|
|
5
5
|
import { d as defineCustomElement$4 } from './mg-card2.js';
|
|
@@ -16,7 +16,6 @@ const variants = ['info', 'warning', 'success', 'danger'];
|
|
|
16
16
|
const variantStyles = ['bar-left', 'background'];
|
|
17
17
|
|
|
18
18
|
const mgAlertCss = ".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing:0 var(--mg-b-size-min-height) 0 0}";
|
|
19
|
-
const MgAlertStyle0 = mgAlertCss;
|
|
20
19
|
|
|
21
20
|
const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLElement {
|
|
22
21
|
constructor() {
|
|
@@ -36,10 +35,18 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
|
|
|
36
35
|
// Manage hover
|
|
37
36
|
this.isFocused = false;
|
|
38
37
|
this.isHovered = false;
|
|
38
|
+
/**
|
|
39
|
+
* Define variant
|
|
40
|
+
*/
|
|
41
|
+
this.variant = 'info';
|
|
42
|
+
/**
|
|
43
|
+
* Define variant style
|
|
44
|
+
*/
|
|
45
|
+
this.variantStyle = 'bar-left';
|
|
39
46
|
/**
|
|
40
47
|
* Component classes
|
|
41
48
|
*/
|
|
42
|
-
this.classCollection = new
|
|
49
|
+
this.classCollection = new kt(['mg-c-alert']);
|
|
43
50
|
/**
|
|
44
51
|
* Define if component is using actions slot
|
|
45
52
|
*/
|
|
@@ -83,17 +90,17 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
|
|
|
83
90
|
}
|
|
84
91
|
watchDelay(newValue) {
|
|
85
92
|
if (newValue !== undefined && newValue < 2) {
|
|
86
|
-
throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${
|
|
93
|
+
throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${zt(newValue)}.`);
|
|
87
94
|
}
|
|
88
95
|
}
|
|
89
96
|
watchVariant(newValue) {
|
|
90
97
|
if (newValue && !variants.includes(newValue)) {
|
|
91
|
-
throw new Error(`<mg-alert> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${
|
|
98
|
+
throw new Error(`<mg-alert> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
92
99
|
}
|
|
93
100
|
}
|
|
94
101
|
watchVariantStyle(newValue) {
|
|
95
102
|
if (newValue && !variantStyles.includes(newValue)) {
|
|
96
|
-
throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${
|
|
103
|
+
throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
97
104
|
}
|
|
98
105
|
}
|
|
99
106
|
/**
|
|
@@ -152,7 +159,7 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
|
|
|
152
159
|
* @returns HTML Element
|
|
153
160
|
*/
|
|
154
161
|
render() {
|
|
155
|
-
return (h("mg-message", { key: '
|
|
162
|
+
return (h("mg-message", { key: '251ddbb383261a86359137a9b82f89b9475e7b7f', class: this.classCollection.join(), role: ['info', 'success'].includes(this.variant) ? 'status' : 'alert', variant: this.variant, variantStyle: this.variantStyle }, h("slot", { key: '67b12fa0ce186121083b220e546d3254ed644c16' }), this.hasActions ? (h("span", { slot: "actions" }, h("slot", { name: "actions" }))) : (h("span", { class: "mg-c-alert__close-button" }, h("mg-button", { "is-icon": true, variant: "flat", label: this.messages.alert.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" }))))));
|
|
156
163
|
}
|
|
157
164
|
get element() { return this; }
|
|
158
165
|
static get watchers() { return {
|
|
@@ -161,7 +168,7 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
|
|
|
161
168
|
"variantStyle": ["watchVariantStyle"],
|
|
162
169
|
"hidden": ["watchHidden"]
|
|
163
170
|
}; }
|
|
164
|
-
static get style() { return
|
|
171
|
+
static get style() { return mgAlertCss; }
|
|
165
172
|
}, [1, "mg-alert", {
|
|
166
173
|
"delay": [2],
|
|
167
174
|
"variant": [1],
|
|
@@ -213,5 +220,6 @@ const MgAlert = MgAlert$1;
|
|
|
213
220
|
const defineCustomElement = defineCustomElement$1;
|
|
214
221
|
|
|
215
222
|
export { MgAlert, defineCustomElement };
|
|
223
|
+
//# sourceMappingURL=mg-alert.js.map
|
|
216
224
|
|
|
217
225
|
//# sourceMappingURL=mg-alert.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"mg-alert.js","mappings":"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","names":["MgAlert","ClassList","toString"],"sources":["src/components/molecules/mg-alert/mg-alert.conf.ts","../styles/dist/components/mg-alert.css?tag=mg-alert&encapsulation=shadow","src/components/molecules/mg-alert/mg-alert.tsx"],"sourcesContent":["import type { Variant, VariantStyle } from '../../../types';\n\n/**\n * List available variants\n */\nexport const variants = ['info', 'warning', 'success', 'danger'] as const;\n\n/**\n * Variant type\n */\nexport type VariantType = Variant & (typeof variants)[number];\n\n/**\n * List available variant styles\n */\nexport const variantStyles = ['bar-left', 'background'] as const;\n\n/**\n * VariantStyle type\n */\nexport type VariantStyleType = VariantStyle & (typeof variantStyles)[number];\n",".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing: 0 var(--mg-b-size-min-height) 0 0}/*# sourceMappingURL=mg-alert.css.map */\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch, forceUpdate } from '@stencil/core';\nimport { ClassList, toString } from '@mgdis/stencil-helpers';\nimport { variants, variantStyles, VariantStyleType, VariantType } from './mg-alert.conf';\nimport { initLocales } from '../../../locales';\n\n/**\n * @slot - Alert content\n * @slot actions - Actions content\n */\n@Component({\n tag: 'mg-alert',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-alert.css',\n shadow: true,\n})\nexport class MgAlert {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classCloseButton = 'mg-c-alert--close-button';\n\n // Stored timer setted when hide action is run from setTimeOut\n private storedTimer: ReturnType<typeof setTimeout> = null;\n\n // Manage hover\n private isFocused = false;\n private isHovered = false;\n\n // Locales\n private messages;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgAlertElement;\n\n /**\n * Add a delay to hide/close message when it passed\n * Value is defined in seconds and must greater than 2 seconds\n */\n @Prop() delay?: number;\n @Watch('delay')\n watchDelay(newValue: MgAlert['delay']): void {\n if (newValue !== undefined && newValue < 2) {\n throw new Error(`<mg-alert> prop \"delay\" must be greater than 2 seconds. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define variant\n */\n @Prop() variant?: VariantType;\n @Watch('variant')\n watchVariant(newValue: MgAlert['variant']): void {\n if (newValue && !variants.includes(newValue)) {\n throw new Error(`<mg-alert> prop \"variant\" must be one of: ${variants.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define variant style\n */\n @Prop() variantStyle?: VariantStyleType;\n @Watch('variantStyle')\n watchVariantStyle(newValue: MgAlert['variantStyle']): void {\n if (newValue && !variantStyles.includes(newValue)) {\n throw new Error(`<mg-alert> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Watch hidden prop\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('hidden')\n watchHidden(newValue: boolean): void {\n if (typeof newValue === 'string' && newValue === '') {\n newValue = true;\n }\n if (newValue) {\n this.componentHide.emit();\n // Remove event Listener\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.removeEventListener(event, this.timerEvents);\n });\n // Clear Timer\n this.clearTimer();\n } else {\n this.componentShow.emit();\n // If delay is set\n if (this.delay > 1) {\n // Start timer\n this.setTimer();\n // Stop timer when get focus or mouse enter\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.addEventListener(event, this.timerEvents);\n });\n }\n }\n forceUpdate(this);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-alert']);\n\n /**\n * Define if component is using actions slot\n */\n @State() hasActions = false;\n\n /**\n * Emited event when alert is diplayed\n */\n @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n /**\n * Emited event when alert is hidden\n */\n @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n /**\n * Emmited event when alert is closed\n */\n @Event({ eventName: 'component-close' }) componentClose: EventEmitter<void>;\n\n /**\n * Set timer\n */\n private setTimer = (): void => {\n this.storedTimer = setTimeout(() => (this.element.hidden = true), this.delay * 1000);\n };\n\n /**\n * Clear timer\n */\n private clearTimer = (): void => {\n clearTimeout(this.storedTimer);\n };\n\n /**\n * Event to add on element\n * @param event - event\n */\n private timerEvents = (event: MouseEvent | FocusEvent): void => {\n this.clearTimer();\n const isMouseEvent: boolean = event.type === 'mouseenter';\n // Needed to ensure we don't start the timer\n this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n // Restart timer when loose focus AND mouse leave\n this.element.addEventListener(\n isMouseEvent ? 'mouseleave' : 'focusout',\n eventOut => {\n this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n // Start timer if needed\n if (!this.isFocused && !this.isHovered) this.setTimer();\n },\n { once: true },\n );\n };\n\n /**\n * Handle close button\n */\n private handleClose = (): void => {\n this.element.hidden = true;\n this.componentClose.emit();\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.watchVariant(this.variant);\n this.watchVariantStyle(this.variantStyle);\n this.watchDelay(this.delay);\n this.watchHidden(this.element.hidden);\n // Check if component has actions slot\n this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n if (!this.hasActions) {\n this.classCollection.add(this.classCloseButton);\n }\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-message\n class={this.classCollection.join()}\n role={['info', 'success'].includes(this.variant) ? 'status' : 'alert'}\n variant={this.variant}\n variantStyle={this.variantStyle}\n >\n <slot></slot>\n {this.hasActions ? (\n <span slot=\"actions\">\n <slot name=\"actions\"></slot>\n </span>\n ) : (\n <span class=\"mg-c-alert__close-button\">\n <mg-button is-icon variant=\"flat\" label={this.messages.alert.closeButton} onClick={this.handleClose}>\n <mg-icon icon=\"cross\"></mg-icon>\n </mg-button>\n </span>\n )}\n </mg-message>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"mg-alert.js","mappings":"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","names":["MgAlert","__stencil_proxyCustomElement","ClassList","toString"],"sources":["src/components/molecules/mg-alert/mg-alert.conf.ts","../styles/dist/components/mg-alert.css?tag=mg-alert&encapsulation=shadow","src/components/molecules/mg-alert/mg-alert.tsx"],"sourcesContent":["import type { Variant, VariantStyle } from '../../../types';\n\n/**\n * List available variants\n */\nexport const variants = ['info', 'warning', 'success', 'danger'] as const;\n\n/**\n * Variant type\n */\nexport type VariantType = Variant & (typeof variants)[number];\n\n/**\n * List available variant styles\n */\nexport const variantStyles = ['bar-left', 'background'] as const;\n\n/**\n * VariantStyle type\n */\nexport type VariantStyleType = VariantStyle & (typeof variantStyles)[number];\n",".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing: 0 var(--mg-b-size-min-height) 0 0}/*# sourceMappingURL=mg-alert.css.map */\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch, forceUpdate } from '@stencil/core';\nimport { ClassList, toString } from '@mgdis/stencil-helpers';\nimport { variants, variantStyles, VariantStyleType, VariantType } from './mg-alert.conf';\nimport { initLocales } from '../../../locales';\n\n/**\n * @slot - Alert content\n * @slot actions - Actions content\n */\n@Component({\n tag: 'mg-alert',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-alert.css',\n shadow: true,\n})\nexport class MgAlert {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classCloseButton = 'mg-c-alert--close-button';\n\n // Stored timer setted when hide action is run from setTimeOut\n private storedTimer: ReturnType<typeof setTimeout> = null;\n\n // Manage hover\n private isFocused = false;\n private isHovered = false;\n\n // Locales\n private messages;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgAlertElement;\n\n /**\n * Add a delay to hide/close message when it passed\n * Value is defined in seconds and must greater than 2 seconds\n */\n @Prop() delay?: number;\n @Watch('delay')\n watchDelay(newValue: MgAlert['delay']): void {\n if (newValue !== undefined && newValue < 2) {\n throw new Error(`<mg-alert> prop \"delay\" must be greater than 2 seconds. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define variant\n */\n @Prop() variant?: VariantType = 'info';\n @Watch('variant')\n watchVariant(newValue: MgAlert['variant']): void {\n if (newValue && !variants.includes(newValue)) {\n throw new Error(`<mg-alert> prop \"variant\" must be one of: ${variants.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define variant style\n */\n @Prop() variantStyle?: VariantStyleType = 'bar-left';\n @Watch('variantStyle')\n watchVariantStyle(newValue: MgAlert['variantStyle']): void {\n if (newValue && !variantStyles.includes(newValue)) {\n throw new Error(`<mg-alert> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Watch hidden prop\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('hidden')\n watchHidden(newValue: boolean): void {\n if (typeof newValue === 'string' && newValue === '') {\n newValue = true;\n }\n if (newValue) {\n this.componentHide.emit();\n // Remove event Listener\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.removeEventListener(event, this.timerEvents);\n });\n // Clear Timer\n this.clearTimer();\n } else {\n this.componentShow.emit();\n // If delay is set\n if (this.delay > 1) {\n // Start timer\n this.setTimer();\n // Stop timer when get focus or mouse enter\n ['focusin', 'mouseenter'].forEach(event => {\n this.element.addEventListener(event, this.timerEvents);\n });\n }\n }\n forceUpdate(this);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-alert']);\n\n /**\n * Define if component is using actions slot\n */\n @State() hasActions = false;\n\n /**\n * Emited event when alert is diplayed\n */\n @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n /**\n * Emited event when alert is hidden\n */\n @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n /**\n * Emmited event when alert is closed\n */\n @Event({ eventName: 'component-close' }) componentClose: EventEmitter<void>;\n\n /**\n * Set timer\n */\n private setTimer = (): void => {\n this.storedTimer = setTimeout(() => (this.element.hidden = true), this.delay * 1000);\n };\n\n /**\n * Clear timer\n */\n private clearTimer = (): void => {\n clearTimeout(this.storedTimer);\n };\n\n /**\n * Event to add on element\n * @param event - event\n */\n private timerEvents = (event: MouseEvent | FocusEvent): void => {\n this.clearTimer();\n const isMouseEvent: boolean = event.type === 'mouseenter';\n // Needed to ensure we don't start the timer\n this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n // Restart timer when loose focus AND mouse leave\n this.element.addEventListener(\n isMouseEvent ? 'mouseleave' : 'focusout',\n eventOut => {\n this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n // Start timer if needed\n if (!this.isFocused && !this.isHovered) this.setTimer();\n },\n { once: true },\n );\n };\n\n /**\n * Handle close button\n */\n private handleClose = (): void => {\n this.element.hidden = true;\n this.componentClose.emit();\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.watchVariant(this.variant);\n this.watchVariantStyle(this.variantStyle);\n this.watchDelay(this.delay);\n this.watchHidden(this.element.hidden);\n // Check if component has actions slot\n this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n if (!this.hasActions) {\n this.classCollection.add(this.classCloseButton);\n }\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-message\n class={this.classCollection.join()}\n role={['info', 'success'].includes(this.variant) ? 'status' : 'alert'}\n variant={this.variant}\n variantStyle={this.variantStyle}\n >\n <slot></slot>\n {this.hasActions ? (\n <span slot=\"actions\">\n <slot name=\"actions\"></slot>\n </span>\n ) : (\n <span class=\"mg-c-alert__close-button\">\n <mg-button is-icon variant=\"flat\" label={this.messages.alert.closeButton} onClick={this.handleClose}>\n <mg-icon icon=\"cross\"></mg-icon>\n </mg-button>\n </span>\n )}\n </mg-message>\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 { k as kt, z as zt, L as Le } from './index.es.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* List of all possibles variants
|
|
@@ -7,7 +7,6 @@ import { Z as Ze, V as Ve, m as me } from './index.es.js';
|
|
|
7
7
|
const variants = ['info', 'primary', 'secondary', 'success', 'warning', 'danger', 'text-color'];
|
|
8
8
|
|
|
9
9
|
const mgBadgeCss = ".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-badge-size: Defines the height and minimum width of the badge. The default value is `--mg-b-size-16`.\n * @prop --mg-c-badge-font-size: Defines the font size of the badge. The default value is `--mg-b-font-size-small`.\n * @prop --mg-c-badge-color-text: Defines the font color of the badge when used with the `text-color` variant and without `outline`. The default value is `--mg-b-color-light`.\n */.mg-c-badge{min-width:var(--mg-c-badge-size);height:var(--mg-c-badge-size);box-sizing:border-box;padding:0 var(--mg-b-size-4);border:var(--mg-b-size-border) solid;border-radius:calc(var(--mg-c-badge-size)/2);font-size:var(--mg-c-badge-font-size);font-weight:600;line-height:var(--mg-c-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:var(--mg-b-color-primary);background-color:var(--mg-b-color-primary);color:var(--mg-b-color-text-on-primary)}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-primary)}.mg-c-badge.mg-c-badge--secondary{border-color:var(--mg-b-color-secondary);background-color:var(--mg-b-color-secondary);color:var(--mg-b-color-text-on-secondary)}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-secondary)}.mg-c-badge.mg-c-badge--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-badge.mg-c-badge--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-badge.mg-c-badge--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-badge.mg-c-badge--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-badge.mg-c-badge--text-color{border-color:currentcolor;background-color:currentcolor}.mg-c-badge.mg-c-badge--text-color .mg-c-badge__value{color:var(--mg-c-badge-color-text, var(--mg-b-color-light))}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline{background-color:rgba(0,0,0,0)}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline .mg-c-badge__value{color:currentcolor}.mg-c-badge,mg-badge{display:inline-flex;align-items:center;justify-content:center}";
|
|
10
|
-
const MgBadgeStyle0 = mgBadgeCss;
|
|
11
10
|
|
|
12
11
|
const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLElement {
|
|
13
12
|
constructor() {
|
|
@@ -22,25 +21,29 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
|
|
|
22
21
|
/**
|
|
23
22
|
* Define badge variant
|
|
24
23
|
*/
|
|
25
|
-
this.variant =
|
|
24
|
+
this.variant = 'info';
|
|
25
|
+
/**
|
|
26
|
+
* Define if button is using outline style
|
|
27
|
+
*/
|
|
28
|
+
this.outline = false;
|
|
26
29
|
/**
|
|
27
30
|
* Component classes
|
|
28
31
|
*/
|
|
29
|
-
this.classCollection = new
|
|
32
|
+
this.classCollection = new kt(['mg-c-badge']);
|
|
30
33
|
}
|
|
31
34
|
validateValue(newValue) {
|
|
32
35
|
if (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {
|
|
33
|
-
throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${
|
|
36
|
+
throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${zt(newValue)}.`);
|
|
34
37
|
}
|
|
35
38
|
}
|
|
36
39
|
validateLabel(newValue) {
|
|
37
|
-
if (!
|
|
38
|
-
throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${
|
|
40
|
+
if (!Le(newValue)) {
|
|
41
|
+
throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
39
42
|
}
|
|
40
43
|
}
|
|
41
44
|
validateVariant(newValue, oldValue) {
|
|
42
45
|
if (!variants.includes(newValue)) {
|
|
43
|
-
throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${
|
|
46
|
+
throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
44
47
|
}
|
|
45
48
|
else {
|
|
46
49
|
if (oldValue !== undefined) {
|
|
@@ -69,7 +72,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
|
|
|
69
72
|
* @returns HTML Element
|
|
70
73
|
*/
|
|
71
74
|
render() {
|
|
72
|
-
return (h("span", { key: '
|
|
75
|
+
return (h("span", { key: 'b5d63ec3facd86cae8b8612a5318fcc8c63287a9', class: this.classCollection.join() }, h("span", { key: '350de0e420b7a7d432cd8179b4c353375d8bf185', class: "mg-c-badge__value" }, this.value), h("span", { key: '279602e43db9644f673ddbbd79970f07439c6aad', class: "mg-u-visually-hidden" }, this.label)));
|
|
73
76
|
}
|
|
74
77
|
static get watchers() { return {
|
|
75
78
|
"value": ["validateValue"],
|
|
@@ -77,7 +80,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
|
|
|
77
80
|
"variant": ["validateVariant"],
|
|
78
81
|
"outline": ["validateOutline"]
|
|
79
82
|
}; }
|
|
80
|
-
static get style() { return
|
|
83
|
+
static get style() { return mgBadgeCss; }
|
|
81
84
|
}, [1, "mg-badge", {
|
|
82
85
|
"value": [8],
|
|
83
86
|
"label": [1],
|
|
@@ -106,5 +109,6 @@ function defineCustomElement() {
|
|
|
106
109
|
defineCustomElement();
|
|
107
110
|
|
|
108
111
|
export { MgBadge as M, defineCustomElement as d };
|
|
112
|
+
//# sourceMappingURL=mg-badge2.js.map
|
|
109
113
|
|
|
110
114
|
//# sourceMappingURL=mg-badge2.js.map
|