@mgdis/mg-components 6.8.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-234e834a.js → index-CTU2m-sy.js} +18 -9
- 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_37.cjs.entry.js +397 -767
- package/dist/cjs/mg-action-more_37.cjs.entry.js.map +1 -1
- 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 +3 -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 +5 -5
- package/dist/collection/components/atoms/mg-button/mg-button.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.js +8 -3
- 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 +8 -3
- 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.js +49 -44
- 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/locales/en/messages.json +6 -2
- package/dist/collection/locales/fr/messages.json +6 -2
- 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 +17 -8
- 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 +11 -11
- 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 +8 -8
- 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 +24 -20
- package/dist/components/mg-input-date.js.map +1 -1
- package/dist/components/mg-input-numeric.js +21 -17
- 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 +23 -19
- 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.js +8 -8
- package/dist/components/mg-table.js.map +1 -1
- 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-544778a7.js → index-SQlkEaXW.js} +18 -9
- 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_37.entry.js +397 -765
- package/dist/esm/mg-action-more_37.entry.js.map +1 -1
- 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 +6 -2
- package/dist/mg-components/locales/fr/messages.json +6 -2
- 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-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.d.ts +1 -1
- package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.d.ts +1 -1
- 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.d.ts +8 -8
- 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.d.ts +27 -27
- package/dist/types/stencil-public-runtime.d.ts +1 -0
- package/ide/intellij/web-types.json +89 -45
- package/ide/vscode/html-custom-data.json +26 -26
- package/package.json +23 -23
- 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-234e834a.js.map +0 -1
- package/dist/cjs/index.es-b90f74d4.js +0 -151
- package/dist/cjs/index.es-b90f74d4.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-544778a7.js.map +0 -1
- package/dist/esm/index.es-517b1bf2.js +0 -129
- package/dist/esm/index.es-517b1bf2.js.map +0 -1
- package/dist/esm/mg-input.conf-712c7bb6.js.map +0 -1
- package/dist/mg-components/p-12a1edee.js +0 -2
- package/dist/mg-components/p-12a1edee.js.map +0 -1
- package/dist/mg-components/p-2884f369.js.map +0 -1
- package/dist/mg-components/p-9bc53279.js +0 -2
- package/dist/mg-components/p-9bc53279.js.map +0 -1
- package/dist/mg-components/p-ad98f3d8.entry.js +0 -2
- package/dist/mg-components/p-ad98f3d8.entry.js.map +0 -1
- package/dist/mg-components/p-c10433db.entry.js +0 -2
- package/dist/mg-components/p-c10433db.entry.js.map +0 -1
- package/dist/mg-components/p-c67e4934.entry.js +0 -2
- package/dist/mg-components/p-c67e4934.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-f72efb64.entry.js +0 -2
- package/dist/mg-components/p-f72efb64.entry.js.map +0 -1
- package/dist/mg-components/p-fd4a7980.entry.js +0 -2
- package/dist/mg-components/p-fd4a7980.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,7 +1,7 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-
|
|
2
|
-
import {
|
|
3
|
-
import { i as initLocales } from './index-
|
|
4
|
-
import { t as tooltipPositions, c as classFieldset, a as classReadonly, b as classDisabled, d as classVerticalList, w as widths } from './mg-input.conf-
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-CAuxALt5.js';
|
|
2
|
+
import { x as xt, z as zt, k as kt, L as Le, M as Mt, O as Ot, T as Tt, a as Lt, w as wt, E as Et, H as Ht, B as Bt, G as Gt, X as Xt, W as Wt, P as Pt, A as At, R as Rt, j as jt } from './index.es-DDBtzymI.js';
|
|
3
|
+
import { i as initLocales } from './index-SQlkEaXW.js';
|
|
4
|
+
import { t as tooltipPositions, c as classFieldset, a as classReadonly, b as classDisabled, d as classVerticalList, w as widths } from './mg-input.conf-BtkqaBXm.js';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* Available menu item status values
|
|
@@ -30,7 +30,6 @@ const directions$1 = {
|
|
|
30
30
|
const sizes$5 = ['medium', 'large', 'xlarge'];
|
|
31
31
|
|
|
32
32
|
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)}";
|
|
33
|
-
const MgActionMoreStyle0 = mgActionMoreCss;
|
|
34
33
|
|
|
35
34
|
/**
|
|
36
35
|
* MgActionMore['items'] type guard
|
|
@@ -74,11 +73,15 @@ const MgActionMore = class {
|
|
|
74
73
|
************/
|
|
75
74
|
this.name = 'mg-action-more';
|
|
76
75
|
this.classBase = 'mg-c-action-more';
|
|
77
|
-
this.mgPopoverIdentifier =
|
|
76
|
+
this.mgPopoverIdentifier = xt(this.name);
|
|
78
77
|
/**
|
|
79
78
|
* Define button properties
|
|
80
79
|
*/
|
|
81
80
|
this.button = { variant: 'flat', isIcon: true };
|
|
81
|
+
/**
|
|
82
|
+
* Define if chevron is display
|
|
83
|
+
*/
|
|
84
|
+
this.displayChevron = false;
|
|
82
85
|
/**
|
|
83
86
|
* Menu expanded state
|
|
84
87
|
*/
|
|
@@ -117,15 +120,15 @@ const MgActionMore = class {
|
|
|
117
120
|
}
|
|
118
121
|
validateItems(newValue) {
|
|
119
122
|
if (!isMgActionMoreItems(newValue)) {
|
|
120
|
-
throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${
|
|
123
|
+
throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${zt(newValue)}.`);
|
|
121
124
|
}
|
|
122
125
|
else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {
|
|
123
|
-
throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${
|
|
126
|
+
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)}.`);
|
|
124
127
|
}
|
|
125
128
|
}
|
|
126
129
|
validateIcon(newValue) {
|
|
127
130
|
if (newValue && !isMgActionMoreIcon(newValue)) {
|
|
128
|
-
throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${
|
|
131
|
+
throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${zt(newValue)}.`);
|
|
129
132
|
}
|
|
130
133
|
else if ((newValue === null || newValue === void 0 ? void 0 : newValue.icon) === undefined && Boolean(this.button.isIcon)) {
|
|
131
134
|
this.icon = { icon: 'ellipsis' };
|
|
@@ -133,7 +136,7 @@ const MgActionMore = class {
|
|
|
133
136
|
}
|
|
134
137
|
validateButton(newValue) {
|
|
135
138
|
if (newValue && !isMgActionMoreButton(newValue)) {
|
|
136
|
-
throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${
|
|
139
|
+
throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${zt(newValue)}.`);
|
|
137
140
|
}
|
|
138
141
|
}
|
|
139
142
|
validateDisplayChevron(newValue) {
|
|
@@ -182,7 +185,7 @@ const MgActionMore = class {
|
|
|
182
185
|
"displayChevron": ["validateDisplayChevron"]
|
|
183
186
|
}; }
|
|
184
187
|
};
|
|
185
|
-
MgActionMore.style =
|
|
188
|
+
MgActionMore.style = mgActionMoreCss;
|
|
186
189
|
|
|
187
190
|
/**
|
|
188
191
|
* List of all possibles variants
|
|
@@ -190,7 +193,6 @@ MgActionMore.style = MgActionMoreStyle0;
|
|
|
190
193
|
const variants$4 = ['info', 'primary', 'secondary', 'success', 'warning', 'danger', 'text-color'];
|
|
191
194
|
|
|
192
195
|
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}";
|
|
193
|
-
const MgBadgeStyle0 = mgBadgeCss;
|
|
194
196
|
|
|
195
197
|
const MgBadge = class {
|
|
196
198
|
constructor(hostRef) {
|
|
@@ -203,25 +205,29 @@ const MgBadge = class {
|
|
|
203
205
|
/**
|
|
204
206
|
* Define badge variant
|
|
205
207
|
*/
|
|
206
|
-
this.variant =
|
|
208
|
+
this.variant = 'info';
|
|
209
|
+
/**
|
|
210
|
+
* Define if button is using outline style
|
|
211
|
+
*/
|
|
212
|
+
this.outline = false;
|
|
207
213
|
/**
|
|
208
214
|
* Component classes
|
|
209
215
|
*/
|
|
210
|
-
this.classCollection = new
|
|
216
|
+
this.classCollection = new kt(['mg-c-badge']);
|
|
211
217
|
}
|
|
212
218
|
validateValue(newValue) {
|
|
213
219
|
if (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {
|
|
214
|
-
throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${
|
|
220
|
+
throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${zt(newValue)}.`);
|
|
215
221
|
}
|
|
216
222
|
}
|
|
217
223
|
validateLabel(newValue) {
|
|
218
|
-
if (!
|
|
219
|
-
throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${
|
|
224
|
+
if (!Le(newValue)) {
|
|
225
|
+
throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
220
226
|
}
|
|
221
227
|
}
|
|
222
228
|
validateVariant(newValue, oldValue) {
|
|
223
229
|
if (!variants$4.includes(newValue)) {
|
|
224
|
-
throw new Error(`<mg-badge> prop "variant" must be one of: ${variants$4.join(', ')}. Passed value: ${
|
|
230
|
+
throw new Error(`<mg-badge> prop "variant" must be one of: ${variants$4.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
225
231
|
}
|
|
226
232
|
else {
|
|
227
233
|
if (oldValue !== undefined) {
|
|
@@ -250,7 +256,7 @@ const MgBadge = class {
|
|
|
250
256
|
* @returns HTML Element
|
|
251
257
|
*/
|
|
252
258
|
render() {
|
|
253
|
-
return (h("span", { key: '
|
|
259
|
+
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)));
|
|
254
260
|
}
|
|
255
261
|
static get watchers() { return {
|
|
256
262
|
"value": ["validateValue"],
|
|
@@ -259,7 +265,7 @@ const MgBadge = class {
|
|
|
259
265
|
"outline": ["validateOutline"]
|
|
260
266
|
}; }
|
|
261
267
|
};
|
|
262
|
-
MgBadge.style =
|
|
268
|
+
MgBadge.style = mgBadgeCss;
|
|
263
269
|
|
|
264
270
|
/**
|
|
265
271
|
* List of all possibles sizes
|
|
@@ -271,12 +277,11 @@ const sizes$4 = ['medium', 'large'];
|
|
|
271
277
|
const variants$3 = ['primary', 'secondary', 'danger', 'danger-alt', 'info', 'flat', 'success', 'link'];
|
|
272
278
|
|
|
273
279
|
const mgButtonCss = "/*!\n * @prop --mg-c-button-border-radius: Defines the border radius of the button. The default value is `--mg-b-size-radius`.\n * @prop --mg-c-button-border-top-width: Defines the top border width of the button. Unset by default, fallback on `--mg-b-size-border`.\n * @prop --mg-c-button-border-right-width: Defines the right border width of the button. Unset by default, fallback on `--mg-b-size-border`.\n * @prop --mg-c-button-border-bottom-width: Defines the bottom border width of the button. Unset by default, fallback on `--mg-b-size-border`.\n * @prop --mg-c-button-border-left-width: Defines the left border width of the button. Unset by default, fallback on `--mg-b-size-border`.\n * @prop --mg-c-button-border-radius-top-left: Defines the top left border radius of the button. Unset by default, fallback on `--mg-c-button-border-radius`.\n * @prop --mg-c-button-border-radius-top-right: Defines the top right border radius of the button. Unset by default, fallback on `--mg-c-button-border-radius`.\n * @prop --mg-c-button-border-radius-bottom-right: Defines the bottom right border radius of the button. Unset by default, fallback on `--mg-c-button-border-radius`.\n * @prop --mg-c-button-border-radius-bottom-left: Defines the bottom left border radius of the button. Unset by default, fallback on `--mg-c-button-border-radius`.\n * @prop --mg-c-button-font-weight: Defines the font weight of the button. Unset by default, fallback on `normal`.\n * @prop --mg-c-button-icon-border-radius: Defines the border radius of the button in icon mode. The default value is `--mg-b-size-min-height`.\n */:host{display:inline-block;max-width:100%;vertical-align:middle}:host(:hover) .mg-c-button--flat:not(.mg-c-button--disabled){background:color-mix(in srgb, var(--mg-b-color-dark), transparent 90%)}:host([full-width]){display:block}:host([disabled]),:host([aria-disabled=true]){pointer-events:none}.mg-c-button.mg-c-button--primary{/*!\n * @prop --mg-c-button-color-background-primary: Defines the background color for the primary variant button.\n * @prop --mg-c-button-color-border-primary: Defines the border color for the primary variant button.\n * @prop --mg-c-button-color-gradient-primary: Defines the gradient color for the primary variant button.\n * @prop --mg-c-button-color-text-primary: Defines the font color for the primary variant button.\n */border-color:var(--mg-c-button-color-border-primary);background:linear-gradient(to bottom, var(--mg-c-button-color-background-primary), var(--mg-c-button-color-gradient-primary));color:var(--mg-c-button-color-text-primary)}:host(:hover) .mg-c-button.mg-c-button--primary:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-primary)}.mg-c-button.mg-c-button--secondary{/*!\n * @prop --mg-c-button-color-background-secondary: Defines the background color for the secondary variant button.\n * @prop --mg-c-button-color-border-secondary: Defines the border color for the secondary variant button.\n * @prop --mg-c-button-color-gradient-secondary: Defines the gradient color for the secondary variant button.\n * @prop --mg-c-button-color-text-secondary: Defines the font color for the secondary variant button.\n */border-color:var(--mg-c-button-color-border-secondary);background:linear-gradient(to bottom, var(--mg-c-button-color-background-secondary), var(--mg-c-button-color-gradient-secondary));color:var(--mg-c-button-color-text-secondary)}:host(:hover) .mg-c-button.mg-c-button--secondary:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-secondary)}.mg-c-button.mg-c-button--danger{/*!\n * @prop --mg-c-button-color-background-danger: Defines the background color for the danger variant button.\n * @prop --mg-c-button-color-border-danger: Defines the border color for the danger variant button.\n * @prop --mg-c-button-color-gradient-danger: Defines the gradient color for the danger variant button.\n * @prop --mg-c-button-color-text-danger: Defines the font color for the danger variant button.\n */border-color:var(--mg-c-button-color-border-danger);background:linear-gradient(to bottom, var(--mg-c-button-color-background-danger), var(--mg-c-button-color-gradient-danger));color:var(--mg-c-button-color-text-danger)}:host(:hover) .mg-c-button.mg-c-button--danger:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-danger)}.mg-c-button.mg-c-button--info{/*!\n * @prop --mg-c-button-color-background-info: Defines the background color for the info variant button.\n * @prop --mg-c-button-color-border-info: Defines the border color for the info variant button.\n * @prop --mg-c-button-color-gradient-info: Defines the gradient color for the info variant button.\n * @prop --mg-c-button-color-text-info: Defines the font color for the info variant button.\n */border-color:var(--mg-c-button-color-border-info);background:linear-gradient(to bottom, var(--mg-c-button-color-background-info), var(--mg-c-button-color-gradient-info));color:var(--mg-c-button-color-text-info)}:host(:hover) .mg-c-button.mg-c-button--info:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-info)}.mg-c-button.mg-c-button--success{/*!\n * @prop --mg-c-button-color-background-success: Defines the background color for the success variant button.\n * @prop --mg-c-button-color-border-success: Defines the border color for the success variant button.\n * @prop --mg-c-button-color-gradient-success: Defines the gradient color for the success variant button.\n * @prop --mg-c-button-color-text-success: Defines the font color for the success variant button.\n */border-color:var(--mg-c-button-color-border-success);background:linear-gradient(to bottom, var(--mg-c-button-color-background-success), var(--mg-c-button-color-gradient-success));color:var(--mg-c-button-color-text-success)}:host(:hover) .mg-c-button.mg-c-button--success:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-success)}.mg-c-button.mg-c-button--warning{/*!\n * @prop --mg-c-button-color-background-warning: Defines the background color for the warning variant button.\n * @prop --mg-c-button-color-border-warning: Defines the border color for the warning variant button.\n * @prop --mg-c-button-color-gradient-warning: Defines the gradient color for the warning variant button.\n * @prop --mg-c-button-color-text-warning: Defines the font color for the warning variant button.\n */border-color:var(--mg-c-button-color-border-warning);background:linear-gradient(to bottom, var(--mg-c-button-color-background-warning), var(--mg-c-button-color-gradient-warning));color:var(--mg-c-button-color-text-warning)}:host(:hover) .mg-c-button.mg-c-button--warning:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-warning)}.mg-c-button.mg-c-button--danger-alt{/*!\n * @prop --mg-c-button-color-background-danger-alt: Defines the background color for the danger-alt variant button.\n * @prop --mg-c-button-color-border-danger-alt: Defines the border color for the danger-alt variant button.\n * @prop --mg-c-button-color-gradient-danger-alt: Defines the gradient color for the danger-alt variant button.\n * @prop --mg-c-button-color-text-danger-alt: Defines the font color for the danger-alt variant button.\n */border-color:var(--mg-c-button-color-border-danger-alt);background:linear-gradient(to bottom, var(--mg-c-button-color-background-danger-alt), var(--mg-c-button-color-gradient-danger-alt));color:var(--mg-c-button-color-text-danger-alt)}:host(:hover) .mg-c-button.mg-c-button--danger-alt:not(.mg-c-button--disabled){background:var(--mg-c-button-color-background-danger-alt)}.mg-c-button{position:relative;display:inline-flex;min-height:var(--mg-b-size-min-height);box-sizing:border-box;align-items:center;padding:calc((var(--mg-b-size-min-height) - 2*var(--mg-b-size-border) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-12);border-width:var(--mg-c-button-border-top-width, var(--mg-b-size-border)) var(--mg-c-button-border-right-width, var(--mg-b-size-border)) var(--mg-c-button-border-bottom-width, var(--mg-b-size-border)) var(--mg-c-button-border-left-width, var(--mg-b-size-border));border-style:solid;border-radius:var(--mg-c-button-border-radius-top-left, var(--mg-c-button-border-radius)) var(--mg-c-button-border-radius-top-right, var(--mg-c-button-border-radius)) var(--mg-c-button-border-radius-bottom-right, var(--mg-c-button-border-radius)) var(--mg-c-button-border-radius-bottom-left, var(--mg-c-button-border-radius));background-image:none;column-gap:var(--mg-b-size-8);cursor:pointer;touch-action:manipulation;font-family:inherit;font-size:var(--mg-b-font-size);font-weight:var(--mg-c-button-font-weight, normal);text-align:left;text-decoration:none}.mg-c-button slot,.mg-c-button ::slotted(*:not(mg-icon)){font-family:inherit;font-size:var(--mg-b-font-size);font-weight:var(--mg-c-button-font-weight, normal);text-align:left;text-decoration:none;display:flex;align-items:center;column-gap:var(--mg-b-size-8)}.mg-c-button mg-icon:only-child,.mg-c-button ::slotted(mg-icon){display:inline-flex;flex-shrink:0;margin:auto 0;line-height:1}.mg-c-button.mg-c-button--disabled{cursor:default;opacity:var(--mg-b-opacity-element-disabled)}.mg-c-button.mg-c-button--flat{border:none;background:none}.mg-c-button.mg-c-button--link{min-height:unset;padding:unset;border:unset;border-radius:unset;background:unset;text-decoration:underline}.mg-c-button.mg-c-button--link slot{font-weight:600}.mg-c-button.mg-c-button--link:hover{text-decoration:none}.mg-c-button.mg-c-button--large{padding:calc(var(--mg-b-size-12) - var(--mg-b-size-border)) calc(var(--mg-b-size-24) - var(--mg-b-size-border))}.mg-c-button.mg-c-button--large:not(.mg-c-button--icon){line-height:var(--mg-b-size-24)}.mg-c-button.mg-c-button--large:not(.mg-c-button--icon) slot,.mg-c-button.mg-c-button--large:not(.mg-c-button--icon) ::slotted(*){font-size:var(--mg-b-size-16)}.mg-c-button.mg-c-button--icon{width:var(--mg-b-size-min-height);height:var(--mg-b-size-min-height);justify-content:center;padding:0;border-radius:var(--mg-c-button-border-radius-top-left, var(--mg-c-button-icon-border-radius)) var(--mg-c-button-border-radius-top-right, var(--mg-c-button-icon-border-radius)) var(--mg-c-button-border-radius-bottom-right, var(--mg-c-button-icon-border-radius)) var(--mg-c-button-border-radius-bottom-left, var(--mg-c-button-icon-border-radius));font-size:var(--mg-b-font-size);line-height:var(--mg-b-font-size)}.mg-c-button.mg-c-button--icon.mg-c-button--large{width:unset;height:unset;padding:calc(var(--mg-b-size-12) - var(--mg-b-size-border))}.mg-c-button.mg-c-button--icon.mg-c-button--large ::slotted(*){min-width:var(--mg-b-size-24);min-height:var(--mg-b-size-24);align-items:center;justify-content:center}.mg-c-button.mg-c-button--full-width{display:flex;justify-content:center}.mg-c-button.mg-c-button--loading>mg-icon:first-of-type{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.mg-c-button.mg-c-button--loading .mg-c-button__content{opacity:0}:host(:focus-visible){outline:0}:host(:focus-visible) .mg-c-button{outline-color:-webkit-focus-ring-color;outline-style:auto;outline-width:.2rem}";
|
|
274
|
-
const MgButtonStyle0 = mgButtonCss;
|
|
275
280
|
|
|
276
281
|
const MgButton = class {
|
|
277
282
|
constructor(hostRef) {
|
|
278
283
|
registerInstance(this, hostRef);
|
|
279
|
-
this.disabledChange = createEvent(this, "disabled-change"
|
|
284
|
+
this.disabledChange = createEvent(this, "disabled-change");
|
|
280
285
|
/************
|
|
281
286
|
* Internal *
|
|
282
287
|
************/
|
|
@@ -287,11 +292,11 @@ const MgButton = class {
|
|
|
287
292
|
/**
|
|
288
293
|
* Define button variant
|
|
289
294
|
*/
|
|
290
|
-
this.variant =
|
|
295
|
+
this.variant = 'primary';
|
|
291
296
|
/**
|
|
292
297
|
* Define button size
|
|
293
298
|
*/
|
|
294
|
-
this.size =
|
|
299
|
+
this.size = 'medium';
|
|
295
300
|
/**
|
|
296
301
|
* Set button to full-width
|
|
297
302
|
*/
|
|
@@ -315,7 +320,7 @@ const MgButton = class {
|
|
|
315
320
|
/**
|
|
316
321
|
* Component classes
|
|
317
322
|
*/
|
|
318
|
-
this.classCollection = new
|
|
323
|
+
this.classCollection = new kt(['mg-c-button']);
|
|
319
324
|
/**
|
|
320
325
|
* Trigger actions onClick event
|
|
321
326
|
* @param event - click event
|
|
@@ -373,7 +378,7 @@ const MgButton = class {
|
|
|
373
378
|
this.variant = variants$3[0];
|
|
374
379
|
return;
|
|
375
380
|
}
|
|
376
|
-
throw new Error(`<mg-button> prop "variant" must be one of: ${variants$3.join(', ')}. Passed value: ${
|
|
381
|
+
throw new Error(`<mg-button> prop "variant" must be one of: ${variants$3.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
377
382
|
}
|
|
378
383
|
else {
|
|
379
384
|
if (oldValue !== undefined) {
|
|
@@ -385,7 +390,7 @@ const MgButton = class {
|
|
|
385
390
|
validateSize(newValue, oldValue) {
|
|
386
391
|
// validate new value
|
|
387
392
|
if (!sizes$4.includes(newValue)) {
|
|
388
|
-
throw new Error(`<mg-button> prop "size" must be one of: ${sizes$4.join(', ')}. Passed value: ${
|
|
393
|
+
throw new Error(`<mg-button> prop "size" must be one of: ${sizes$4.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
389
394
|
}
|
|
390
395
|
else {
|
|
391
396
|
if (oldValue !== undefined) {
|
|
@@ -427,7 +432,7 @@ const MgButton = class {
|
|
|
427
432
|
watchIsIcon(newValue) {
|
|
428
433
|
if (newValue) {
|
|
429
434
|
this.classCollection.add(`mg-c-button--icon`);
|
|
430
|
-
if (!
|
|
435
|
+
if (!Le(this.label)) {
|
|
431
436
|
throw new Error(`<mg-button> prop "label" is mandatory when prop "isIcon" is set to true.`);
|
|
432
437
|
}
|
|
433
438
|
}
|
|
@@ -458,7 +463,7 @@ const MgButton = class {
|
|
|
458
463
|
* Add listners
|
|
459
464
|
*/
|
|
460
465
|
componentDidLoad() {
|
|
461
|
-
|
|
466
|
+
Mt(() => {
|
|
462
467
|
var _a;
|
|
463
468
|
const closestForm = this.element.closest('form') || ((_a = this.element.closest('mg-form')) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector('form'));
|
|
464
469
|
// submit buttons should trigger form submition;
|
|
@@ -475,7 +480,7 @@ const MgButton = class {
|
|
|
475
480
|
*/
|
|
476
481
|
render() {
|
|
477
482
|
var _a;
|
|
478
|
-
return (h(Host, { key: '
|
|
483
|
+
return (h(Host, { key: '73d97963f988261cec281f67842d71194513528b', role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": (_a = this.disabled) === null || _a === void 0 ? void 0 : _a.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, h("div", { key: 'c8ce88a3d9d67ce40cc9687b4ea192681d826896', class: this.classCollection.join() }, this.loading && h("mg-icon", { key: '5e8949fa49487deda3fdeb1fbb85b62d799e33c6', icon: "loader", spin: true }), h("div", { key: 'fc733614c9fb3e30c30c520e9ca3d8a4efd59efe', class: "mg-c-button__content" }, h("slot", { key: '1c2c5a91c44c8983d317a4f475ffe89fc21a36e5' })))));
|
|
479
484
|
}
|
|
480
485
|
get element() { return getElement(this); }
|
|
481
486
|
static get watchers() { return {
|
|
@@ -487,10 +492,9 @@ const MgButton = class {
|
|
|
487
492
|
"loading": ["loadingHandler"]
|
|
488
493
|
}; }
|
|
489
494
|
};
|
|
490
|
-
MgButton.style =
|
|
495
|
+
MgButton.style = mgButtonCss;
|
|
491
496
|
|
|
492
497
|
const mgCardCss = "/*!\n * @prop --mg-c-card-overflow: Defines the overflow property for the card. Unset by default, fallback on `--mg-c-card-overflow-default`.\n * @prop --mg-c-card-overflow-default: Defines the default overflow property for the card. Unset by default.\n * @prop --mg-c-card-min-width: Defines the min-width property for the card. Unset by default.\n * @prop --mg-c-card-max-width: Defines the max-width property for the card. Unset by default.\n * @prop --mg-c-card-spacing: Defines the padding property for the card. Unset by default, fallback on `--mg-c-card-spacing-default`.\n * @prop --mg-c-card-spacing-default: Defines the default padding property for the card. Default value: `--mg-b-size-16`.\n * @prop --mg-c-card-border: Defines the border property for the card. Unset by default, fallback on `--mg-c-card-border-default`.\n * @prop --mg-c-card-border-default: Defines the default border property for the card. Default value: `var(--mg-b-size-border) solid color-mix(in srgb, var(--mg-b-color-dark), transparent 95%)`.\n * @prop --mg-c-card-border-radius: Defines the border radius property for the card. Unset by default, fallback on `--mg-c-card-border-radius-default`.\n * @prop --mg-c-card-border-radius-default: Defines the default border radius property for the card. Default value: `--mg-b-size-radius`.\n * @prop --mg-c-card-color-background: Defines the background property for the card. Unset by default, fallback on `--mg-c-card-color-background-default`.\n * @prop --mg-c-card-color-background-default: Defines the default background property for the card. Default value: `--mg-b-color-light`.\n * @prop --mg-c-card-box-shadow: Defines the box shadow property for the card. Unset by default, fallback on `--mg-c-card-box-shadow-default`.\n * @prop --mg-c-card-box-shadow-default: Defines the default box shadow property for the card. Default value: `--mg-b-box-shadow`.\n */.mg-c-card{position:relative;z-index:inherit;overflow:var(--mg-c-card-overflow, var(--mg-c-card-overflow-default));width:100%;min-width:var(--mg-c-card-min-width);max-width:var(--mg-c-card-max-width);box-sizing:border-box;padding:var(--mg-c-card-spacing, var(--mg-c-card-spacing-default));border:var(--mg-c-card-border, var(--mg-c-card-border-default));border-radius:var(--mg-c-card-border-radius, var(--mg-c-card-border-radius-default));background:var(--mg-c-card-color-background, var(--mg-c-card-color-background-default));box-shadow:var(--mg-c-card-box-shadow, var(--mg-c-card-box-shadow-default))}.mg-c-card ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset}";
|
|
493
|
-
const MgCardStyle0 = mgCardCss;
|
|
494
498
|
|
|
495
499
|
const MgCard = class {
|
|
496
500
|
constructor(hostRef) {
|
|
@@ -507,10 +511,9 @@ const MgCard = class {
|
|
|
507
511
|
return (h("div", { key: 'e59cabb09dbc28c148770b57de98f130c4479b75', class: "mg-c-card" }, h("slot", { key: 'b6e679317bddd23e73443c601992b7b344d6dc72' })));
|
|
508
512
|
}
|
|
509
513
|
};
|
|
510
|
-
MgCard.style =
|
|
514
|
+
MgCard.style = mgCardCss;
|
|
511
515
|
|
|
512
516
|
const mgCharacterLeftCss = ".mg-u-visually-hidden.sc-mg-character-left{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}*.sc-mg-character-left:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*.sc-mg-character-left{animation:none !important;transition:none !important}}mg-character-left.sc-mg-character-left{display:block}";
|
|
513
|
-
const MgCharacterLeftStyle0 = mgCharacterLeftCss;
|
|
514
517
|
|
|
515
518
|
const MgCharacterLeft = class {
|
|
516
519
|
constructor(hostRef) {
|
|
@@ -521,13 +524,13 @@ const MgCharacterLeft = class {
|
|
|
521
524
|
this.characters = '';
|
|
522
525
|
}
|
|
523
526
|
watchIdentifier(newValue) {
|
|
524
|
-
if (newValue !== undefined && !
|
|
525
|
-
console.error(`<mg-character-left> prop "identifier" value is invalid. Passed value: ${
|
|
527
|
+
if (newValue !== undefined && !Ot(newValue)) {
|
|
528
|
+
console.error(`<mg-character-left> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
526
529
|
}
|
|
527
530
|
}
|
|
528
531
|
validateMaxlength(newValue) {
|
|
529
532
|
if (typeof newValue !== 'number') {
|
|
530
|
-
throw new Error(`<mg-character-left> prop "maxlength" is required and must be a number. Passed value: ${
|
|
533
|
+
throw new Error(`<mg-character-left> prop "maxlength" is required and must be a number. Passed value: ${zt(newValue)}.`);
|
|
531
534
|
}
|
|
532
535
|
}
|
|
533
536
|
/*************
|
|
@@ -554,15 +557,14 @@ const MgCharacterLeft = class {
|
|
|
554
557
|
"maxlength": ["validateMaxlength"]
|
|
555
558
|
}; }
|
|
556
559
|
};
|
|
557
|
-
MgCharacterLeft.style =
|
|
560
|
+
MgCharacterLeft.style = mgCharacterLeftCss;
|
|
558
561
|
|
|
559
562
|
const mgDetailsCss = ".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-details-spacing: Defines the spacing between the summary and the details. Default value: `--mg-b-size-8`.\n */.mg-c-details summary{display:flex;align-items:baseline;cursor:pointer;gap:var(--mg-b-size-16)}.mg-c-details summary::-webkit-details-marker{display:none}.mg-c-details__toggle{display:flex;min-height:calc(var(--mg-b-font-size)*var(--mg-b-line-height));flex-shrink:0;align-items:center;align-self:flex-start;gap:var(--mg-b-size-4)}.mg-c-details__toggle-icon.mg-c-details__toggle-icon--reverse{transform:rotate(180deg)}.mg-c-details__details{margin-top:var(--mg-c-details-spacing)}@media (width < 43.75rem){.mg-c-details__toggle>span{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}}";
|
|
560
|
-
const MgDetailsStyle0 = mgDetailsCss;
|
|
561
563
|
|
|
562
564
|
const MgDetails = class {
|
|
563
565
|
constructor(hostRef) {
|
|
564
566
|
registerInstance(this, hostRef);
|
|
565
|
-
this.expandedChange = createEvent(this, "expanded-change"
|
|
567
|
+
this.expandedChange = createEvent(this, "expanded-change");
|
|
566
568
|
/**
|
|
567
569
|
* Hide summary element
|
|
568
570
|
*/
|
|
@@ -579,7 +581,7 @@ const MgDetails = class {
|
|
|
579
581
|
};
|
|
580
582
|
}
|
|
581
583
|
validateTitles(newValue) {
|
|
582
|
-
if (!
|
|
584
|
+
if (!Le(newValue)) {
|
|
583
585
|
throw new Error(`<mg-details> prop "toggleClosed" and "toggleOpened" is required and must be a valid string. Passed value: "toggleClosed='${this.toggleClosed}'" and "toggleOpened='${this.toggleOpened}'".`);
|
|
584
586
|
}
|
|
585
587
|
}
|
|
@@ -596,8 +598,9 @@ const MgDetails = class {
|
|
|
596
598
|
this.validateTitles(this.toggleClosed);
|
|
597
599
|
this.validateTitles(this.toggleOpened);
|
|
598
600
|
this.element.addEventListener('click', (event) => {
|
|
599
|
-
if (event.target.closest('[slot="summary"] mg-button, mg-button[slot="summary"]'))
|
|
601
|
+
if (event.target.closest('[slot="summary"] mg-button, mg-button[slot="summary"]') !== null) {
|
|
600
602
|
event.preventDefault();
|
|
603
|
+
}
|
|
601
604
|
});
|
|
602
605
|
}
|
|
603
606
|
/**
|
|
@@ -605,7 +608,7 @@ const MgDetails = class {
|
|
|
605
608
|
* @returns HTML Element
|
|
606
609
|
*/
|
|
607
610
|
render() {
|
|
608
|
-
return (h("details", { key: '
|
|
611
|
+
return (h("details", { key: '3f773b6c0d10c12049d62a9bbe3b24ce95329077', class: "mg-c-details", onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", { key: 'c6378c290a253098a26e832dbc43c58182e1d90c' }, h("slot", { key: '033334926172ca422a1346085cfe5fb1adf33e9b', name: "summary" }), h("span", { key: '105cd284d2cf7363cd0ea85279c057471f2113c9', class: "mg-c-details__toggle" }, h("mg-icon", { key: 'c17df4c2813a346a4ced9be2f872dcdc688baa2e', icon: "chevron-up", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { key: '5dc2078f2ba8808dbad0b75f2857173d2bd8d3e5', class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { key: 'bf9883ad6dbf0c1014ad6559cb5d08b157d80d9b', class: "mg-c-details__details" }, h("slot", { key: '244092eb1aceb39143e53b63faf36ab2a5c4c205', name: "details" }))));
|
|
609
612
|
}
|
|
610
613
|
get element() { return getElement(this); }
|
|
611
614
|
static get watchers() { return {
|
|
@@ -614,10 +617,9 @@ const MgDetails = class {
|
|
|
614
617
|
"expanded": ["handleExpanded"]
|
|
615
618
|
}; }
|
|
616
619
|
};
|
|
617
|
-
MgDetails.style =
|
|
620
|
+
MgDetails.style = mgDetailsCss;
|
|
618
621
|
|
|
619
622
|
const mgDividerCss = "/*!\n * @prop --mg-c-divider-color-background: Defines the background color of the divider. The default value is `color-mix(in srgb, var(--mg-b-color-dark), transparent 85%)`.\n * @prop --mg-c-divider-thickness: Defines the thickness of the divider. The default value is `--mg-b-size-border`.\n * @prop --mg-c-divider-spacing-vertical: Defines the vertical spacing of the divider. The default value is `--mg-b-size-40`.\n */.mg-c-divider{width:var(--mg-b-size-120);height:var(--mg-c-divider-thickness);margin:var(--mg-c-divider-spacing-vertical) auto;background-color:var(--mg-c-divider-color-background)}.mg-c-divider.mg-c-divider--full-width{width:100%}";
|
|
620
|
-
const MgDividerStyle0 = mgDividerCss;
|
|
621
623
|
|
|
622
624
|
const MgDivider = class {
|
|
623
625
|
constructor(hostRef) {
|
|
@@ -641,7 +643,7 @@ const MgDivider = class {
|
|
|
641
643
|
} }));
|
|
642
644
|
}
|
|
643
645
|
};
|
|
644
|
-
MgDivider.style =
|
|
646
|
+
MgDivider.style = mgDividerCss;
|
|
645
647
|
|
|
646
648
|
/**
|
|
647
649
|
* List of all possibles roles
|
|
@@ -653,13 +655,12 @@ const roles = ['form', 'search', 'none', 'presentation'];
|
|
|
653
655
|
const requiredMessageStatus = ['default', 'hide'];
|
|
654
656
|
|
|
655
657
|
const mgFormCss = ".mg-u-form-legacy{--mg-c-form-inputs-title-width:calc(100% / 3 - 20px)}.mg-u-is-asterisk{color:var(--mg-b-color-danger)}/*!\n * @prop --mg-c-form-inputs-title-width: Defines the width of the input title. Fallback on `calc(28 * var(--mg-b-size-8))`.\n */.mg-c-form{--mg-c-input-title-width:var(--mg-c-form-inputs-title-width, calc(28 * var(--mg-b-size-8)));--mg-c-input-margin-bottom:var(--mg-b-size-16);--mg-c-input-title-horizontal-space:var(--mg-b-size-32)}.mg-c-form.mg-c-form--all-required{--mg-c-input-title-display:none}.mg-c-form.mg-c-form--label-on-top{--mg-c-input-margin-bottom:var(--mg-b-size-24)}.mg-c-form>p{font-size:var(--mg-b-font-size-small)}";
|
|
656
|
-
const MgFormStyle0 = mgFormCss;
|
|
657
658
|
|
|
658
659
|
const MgForm = class {
|
|
659
660
|
constructor(hostRef) {
|
|
660
661
|
registerInstance(this, hostRef);
|
|
661
|
-
this.formValid = createEvent(this, "form-valid"
|
|
662
|
-
this.formSubmit = createEvent(this, "form-submit"
|
|
662
|
+
this.formValid = createEvent(this, "form-valid");
|
|
663
|
+
this.formSubmit = createEvent(this, "form-submit");
|
|
663
664
|
// Classes
|
|
664
665
|
this.classAllRequired = 'mg-c-form--all-required';
|
|
665
666
|
this.classLabelOnTop = 'mg-c-form--label-on-top';
|
|
@@ -667,7 +668,7 @@ const MgForm = class {
|
|
|
667
668
|
* Identifier is used for the element ID (id is a reserved prop in Stencil.js)
|
|
668
669
|
* If not set, it will be created.
|
|
669
670
|
*/
|
|
670
|
-
this.identifier =
|
|
671
|
+
this.identifier = xt('mg-form');
|
|
671
672
|
/**
|
|
672
673
|
* Input name
|
|
673
674
|
* If not set the value equals the identifier
|
|
@@ -677,6 +678,10 @@ const MgForm = class {
|
|
|
677
678
|
* Define if form is readonly
|
|
678
679
|
*/
|
|
679
680
|
this.readonly = false;
|
|
681
|
+
/**
|
|
682
|
+
* Define if slotted mg-component's label are displayed on top
|
|
683
|
+
*/
|
|
684
|
+
this.labelOnTop = false;
|
|
680
685
|
/**
|
|
681
686
|
* Define if form is disabled
|
|
682
687
|
*/
|
|
@@ -684,7 +689,7 @@ const MgForm = class {
|
|
|
684
689
|
/**
|
|
685
690
|
* Component classes
|
|
686
691
|
*/
|
|
687
|
-
this.classCollection = new
|
|
692
|
+
this.classCollection = new kt(['mg-c-form']);
|
|
688
693
|
/**
|
|
689
694
|
* Define required message based on mg-inputs required elements
|
|
690
695
|
*/
|
|
@@ -772,18 +777,18 @@ const MgForm = class {
|
|
|
772
777
|
};
|
|
773
778
|
}
|
|
774
779
|
watchIdentifier(newValue) {
|
|
775
|
-
if (!
|
|
776
|
-
console.error(`<mg-form> prop "identifier" value is invalid. Passed value: ${
|
|
780
|
+
if (!Ot(newValue)) {
|
|
781
|
+
console.error(`<mg-form> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
777
782
|
}
|
|
778
783
|
}
|
|
779
784
|
validateRequiredMessage(newValue) {
|
|
780
785
|
if (newValue && !requiredMessageStatus.includes(newValue)) {
|
|
781
|
-
throw new Error(`<mg-form> prop "requiredMessage" must be one of: ${requiredMessageStatus.join(', ')}. Passed value: ${
|
|
786
|
+
throw new Error(`<mg-form> prop "requiredMessage" must be one of: ${requiredMessageStatus.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
782
787
|
}
|
|
783
788
|
}
|
|
784
789
|
validateAriaRole(newValue) {
|
|
785
790
|
if (newValue && !roles.includes(newValue)) {
|
|
786
|
-
throw new Error(`<mg-form> prop "ariaRole" must be one of: ${roles.join(', ')}. Passed value: ${
|
|
791
|
+
throw new Error(`<mg-form> prop "ariaRole" must be one of: ${roles.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
787
792
|
}
|
|
788
793
|
}
|
|
789
794
|
handlelabelOnTop(newValue) {
|
|
@@ -872,7 +877,7 @@ const MgForm = class {
|
|
|
872
877
|
* @returns HTML Element
|
|
873
878
|
*/
|
|
874
879
|
render() {
|
|
875
|
-
return (h("form", { key: '
|
|
880
|
+
return (h("form", { key: '43c060c027330a9db84c469228536db8d2329c86', class: this.classCollection.join(), id: this.identifier, name: this.name, onSubmit: this.handleFormSubmit, role: this.ariaRole }, this.requiredMessageText && h("p", { key: '42cba44f2075371ae73b097b84012fdbd1b473d8', innerHTML: this.requiredMessageText }), h("slot", { key: '0797165b78e980ab2680f7a3a1c68b13c5140820' }), !this.readonly && !this.disabled && h("slot", { key: 'a13f2ac1e784b0e03408ed811b1c3bec4b730479', name: "actions" })));
|
|
876
881
|
}
|
|
877
882
|
get element() { return getElement(this); }
|
|
878
883
|
static get watchers() { return {
|
|
@@ -884,7 +889,7 @@ const MgForm = class {
|
|
|
884
889
|
"disabled": ["handleAttributeChange"]
|
|
885
890
|
}; }
|
|
886
891
|
};
|
|
887
|
-
MgForm.style =
|
|
892
|
+
MgForm.style = mgFormCss;
|
|
888
893
|
|
|
889
894
|
/**
|
|
890
895
|
* List of all possibles sizes
|
|
@@ -902,7 +907,6 @@ const variantStyles$1 = ['icon', 'background', 'full'];
|
|
|
902
907
|
const icons = { 'address-card': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 2a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm11 3h-3v1h3zm-3 2h3v1h-3zM8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0m-5 5.4A2.4 2.4 0 0 1 5.4 9h1.2A2.4 2.4 0 0 1 9 11.4a.6.6 0 0 1-.6.6H3.6a.6.6 0 0 1-.6-.6" clip-rule="evenodd"/></svg>', 'address-card-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 6.5a2 2 0 1 1-4 0 2 2 0 0 1 4 0m-1 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/><path fill="currentColor" d="M13 5h-3v1h3zm-3 2h3v1h-3z"/><path fill="currentColor" fill-rule="evenodd" d="M5.4 9A2.4 2.4 0 0 0 3 11.4a.6.6 0 0 0 .6.6h4.8a.6.6 0 0 0 .6-.6A2.4 2.4 0 0 0 6.6 9zm0 1a1.4 1.4 0 0 0-1.342 1h3.884A1.4 1.4 0 0 0 6.6 10z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M2 2a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm12 1H2v10h12z" clip-rule="evenodd"/></svg>', 'align-center': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M4 3h8v1H4zm-2 9h12v1H2zm12-6H2v1h12zM4 9h8v1H4z"/></svg>', 'align-justify': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M2 3h12v1H2zm0 9h12v1H2zm12-6H2v1h12zM2 9h12v1H2z"/></svg>', 'align-left': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M2 3h8v1H2zm0 9h12v1H2zm12-6H2v1h12zM2 9h8v1H2z"/></svg>', 'align-right': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6 3h8v1H6zm-4 9h12v1H2zm12-6H2v1h12zM6 9h8v1H6z"/></svg>', 'api': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14.44 11.47h-.02l-.66-.1-.02-.08c-.03-.11-.08-.21-.13-.31l-.04-.07.4-.54v-.02l-.52-.52h-.02l-.54.41-.07-.04c-.1-.05-.2-.09-.31-.13l-.08-.02-.1-.67v-.01h-.73v.02l-.1.66-.08.02c-.11.03-.21.08-.31.13l-.07.04-.55-.41-.52.52v.02l.41.54-.04.07c-.05.1-.09.2-.13.31l-.02.08-.67.1h-.01v.73h.02l.66.1.02.08c.03.1.08.21.13.3l.04.07-.41.55.52.52h.02l.54-.41.07.04c.1.05.2.09.31.13l.08.02.1.67v.01h.73v-.02l.1-.66.08-.02c.11-.03.21-.08.31-.13l.07-.04.55.41.52-.52v-.02l-.4-.54.04-.07c.05-.1.09-.2.13-.31l.02-.08.67-.1h.01v-.73zm-2.46 1.38c-.56 0-1.01-.45-1.01-1.01s.45-1.01 1.01-1.01 1.01.45 1.01 1.01-.45 1.01-1.01 1.01M8.51 5.81c-.11-.09-.27-.14-.5-.14h-.38v1.17h.27c.26 0 .45-.05.58-.15s.19-.25.19-.44-.05-.34-.16-.43zm1.57 5.13-.3-.4c-.1-.1-.09-.27 0-.37l.52-.52c.1-.1.26-.1.37 0l.4.29c.06-.03.13-.06.2-.08l.07-.49c0-.14.12-.25.26-.25h.45a5.44 5.44 0 1 0-10.5-1.99 5.44 5.44 0 0 0 5.44 5.44c.78 0 1.54-.17 2.25-.49v-.6c0-.14.11-.26.26-.26l.49-.07c.02-.07.05-.13.08-.2zm.18-5.96h.84v3.94h-.84zM5.4 8.92l-.29-.94H3.67l-.29.94h-.9l1.39-3.96h1.02l1.4 3.96h-.9zm3.72-1.74c-.26.23-.64.34-1.13.34h-.36v1.4h-.84V4.98h1.26c.48 0 .84.1 1.09.31s.37.51.37.92c0 .42-.13.75-.4.97zM4.4 5.57q-.09.345-.51 1.71h1.03q-.39-1.275-.45-1.44c-.03-.11-.06-.2-.07-.26z"/></svg>', 'archive': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3 6v6.96c0 .57.46 1.04 1.04 1.04H12c.55 0 1-.45 1-1V6zm7 2H6V7h4zm3-3H3c-.55 0-1-.45-1-1V3c0-.55.45-1 1-1h10c.55 0 1 .45 1 1v1c0 .55-.45 1-1 1"/></svg>', 'archive-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13 2H3c-.55 0-1 .45-1 1v2c0 .55.45 1 1 1v6.96c0 .57.46 1.04 1.04 1.04H12c.55 0 1-.45 1-1V6c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1m-1 11H4.04S4 12.98 4 12.96V6h8zm1-8H3V3h10zm-3 3H6V7h4z"/></svg>', 'arrow-clock': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m3.025 3.82-.002-.001.083-.09.063-.066.009-.01q.132-.15.273-.292a4 4 0 0 1 .215-.196q.136-.124.279-.24.108-.086.22-.166l.024-.018q.143-.105.293-.203a7 7 0 0 1 1.198-.607l.029-.01q.126-.05.257-.094a6 6 0 0 1 .375-.108l.067-.019q.105-.029.21-.053c.146-.032.294-.054.442-.075l.092-.015q.072-.013.146-.022A6.47 6.47 0 0 1 13 3.847V1.996h1v4h-4v-1h2.594a5.48 5.48 0 0 0-5.189-2.467l-.124.019-.077.012q-.188.025-.373.064a3 3 0 0 0-.173.044l-.063.017a6 6 0 0 0-.317.09 6 6 0 0 0-.227.084l-.016.006a6 6 0 0 0-.523.232 5.4 5.4 0 0 0-.736.452l-.028.021q-.092.065-.18.135-.12.098-.235.204l-.05.044q-.068.06-.133.122-.117.117-.226.241l-.013.014A5.496 5.496 0 1 0 13.5 7.996h1A6.5 6.5 0 1 1 3.025 3.82"/><path fill="currentColor" d="M9.795 11.746 7 8.95V4.246h1v4.29l2.5 2.505z"/></svg>', 'arrow-down': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.295 8.295 8.5 12.085V2h-1v10.085l-3.795-3.79L3 9l5 5 5-5z"/></svg>', 'arrow-down-a-z': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m6.53 10.9-1.41 1.41-.71.71-2.12-2.12.71-.71.88.88V3.02h1v8.12l.95-.95.71.71zM12.29 6H10.5l-.36 1H9.08l1.79-5h1.05l1.79 5h-1.06zm-.36-1.02-.53-1.49-.53 1.49zm1.79 5.18V9H9.09v1h3.29l-3.29 2.84V14h4.63v-1h-3.29z"/></svg>', 'arrow-down-right': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.999 12.292V3.999h1v10h-10v-1h8.292L2 2.707 2.707 2z"/></svg>', 'arrow-left': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m7 13 .705-.705L3.915 8.5H14v-1H3.915l3.79-3.795L7 3 2 8z"/></svg>', 'arrow-right': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m9 3-.715.696 3.79 3.804H2v1h10.075l-3.79 3.787L9 13l5-5z"/></svg>', 'arrow-rotate': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m3.025 3.82-.002-.001c.046-.055.098-.103.146-.156q.137-.155.282-.302c.069-.068.142-.13.215-.195q.136-.124.279-.241.12-.095.244-.184.143-.105.293-.203a7 7 0 0 1 1.198-.607q.142-.055.286-.104a6 6 0 0 1 .375-.108c.092-.025.184-.052.278-.072a6 6 0 0 1 .441-.075c.08-.012.157-.028.238-.037A6.47 6.47 0 0 1 13 3.847V1.996h1v4h-4v-1h2.594a5.48 5.48 0 0 0-5.188-2.467q-.102.014-.202.031-.188.025-.373.064c-.08.017-.157.04-.236.06a6 6 0 0 0-.317.092q-.122.042-.243.089a6 6 0 0 0-.523.232 5.4 5.4 0 0 0-.736.452q-.106.076-.208.156-.12.098-.235.204-.093.08-.183.166c-.083.081-.16.169-.239.255A5.496 5.496 0 1 0 13.5 7.996h1A6.5 6.5 0 1 1 3.025 3.82"/></svg>', 'arrow-rotate-backward': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m12.975 3.82.002-.001c-.046-.055-.098-.103-.146-.156-.092-.103-.183-.205-.282-.302-.069-.068-.142-.13-.215-.195q-.135-.124-.279-.241-.12-.095-.244-.184a7 7 0 0 0-.293-.203 7 7 0 0 0-.859-.467 7 7 0 0 0-.339-.14q-.142-.055-.286-.104a6 6 0 0 0-.375-.108c-.092-.025-.184-.052-.278-.072a6 6 0 0 0-.441-.075c-.08-.012-.157-.028-.238-.037A6.47 6.47 0 0 0 3 3.847V1.996H2v4h4v-1H3.406a5.48 5.48 0 0 1 5.189-2.467q.101.014.2.031.19.025.374.064c.08.017.157.04.236.06q.16.042.317.092.122.042.243.089a6 6 0 0 1 .523.232 5.3 5.3 0 0 1 .736.452q.105.076.208.156.12.098.235.204.093.08.183.166c.083.081.16.169.239.255A5.496 5.496 0 1 1 2.5 7.996h-1A6.5 6.5 0 1 0 12.975 3.82"/></svg>', 'arrow-up': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 2 3 7l.705.705L7.5 3.915V14h1V3.915l3.795 3.79L13 7z"/></svg>', 'arrow-up-right': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.292 3H3.999V2h10v10h-1V3.707L2.707 14 2 13.29z"/></svg>', 'arrow-up-right-square': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14.33 3v10c0 .73-.6 1.32-1.33 1.33H3c-.73 0-1.32-.6-1.33-1.33V3c0-.73.6-1.32 1.33-1.33h10c.73 0 1.32.6 1.33 1.33m-2.48.46H8.68c-.37 0-.67.29-.68.66v.04c0 .18.07.35.2.47l.91.91-5.53 5.53c-.13.13-.14.33-.01.47h.01l.87.88c.13.13.33.14.47.01h.01l5.53-5.53.91.9c.26.28.7.29.98.02l.02-.02c.12-.13.19-.3.19-.48V4.15c0-.37-.3-.67-.67-.67z"/></svg>', 'arrow-up-z-a': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m5.82 5.85-.94-.94v8.11h-1V4.96l-.89.89-.71-.71 1.41-1.41.71-.71.71.71 1.41 1.41-.71.71zM12.29 13H10.5l-.36 1H9.08l1.79-5h1.05l1.79 5h-1.06zm-.36-1.02-.53-1.49-.53 1.49zm1.79-8.82V2H9.09v1h3.29L9.09 5.84V7h4.63V6h-3.29z"/></svg>', 'arrows-compare': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M11.705 8.295 9.915 6.5H15v-1H9.915l1.79-1.795L11 3 8 6l3 3zM8 10 5 7l-.705.705L6.085 9.5H1v1h5.085l-1.79 1.795L5 13z"/></svg>', 'arrows-right-down': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m12.085 4.499-1.79-1.795.705-.705 3 3-3 3-.705-.705 1.79-1.795H9v-1zM8 6.514h.003v5.572l1.795-1.79.705.705-3 3-3-3 .705-.705 1.795 1.79V5.499H2v-1h6z"/></svg>', 'arrows-right-left': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m11 2 3 3-3 3-.705-.705 1.79-1.795H2v-1h10.085l-1.79-1.795zm-7.085 9.5 1.79 1.795L5 14l-3-3 3-3 .705.705-1.79 1.795H14v1z" clip-rule="evenodd"/></svg>', 'arrows-rotate': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M10 4.997h2.61a5.5 5.5 0 0 0-6.175-2.271A5.5 5.5 0 0 0 2.5 7.993h-1a6.49 6.49 0 0 1 4.289-6.112A6.51 6.51 0 0 1 13 3.838V2h1v3.996h-4zM6 10.99H3.39a5.5 5.5 0 0 0 6.175 2.271A5.5 5.5 0 0 0 13.5 7.993h1a6.49 6.49 0 0 1-4.289 6.113A6.51 6.51 0 0 1 3 12.15v1.838H2V9.991h4z"/></svg>', 'arrows-rotate-backward': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6 4.997H3.39a5.5 5.5 0 0 1 6.175-2.271A5.5 5.5 0 0 1 13.5 7.993h1a6.49 6.49 0 0 0-4.289-6.112A6.51 6.51 0 0 0 3 3.838V2H2v3.996h4zm4 5.993h2.61a5.5 5.5 0 0 1-6.175 2.271A5.5 5.5 0 0 1 2.5 7.993h-1a6.49 6.49 0 0 0 4.289 6.113A6.51 6.51 0 0 0 13 12.15v1.838h1V9.991h-4z"/></svg>', 'arrows-up-down': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m1.5 5 3-3 3 3-.7.7L5 3.9V14H4V3.9L2.2 5.7zM12 12.1l1.8-1.8.7.7-3 3-3-3 .7-.7 1.8 1.8V2h1z" clip-rule="evenodd"/></svg>', 'ban': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0m-3.126 4.582a6 6 0 0 1-8.456-8.456zm.707-.708L4.127 3.418a6 6 0 0 1 8.456 8.456" clip-rule="evenodd"/></svg>', 'bell': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3.97 6a4 4 0 0 1 8 0v2.3l1.507.822c.91.496.558 1.878-.478 1.878H3.002c-1.027 0-1.387-1.362-.494-1.87l1.461-.83zm2.027 6a2 2 0 1 0 4 0z"/></svg>', 'bell-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path stroke="currentColor" d="m11.47 8.597 1.768.964c.455.248.28.939-.239.939H3.002c-.514 0-.694-.681-.247-.935l1.714-.974V6a3.5 3.5 0 0 1 7 0zM7.996 13.5a1.5 1.5 0 0 1-1.415-1h2.83a1.5 1.5 0 0 1-1.415 1Z"/></svg>', 'book': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3 3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-2H1.5a.5.5 0 0 1 0-1H3V9H1.5a.5.5 0 0 1 0-1H3V7H1.5a.5.5 0 0 1 0-1H3zm8 0H9v4h2z" clip-rule="evenodd"/></svg>', 'book-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M4 2a1 1 0 0 0-1 1v3H1.5a.5.5 0 0 0 0 1H3v1H1.5a.5.5 0 0 0 0 1H3v1H1.5a.5.5 0 0 0 0 1H3v2a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm5 1H4v3h.5a.5.5 0 0 1 0 1H4v1h.5a.5.5 0 0 1 0 1H4v1h.5a.5.5 0 0 1 0 1H4v2h8V3h-1v4H9z" clip-rule="evenodd"/></svg>', 'briefcase': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5 4v1H2a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-3V4a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1m5 1V4H6v1z" clip-rule="evenodd"/></svg>', 'briefcase-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5 5V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v1h3a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zm1-1h4v1H6zM2 6v7h12V6z" clip-rule="evenodd"/></svg>', 'building-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M4 2h8v12H9v-1a1 1 0 1 0-2 0v1H4zm4 13h4a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1zM7 4H5v2h2zm2 0h2v2H9zm2 4H9v2h2zM5 8h2v2H5z" clip-rule="evenodd"/></svg>', 'calculator': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 2a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm2 1h8v3H4zm2 5H4v2h2zm1 0h2v2H7zm5 0h-2v5h2zm-8 3h2v2H4zm5 0H7v2h2z" clip-rule="evenodd"/></svg>', 'calculator-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M4 3h8v3H4zm2 5H4v2h2zm3 0H7v2h2zm3 0h-2v5h2zm-6 3H4v2h2zm3 0H7v2h2z"/><path fill="currentColor" fill-rule="evenodd" d="M2 2a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm1 0h10v12H3z" clip-rule="evenodd"/></svg>', 'calendar': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5 1h1v1h4V1h1v1h2a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h2zm8 5H3v7h10z" clip-rule="evenodd"/></svg>', 'calendar-euro': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12 2.5h1c.6 0 1 .4 1 1v10c0 .6-.4 1-1 1H3c-.6 0-1-.4-1-1v-10c0-.6.4-1 1-1h1v-1h1v1h6v-1h1zm-9 3v8h10v-8zm7.5 6.24-.71-.71c-.35.3-.8.49-1.29.49-.74 0-1.4-.41-1.74-1.02h1.77v-.75H6.51c-.01-.07-.01-.15-.01-.23 0-.09.01-.18.02-.27h2.01V8.5H6.78c.35-.59.99-.98 1.72-.98.49 0 .94.19 1.29.49l.71-.71a2.974 2.974 0 0 0-4.81 1.2H4.5v.75h1.02c-.02.09-.02.18-.02.27 0 .08 0 .16.02.23H4.5v.75h1.17c.4 1.17 1.52 2.02 2.83 2.02.77 0 1.47-.3 2-.78" clip-rule="evenodd"/></svg>', 'calendar-euro-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m9.79 11.02.71.71a2.976 2.976 0 0 1-4.83-1.24H4.5v-.75h1.01c-.01-.08-.01-.15-.01-.23 0-.09 0-.18.02-.27H4.5v-.75h1.19a2.974 2.974 0 0 1 4.81-1.2L9.79 8c-.35-.3-.8-.49-1.29-.49-.73 0-1.37.39-1.72.98h1.75v.75H6.52c-.01.09-.02.18-.02.27 0 .08 0 .16.01.23h2.02v.75H6.76c.34.61 1 1.02 1.74 1.02.49 0 .94-.19 1.29-.49M13 3.5v1H3v-1zm-1-2h-1v1H5v-1H4v1H3c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h10c.55 0 1-.45 1-1v-10c0-.55-.45-1-1-1h-1zm-9 12v-8h10v8z"/></svg>', 'calendar-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13 2h-2V1h-1v1H6V1H5v1H3c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1m0 11H3V6h10zm0-8H3V3h2v1h1V3h4v1h1V3h2z"/></svg>', 'check': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6.77 12.113 15 3.883l-.707-.707-8.23 8.23-4.355-4.355L1 7.76l4.355 4.355-.004.004.707.706.004-.004.003.004.708-.707z"/></svg>', 'check-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1m-1 9.795-2.5-2.5.795-.795L7 9.205 10.705 5.5l.798.793z"/></svg>', 'check-circle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m4.5 8.207 2.5 2.5 4.5-4.5-.707-.707L7 9.293 5.207 7.5z"/><path fill="currentColor" fill-rule="evenodd" d="M4.111 2.18a7 7 0 1 1 7.778 11.64A7 7 0 0 1 4.111 2.18m.556 10.809a6 6 0 1 0 6.666-9.978 6 6 0 0 0-6.666 9.978" clip-rule="evenodd"/></svg>', 'chevron-down': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m8 11.708 6-6L13.293 5 8 10.293 2.708 5 2 5.708z"/></svg>', 'chevron-down-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14M3.706 6 8 10.294 12.294 6l.706.706-5 5-5-5z" clip-rule="evenodd"/></svg>', 'chevron-left': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m4 8 6 6 .708-.708L5.415 8l5.293-5.292L10 2z"/></svg>', 'chevron-left-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8m9-4.294L5.706 8 10 12.294 9.294 13l-5-5 5-5z" clip-rule="evenodd"/></svg>', 'chevron-right': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m11.708 8-6-6L5 2.708 10.293 8 5 13.293l.708.707z"/></svg>', 'chevron-right-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M15 8A7 7 0 1 0 1 8a7 7 0 0 0 14 0m-9 4.294L10.294 8 6 3.706 6.706 3l5 5-5 5z" clip-rule="evenodd"/></svg>', 'chevron-up': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m8 4.5-6 6 .708.707L8 5.916l5.293 5.293L14 10.5z"/></svg>', 'chevron-up-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1m4.294 9L8 5.706 3.706 10 3 9.294l5-5 5 5z" clip-rule="evenodd"/></svg>', 'circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8"/></svg>', 'clock': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m-.5-6.795L10.295 11l.705-.705L8.5 7.79V3.5h-1z" clip-rule="evenodd"/></svg>', 'clock-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m10.95 10.04-.71.71L7.5 8.01v-4h1V7.6l2.45 2.45zM8 2C4.69 2 2 4.69 2 8s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6m0-1c3.87 0 7 3.13 7 7s-3.13 7-7 7-7-3.13-7-7 3.13-7 7-7"/></svg>', 'code-square-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m6.32 10.28.73-.73L5.5 8l1.53-1.53-.73-.73-2.27 2.27 2.28 2.28zm3.37 0L11.97 8 9.69 5.72l-.73.73L10.51 8 8.96 9.55zM3.01 14c-.27 0-.5-.1-.7-.3s-.3-.43-.3-.7V3c0-.27.1-.5.3-.7s.43-.3.7-.3h10c.27 0 .5.1.7.3s.3.43.3.7v10c0 .27-.1.5-.3.7s-.43.3-.7.3H3zm0-1h10V3H3v10z"/></svg>', 'cog': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6.062 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v1.416c.345.15.67.34.97.56l1.226-.708a1 1 0 0 1 1.366.366l1 1.732a1 1 0 0 1-.366 1.366l-1.227.709a5 5 0 0 1 0 1.119l1.227.708a1 1 0 0 1 .366 1.366l-1 1.732a1 1 0 0 1-1.366.366l-1.227-.708c-.3.22-.624.41-.969.56V14a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1.416a5 5 0 0 1-.969-.56l-1.227.708a1 1 0 0 1-1.366-.366l-1-1.732a1 1 0 0 1 .366-1.366l1.227-.709a5 5 0 0 1 0-1.118l-1.227-.709A1 1 0 0 1 1.5 5.366l1-1.732a1 1 0 0 1 1.366-.366l1.227.709q.45-.334.97-.561zm2 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4" clip-rule="evenodd"/></svg>', 'cog-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5.438 8a2.5 2.5 0 1 1 5 0 2.5 2.5 0 0 1-5 0m2.5-1.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M10 3.416V2a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1v1.416c-.345.15-.67.34-.969.56l-1.227-.708a1 1 0 0 0-1.366.366l-1 1.732a1 1 0 0 0 .366 1.366l1.227.709a5 5 0 0 0 0 1.118l-1.227.709a1 1 0 0 0-.366 1.366l1 1.732a1 1 0 0 0 1.366.366l1.227-.708a5 5 0 0 0 .969.56V14a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-1.416c.345-.15.67-.34.969-.56l1.227.708a1 1 0 0 0 1.366-.366l1-1.732a1 1 0 0 0-.366-1.366l-1.227-.709a5 5 0 0 0 0-1.118l1.227-.709a1 1 0 0 0 .366-1.366l-1-1.732a1 1 0 0 0-1.366-.366l-1.227.708c-.3-.22-.624-.41-.97-.56M7 4.07l-.6.262q-.414.182-.775.449l-.527.39-1.794-1.037-1 1.732 1.793 1.035-.072.65a4 4 0 0 0 0 .898l.072.65-1.793 1.035 1 1.732 1.794-1.036.527.39q.361.265.775.448l.6.262V14h2v-2.07l.6-.262q.414-.182.774-.449l.527-.39 1.795 1.037 1-1.732-1.793-1.035.072-.65a4 4 0 0 0 0-.898l-.072-.65 1.793-1.035-1-1.732-1.795 1.036-.527-.39q-.36-.265-.774-.448L9 4.07V2H7z" clip-rule="evenodd"/></svg>', 'comment': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M7.5 2A5.5 5.5 0 0 0 4 11.743V14l3.5-1h1a5.5 5.5 0 1 0 0-11zM5 6h6v1H5zm3 2H5v1h3z" clip-rule="evenodd"/></svg>', 'comment-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5 6h6v1H5zm0 2h3v1H5z"/><path fill="currentColor" fill-rule="evenodd" d="m4 14 3.5-1h1a5.5 5.5 0 1 0 0-11h-1A5.5 5.5 0 0 0 4 11.743zm1-2.728-.363-.3A4.5 4.5 0 0 1 7.5 3h1a4.5 4.5 0 1 1 0 9H7.36L5 12.674z" clip-rule="evenodd"/></svg>', 'comment-sms': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 2.67c-3.37 0-6.1 2.21-6.1 4.95.02 1.18.51 2.3 1.36 3.11-.26.85-.71 1.62-1.3 2.28a.2.2 0 0 0-.04.21c.03.07.1.11.17.11 1.22-.02 2.4-.45 3.34-1.22.82.31 1.68.46 2.56.46 3.37 0 6.1-2.22 6.1-4.95S11.37 2.67 8 2.67M4.95 8.39a.76.76 0 1 1 0-1.52.76.76 0 0 1 0 1.52m3.05 0a.76.76 0 1 1 0-1.52.76.76 0 0 1 0 1.52m3.05 0a.76.76 0 1 1-.02-1.52c.42 0 .77.33.77.75v.01c0 .42-.34.76-.76.76"/></svg>', 'conversation': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1.01 6.51c0-1.93 2.23-3.5 4.99-3.5s4.99 1.57 4.99 3.5-2.23 3.5-4.99 3.5c-.36 0-.71-.03-1.05-.08l-2.26 1.05c-.06.03-.11.03-.17.03-.27 0-.5-.21-.5-.5V8.6c-.62-.58-1.01-1.3-1.01-2.09m10.48-.01c0-.5-.13-.97-.36-1.41h.01c2.22.36 3.88 1.75 3.88 3.41 0 .79-.39 1.5-1.02 2.09v1.91a.5.5 0 0 1-.67.47l-2.26-1.05c-.34.05-.69.08-1.05.08-1.69 0-3.19-.59-4.09-1.5h.12c3.03 0 5.44-1.81 5.44-4" clip-rule="evenodd"/></svg>', 'conversation-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M10 6.5C10 5.14 8.17 4 6 4l-.01.01c-2.17 0-4 1.14-4 2.5 0 .59.38 1.06.7 1.36l.32.3v1.55l1.51-.7.27-.13.3.04c.31.05.62.07.91.07 2.17 0 4-1.14 4-2.5m-9.01.01c0-1.929 2.237-3.498 4.995-3.5 2.758.002 4.995 1.571 4.995 3.5s-2.24 3.5-5 3.5c-.36 0-.71-.03-1.05-.08l-2.26 1.05c-.06.03-.11.03-.17.03-.26 0-.5-.21-.5-.5V8.6C1.38 8.02.99 7.3.99 6.51m4.995-3.5h.005-.01zm8.005 7.58c.62-.58 1.01-1.3 1.01-2.09q0-.18-.03-.36c-.01-.11-.04-.22-.07-.33a2.3 2.3 0 0 0-.17-.45 3.55 3.55 0 0 0-1.1-1.26c-.1-.07-.19-.13-.3-.2a5 5 0 0 0-.65-.35c-.23-.1-.48-.19-.73-.27a4 4 0 0 1-.19-.06c.14.36.22.74.23 1.13C13.18 6.78 14 7.59 14 8.5c0 .59-.38 1.07-.7 1.36l-.31.3-.01.43v1.12l-1.5-.7-.28-.12-.29.04c-.31.05-.62.07-.91.07-.67 0-1.3-.1-1.86-.29-.51.15-1.06.24-1.64.27.06.05.12.09.18.13l.42.24c.36.18.76.33 1.18.43.15.04.3.08.46.1.02.01.03.01.05.01.17.04.34.07.52.07.22.03.46.04.69.04.36 0 .71-.03 1.05-.08l2.26 1.05q.09.03.18.03c.26 0 .49-.21.5-.5z" clip-rule="evenodd"/></svg>', 'copy': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M4 2h6V1H4a1 1 0 0 0-1 1v9h1z"/><path fill="currentColor" d="M5 4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1z"/></svg>', 'copy-file': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M4 2h6V1H4a1 1 0 0 0-1 1v9h1z"/><path fill="currentColor" d="M6 3h3v4h4v7a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1"/><path fill="currentColor" d="m13 6-3-3v3z"/></svg>', 'copy-file-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m10 3 3 3v8a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm0 1.414V6h1.586zM12 7H9V4H6v10h6z" clip-rule="evenodd"/><path fill="currentColor" d="M4 2h6V1H4a1 1 0 0 0-1 1v9h1z"/></svg>', 'copy-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M10 2H4v9H3V2a1 1 0 0 1 1-1h6z"/><path fill="currentColor" fill-rule="evenodd" d="M5 4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1zm1 0h6v10H6z" clip-rule="evenodd"/></svg>', 'credit-card': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3 9h3v2H3z"/><path fill="currentColor" fill-rule="evenodd" d="M2 13a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1zm0-9h12v1H2zm12 3v5H2V7z" clip-rule="evenodd"/></svg>', 'cross': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M2 2.707 2.707 2l11.29 11.289-.708.707z"/><path fill="currentColor" d="M2.707 14 2 13.293 13.293 2l.707.708z"/></svg>', 'cross-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 1C4.1 1 1 4.1 1 8s3.1 7 7 7 7-3.1 7-7-3.1-7-7-7m2.7 10.5L8 8.8l-2.7 2.7-.8-.8L7.2 8 4.5 5.3l.8-.8L8 7.2l2.7-2.7.8.8L8.8 8l2.7 2.7z"/></svg>', 'cross-circle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1 8c0-3.9 3.1-7 7-7s7 3.1 7 7-3.1 7-7 7-7-3.1-7-7m1 0c0 3.3 2.7 6 6 6s6-2.7 6-6-2.7-6-6-6-6 2.7-6 6m6 .8 2.7 2.7.8-.8L8.8 8l2.7-2.7-.8-.8L8 7.2 5.3 4.5l-.8.8L7.2 8l-2.7 2.7.8.8z" clip-rule="evenodd"/></svg>', 'dashboard': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M2 2h6v7H2zm0 8h6v4H2zm7-8h5v4H9zm0 5h5v7H9z"/></svg>', 'dashboard-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 2H2v7h6zM7 3H3v5h4zm1 7H2v4h6zm-1 1H3v2h4zm2-9v4h5V2zm4 1h-3v2h3zm1 4H9v7h5zm-1 1h-3v5h3z" clip-rule="evenodd"/></svg>', 'download': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12.295 6.295 13 7l-5 5-5-5 .705-.705 3.795 3.79V1h1v9.085zM13 14v-2h1v2a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-2h1v2z" clip-rule="evenodd"/></svg>', 'earth': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m-1.224-2.553-.63 1.261A6.003 6.003 0 0 1 4.501 3.126l1.6.4a1 1 0 0 1 .742 1.14L6.41 7.19a1 1 0 0 1-.986.83H4.47a1 1 0 0 0-.77.362l-.185.223A1 1 0 0 0 3.5 9.862l.273.348a1 1 0 0 0 .59.362l1.658.332a1 1 0 0 1 .699.533l.057.116a1 1 0 0 1 0 .894m3.543-9.983V4.53a1 1 0 0 0 1 1h1.234a1 1 0 0 0 .664-.252l.09-.08a6.02 6.02 0 0 0-2.988-2.733m3.612 4.622-.012-.075h-3.05a1 1 0 0 0-.884.535l-.773 1.469a1 1 0 0 0-.115.465v.964a1 1 0 0 0 .408.806l.353.259a1 1 0 0 1 .408.806v1.242a6 6 0 0 0 3.665-6.47" clip-rule="evenodd"/></svg>', 'earth-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m0-1a6 6 0 0 0 1.766-.264v-1.421a.5.5 0 0 0-.204-.403l-.353-.26a1.5 1.5 0 0 1-.612-1.208V9.48c0-.243.06-.483.173-.698l.772-1.469a1.5 1.5 0 0 1 1.328-.802h2.944a6 6 0 0 0-.284-.844 1.5 1.5 0 0 1-.977.362h-1.235a1.5 1.5 0 0 1-1.5-1.5V2.28A6 6 0 0 0 8 2a6 6 0 0 0-2.918.756l1.14.286A1.5 1.5 0 0 1 7.336 4.75l-.433 2.525a1.5 1.5 0 0 1-1.479 1.247H4.47a.5.5 0 0 0-.385.18l-.185.223a.5.5 0 0 0-.008.628l.273.348a.5.5 0 0 0 .295.181l1.658.332a1.5 1.5 0 0 1 1.048.8l.058.115a1.5 1.5 0 0 1 0 1.342l-.587 1.174A6 6 0 0 0 8 14m6-6q0-.247-.02-.489h-3.11a.5.5 0 0 0-.443.268l-.772 1.468a.5.5 0 0 0-.058.233v.964a.5.5 0 0 0 .204.403l.353.259a1.5 1.5 0 0 1 .612 1.209v1.01A6 6 0 0 0 14 8m-8.402 5.5h.093l.638-1.276a.5.5 0 0 0 0-.448l-.057-.115a.5.5 0 0 0-.35-.267l-1.658-.331a1.5 1.5 0 0 1-.885-.545l-.273-.347a1.5 1.5 0 0 1 .025-1.884l.184-.223a1.5 1.5 0 0 1 1.155-.542h.954a.5.5 0 0 0 .493-.416l.433-2.525a.5.5 0 0 0-.37-.57l-1.95-.487-.046.018A6.002 6.002 0 0 0 5.598 13.5m7.287-8.597.164-.146a6 6 0 0 0-1.458-1.564 6 6 0 0 0-.772-.457V4.53a.5.5 0 0 0 .5.5h1.234a.5.5 0 0 0 .332-.126" clip-rule="evenodd"/></svg>', 'ellipsis': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3 8a1 1 0 1 1 2 0 1 1 0 0 1-2 0m4 0a1 1 0 1 1 2 0 1 1 0 0 1-2 0m4 0a1 1 0 1 1 2 0 1 1 0 0 1-2 0"/></svg>', 'ellipsis-vertical': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 3a1 1 0 1 1 0 2 1 1 0 0 1 0-2m0 4a1 1 0 1 1 0 2 1 1 0 0 1 0-2m0 4a1 1 0 1 1 0 2 1 1 0 0 1 0-2"/></svg>', 'euro': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m12.08 11.02 1.42 1.42a5.95 5.95 0 0 1-4 1.56c-2.6 0-4.8-1.64-5.62-3.94H1.5v-1.5h2.04C3.5 8.38 3.5 8.18 3.5 8c0-.16 0-.34.04-.5H1.5V6h2.36c.8-2.34 3.02-4 5.64-4 1.54 0 2.94.6 4 1.56l-1.42 1.42c-.7-.6-1.6-.98-2.58-.98-1.48 0-2.76.8-3.46 2h3.52v1.5H5.54c-.02.16-.04.32-.04.5 0 .2.02.38.04.56h4.02v1.5H6.08C6.78 11.22 8.06 12 9.5 12c.98 0 1.88-.38 2.58-.98"/></svg>', 'euro-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill="currentColor" d="M8 .67C3.95.67.67 3.95.67 8S3.95 15.33 8 15.33s7.33-3.28 7.33-7.33S12.05.67 8 .67m2.27 11.4c-.38.09-.76.14-1.15.14a4.04 4.04 0 0 1-3.99-2.92h-.58c-.12 0-.23-.09-.23-.22v-.54c0-.12.11-.22.23-.22h.41a5 5 0 0 1 0-.8h-.41c-.12 0-.23-.09-.23-.22v-.58c0-.12.1-.22.23-.22h.63c.6-1.65 2.18-2.74 3.94-2.71.34 0 .68.03 1.02.1.12.03.19.16.16.28l-.23.84c-.03.12-.15.19-.27.17-.24-.05-.48-.08-.73-.08A2.42 2.42 0 0 0 6.81 6.5h2.71c.12.03.2.15.17.27l-.13.58c-.02.1-.11.18-.22.18H6.52c-.03.27-.03.53 0 .8h2.63c.12.03.2.15.17.27l-.11.52c-.03.1-.12.17-.22.18H6.8c.36.96 1.28 1.6 2.31 1.61.3 0 .59-.04.88-.1.12-.02.24.06.27.18l.17.84c.02.12-.05.24-.17.27v-.03z"/></g><defs><clipPath id="a"><path fill="currentColor" d="M0 0h16v16H0z"/></clipPath></defs></svg>', 'exclamation-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1 8a7 7 0 1 1 14 0A7 7 0 0 1 1 8m7.75-4v5h-1.5V4zm0 8v-1.5h-1.5V12z" clip-rule="evenodd"/></svg>', 'exclamation-circle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.75 4v5h-1.5V4zm0 8v-1.5h-1.5V12z"/><path fill="currentColor" fill-rule="evenodd" d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1M2 8a6 6 0 1 0 12 0A6 6 0 0 0 2 8" clip-rule="evenodd"/></svg>', 'exclamation-stamp': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m15 8-1.55-1.86.22-2.46-2.3-.55L10.17 1 8 1.98 5.84 1 4.63 3.13l-2.29.54.22 2.46L1.01 8l1.55 1.86-.22 2.47 2.3.55 1.2 2.13L8 14.03l2.17.98 1.2-2.13 2.3-.55-.22-2.46L15 8.01zm-6.36 3.35H7.36v-1.34h1.28zm0-2.67H7.36V4.67h1.28z"/></svg>', 'exclamation-triangle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m8 2 7 12H1zm-.75 4.5h1.5V10h-1.5zm1.5 6V11h-1.5v1.5z" clip-rule="evenodd"/></svg>', 'exclamation-triangle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.75 6.5V10h-1.5V6.5zm0 6V11h-1.5v1.5z"/><path fill="currentColor" fill-rule="evenodd" d="M8 2 1 14h14zm0 1.985L2.741 13h10.518z" clip-rule="evenodd"/></svg>', 'eye': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 10a2 2 0 1 0 0-4 2 2 0 0 0 0 4"/><path fill="currentColor" fill-rule="evenodd" d="M15 8s-3.134 5-7 5-7-5-7-5 3.134-5 7-5 7 5 7 5m-7 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6" clip-rule="evenodd"/></svg>', 'eye-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6m0-1a2 2 0 1 0 0-4 2 2 0 0 0 0 4" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M1 8s3.134 5 7 5 7-5 7-5-3.134-5-7-5-7 5-7 5m1.215 0 .133.178a15 15 0 0 0 1.405 1.61C4.974 10.994 6.478 12 8 12s3.026-1.006 4.247-2.212A15 15 0 0 0 13.785 8l-.133-.178a15 15 0 0 0-1.405-1.61C11.026 5.006 9.522 4 8 4S4.974 5.006 3.753 6.212A15 15 0 0 0 2.215 8" clip-rule="evenodd"/></svg>', 'eye-slash': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m1 1.7.7-.7L15 14.302l-.7.7-3.084-3.085c-.963.63-2.057 1.08-3.216 1.08-3.866 0-7-5-7-5S2.174 6.124 3.97 4.67zm4.556 4.557A3 3 0 0 0 9.74 10.44l-.722-.722a2 2 0 0 1-2.74-2.74z" clip-rule="evenodd"/><path fill="currentColor" d="m5.67 3.572 1.532 1.532a3.003 3.003 0 0 1 3.69 3.691l1.877 1.877C14.142 9.366 15 7.997 15 7.997s-3.134-5-7-5c-.817 0-1.6.223-2.33.575"/><path fill="currentColor" d="M9.998 7.9 8.097 6a2 2 0 0 1 1.9 1.901"/></svg>', 'eye-slash-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m1 1.7.7-.7L15 14.302l-.7.7-3.084-3.085c-.963.63-2.057 1.08-3.216 1.08-3.866 0-7-5-7-5S2.174 6.124 3.97 4.67zm3.682 3.683c-.324.256-.635.535-.93.826a15 15 0 0 0-1.537 1.788l.133.178c.334.442.815 1.028 1.405 1.61C4.974 10.99 6.478 11.997 8 11.997c.852 0 1.698-.315 2.492-.804l-.752-.752a3 3 0 0 1-4.184-4.184zm1.596 1.596a2 2 0 0 0 2.74 2.74z" clip-rule="evenodd"/><path fill="currentColor" d="m5.67 3.572.757.757A4.2 4.2 0 0 1 8 3.997c1.522 0 3.026 1.006 4.247 2.212a15 15 0 0 1 1.538 1.788q-.061.085-.133.178a15 15 0 0 1-1.531 1.733l-.06.057.708.707C14.142 9.366 15 7.997 15 7.997s-3.134-5-7-5c-.817 0-1.6.223-2.33.575"/><path fill="currentColor" d="m8.097 6-.895-.896a3.003 3.003 0 0 1 3.69 3.691L9.999 7.9A2 2 0 0 0 8.097 6"/></svg>', 'fax': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M13 14H6V2h7v3a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1M7 3h5v2H7zm0 4h5v1H7zm1 2H7v1h1zm-1 2h1v1H7zm3-2H9v1h1zm-1 2h1v1H9zm3-2h-1v1h1zm-1 2h1v1h-1z" clip-rule="evenodd"/><path fill="currentColor" d="M2 5a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/></svg>', 'fax-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12 3H7v2h5zM6 3v2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1V2H6zm6 3h1v7H6V6zM3 5h2v8H3zm9 2H7v1h5zM7 9h1v1H7zm1 2H7v1h1zm1-2h1v1H9zm1 2H9v1h1zm1-2h1v1h-1zm1 2h-1v1h1z" clip-rule="evenodd"/></svg>', 'file': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9 5V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V5zm1-1V1l3 3z" clip-rule="evenodd"/></svg>', 'file-cog': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M9 10.06c-.03.53-.47.94-1 .94-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1zm.55-4.81h3.76v9.4a.68.68 0 0 1-.66.66h-9.3c-.37 0-.67-.31-.66-.68V1.33c.01-.36.3-.65.66-.66h5.54v3.89c-.01.37.28.68.65.69zM10 8l-.51.29c-.21-.18-.46-.32-.72-.41v-.57c0-.06-.05-.12-.11-.14-.43-.09-.87-.09-1.3 0a.14.14 0 0 0-.12.14v.59q-.405.135-.72.42L6 8a.135.135 0 0 0-.17 0c-.3.32-.52.71-.65 1.13-.02.06 0 .13.06.16l.51.29q-.075.42 0 .84l-.51.29c-.05.03-.08.1-.06.16.13.42.35.81.65 1.13.05.04.12.04.17 0l.51-.29c.22.18.46.32.73.41v.59c0 .07.04.13.11.14.43.09.87.09 1.3 0 .07-.01.12-.07.11-.14v-.51c.27-.09.51-.23.73-.41l.51.29c.05.04.12.04.17 0 .3-.32.52-.71.65-1.13.02-.06 0-.13-.06-.16l-.5-.3c.05-.27.05-.56 0-.83l.5-.3c.06-.03.09-.1.07-.16a2.9 2.9 0 0 0-.65-1.13A.16.16 0 0 0 10 8m3.12-4.33L10.41.87a.63.63 0 0 0-.47-.2h-.17v3.66h3.54v-.17c0-.18-.06-.36-.19-.49"/></svg>', 'file-download': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m10.41.87 2.71 2.8a.7.7 0 0 1 .19.49v.17H9.77V.67h.17a.63.63 0 0 1 .47.2m2.9 4.38v9.42a.67.67 0 0 1-.66.66h-9.3a.67.67 0 0 1-.66-.68V1.33a.67.67 0 0 1 .66-.66h5.54v3.9a.67.67 0 0 0 .66.68zm-5.45 7.69 2.54-2.53a.19.19 0 0 0 .01-.27.16.16 0 0 0-.14-.06H8.93a.2.2 0 0 1-.2-.2v-2.6a.18.18 0 0 0-.18-.19H6.92a.19.19 0 0 0-.19.18v2.61a.2.2 0 0 1-.2.2H5.19a.18.18 0 0 0-.19.18.2.2 0 0 0 .06.15l2.54 2.53a.18.18 0 0 0 .26 0" clip-rule="evenodd"/></svg>', 'file-excel': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9 5V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V5zm-.018 7h1.335L8.776 9.48l1.5-2.48H9.02l-.795 1.485a5 5 0 0 0-.157.436h-.014a2.6 2.6 0 0 0-.15-.422L7.19 7H5.82l1.457 2.5L5.683 12h1.342l.865-1.614q.09-.234.115-.349h.014q.053.244.101.335z" clip-rule="evenodd"/><path fill="currentColor" d="M10 4V1l3 3z"/></svg>', 'file-excel-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.982 12h1.335L8.776 9.48l1.5-2.48H9.02l-.795 1.485a5 5 0 0 0-.157.436h-.014a2.6 2.6 0 0 0-.15-.422L7.19 7H5.82l1.457 2.5L5.683 12h1.342l.865-1.614q.09-.234.115-.349h.014q.053.244.101.335z"/><path fill="currentColor" fill-rule="evenodd" d="M4 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4l-3-3zm6 3V2.537L11.254 4zm2 1v9H4V2h5v3z" clip-rule="evenodd"/></svg>', 'file-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m10 1 3 3v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zm0 1.415V4h1.585zM12 5H9V2H4v12h8z" clip-rule="evenodd"/></svg>', 'file-pdf': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6.464 11.274a4 4 0 0 0-.393.207c-.223.137-.37.27-.444.387-.072.11-.073.19-.03.273l.019.034.027-.01c.103-.042.268-.177.48-.433q.18-.22.34-.458m1.243-1.007q.378-.09.764-.146a9 9 0 0 1-.386-.65 16 16 0 0 1-.378.796m1.873.363a3 3 0 0 0 .341.314c.164.123.28.165.344.168a.1.1 0 0 0 .053-.012.23.23 0 0 0 .07-.094.3.3 0 0 0 .045-.152.07.07 0 0 0-.02-.047c-.039-.047-.15-.116-.391-.159a3 3 0 0 0-.463-.04zM8.051 7.952q.096-.308.151-.626.035-.213.029-.352a.5.5 0 0 0-.024-.15.4.4 0 0 0-.11.03c-.066.027-.12.08-.148.215l-.01.057q-.029.213.044.565.027.126.068.26"/><path fill="currentColor" fill-rule="evenodd" d="M9 1v4h4v9a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM5.42 12.713a.6.6 0 0 1-.332-.318c-.147-.294-.098-.588.06-.834.15-.233.4-.43.68-.596a6 6 0 0 1 1.122-.489q.454-.817.804-1.686a5.6 5.6 0 0 1-.326-.98c-.065-.303-.09-.603-.034-.86.056-.268.207-.509.492-.623l.055-.02a.75.75 0 0 1 .4-.038.53.53 0 0 1 .362.276c.066.124.09.27.096.407.005.142-.01.3-.036.465-.063.386-.204.859-.394 1.358q.316.672.742 1.277a4.5 4.5 0 0 1 1.01.038c.276.049.556.147.727.352a.64.64 0 0 1 .151.392.9.9 0 0 1-.104.426.8.8 0 0 1-.312.341.65.65 0 0 1-.342.078c-.25-.01-.495-.148-.706-.315l-.095-.081a4.3 4.3 0 0 1-.595-.638 9 9 0 0 0-1.512.307 8.6 8.6 0 0 1-.773 1.143c-.22.265-.46.496-.701.596a.6.6 0 0 1-.44.022" clip-rule="evenodd"/><path fill="currentColor" d="M10 1v3h3z"/></svg>', 'file-pdf-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5.42 12.713a.6.6 0 0 1-.332-.318c-.147-.294-.098-.588.06-.834.15-.233.4-.43.68-.596a6 6 0 0 1 1.122-.489q.454-.817.804-1.686a5.5 5.5 0 0 1-.326-.98c-.065-.303-.09-.603-.034-.86.056-.268.207-.509.492-.623.145-.058.303-.09.455-.058a.53.53 0 0 1 .362.276c.066.124.09.27.096.407.005.142-.01.3-.036.465-.063.386-.204.859-.394 1.358q.316.672.742 1.277a4.4 4.4 0 0 1 1.01.038c.276.049.556.147.727.352a.64.64 0 0 1 .151.392.9.9 0 0 1-.104.426.8.8 0 0 1-.268.315.65.65 0 0 1-.386.104c-.25-.01-.495-.148-.706-.315a4.3 4.3 0 0 1-.69-.72 9 9 0 0 0-1.512.308 8.6 8.6 0 0 1-.773 1.143c-.22.265-.46.496-.701.596a.6.6 0 0 1-.44.022m1.044-1.44a4 4 0 0 0-.348.18c-.248.148-.41.29-.49.415-.07.11-.072.19-.03.273l.02.034.027-.01c.103-.042.268-.177.48-.433q.18-.22.34-.458m1.242-1.006q.378-.09.764-.146a9 9 0 0 1-.386-.65 16 16 0 0 1-.378.796m2.18.65a3 3 0 0 1-.328-.309q.233.002.463.04c.24.043.352.112.392.159q.019.02.02.047a.3.3 0 0 1-.045.152.23.23 0 0 1-.071.094.1.1 0 0 1-.053.012c-.07-.003-.196-.05-.377-.194m-1.684-3.59q-.056.316-.15.625a3 3 0 0 1-.069-.26c-.057-.268-.065-.478-.034-.623.028-.134.082-.188.148-.214a.4.4 0 0 1 .11-.03.5.5 0 0 1 .024.15q.006.138-.029.351" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M3 2a1 1 0 0 1 1-1h6l3 3v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm7 .537V4h1.254zM12 14V5H9V2H4v12z" clip-rule="evenodd"/></svg>', 'file-text': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9 5V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V5zm2 2H5v1h6zM5 9h6v1H5zm6 2H5v1h6z" clip-rule="evenodd"/><path fill="currentColor" d="M10 4V1l3 3z"/></svg>', 'file-text-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M11 7H5v1h6zM5 9h6v1H5zm6 2H5v1h6z"/><path fill="currentColor" fill-rule="evenodd" d="m13 4-3-3H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1zm-3 0V2.415L11.585 4zM9 5h3v9H4V2h5z" clip-rule="evenodd"/></svg>', 'file-upload': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13.12 3.67 10.41.87a.63.63 0 0 0-.47-.2h-.17v3.66h3.54v-.17c0-.18-.06-.36-.19-.49m.19 11V5.25H9.55c-.37 0-.67-.31-.66-.68V.67H3.35a.68.68 0 0 0-.66.66v13.32c0 .37.29.67.66.68h9.3c.36-.01.65-.3.66-.66m-3-4.64H8.93c-.1 0-.19.07-.2.18v2.61c0 .1-.09.18-.19.18H6.91a.18.18 0 0 1-.18-.18V10.2c0-.1-.07-.19-.18-.2H5.19s-.09.01-.14 0a.19.19 0 0 1 0-.27L7.6 7.14c.07-.07.19-.07.26 0l2.54 2.54s.06.09.06.14c0 .1-.09.18-.19.18z"/></svg>', 'file-word': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M9 5V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V5zM5 7l1.091 5h1.002L8 8.262 8.91 12h.98L11 7h-.93l-.701 3.492L8.568 7H7.47l-.836 3.435L5.944 7z" clip-rule="evenodd"/><path fill="currentColor" d="M10 4V1l3 3z"/></svg>', 'file-word-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m5 7 1.091 5h1.002L8 8.262 8.91 12h.98L11 7h-.93l-.701 3.492L8.568 7H7.47l-.836 3.435L5.944 7z"/><path fill="currentColor" fill-rule="evenodd" d="M4 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4l-3-3zm6 3V2.537L11.254 4zm2 1v9H4V2h5v3z" clip-rule="evenodd"/></svg>', 'filter': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3 2a1 1 0 0 0-1 1v1.586a1 1 0 0 0 .293.707L6 9v2.5a1 1 0 0 0 .4.8l2 1.5A1 1 0 0 0 10 13V9l3.707-3.707A1 1 0 0 0 14 4.586V3a1 1 0 0 0-1-1z" clip-rule="evenodd"/></svg>', 'filter-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3 3h10v1.586l-4 4V13l-2-1.5V8.586l-4-4zm3 7V9L2.293 5.293A1 1 0 0 1 2 4.586V3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1.586a1 1 0 0 1-.293.707L10 9v4a1 1 0 0 1-1.6.8l-2-1.5a1 1 0 0 1-.4-.8z" clip-rule="evenodd"/></svg>', 'floppy-disk': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 3a1 1 0 0 1 1-1h7.586a1 1 0 0 1 .707.293l2.414 2.414a1 1 0 0 1 .293.707V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm2 0h6v3H4zm4 5a2 2 0 1 0 0 4 2 2 0 0 0 0-4" clip-rule="evenodd"/></svg>', 'floppy-disk-checked': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 3a1 1 0 0 1 1-1h7.586a1 1 0 0 1 .707.293l2.414 2.414a1 1 0 0 1 .293.707V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm2 0h6v3H4zm6.828 5-3.535 3.535-2.12-2.12.706-.708 1.415 1.414 2.828-2.828z" clip-rule="evenodd"/></svg>', 'floppy-disk-checked-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M11.293 2.293A1 1 0 0 0 10.586 2H3a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V5.414a1 1 0 0 0-.293-.707zM3 13V3h1v3h6V3h.586L13 5.414V13zM9 3H5v2h4zm1.828 5.12L8 10.948v.001l-.707.707-.707-.706-1.414-1.415.707-.707 1.415 1.414 2.828-2.828z" clip-rule="evenodd"/></svg>', 'floppy-disk-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M6 10a2 2 0 1 1 4 0 2 2 0 0 1-4 0m2 1a1 1 0 1 1 0-2 1 1 0 0 1 0 2" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M10.586 2a1 1 0 0 1 .707.293l2.414 2.414a1 1 0 0 1 .293.707V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zM3 3v10h10V5.414L10.586 3H10v3H4V3zm2 0h4v2H5z" clip-rule="evenodd"/></svg>', 'folder': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7 4h7c.55 0 1 .45 1 1v7c0 .55-.45 1-1 1H2c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h4z"/></svg>', 'folder-check': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M14 4H7L6 3H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V5c0-.55-.45-1-1-1M5.705 8.185 7 9.48l3.295-3.295.705.705-4 4-2-2z" clip-rule="evenodd"/></svg>', 'folder-check-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5.705 8.185 7 9.48l3.295-3.295.705.705-4 4-2-2z"/><path fill="currentColor" fill-rule="evenodd" d="m6 3 1 1.001h7c.55 0 1 .45 1 1.001v6.997c0 .55-.45 1.001-1 1.001H2c-.55 0-1-.45-1-1.001V4.001C1 3.451 1.45 3 2 3zm-.41 1.001H2v8.008h12V5.002H6.59z" clip-rule="evenodd"/></svg>', 'folder-lines': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14 4H7L6 3H2c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V5c0-.55-.45-1-1-1m-5 6H4V9h5zm3-2H4V7h8z"/></svg>', 'folder-lines-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12 8.005H4V7.004h8zM9 9.006H4v1.001h5zM5.59 4.001H2v8.008h12V5.002H6.59l-.29-.29zM6 3l1 1.001h7c.55 0 1 .45 1 1.001v6.997c0 .55-.45 1.001-1 1.001H2c-.55 0-1-.45-1-1.001V4.001C1 3.451 1.45 3 2 3z"/></svg>', 'folder-link': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14 4.44H8.46L6.62 2.67H2C1.27 2.67.68 3.27.67 4v8c0 .73.6 1.32 1.33 1.33h12c.73 0 1.32-.6 1.33-1.33V5.78c0-.73-.6-1.33-1.33-1.34m-6.82 6.88H5.65c-1.34 0-2.42-1.08-2.42-2.42s1.08-2.42 2.42-2.42h.84c.14 0 .25.11.25.25 0 .06-.02.13-.06.17-.2.21-.36.45-.49.71-.04.07-.11.13-.19.14h-.33c-.62-.15-1.24.22-1.39.84s.22 1.24.84 1.39c.15.04.31.04.47.02h1.58c.62 0 1.12-.48 1.15-1.1v-.22c-.02-.08 0-.16.06-.22.12-.13.29-.2.47-.2h.45c.12 0 .23.09.25.21.02.14.02.29 0 .43 0 1.32-1.05 2.39-2.37 2.42m3.17 0h-.84c-.06 0-.13-.02-.17-.07-.1-.1-.1-.25 0-.35.2-.21.36-.45.49-.71.02-.09.08-.16.17-.19h.36c.63.04 1.18-.43 1.23-1.07.04-.63-.43-1.18-1.07-1.23H8.83c-.64 0-1.15.51-1.15 1.15v.25c.02.08 0 .16-.06.22-.12.13-.29.21-.47.21H6.7c-.13 0-.24-.09-.26-.22-.01-.14-.01-.27 0-.41a2.41 2.41 0 0 1 2.38-2.43h1.52c1.34 0 2.42 1.07 2.43 2.41 0 1.34-1.09 2.42-2.42 2.43z"/></svg>', 'folder-link-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m6.22 3.67 1.55 1.49.29.28h5.93c.19 0 .34.16.34.34v6.21c0 .18-.15.34-.33.34H2.01c-.18 0-.34-.15-.34-.33V4.01c0-.18.15-.34.33-.34zm.4-1H2C1.27 2.67.68 3.27.67 4v8c0 .73.6 1.32 1.33 1.33h12c.73 0 1.32-.6 1.33-1.33V5.78c0-.73-.6-1.33-1.33-1.34H8.46z"/><path fill="currentColor" d="M9.555 8.848a2.37 2.37 0 0 1-2.372 2.372l-1.486.006a2.366 2.366 0 0 1-2.37-2.37 2.38 2.38 0 0 1 2.376-2.377h.82c.135 0 .25.106.25.249q-.001.094-.062.17a3 3 0 0 0-.474.687.26.26 0 0 1-.223.143h-.286a1.13 1.13 0 0 0-1.165 1.086 1.123 1.123 0 0 0 1.082 1.163c.023.005.045 0 .063 0l1.481-.002A1.123 1.123 0 0 0 8.292 8.64a.25.25 0 0 1 .063-.214.62.62 0 0 1 .46-.201l.464-.001c.125 0 .223.089.245.21q.034.206.035.419zm3.11.001a2.365 2.365 0 0 0-2.371-2.37l-1.481.001a2.387 2.387 0 0 0-2.337 2.8c.022.12.125.205.245.21l.464-.001a.6.6 0 0 0 .46-.201.24.24 0 0 0 .063-.214 1.123 1.123 0 0 1 1.104-1.335l1.48-.002a1.12 1.12 0 0 1 1.15 1.096 1.13 1.13 0 0 1-1.099 1.152c-.022.004-.045 0-.062 0h-.286a.25.25 0 0 0-.223.143c-.125.25-.286.482-.474.688a.244.244 0 0 0 .013.352.24.24 0 0 0 .17.063l.82-.001a2.38 2.38 0 0 0 2.377-2.376z"/></svg>', 'folder-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M7 4.001 6 3H2c-.55 0-1 .45-1 1.001v7.998C1 12.549 1.45 13 2 13h12c.55 0 1-.45 1-1.001V5.002c0-.55-.45-1.001-1-1.001zm-5 0h3.59l1 1.001H14v7.007H2z" clip-rule="evenodd"/></svg>', 'folder-star': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14 4.44H8.46L6.62 2.67H2A1.35 1.35 0 0 0 .67 4v8A1.35 1.35 0 0 0 2 13.33h12A1.35 1.35 0 0 0 15.33 12V5.78A1.36 1.36 0 0 0 14 4.44m-.2 3.89L12 9.66l.69 2a.22.22 0 0 1-.08.27.26.26 0 0 1-.13.06.4.4 0 0 1-.15-.06l-1.77-1.26L8.75 12a.34.34 0 0 1-.15 0 .3.3 0 0 1-.13 0 .23.23 0 0 1-.08-.27l.69-2-1.81-1.35a.23.23 0 0 1-.1-.17.24.24 0 0 1 .24-.24h2.21l.67-2a.26.26 0 0 1 .243-.156.24.24 0 0 1 .217.156l.67 2h2.2a.26.26 0 0 1 .26.24.3.3 0 0 1-.08.12"/></svg>', 'folders': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M9 3h4c.55 0 1 .45 1 1v5c0 .55-.45 1-1 1h-1V8a2 2 0 0 0-2-2H6.414l-1-1H5V3c0-.55.45-1 1-1h2z"/><path fill="currentColor" d="M10 7a1 1 0 0 1 1 1v5c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V7c0-.55.45-1 1-1h2l1 1z"/></svg>', 'folders-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M9 3 8 2H6c-.55 0-1 .45-1 1v2h1V3h1.59l1 1H13v5.01h-1V10h1c.55 0 1-.45 1-1V4c0-.55-.45-1-1-1z"/><path fill="currentColor" fill-rule="evenodd" d="m5 6 1 1h4c.55 0 1 .45 1 1v5c0 .55-.45 1-1 1H3c-.55 0-1-.45-1-1V7c0-.55.45-1 1-1zm-.41 1H3v6.01h7V8H5.59z" clip-rule="evenodd"/></svg>', 'gavel': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5.908 5.012a.59.59 0 0 0 .59 1.02l.138-.08.59 1.02-5.892 3.402a.59.59 0 0 0 .589 1.02l5.892-3.4.589 1.02-.14.08a.59.59 0 0 0 .59 1.02l3.31-1.91a.59.59 0 0 0-.59-1.02l-.139.08-1.768-3.062.14-.08a.59.59 0 0 0-.59-1.021zm3.631 7.01a.5.5 0 1 0 0 1h5a.5.5 0 0 0 0-1z"/></svg>', 'gavel-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5.869 4.99a.59.59 0 0 0 .59 1.02l.138-.08.59 1.02-5.892 3.402a.59.59 0 1 0 .589 1.02l5.892-3.4.59 1.02-.14.08a.59.59 0 0 0 .589 1.02l3.31-1.91a.59.59 0 0 0-.59-1.02l-.139.08L9.628 4.18l.14-.08a.59.59 0 0 0-.59-1.021zm1.594.44 1.3-.75 1.767 3.062-1.299.75z" clip-rule="evenodd"/><path fill="currentColor" d="M9.5 12a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1z"/></svg>', 'graduation-cap': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m1 6 7-3 7 3v5h-1V6.429L8 9z"/><path fill="currentColor" d="M3 7.945V11l5 2 5-2V7.945l-5 2.143z"/></svg>', 'graduation-cap-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m1 6 2 .857V11l5 2 5-2V6.857l1-.428V11h1V6L8 3zm3 4.323V7.286L8 9l4-1.714v3.037l-4 1.6zM3.539 6 8 7.912 12.461 6 8 4.088z" clip-rule="evenodd"/></svg>', 'hand-euro': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14.91 7.11c-.581.55-1.362.89-2.213.89h-.01c-1.357 0-2.527-.86-3.043-2.09H8v-1h1.385a4 4 0 0 1-.02-.554l.002-.043q.005-.113.017-.223H8v-1h1.642C10.156 1.86 11.322 1 12.687 1c.901 0 1.712.37 2.313.98l-.711.71c-.42-.43-.991-.69-1.602-.69-.774 0-1.492.422-1.92 1.09h1.239v1h-1.612a2.7 2.7 0 0 0 0 .82h1.612v1h-1.241C11.19 6.578 11.907 7 12.687 7c.57 0 1.101-.22 1.512-.6zM3 7H1v7h2zm9.81 4.5h-2.06c-.09.18-.2.34-.35.49-.37.37-.87.58-1.39.58s-1.02-.2-1.39-.58l-1.04-1.04c-.2-.2-.2-.51 0-.71s.51-.2.71 0l1.04 1.04c.36.36 1 .37 1.36 0 .18-.18.28-.42.28-.68s-.1-.5-.28-.68L8.44 8.67c-.2-.2-.44-.36-.71-.48-.3-.12-.62-.18-.94-.18h-2.8v4.8h.02l.29-.02 1.94 1.63c.45.38 1.02.58 1.6.58h5.81c.74 0 1.33-.6 1.33-1.33 0-1.2-.97-2.17-2.17-2.17"/></svg>', 'hand-euro-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14.91 7.11c-.581.55-1.362.89-2.213.89h-.01c-1.357 0-2.527-.86-3.043-2.09H8v-1h1.385a3.7 3.7 0 0 1 0-.82H8v-1h1.642C10.156 1.86 11.322 1 12.687 1c.901 0 1.712.37 2.313.98l-.711.71c-.42-.43-.991-.69-1.602-.69-.774 0-1.492.422-1.92 1.09h1.239v1h-1.612a2.7 2.7 0 0 0 0 .82h1.612v1h-1.241C11.19 6.578 11.907 7 12.687 7c.57 0 1.101-.22 1.512-.6z"/><path fill="currentColor" fill-rule="evenodd" d="M1 7h3v1h2.798a2.5 2.5 0 0 1 1.77.731L9.73 9.896a1.56 1.56 0 0 1 .376 1.603h2.726c1.197 0 2.167.971 2.167 2.167 0 .737-.599 1.333-1.334 1.333H7.852a2.5 2.5 0 0 1-1.599-.578L4 12.566V14H1zm1 1h1v5H2zm2 1v2.27l2.892 2.382c.27.224.61.347.96.347h5.814c.185 0 .334-.15.334-.333 0-.644-.522-1.167-1.167-1.167h-3.77a1.56 1.56 0 0 1-1.539-.395l-.75-.75a.5.5 0 1 1 .707-.707l.75.75a.56.56 0 0 0 .397.164h.021a.56.56 0 0 0 .375-.957L7.861 9.439A1.5 1.5 0 0 0 6.799 9z" clip-rule="evenodd"/></svg>', 'hand-up': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.75 3.5c-.41 0-.75.34-.75.75v3.5c0 .14-.11.25-.25.25s-.25-.11-.25-.25v-4c0-.41-.34-.75-.75-.75s-.75.34-.75.75v4c0 .14-.11.25-.25.25s-.25-.11-.25-.25v-5c0-.41-.34-.75-.75-.75S8 2.34 8 2.75v5c0 .14-.11.25-.25.25s-.25-.11-.25-.25v-4c0-.41-.34-.75-.75-.75S6 3.34 6 3.75V11L3.97 9.54a.845.845 0 0 0-1.21 0c-.33.34-.34.88 0 1.21l2.22 2.22c.66.66 1.55 1.03 2.47 1.03H11a2.5 2.5 0 0 0 2.5-2.5V4.25c0-.41-.34-.75-.75-.75"/></svg>', 'history': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m12.975 3.82.002-.001-.083-.09-.063-.066-.009-.01-.001-.002a6 6 0 0 0-.272-.29q-.076-.074-.157-.144l-.058-.052-.004-.003a6 6 0 0 0-.275-.237 6 6 0 0 0-.22-.166l-.024-.018a7 7 0 0 0-.293-.203 7 7 0 0 0-.859-.467 7 7 0 0 0-.339-.14l-.03-.011a6 6 0 0 0-.255-.093 7 7 0 0 0-.376-.108L9.592 1.7a4 4 0 0 0-.652-.128l-.092-.015q-.072-.013-.146-.022A6.47 6.47 0 0 0 3 3.847V1.996H2v4h4v-1H3.406a5.48 5.48 0 0 1 5.189-2.467q.061.008.124.019l.077.012q.188.025.373.064.088.02.173.044l.063.017q.16.041.317.09.115.04.227.084l.016.006a6 6 0 0 1 .523.232 5.4 5.4 0 0 1 .736.452l.03.022q.09.066.178.134.12.098.235.204l.05.044a4 4 0 0 1 .36.364l.012.013A5.496 5.496 0 1 1 2.5 7.996h-1A6.5 6.5 0 1 0 12.975 3.82"/><path fill="currentColor" d="M10.088 11.746 7.293 8.95V4.246h1v4.29l2.5 2.505z"/></svg>', 'home': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m13.55 5.5-5-3.33C8.38 2.06 8.19 2 7.99 2s-.39.06-.56.17L2.45 5.5c-.28.19-.45.5-.45.83v6.66c0 .55.45 1 1 1h4V12c0-.56.45-1.01 1-1.01s1 .45 1 1.01v1.99h4c.55 0 1-.45 1-1V6.33c0-.33-.17-.65-.45-.83"/></svg>', 'home-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m13.55 5.5-5-3.33C8.38 2.06 8.19 2 7.99 2s-.39.06-.56.17L2.45 5.5c-.28.19-.45.5-.45.83v6.66c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V6.33c0-.33-.17-.65-.45-.83m-.56 7.5h-4v-1c0-.55-.45-1-1-1s-1 .45-1 1v1H3V6.33L8 3l5 3.33V13z"/></svg>', 'info-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0m-7.75 4V7h1.5v5zm0-8v1.5h1.5V4z" clip-rule="evenodd"/></svg>', 'info-circle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7.25 12V7h1.5v5zm0-8v1.5h1.5V4z"/><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m6-7A6 6 0 1 0 2 8a6 6 0 0 0 12 0" clip-rule="evenodd"/></svg>', 'interrogation-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M15.039 8.146a7 7 0 1 1-14 0 7 7 0 0 1 14 0m-6.974-.5a1 1 0 1 0-.942-1.335l-1.43-.458A2.501 2.501 0 1 1 8.79 9.04v.606h-1.5v-2zm-.026 3a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5" clip-rule="evenodd"/></svg>', 'interrogation-circle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7.824 7.646a1 1 0 1 0-.943-1.335l-1.429-.458A2.501 2.501 0 1 1 8.548 9.04v.606h-1.5v-2zm-.776 3.75a.75.75 0 1 1 1.5 0 .75.75 0 0 1-1.5 0"/><path fill="currentColor" fill-rule="evenodd" d="M7.798 15.146a7 7 0 1 0 0-14 7 7 0 0 0 0 14m0-1a6 6 0 1 0 0-12 6 6 0 0 0 0 12" clip-rule="evenodd"/></svg>', 'key': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.44 6.67a3.994 3.994 0 0 0-5.1-2.44A3.986 3.986 0 0 0 .9 9.33 3.994 3.994 0 0 0 6 11.77c1.14-.4 2.04-1.3 2.44-2.44h2.89V12H14V9.33h1.33V6.67zM4.67 9.33c-.73 0-1.33-.6-1.33-1.33s.6-1.33 1.33-1.33S6 7.27 6 8s-.58 1.32-1.31 1.33z"/></svg>', 'laptop': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6.5 5a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1z"/><path fill="currentColor" fill-rule="evenodd" d="M3 3a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1H1a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1h-2a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1zm10 1H3v7h10z" clip-rule="evenodd"/></svg>', 'layers': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M7.763 8.94a.5.5 0 0 0 .474 0l6.5-3.5a.5.5 0 0 0 0-.88l-6.5-3.5a.5.5 0 0 0-.474 0l-6.5 3.5a.5.5 0 0 0 0 .88zM8 7.932 2.555 5 8 2.068 13.445 5zM8 12a.5.5 0 0 1-.237-.06l-6.5-3.5.474-.88L8 10.932l6.263-3.372.474.88-6.5 3.5A.5.5 0 0 1 8 12m0 3a.5.5 0 0 1-.237-.06l-6.5-3.5.474-.88L8 13.932l6.263-3.372.474.88-6.5 3.5A.5.5 0 0 1 8 15" clip-rule="evenodd"/></svg>', 'life-ring': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15a6.97 6.97 0 0 0 4.192-1.394 7 7 0 0 0 1.315-1.284A6.97 6.97 0 0 0 15 8a6.97 6.97 0 0 0-1.394-4.192 7 7 0 0 0-1.414-1.414A6.97 6.97 0 0 0 8 1a6.97 6.97 0 0 0-4.192 1.394 7 7 0 0 0-1.414 1.414A6.97 6.97 0 0 0 1 8a6.97 6.97 0 0 0 1.394 4.192c.368.493.8.935 1.284 1.315A6.97 6.97 0 0 0 8 15m3.446-4.968 1.445 1.444a6 6 0 0 1-1.415 1.415l-1.444-1.445a4 4 0 0 0 1.414-1.414m-6.892 0a4 4 0 0 0 1.414 1.414l-1.445 1.445a6 6 0 0 1-1.414-1.415zm1.414-5.478a4 4 0 0 0-1.414 1.414L3.109 4.523A6 6 0 0 1 4.523 3.11zm5.509-1.445-1.445 1.445a4 4 0 0 1 1.414 1.414l1.445-1.445a6 6 0 0 0-1.415-1.414M8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6" clip-rule="evenodd"/></svg>', 'lines-rectangle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3 2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm2 4h6v1H5zm4 3H5v1h4z" clip-rule="evenodd"/></svg>', 'lines-rectangle-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5 6h6v1H5zm4 3H5v1h4z"/><path fill="currentColor" fill-rule="evenodd" d="M4 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zm8 1H4v12h8z" clip-rule="evenodd"/></svg>', 'link': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M13.65 2.727a3 3 0 0 1 .975.653 3 3 0 0 1 .01 4.24l-4 4a3 3 0 0 1-2.135.88 3 3 0 0 1-2.125-.865 3 3 0 0 1 0-4.25l.71-.71.705.71-.705.71a2.003 2.003 0 1 0 2.835 2.83l4-4a2.006 2.006 0 0 0-.65-3.27 2.005 2.005 0 0 0-2.185.435l-.71-.71a3 3 0 0 1 3.275-.653M1.66 11.76a2 2 0 0 0 .435.65 2 2 0 0 0 2.835 0l.71.71A3.04 3.04 0 0 1 3.5 14a3 3 0 0 1-2.13-.85 3 3 0 0 1 0-4.255l4-4A3.009 3.009 0 0 1 9.625 9.15l-1.06 1.06-.71-.71 1.06-1.075A2 2 0 0 0 9.5 7a1.97 1.97 0 0 0-1.22-1.86 2 2 0 0 0-2.185.435l-4 4a2 2 0 0 0-.436 2.185" clip-rule="evenodd"/></svg>', 'list': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5 3h9v1H5zm0 9h9v1H5zm9-4.5H5v1h9zm-12 0h1v1H2zM3 3H2v1h1zm-1 9h1v1H2z" clip-rule="evenodd"/></svg>', 'loader': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-opacity=".2" d="M13.657 8A5.657 5.657 0 1 1 2.343 8a5.657 5.657 0 0 1 11.314 0M3.475 8a4.526 4.526 0 1 0 9.05 0 4.526 4.526 0 0 0-9.05 0"/><path fill="currentColor" d="M2.343 8A5.657 5.657 0 0 1 8 2.343v1.132A4.525 4.525 0 0 0 3.475 8z"/></svg>', 'location': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 14.997c2.5-2.5 5-6.236 5-8.997A5 5 0 0 0 3 6c0 2.761 2.5 6.496 5 8.997m0-7.499a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3" clip-rule="evenodd"/></svg>', 'location-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M10 6.002a2 2 0 1 1-4 0 2 2 0 0 1 4 0m-1 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M13 6.002c0 2.506-2.06 5.814-4.309 8.273q-.344.376-.691.723a23 23 0 0 1-.691-.723C5.059 11.816 3 8.508 3 6.002a5 5 0 0 1 10 0m-1 0c0 1.116-.52 2.554-1.424 4.088A21.5 21.5 0 0 1 8 13.55a21.5 21.5 0 0 1-2.576-3.459C4.52 8.556 4 7.118 4 6.002a4 4 0 1 1 8 0" clip-rule="evenodd"/></svg>', 'lock': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5 4v3H4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1h-1V4a3 3 0 0 0-6 0m5 3V4a2 2 0 1 0-4 0v3zm-2 3a1 1 0 1 0 0 2 1 1 0 0 0 0-2" clip-rule="evenodd"/></svg>', 'lock-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 10a1 1 0 1 0 0 2 1 1 0 0 0 0-2"/><path fill="currentColor" fill-rule="evenodd" d="M5 4v3H4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1h-1V4a3 3 0 0 0-6 0m5 3V4a2 2 0 1 0-4 0v3zm2 1v6H4V8z" clip-rule="evenodd"/></svg>', 'log-in': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 13v1h5a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H8v1h5v10z"/><path fill="currentColor" d="m9.086 8.5-1.793 1.793L8 11l3-3-3-3-.707.707L9.086 7.5H2v1z"/></svg>', 'log-out': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m12.086 8.5-1.793 1.793L11 11l3-3-3-3-.707.707L12.086 7.5H5v1z"/><path fill="currentColor" d="M8 3V2H3a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h5v-1H3V3z"/></svg>', 'magnifying-glass': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 7a5 5 0 1 1 8.872 3.164l3.127 3.128-.707.707-3.128-3.128A5 5 0 0 1 2 7m5 4a4 4 0 1 1 0-8 4 4 0 0 1 0 8" clip-rule="evenodd"/></svg>', 'mail': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M1.007 4.002v8.011a1 1 0 0 0 1 1h11.997a1 1 0 0 0 1-1V4l-7 5z"/><path fill="currentColor" d="m1.52 3.14 6.484 4.63 6.485-4.632a1 1 0 0 0-.486-.126H2.008a1 1 0 0 0-.487.127"/></svg>', 'mail-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1 3.999v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-8A1 1 0 0 0 14.001 3H2a1 1 0 0 0-1 .999m13 .713-6 4.28-6-4.28V12h12zM2.724 4 8 7.764 13.276 4z" clip-rule="evenodd"/></svg>', 'messages-square': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12 10v1.017a1 1 0 0 1-1.006 1L8 12l-4 2v-1.978H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h1V4a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1zm1-6H5v1h6a1 1 0 0 1 1 1v3h1zm-3 3H4v1h6zM4 9h3v1H4z" clip-rule="evenodd"/></svg>', 'messages-square-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M4 7h6v1H4zm0 2h3v1H4z"/><path fill="currentColor" fill-rule="evenodd" d="M12 10v1.017a1 1 0 0 1-1.006 1L8 12l-4 2v-1.978H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h1V4a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1zm1-6H5v1h6a1 1 0 0 1 1 1v3h1zm-5.233 6.999L5 12.382v-1.36H3V6h8v5.017z" clip-rule="evenodd"/></svg>', 'mobile': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3 2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm4 10a1 1 0 1 1 2 0 1 1 0 0 1-2 0M6 3.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5" clip-rule="evenodd"/></svg>', 'mobile-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0M6 3.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5"/><path fill="currentColor" fill-rule="evenodd" d="M4 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zm8 1H4v12h8z" clip-rule="evenodd"/></svg>', 'notes': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M13 4h-1V3a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h1v1a1 1 0 0 0 1 1h5v-4h4V5a1 1 0 0 0-1-1M3 3h8v1H5a1 1 0 0 0-1 1v6H3zm9 4H6v1h6zM6 9h3v1H6z" clip-rule="evenodd"/><path fill="currentColor" d="m11 14 3-3h-3z"/></svg>', 'notes-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12 7H6v1h6zM9 9H6v1h3z"/><path fill="currentColor" fill-rule="evenodd" d="M13 4h-1V3a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h1v1a1 1 0 0 0 1 1h6l3-3V5a1 1 0 0 0-1-1M3 3h8v1H5a1 1 0 0 0-1 1v6H3zm10 2H5v8h5v-3h3zm-.414 6L11 12.586V11z" clip-rule="evenodd"/></svg>', 'paper-plane': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13.855 2.145a.5.5 0 0 0-.525-.115l-11 4a.5.5 0 0 0 0 .935L6.625 8.68l3.17-3.18.705.705L7.315 9.39l1.72 4.295A.5.5 0 0 0 9.5 14a.5.5 0 0 0 .46-.33l4-11a.5.5 0 0 0-.105-.525"/></svg>', 'paper-plane-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13.855 2.145a.5.5 0 0 0-.525-.115l-11 4a.5.5 0 0 0 0 .935l4.8 1.92 1.92 4.8A.5.5 0 0 0 9.5 14a.5.5 0 0 0 .46-.33l4-11a.5.5 0 0 0-.105-.525M9.5 12.1 8.105 8.6 10.5 6.205 9.795 5.5 7.38 7.915 3.9 6.5l8.765-3.165z"/></svg>', 'paper-plane-slash': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1.705 1 15 14.295l-.7.705-4-4-1.34 3.67a.5.5 0 0 1-.46.33.5.5 0 0 1-.465-.315l-1.72-4.295L8 8.705 7.295 8l-1.67 1.68L1.33 7.965a.5.5 0 0 1 0-.935L5 5.705l-4-4zM12.97 3.67l-1.725 4.745-3.66-3.66L12.33 3.03a.5.5 0 0 1 .64.64" clip-rule="evenodd"/></svg>', 'paper-plane-slash-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1.705 1 15 14.295l-.7.705-4-4-1.34 3.67a.5.5 0 0 1-.46.33.5.5 0 0 1-.45-.315l-1.92-4.8-4.8-1.92a.5.5 0 0 1 0-.935L5 5.705l-4-4zM5.77 6.5l-2.87 1 3.48 1.415L7.295 8zm1.335 3.1L8.5 13.1l1-2.87L8 8.705zm4.56-5.265-3.82 1.39-.78-.78L12.33 3.03a.5.5 0 0 1 .64.64l-1.915 5.265-.78-.78z" clip-rule="evenodd"/></svg>', 'paperclip': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m6.57 12.358 6.09-6.09a1.035 1.035 0 1 0-1.465-1.463l-5.32 5.32-.733-.731 5.321-5.321A2.07 2.07 0 1 1 13.391 7l-5.339 5.34-.006.006-.744.744A3.106 3.106 0 0 1 2.91 8.698L9.608 2l.732.732L3.642 9.43a2.07 2.07 0 1 0 2.928 2.928"/></svg>', 'pen': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M10.88 2.293a1 1 0 0 1 1.415 0l1.414 1.414a1 1 0 0 1 0 1.414l-1.414 1.415-2.828-2.829zm.705 4.953L8.756 4.417 2 11.174l.003 2.825 2.825.003z"/></svg>', 'pen-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m-3.692-3.307v-1.54l4.538-4.539 1.54 1.54-4.538 4.539zm7.268-6.312a.42.42 0 0 1 0 .583l-.753.753-1.54-1.54.747-.753a.42.42 0 0 1 .583 0z" clip-rule="evenodd"/></svg>', 'pen-fancy': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3.63 8.65c-.24.07-.43.26-.5.5l-1.46 4.37.11.12 2.3-2.3v-.19c0-.44.35-.8.79-.81.44 0 .8.35.81.79 0 .44-.35.8-.79.81h-.21l-2.3 2.3.12.11 4.37-1.46c.24-.07.43-.26.5-.5l.82-2.08L5.7 7.83zm7.17-6.3L6.27 7.28 8.69 9.7l4.94-4.52c2.1-1.86-.99-4.92-2.83-2.83"/></svg>', 'pen-fancy-files-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12 2H6v10h6V8.946l.023-.058.085-.078.892-.813V12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v.112a2.3 2.3 0 0 0-.974.66L12 2.8zm1 4.643-1 .913-.566.515-1.528-1.524L12 4.275l.767-.832q.113-.127.233-.215c1.167-.857 2.797.9 1.555 1.997zM4 3H3v11.5a.5.5 0 0 0 .5.5H11v-1H4zm4.238 4.41a.47.47 0 0 0-.316.315L7 10.477l.07.076 1.452-1.449v-.12a.51.51 0 0 1 .5-.51.51.51 0 0 1 .511.498.51.51 0 0 1-.499.51h-.133L7.45 10.931l.075.069 2.76-.92a.47.47 0 0 0 .317-.314l.518-1.31-1.573-1.562z" clip-rule="evenodd"/></svg>', 'pen-fancy-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.24 1.67c-.49 0-1 .21-1.44.7L6.27 7.3l2.42 2.42 4.94-4.52c1.6-1.42.19-3.53-1.39-3.53M8.72 8.34 7.66 7.28l3.9-4.24c.22-.24.44-.36.69-.36.41 0 .87.34 1.03.78.14.37.04.7-.32 1.02L8.73 8.36zM5.7 7.86l-2.08.82c-.24.08-.42.26-.5.5l-1.46 4.37.12.12.56.56.12.12 4.37-1.46c.24-.08.42-.26.5-.5l.81-2.08L5.7 7.87zm-2.57 4.46L4 9.72c.03-.08.09-.15.17-.18l1.29-.51 1.52 1.52-.5 1.29c-.03.08-.1.15-.19.18l-2.6.87.95-.95c.06.02.12.04.19.04.44 0 .79-.35.79-.79s-.35-.79-.79-.79-.79.35-.79.79c0 .07.02.13.04.19l-.95.95z"/></svg>', 'pen-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.295 2.293a1 1 0 0 0-1.414 0L9.467 3.707l2.828 2.829 1.414-1.415a1 1 0 0 0 0-1.414z"/><path fill="currentColor" fill-rule="evenodd" d="m2.003 13.999 2.825.003 6.757-6.756-2.829-2.829L2 11.174zM3 11.587l5.756-5.755 1.414 1.414-5.755 5.756L3.002 13z" clip-rule="evenodd"/></svg>', 'phone': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m10 10.53 1.034-1.035a1.01 1.01 0 0 1 1.08-.221l1.259.503A1.01 1.01 0 0 1 14 10.7v2.308a1 1 0 0 1-1.052.992C4.124 13.45 2.343 5.974 2.006 3.112A1.002 1.002 0 0 1 3.007 2h2.228a1 1 0 0 1 .923.628l.503 1.26a1 1 0 0 1-.217 1.08L5.41 6.002s.595 4.029 4.59 4.527"/></svg>', 'phone-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.62 14h-.079C3.472 13.479 2.184 5.826 2.004 3.49A1.384 1.384 0 0 1 3.278 2h2.543a.92.92 0 0 1 .859.582l.701 1.726a.92.92 0 0 1-.203.997l-.983.992a4.325 4.325 0 0 0 3.499 3.508l1.001-.993a.92.92 0 0 1 1.002-.189l1.74.697a.92.92 0 0 1 .567.858v2.437A1.385 1.385 0 0 1 12.62 14M3.389 2.923a.46.46 0 0 0-.462.462v.037c.213 2.732 1.574 9.193 9.665 9.655a.46.46 0 0 0 .49-.434v-2.465l-1.74-.696-1.325 1.315-.222-.028c-4.015-.503-4.56-4.518-4.56-4.56l-.028-.221 1.311-1.325-.692-1.74z"/></svg>', 'picture': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M14 3a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1zM4 5a1 1 0 1 0 2 0 1 1 0 0 0-2 0m7.134 2.514L13 10.023V13H3v-2.494l.896-1.064c.203-.242.305-.362.425-.408a.5.5 0 0 1 .358 0c.12.046.222.166.425.408l1.767 2.098 2.995-4.026c.21-.282.316-.423.444-.476a.5.5 0 0 1 .38 0c.129.053.234.194.444.476" clip-rule="evenodd"/></svg>', 'picture-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2"/><path fill="currentColor" fill-rule="evenodd" d="M14 13a1 1 0 0 1-1 1H2h.994A1 1 0 0 1 2 13V3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1zM3 3h10v5.315l-1.069-1.43a6 6 0 0 0-.29-.368 1.5 1.5 0 0 0-.555-.41 1.5 1.5 0 0 0-1.14-.001c-.27.11-.448.288-.556.408-.098.11-.2.246-.291.366L6.822 9.911l-.974-1.14a5 5 0 0 0-.283-.314 1.5 1.5 0 0 0-.53-.353 1.5 1.5 0 0 0-1.064 0c-.248.094-.42.245-.529.352a5 5 0 0 0-.283.314L3 8.956zm0 10v-2.506l.903-1.055c.202-.237.303-.355.423-.4a.5.5 0 0 1 .355 0c.12.045.22.164.422.4l1.769 2.07 3.01-4.006c.21-.28.315-.42.443-.472a.5.5 0 0 1 .38 0c.127.053.232.193.441.474L13 9.985V13z" clip-rule="evenodd"/></svg>', 'play-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1m3.724 7.447-6 3A.5.5 0 0 1 5 11V5a.5.5 0 0 1 .724-.447l6 3a.5.5 0 0 1 0 .894"/></svg>', 'plus': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M9 2H7v5H2v2h5v5h2V9h5V7H9z"/></svg>', 'plus-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14M7 7V4h2v3h3v2H9v3H7V9H4V7z" clip-rule="evenodd"/></svg>', 'share': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14 4.5a2.5 2.5 0 0 1-4.467 1.543L6.915 7.35a2.5 2.5 0 0 1 0 1.298l2.618 1.308a2.5 2.5 0 1 1-.448.894L6.467 9.544a2.5 2.5 0 1 1 0-3.085l2.618-1.31A2.503 2.503 0 0 1 11.5 2 2.5 2.5 0 0 1 14 4.5"/></svg>', 'share-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M13 4.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m1 0a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0M6 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m.623 1.32a2.5 2.5 0 1 1-.156-2.863L9.085 5.15c.088.33.243.633.448.894L6.915 7.35a2.5 2.5 0 0 1 0 1.298l2.618 1.308a2.5 2.5 0 1 1-.448.894L6.467 9.544q.084-.107.156-.223M11.5 13a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3" clip-rule="evenodd"/></svg>', 'shuffle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m11.295 9.705 1.79 1.795h-3.31L7.59 8l2.185-3.5h3.31l-1.79 1.795L12 7l3-3-3-3-.705.705 1.79 1.795h-3.31a1 1 0 0 0-.845.47L7 7.055 5.07 3.97a1 1 0 0 0-.845-.47H1v1h3.225L6.41 8l-2.185 3.5H1v1h3.225a1 1 0 0 0 .845-.47L7 8.945l1.93 3.085a1 1 0 0 0 .845.47h3.31l-1.79 1.795L12 15l3-3-3-3z"/></svg>', 'sitemap': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M3.33 10h-2c-.37 0-.66.3-.66.67v2c0 .36.3.65.66.66h2c.37 0 .66-.29.67-.66v-2c0-.37-.3-.67-.67-.67m-.5-1.67H7.5v1h1v-1h4.67v1h1v-1.2c0-.44-.36-.8-.8-.8H8.5V6h.83c.37 0 .67-.3.67-.67v-2c0-.37-.3-.66-.67-.66H6.67c-.37 0-.66.29-.67.66v2c0 .37.3.67.67.67h.83v1.33H2.63c-.44 0-.8.36-.8.8v1.2h1zM9 10H7c-.37 0-.67.3-.67.67v2c0 .37.3.66.67.66h2c.37 0 .66-.29.67-.66v-2c0-.37-.3-.67-.67-.67m5.67 0h-2c-.37 0-.67.3-.67.67v2c0 .37.3.66.67.66h2c.36 0 .65-.3.66-.66v-2c0-.37-.29-.66-.66-.67"/></svg>', 'sliders': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M12.95 4H15v1h-2.05v.002a2.5 2.5 0 0 1-2.672 1.988A2.52 2.52 0 0 1 8.05 5.002V5H1V4h7.05v-.002a2.5 2.5 0 0 1 2.672-1.988 2.52 2.52 0 0 1 2.228 1.988zm-9.9 8H1v-1h2.05v-.002A2.52 2.52 0 0 1 5.5 9a2.5 2.5 0 0 1 2.45 1.999V11H15v1H7.95v.002A2.52 2.52 0 0 1 5.5 14a2.5 2.5 0 0 1-2.45-1.998z"/></svg>', 'sliders-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M12.95 4H15v1h-2.05c-.25 1.15-1.25 2-2.45 2s-2.2-.85-2.45-2H1V4h7.05C8.3 2.85 9.3 2 10.5 2s2.2.85 2.45 2M9 4.5c0 .85.65 1.5 1.5 1.5S12 5.35 12 4.5 11.35 3 10.5 3 9 3.65 9 4.5M3.05 12H1v-1h2.05C3.3 9.85 4.3 9 5.5 9s2.2.85 2.45 2H15v1H7.95c-.25 1.15-1.25 2-2.45 2s-2.2-.85-2.45-2M7 11.5c0-.85-.65-1.5-1.5-1.5S4 10.65 4 11.5 4.65 13 5.5 13 7 12.35 7 11.5" clip-rule="evenodd"/></svg>', 'squares': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M2 3a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm7 0a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1zm0 7a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1zm-7 0a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/></svg>', 'star': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" stroke="currentColor" d="m8 2.472 1.715 3.475.116.235.26.038 3.835.557-2.775 2.705-.188.183.044.26.655 3.818-3.43-1.803L8 11.818l-.233.122-3.43 1.803.656-3.818.044-.26-.188-.183-2.775-2.705L5.91 6.22l.26-.038.116-.235z"/></svg>', 'star-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path stroke="currentColor" d="m8 2.472 1.715 3.475.116.235.26.038 3.835.557-2.775 2.705-.188.183.044.26.655 3.818-3.43-1.803L8 11.818l-.233.122-3.43 1.803.656-3.818.044-.26-.188-.183-2.775-2.705L5.91 6.22l.26-.038.116-.235z"/></svg>', 'table': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 13a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1zm1-3v3h3v-3zm4 0v3h6v-3zm6-1H7V6h6zM6 9H3V6h3zM3 5V3h10v2z" clip-rule="evenodd"/></svg>', 'tag': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2 7.43c0 .275.11.538.303.732l5.535 5.535c.404.404 1.06.404 1.464 0l4.395-4.395a1.036 1.036 0 0 0 0-1.464L8.162 2.303A1.04 1.04 0 0 0 7.43 2H3.036C2.464 2 2 2.464 2 3.036zM5.5 7a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3" clip-rule="evenodd"/></svg>', 'tag-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M5.5 7a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m0-1a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M2 7.43c0 .275.11.538.303.732l5.535 5.535c.404.404 1.06.404 1.464 0l4.395-4.395a1.036 1.036 0 0 0 0-1.464L8.162 2.303A1.04 1.04 0 0 0 7.43 2H3.036C2.464 2 2 2.464 2 3.036zm1 0q0 .016.01.025l5.535 5.534a.036.036 0 0 0 .05 0l4.394-4.394a.036.036 0 0 0 0-.05L7.456 3.01A.04.04 0 0 0 7.43 3H3.036A.036.036 0 0 0 3 3.036z" clip-rule="evenodd"/></svg>', 'tags': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M13.855 6.645 8.5 1.295A1 1 0 0 0 7.795 1H4a1 1 0 0 0-1 1v1h1V2h3.795l5 5-.65.645.71.71 1-1a.5.5 0 0 0 0-.71"/><path fill="currentColor" fill-rule="evenodd" d="M2 8.978c0 .251.1.493.278.67l5.073 5.074a.95.95 0 0 0 1.343 0l4.028-4.028a.95.95 0 0 0 0-1.343L7.649 4.278A.95.95 0 0 0 6.978 4H2.949A.95.95 0 0 0 2 4.95zM5.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3" clip-rule="evenodd"/></svg>', 'tags-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="m8.5 1.295 5.355 5.35a.5.5 0 0 1 0 .71l-1 1-.71-.71.65-.645-5-5H4v1H3V2a1 1 0 0 1 1-1h3.795a1 1 0 0 1 .705.295"/><path fill="currentColor" fill-rule="evenodd" d="M5.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m0-1a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M2.278 9.649A.95.95 0 0 1 2 8.978V4.949A.95.95 0 0 1 2.95 4h4.028c.251 0 .493.1.67.278l5.074 5.073a.95.95 0 0 1 0 1.343l-4.028 4.028a.95.95 0 0 1-1.343 0zm5.744 4.33L3 8.957V5h3.957l5.022 5.022z" clip-rule="evenodd"/></svg>', 'thumb-down': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M11.202 11.934a1.506 1.506 0 0 1-2.438 1.651L5.5 10.461v-8.46h4.922c1.081 0 2.058.714 2.484 1.817l.944 3.394c.51 1.32-.362 2.788-1.656 2.788h-1.772zM4.5 10H2V2h2.5z"/></svg>', 'thumb-down-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M11.204 11.934 10.424 10h1.772c1.294 0 2.166-1.468 1.656-2.788l-.944-3.394C12.484 2.715 11.507 2 10.426 2H5v.003H2v8h3.023l3.744 3.582a1.506 1.506 0 0 0 2.437-1.651m.755-7.797C11.657 3.4 11.033 3 10.425 3H6.002l.017 6.572 3.439 3.29a.506.506 0 0 0 .819-.554L8.943 9h3.253c.24 0 .48-.131.645-.41.167-.28.218-.657.079-1.018l-.018-.045zM3 9.003h2v-6H3z" clip-rule="evenodd"/></svg>', 'thumb-up': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M11.202 4.069a1.506 1.506 0 0 0-2.438-1.651L5.5 5.542v8.46h4.922c1.081 0 2.058-.714 2.484-1.817l.944-3.394c.51-1.32-.362-2.788-1.656-2.788h-1.772zM4.5 6.003H2v8h2.5z"/></svg>', 'thumb-up-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m11.204 4.069-.78 1.934h1.772c1.294 0 2.166 1.468 1.656 2.788l-.944 3.394c-.425 1.103-1.402 1.818-2.483 1.818H5V14H2V6h3.023l3.744-3.582a1.506 1.506 0 0 1 2.437 1.65m.755 7.797c-.302.738-.926 1.137-1.534 1.137H6.002L6.02 6.43l3.439-3.29a.506.506 0 0 1 .819.554L8.943 7.003h3.253c.24 0 .48.13.645.41.167.28.218.657.079 1.018l-.018.045zM3 7h2v6H3z" clip-rule="evenodd"/></svg>', 'thumbtack': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m8.91 2-1.2 3.594L2.364 7.09 5.274 10l-.707.706-1.687 1.687-.264.264-.09.09-.209.498L2 14l.755-.317.498-.21.09-.089.264-.264 1.687-1.687.706-.706 2.91 2.908 1.496-5.347L14 7.09z" clip-rule="evenodd"/></svg>', 'thumbtack-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="m5.273 10-2.91 2.91L2 14l1.09-.364L6 10.727l2.91 2.91 1.496-5.348L14 7.09 8.91 2l-1.2 3.594L2.364 7.09zm3.241-3.563-4.18 1.17 4.059 4.059 1.17-4.18 2.533-.845-2.737-2.737z" clip-rule="evenodd"/></svg>', 'trash': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M11 2v1h3v1h-1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4H2V3h3V2a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1M6 3V2h4v1zm1 3H6v6h1zm2 0h1v6H9z" clip-rule="evenodd"/></svg>', 'trash-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7 6H6v6h1zm2 0h1v6H9z"/><path fill="currentColor" fill-rule="evenodd" d="M11 3V2a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1v1H2v1h1v10a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4h1V3zM6 2v1h4V2zm6 2v10H4V4z" clip-rule="evenodd"/></svg>', 'universal-access': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0m-3.5-1V6h-7v1H7v1.367l-1.934 3.385.868.496L7.79 9h.42l1.856 3.248.868-.496L9 8.367V7zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/></svg>', 'universal-access-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M4.111 13.82A7 7 0 0 0 8 15a7.01 7.01 0 0 0 7-7 7 7 0 1 0-10.889 5.82m.556-10.809A6 6 0 0 1 8 2a6.007 6.007 0 0 1 6 6 6 6 0 1 1-9.333-4.989M8 5.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2M11.5 7V6h-7v1H7v1.367l-1.934 3.385.868.496L7.79 9h.42l1.856 3.248.868-.496L9 8.367V7z" clip-rule="evenodd"/></svg>', 'unlink': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6.5 1h-1v2h1zM1.792 2.501l.707-.707L4.207 3.5l-.707.707zm9.998 9.995.708-.707 1.707 1.708-.707.707zM1 5.5h2v1H1zm14 4h-2v1h2zM9.5 13h1v2h-1zm-1.21-2.465-1.855 1.86a2.002 2.002 0 0 1-2.83-2.83l1.86-1.86L4.755 7 2.9 8.86a3 3 0 0 0-.03 4.27A3 3 0 0 0 5 14a3.04 3.04 0 0 0 2.16-.9L9 11.245zm1.275-6.93-1.86 1.86L7 4.755 8.84 2.9A3.04 3.04 0 0 1 11 2a3 3 0 0 1 2.13.87 3 3 0 0 1-.03 4.27L11.245 9l-.71-.705 1.86-1.86a2.002 2.002 0 0 0-2.83-2.83"/></svg>', 'unlock': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M10 7V4a2 2 0 1 0-4 0v1H5V4a3 3 0 0 1 6 0v3h1a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1zm-3 4a1 1 0 1 1 2 0 1 1 0 0 1-2 0" clip-rule="evenodd"/></svg>', 'unlock-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 10a1 1 0 1 0 0 2 1 1 0 0 0 0-2"/><path fill="currentColor" fill-rule="evenodd" d="M10 4v3H4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1h-1V4a3 3 0 0 0-6 0v1h1V4a2 2 0 1 1 4 0m2 4v6H4V8z" clip-rule="evenodd"/></svg>', 'upload': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M3.706 6.703 3 6l5-5 5 5-.704.702L8.5 2.912V12h-1V2.913zM13 14v-2h1v2a1 1 0 0 1-1 1H3a1 1 0 0 1-.996-1.002L2 14v-2h1v2z" clip-rule="evenodd"/></svg>', 'user': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6M6 9a4 4 0 0 0-4 4 1 1 0 0 0 1 1h10a1 1 0 0 0 1-1 4 4 0 0 0-4-4z" clip-rule="evenodd"/></svg>', 'user-circle': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.01 1C4.146.99 1.01 4.128 1 7.99c0 3.863 3.128 7 6.99 7.01 3.853 0 6.99-3.109 7.01-6.962C15.019 4.176 11.9 1.02 8.038 1zm0 .715a6.28 6.28 0 0 1 6.275 6.295v.028a6.2 6.2 0 0 1-1.135 3.586 2.59 2.59 0 0 0-2.537-2.26H9.478a3.44 3.44 0 0 1-2.937 0H5.415a2.573 2.573 0 0 0-2.546 2.26 6.2 6.2 0 0 1-1.135-3.586 6.284 6.284 0 0 1 6.247-6.323zM5.147 5.778a2.914 2.914 0 0 1 2.91-2.909 2.914 2.914 0 0 1 2.908 2.909 2.914 2.914 0 0 1-2.909 2.909H8.01a2.917 2.917 0 0 1-2.86-2.91"/></svg>', 'user-group': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4m-4 4c0-.972.347-1.863.923-2.556A2.5 2.5 0 0 0 1 10.5V12a1 1 0 0 0 1 1h2.268A2 2 0 0 1 4 12zm10 2h-2.268A2 2 0 0 0 12 12v-1c0-.972-.347-1.863-.923-2.556A2.5 2.5 0 0 1 15 10.5V12a1 1 0 0 1-1 1m-9-2a3 3 0 0 1 6 0v1a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1zm9-5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0M3.5 7a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3"/></svg>', 'user-group-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M10 5a2 2 0 1 1-4 0 2 2 0 0 1 4 0M9 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/><path fill="currentColor" d="M2 10.5V12h2c0 .364.097.706.268 1H2a1 1 0 0 1-1-1v-1.5a2.5 2.5 0 0 1 3.923-2.056q-.321.386-.54.844A1.5 1.5 0 0 0 2 10.5M14 13h-2.268A2 2 0 0 0 12 12h2v-1.5a1.5 1.5 0 0 0-2.384-1.212 4 4 0 0 0-.539-.844A2.5 2.5 0 0 1 15 10.5V12a1 1 0 0 1-1 1"/><path fill="currentColor" fill-rule="evenodd" d="M8 8a3 3 0 0 0-3 3v1a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-1a3 3 0 0 0-3-3m2 4v-1a2 2 0 1 0-4 0v1zm2.5-5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m0-1a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1M5 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-1 0a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0" clip-rule="evenodd"/></svg>', 'user-lock': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M6.5 7a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5M5 8a4 4 0 0 0-4 4 1 1 0 0 0 1 1h7v-1.5a1.5 1.5 0 0 1 1.036-1.427c.109-.63.452-1.178.938-1.553A4 4 0 0 0 9 8z"/><path fill="currentColor" fill-rule="evenodd" d="M10.5 11h.5v-.5a1.5 1.5 0 0 1 3 0v.5h.5a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-3a.5.5 0 0 1 .5-.5m2.75-.5v.5h-1.5v-.5a.75.75 0 0 1 1.5 0" clip-rule="evenodd"/></svg>', 'user-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0m-1 0a2 2 0 1 1-4 0 2 2 0 0 1 4 0m-8 8a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4 1 1 0 0 1-1 1H3a1 1 0 0 1-1-1m1 0a3 3 0 0 1 3-3h4a3 3 0 0 1 3 3z" clip-rule="evenodd"/></svg>', 'user-pen-fancy-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7.5 7a2.5 2.5 0 0 1 0-5 2.5 2.5 0 0 1 0 5m0-4C6.67 3 6 3.67 6 4.5S6.67 6 7.5 6 9 5.33 9 4.5 8.33 3 7.5 3m3.62 8.46-.22.54-.3.77s-.04.09-.06.13c-.03.04-.06.07-.1.1-.05.04-.1.07-.16.08L7.52 14l-.07-.07 1.45-1.45h.13c.15 0 .27-.06.36-.16a.6.6 0 0 0 .1-.15c.01-.02.02-.04.03-.07v-.02s.01-.05.01-.08v-.03c0-.28-.23-.5-.51-.5-.28.01-.5.24-.5.51v.14l-.76.75-.14.13-.55.55-.07-.07.16-.48.1-.29.24-.71.42-1.27c.05-.16.17-.28.32-.32l1.31-.52zm3.44-3.24-2.05 1.87-.7.64-.06.05-.32.29-1.52-1.52.28-.31.06-.06.64-.7 1.88-2.04c1.16-1.31 3.11.61 1.79 1.78"/><path fill="currentColor" fill-rule="evenodd" d="M9 8H6c-2.21 0-4 1.79-4 4 0 .55.45 1 1 1h3.11l.33-1H3c0-1.66 1.34-3 3-3h3.05l.83-.9C9.6 8.03 9.3 8 9 8" clip-rule="evenodd"/></svg>', 'user-plus': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M14 3.33h-1.35V2c-.02-.18-.17-.33-.35-.33h-.65c-.18 0-.33.15-.35.33v1.33H10c-.18 0-.33.16-.33.34v.66c0 .18.15.33.33.34h1.3V6c.02.18.17.32.35.33h.65c.18 0 .33-.15.35-.33V4.67H14a.34.34 0 0 0 .32-.34v-.66a.34.34 0 0 0-.32-.34M9.28 9.77h-.2c-1.25.51-2.66.51-3.91 0H5a3.006 3.006 0 0 0-3.3 2.67v.74c.06.67.63 1.17 1.3 1.15h8.25c.69.06 1.3-.45 1.36-1.14v-.68a3 3 0 0 0-3.23-2.75h-.1zM7.13 3.7c1.46 0 2.64 1.17 2.65 2.63 0 1.46-1.17 2.64-2.63 2.65-1.46 0-2.64-1.17-2.65-2.63A2.65 2.65 0 0 1 7.13 3.7"/></svg>', 'user-question-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M5.23 11.14c.86-.66 1.01-1.9.35-2.75s-1.9-1.01-2.75-.35a1.96 1.96 0 0 0 0 3.1c-.72.42-1.16 1.2-1.16 2.03v.8c0 .2.17.37.37.37h3.98c.2 0 .37-.17.37-.37v-.8c0-.83-.44-1.61-1.16-2.03M2.81 9.59c0-.67.55-1.22 1.22-1.22s1.22.55 1.22 1.22-.55 1.22-1.22 1.22-1.22-.55-1.22-1.22m2.83 4H2.41v-.42c0-.89.72-1.62 1.62-1.62s1.62.72 1.62 1.62v.42zm7.13-11.93H8c-.86 0-1.56.7-1.56 1.56v7.16c0 .21.17.37.37.37.08 0 .16-.03.22-.07l1.49-1.12h4.25c.86 0 1.56-.7 1.56-1.56V3.22c0-.86-.7-1.56-1.56-1.56m.82 6.33c0 .45-.37.82-.82.82H8.4a.4.4 0 0 0-.22.07l-1 .75V3.22c0-.45.37-.82.82-.82h4.77c.45 0 .82.37.82.82zm-2.8-.42c0 .23-.18.41-.41.41s-.41-.18-.41-.41.18-.41.41-.41.41.18.41.41m-.41-4.34c-.83 0-1.5.67-1.5 1.5 0 .23.18.41.41.41s.41-.18.41-.41c0-.38.31-.68.69-.68s.68.31.68.69-.31.68-.68.68c-.23 0-.41.18-.41.41v.44c0 .23.18.41.41.41s.41-.18.41-.41v-.09c.8-.23 1.26-1.06 1.04-1.85-.18-.65-.77-1.09-1.44-1.09z"/></svg>', 'user-shield': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M2.676 2.768A1 1 0 0 0 2 3.714v4.799a3 3 0 0 0 .154.949l.06.177A7 7 0 0 0 5.1 13.334l2.373 1.508a1 1 0 0 0 1.074-.001l2.361-1.507a7 7 0 0 0 2.875-3.687l.062-.185c.102-.306.154-.627.154-.949V3.714a1 1 0 0 0-.676-.946l-5-1.712a1 1 0 0 0-.648 0zM8 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4m-4.22 2.627a6 6 0 0 0 1.857 1.863l2.373 1.508 2.361-1.507a6 6 0 0 0 1.85-1.862A4 4 0 0 0 9 8.999H7c-1.32 0-2.492.641-3.22 1.628" clip-rule="evenodd"/></svg>', 'user-shield-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M10 5.998a2 2 0 1 1-4 0 2 2 0 0 1 4 0m-1 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M2 3.712a1 1 0 0 1 .676-.946l5-1.712a1 1 0 0 1 .648 0l5 1.712a1 1 0 0 1 .676.946v4.799c0 .322-.052.643-.154.949l-.062.185a7 7 0 0 1-2.875 3.687l-2.36 1.507a1 1 0 0 1-1.075 0l-2.373-1.507a7 7 0 0 1-2.888-3.695l-.06-.177A3 3 0 0 1 2 8.51zm11 0v4.799q0 .324-.103.632l-.061.186a6 6 0 0 1-.614 1.298A4 4 0 0 0 9 8.997H7c-1.32 0-2.492.64-3.22 1.628a6 6 0 0 1-.618-1.304l-.06-.178A2 2 0 0 1 3 8.511V3.712L8 2zM9 9.998a3 3 0 0 1 2.582 1.47c-.355.39-.76.734-1.21 1.021L8.01 13.996l-2.373-1.508a6 6 0 0 1-1.217-1.022A3 3 0 0 1 7 9.998z" clip-rule="evenodd"/></svg>', 'users': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M7.25 3.335a2.5 2.5 0 1 0 0 4.33A3.5 3.5 0 0 1 6.5 5.5c0-.818.28-1.57.75-2.165M10 3a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5m-5 9.2A3.2 3.2 0 0 1 8.2 9h3.6a3.2 3.2 0 0 1 3.2 3.2.8.8 0 0 1-.8.8H5.8a.8.8 0 0 1-.8-.8M5.48 9H4.2A3.2 3.2 0 0 0 1 12.2a.8.8 0 0 0 .8.8h2.387A1.8 1.8 0 0 1 4 12.2 4.19 4.19 0 0 1 5.48 9"/></svg>', 'users-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M7.5 5.5a2.5 2.5 0 1 1 5 0 2.5 2.5 0 0 1-5 0M10 7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3" clip-rule="evenodd"/><path fill="currentColor" d="M4.2 9h1.28a4.2 4.2 0 0 0-.858 1H4.2a2.2 2.2 0 0 0-2.191 2h1.996a4 4 0 0 0-.005.2c0 .287.067.559.187.8H1.8a.8.8 0 0 1-.8-.8A3.2 3.2 0 0 1 4.2 9"/><path fill="currentColor" fill-rule="evenodd" d="M5 12.2A3.2 3.2 0 0 1 8.2 9h3.6a3.2 3.2 0 0 1 3.2 3.2.8.8 0 0 1-.8.8H5.8a.8.8 0 0 1-.8-.8m6.8-2.2a2.2 2.2 0 0 1 2.191 2H6.009A2.2 2.2 0 0 1 8.2 10z" clip-rule="evenodd"/><path fill="currentColor" d="M6 3c.455 0 .882.122 1.25.335a3.5 3.5 0 0 0-.5.865 1.5 1.5 0 1 0 0 2.6c.125.313.294.604.5.865A2.5 2.5 0 1 1 6 3"/></svg>', 'wallet': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M1 4a1 1 0 0 1 1-1h11a1 1 0 0 1 1 1v1a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1zm1 0h11v1H2zm9 5a1 1 0 1 1 2 0 1 1 0 0 1-2 0" clip-rule="evenodd"/></svg>', 'wallet-outline': '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M11 9a1 1 0 1 1 2 0 1 1 0 0 1-2 0"/><path fill="currentColor" fill-rule="evenodd" d="M2 13a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h11a1 1 0 0 1 1 1v1a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1zm0-9h11v1H2zm12 2H2v6h12z" clip-rule="evenodd"/></svg>' };
|
|
903
908
|
|
|
904
909
|
const mgIconCss = ".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-icon-border-radius: Defines the border radius of icons. Default value is `50%`.\n */:host{display:inline-flex;vertical-align:middle}.mg-c-icon{color:currentcolor}.mg-c-icon[size=small],.mg-c-icon.mg-c-icon--size-small{width:var(--mg-b-size-12);height:var(--mg-b-size-12)}.mg-c-icon[size=small][class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon),.mg-c-icon.mg-c-icon--size-small[class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon){padding:calc((var(--mg-b-size-16) - var(--mg-b-size-12))/2)}.mg-c-icon[size=medium],.mg-c-icon.mg-c-icon--size-medium{width:var(--mg-b-size-16);height:var(--mg-b-size-16)}.mg-c-icon[size=medium][class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon),.mg-c-icon.mg-c-icon--size-medium[class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon){padding:calc((var(--mg-b-size-24) - var(--mg-b-size-16))/2)}.mg-c-icon[size=large],.mg-c-icon.mg-c-icon--size-large{width:var(--mg-b-size-20);height:var(--mg-b-size-20)}.mg-c-icon[size=large][class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon),.mg-c-icon.mg-c-icon--size-large[class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon){padding:calc((var(--mg-b-size-32) - var(--mg-b-size-20))/2)}.mg-c-icon[size=xlarge],.mg-c-icon.mg-c-icon--size-xlarge{width:var(--mg-b-size-24);height:var(--mg-b-size-24)}.mg-c-icon[size=xlarge][class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon),.mg-c-icon.mg-c-icon--size-xlarge[class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon){padding:calc((var(--mg-b-size-40) - var(--mg-b-size-24))/2)}.mg-c-icon[size=xxlarge],.mg-c-icon.mg-c-icon--size-xxlarge{width:var(--mg-b-size-32);height:var(--mg-b-size-32)}.mg-c-icon[size=xxlarge][class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon),.mg-c-icon.mg-c-icon--size-xxlarge[class*=mg-c-icon--variant-]:not(.mg-c-icon--variant-style-icon){padding:calc((var(--mg-b-size-48) - var(--mg-b-size-32))/2)}.mg-c-icon.mg-c-icon--variant-app.mg-c-icon--variant-style-icon{color:var(--mg-b-color-app)}.mg-c-icon.mg-c-icon--variant-blue.mg-c-icon--variant-style-icon{color:var(--mg-b-color-blue)}.mg-c-icon.mg-c-icon--variant-80.mg-c-icon--variant-style-icon{color:var(--mg-b-color-80)}.mg-c-icon.mg-c-icon--variant-danger.mg-c-icon--variant-style-icon{color:var(--mg-b-color-danger)}.mg-c-icon.mg-c-icon--variant-info.mg-c-icon--variant-style-icon{color:var(--mg-b-color-info)}.mg-c-icon.mg-c-icon--variant-success.mg-c-icon--variant-style-icon{color:var(--mg-b-color-success)}.mg-c-icon.mg-c-icon--variant-warning.mg-c-icon--variant-style-icon{color:var(--mg-b-color-warning)}.mg-c-icon.mg-c-icon--variant-app.mg-c-icon--variant-style-background{background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-app), white 80%))}.mg-c-icon.mg-c-icon--variant-blue.mg-c-icon--variant-style-background{background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-blue), white 80%))}.mg-c-icon.mg-c-icon--variant-80.mg-c-icon--variant-style-background{background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-80), white 80%))}.mg-c-icon.mg-c-icon--variant-danger.mg-c-icon--variant-style-background{background-color:var(--mg-b-color-red-20, color-mix(in srgb, var(--mg-b-color-danger), white 80%))}.mg-c-icon.mg-c-icon--variant-info.mg-c-icon--variant-style-background{background-color:var(--mg-b-color-blue-20, color-mix(in srgb, var(--mg-b-color-info), white 80%))}.mg-c-icon.mg-c-icon--variant-success.mg-c-icon--variant-style-background{background-color:var(--mg-b-color-green-20, color-mix(in srgb, var(--mg-b-color-success), white 80%))}.mg-c-icon.mg-c-icon--variant-warning.mg-c-icon--variant-style-background{background-color:var(--mg-b-color-yellow-20, color-mix(in srgb, var(--mg-b-color-warning), white 80%))}.mg-c-icon.mg-c-icon--variant-app.mg-c-icon--variant-style-full{color:var(--mg-b-color-app);background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-app), white 80%))}.mg-c-icon.mg-c-icon--variant-blue.mg-c-icon--variant-style-full{color:var(--mg-b-color-blue);background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-blue), white 80%))}.mg-c-icon.mg-c-icon--variant-80.mg-c-icon--variant-style-full{color:var(--mg-b-color-80);background-color:var(--mg-b-color--20, color-mix(in srgb, var(--mg-b-color-80), white 80%))}.mg-c-icon.mg-c-icon--variant-danger.mg-c-icon--variant-style-full{color:var(--mg-b-color-danger);background-color:var(--mg-b-color-red-20, color-mix(in srgb, var(--mg-b-color-danger), white 80%))}.mg-c-icon.mg-c-icon--variant-info.mg-c-icon--variant-style-full{color:var(--mg-b-color-info);background-color:var(--mg-b-color-blue-20, color-mix(in srgb, var(--mg-b-color-info), white 80%))}.mg-c-icon.mg-c-icon--variant-success.mg-c-icon--variant-style-full{color:var(--mg-b-color-success);background-color:var(--mg-b-color-green-20, color-mix(in srgb, var(--mg-b-color-success), white 80%))}.mg-c-icon.mg-c-icon--variant-warning.mg-c-icon--variant-style-full{color:var(--mg-b-color-warning);background-color:var(--mg-b-color-yellow-20, color-mix(in srgb, var(--mg-b-color-warning), white 80%))}.mg-c-icon[class*=mg-c-icon--variant-]{overflow:visible;border-radius:var(--mg-c-icon-border-radius)}.mg-c-icon--spin{animation-duration:.75s;animation-iteration-count:infinite;animation-name:rotate}@keyframes rotate{to{transform:rotate(360deg)}}";
|
|
905
|
-
const MgIconStyle0 = mgIconCss;
|
|
906
910
|
|
|
907
911
|
const MgIcon = class {
|
|
908
912
|
constructor(hostRef) {
|
|
@@ -918,7 +922,7 @@ const MgIcon = class {
|
|
|
918
922
|
/**
|
|
919
923
|
* Component classes
|
|
920
924
|
*/
|
|
921
|
-
this.classCollection = new
|
|
925
|
+
this.classCollection = new kt(['mg-c-icon']);
|
|
922
926
|
/**
|
|
923
927
|
* Method to set default varianStyle props
|
|
924
928
|
* needeed has stencil doesn't know that props is mutated when updated in prop watcher
|
|
@@ -949,7 +953,7 @@ const MgIcon = class {
|
|
|
949
953
|
}
|
|
950
954
|
validateIcon(newValue, oldValue) {
|
|
951
955
|
if (!Object.keys(icons).includes(newValue)) {
|
|
952
|
-
throw new Error(`<mg-icon> prop "icon" must be one of: ${Object.keys(icons).join(', ')}. Passed value: ${
|
|
956
|
+
throw new Error(`<mg-icon> prop "icon" must be one of: ${Object.keys(icons).join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
953
957
|
}
|
|
954
958
|
else {
|
|
955
959
|
if (oldValue !== undefined) {
|
|
@@ -965,7 +969,7 @@ const MgIcon = class {
|
|
|
965
969
|
newValue = 'medium';
|
|
966
970
|
}
|
|
967
971
|
if (!sizes$3.includes(newValue)) {
|
|
968
|
-
throw new Error(`<mg-icon> prop "size" must be one of: ${sizes$3.join(', ')}. Passed value: ${
|
|
972
|
+
throw new Error(`<mg-icon> prop "size" must be one of: ${sizes$3.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
969
973
|
}
|
|
970
974
|
else {
|
|
971
975
|
if (oldValue !== undefined) {
|
|
@@ -977,7 +981,7 @@ const MgIcon = class {
|
|
|
977
981
|
validateVariant(newValue, oldValue) {
|
|
978
982
|
if (newValue !== undefined) {
|
|
979
983
|
if (!variants$2.includes(newValue))
|
|
980
|
-
throw new Error(`<mg-icon> prop "variant" must be one of: ${variants$2.join(', ')}. Passed value: ${
|
|
984
|
+
throw new Error(`<mg-icon> prop "variant" must be one of: ${variants$2.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
981
985
|
else {
|
|
982
986
|
this.setDefaultVariantStyle();
|
|
983
987
|
if (oldValue !== undefined)
|
|
@@ -989,7 +993,7 @@ const MgIcon = class {
|
|
|
989
993
|
validateVariantStyle(newValue, oldValue) {
|
|
990
994
|
if (newValue !== undefined) {
|
|
991
995
|
if (!variantStyles$1.includes(newValue))
|
|
992
|
-
throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles$1.join(', ')}. Passed value: ${
|
|
996
|
+
throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles$1.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
993
997
|
else {
|
|
994
998
|
if (oldValue !== undefined)
|
|
995
999
|
this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);
|
|
@@ -1032,7 +1036,7 @@ const MgIcon = class {
|
|
|
1032
1036
|
"spin": ["handleSpin"]
|
|
1033
1037
|
}; }
|
|
1034
1038
|
};
|
|
1035
|
-
MgIcon.style =
|
|
1039
|
+
MgIcon.style = mgIconCss;
|
|
1036
1040
|
|
|
1037
1041
|
/**
|
|
1038
1042
|
* List of all possibles sizes
|
|
@@ -1044,7 +1048,6 @@ const sizes$2 = ['small', 'medium', 'large'];
|
|
|
1044
1048
|
const directions = ['vertical', 'horizontal'];
|
|
1045
1049
|
|
|
1046
1050
|
const mgIllustratedMessageCss = "/*!\n * @prop --mg-c-illustrated-message-spacing-vertical: Defines the vertical padding of the illustrated message. Default value: `--mg-b-size-40`.\n */.mg-c-illustrated-message{display:flex;max-width:calc(60*var(--mg-b-size-8));box-sizing:border-box;flex-direction:column;justify-content:center;padding:var(--mg-c-illustrated-message-spacing-vertical) var(--mg-b-size-16);margin:auto;gap:var(--mg-b-size-16) var(--mg-b-size-64);text-align:center}.mg-c-illustrated-message__illustration{max-height:calc(15*var(--mg-b-size-8))}.mg-c-illustrated-message__illustration ::slotted([slot=illustration]){width:100%;max-width:100%;height:auto;max-height:calc(15*var(--mg-b-size-8))}.mg-c-illustrated-message__slots{display:flex;flex-direction:column;gap:var(--mg-b-size-16)}.mg-c-illustrated-message__slots ::slotted([slot=title]){margin:0;font-family:var(--mg-b-font-family) !important;font-size:var(--mg-b-font-size-h2) !important;font-weight:400 !important}.mg-c-illustrated-message__slots ::slotted([slot=details]){margin:0}.mg-c-illustrated-message.mg-c-illustrated-message--size-small .mg-c-illustrated-message__illustration{max-height:var(--mg-b-size-64)}.mg-c-illustrated-message.mg-c-illustrated-message--size-small .mg-c-illustrated-message__illustration ::slotted([slot=illustration]){max-height:var(--mg-b-size-64)}.mg-c-illustrated-message.mg-c-illustrated-message--size-large .mg-c-illustrated-message__illustration{max-height:calc(23*var(--mg-b-size-8))}.mg-c-illustrated-message.mg-c-illustrated-message--size-large .mg-c-illustrated-message__illustration ::slotted([slot=illustration]){max-height:calc(23*var(--mg-b-size-8))}.mg-c-illustrated-message.mg-c-illustrated-message--direction-horizontal{max-width:unset;flex-flow:row wrap;align-items:center}.mg-c-illustrated-message.mg-c-illustrated-message--direction-horizontal .mg-c-illustrated-message__slots,.mg-c-illustrated-message.mg-c-illustrated-message--direction-horizontal .mg-c-illustrated-message__illustration{max-width:calc(60*var(--mg-b-size-8))}";
|
|
1047
|
-
const MgIllustratedMessageStyle0 = mgIllustratedMessageCss;
|
|
1048
1051
|
|
|
1049
1052
|
const MgIllustratedMessage = class {
|
|
1050
1053
|
constructor(hostRef) {
|
|
@@ -1060,11 +1063,11 @@ const MgIllustratedMessage = class {
|
|
|
1060
1063
|
/**
|
|
1061
1064
|
* Component classes
|
|
1062
1065
|
*/
|
|
1063
|
-
this.classCollection = new
|
|
1066
|
+
this.classCollection = new kt(['mg-c-illustrated-message']);
|
|
1064
1067
|
}
|
|
1065
1068
|
watchSize(newValue, oldValue) {
|
|
1066
1069
|
if (!sizes$2.includes(newValue)) {
|
|
1067
|
-
throw new Error(`<mg-illustrated-message> prop "size" must be one of: ${sizes$2.join(', ')}. Passed value: ${
|
|
1070
|
+
throw new Error(`<mg-illustrated-message> prop "size" must be one of: ${sizes$2.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
1068
1071
|
}
|
|
1069
1072
|
else {
|
|
1070
1073
|
if (oldValue !== undefined) {
|
|
@@ -1075,7 +1078,7 @@ const MgIllustratedMessage = class {
|
|
|
1075
1078
|
}
|
|
1076
1079
|
watchDirection(newValue, oldValue) {
|
|
1077
1080
|
if (newValue !== undefined && !directions.includes(newValue)) {
|
|
1078
|
-
throw new Error(`<mg-illustrated-message> prop "direction" must be one of: ${directions.join(', ')}. Passed value: ${
|
|
1081
|
+
throw new Error(`<mg-illustrated-message> prop "direction" must be one of: ${directions.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
1079
1082
|
}
|
|
1080
1083
|
else if (newValue === 'horizontal') {
|
|
1081
1084
|
this.classCollection.add('mg-c-illustrated-message--direction-horizontal');
|
|
@@ -1098,7 +1101,7 @@ const MgIllustratedMessage = class {
|
|
|
1098
1101
|
if (slottedDetails.length === 0 && slottedTitle === null) {
|
|
1099
1102
|
throw new Error('<mg-illustrated-message> Slot "title" or "details" must be present.');
|
|
1100
1103
|
}
|
|
1101
|
-
else if (slottedTitle !== null && !
|
|
1104
|
+
else if (slottedTitle !== null && !Tt(slottedTitle, headingTags)) {
|
|
1102
1105
|
throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}.`);
|
|
1103
1106
|
}
|
|
1104
1107
|
else if (slottedIllustrations.length !== 1) {
|
|
@@ -1130,10 +1133,9 @@ const MgIllustratedMessage = class {
|
|
|
1130
1133
|
"direction": ["watchDirection"]
|
|
1131
1134
|
}; }
|
|
1132
1135
|
};
|
|
1133
|
-
MgIllustratedMessage.style =
|
|
1136
|
+
MgIllustratedMessage.style = mgIllustratedMessageCss;
|
|
1134
1137
|
|
|
1135
1138
|
const mgInputCss = ".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-input-border-width: Defines the width of the input border. Default value is `--mg-b-size-border`.\n * @prop --mg-c-input-border-radius: Defines the border radius of the input. Default value is `--mg-b-size-radius`.\n * @prop --mg-c-input-color-border: Defines the color of the input border. Default value is `rgb(181, 194, 201)`.\n * @prop --mg-c-input-placeholder-color-text: Defines the color of the placeholder text. Default value is `rgb(181, 194, 201)`.\n * @prop --mg-c-input-color-box-shadow-focus: Defines the shadow color of the input when focused. Default value is `rgba(0, 221, 255, 0.5)`.\n * @prop --mg-c-input-error-color-background: Defines the background color of the input error message. Default value is `color-mix(in srgb, var(--mg-b-color-danger), white 95%)`.\n * @prop --mg-c-input-toggle-border-radius-ratio: Defines the border radius ratio of the input toggle. Default value is `2`.\n * @prop --mg-c-input-check-size: Defines the size of the input check. Default value is `--mg-b-size-16`.\n */:host{display:block}.mg-c-input__input mg-icon,.mg-c-input__error mg-icon{display:flex}.mg-c-input{display:flex;min-height:var(--mg-b-size-min-height);align-items:flex-start}.mg-c-input__input-container{width:100%;min-height:var(--mg-b-size-min-height)}.mg-c-input__input-container mg-tooltip{display:inline-flex;width:var(--mg-b-size-16);height:var(--mg-b-size-16);margin-left:var(--mg-b-size-8)}@media print{.mg-c-input__input-container mg-tooltip{display:none}}.mg-c-input__input{display:flex;min-height:var(--mg-b-size-min-height);align-items:center;justify-content:start}.mg-c-input__input mg-tooltip{align-self:baseline;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input ::slotted(.mg-c-input__button-toggle:disabled){opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input__title{display:flex;width:var(--mg-c-input-title-width, auto);flex-shrink:0;align-items:baseline;justify-content:flex-end;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);margin-right:var(--mg-c-input-title-horizontal-space, var(--mg-b-size-8));text-align:right}.mg-c-input__title slot[name=label]+mg-tooltip{margin-left:var(--mg-b-size-4)}.mg-c-input__title mg-icon{display:inline-flex;vertical-align:text-bottom}.mg-c-input__error{display:inline-block;padding:var(--mg-b-size-4) var(--mg-b-size-8);border-radius:var(--mg-b-size-radius);background:var(--mg-c-input-error-color-background);color:var(--mg-b-color-danger)}.mg-c-input__error ::slotted(*),.mg-c-input__help-text ::slotted(*){font-size:var(--mg-b-font-size-small);text-align:start}:host(:not(.mg-c-input--textarea)) .mg-c-input__input+.mg-c-input__error,:host(:not(.mg-c-input--textarea)) .mg-c-input__input+.mg-c-input__help-text{margin-top:var(--mg-b-size-4)}:host(.mg-c-input.mg-c-input--readonly) .mg-c-input__input mg-tooltip{margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}:host(.mg-c-input){display:flex;margin-bottom:var(--mg-c-input-margin-bottom, 0)}:host(.mg-c-input.mg-c-input--checkbox) .mg-c-input__input,:host(.mg-c-input.mg-c-input--radio) .mg-c-input__input{min-height:unset;align-items:flex-start}:host(.mg-c-input.mg-c-input--checkbox,.mg-c-input.mg-c-input--radio) .mg-c-input__input{min-height:unset}:host(.mg-c-input.mg-c-input--fieldset:not(.mg-c-input--checkbox-multi,.mg-c-input--readonly)) .mg-c-input__input-container mg-tooltip{margin-left:var(--mg-b-size-32)}:host(.mg-c-input.mg-c-input--label-on-top){flex-direction:column}:host(.mg-c-input.mg-c-input--label-on-top) .mg-c-input__title{width:100%;flex:0;justify-content:flex-start;margin-top:0;margin-right:0;margin-bottom:var(--mg-b-size-4);text-align:left}:host(.mg-c-input.mg-c-input--label-on-top) .mg-c-input__title ::slotted(mg-input-title){flex-shrink:1}@media screen and (max-width: 767px){:host(.mg-c-input){flex-direction:column}:host(.mg-c-input) .mg-c-input__title{width:100%;flex:0;justify-content:flex-start;margin-top:0;margin-right:0;margin-bottom:var(--mg-b-size-4);text-align:left}:host(.mg-c-input) .mg-c-input__title ::slotted(mg-input-title){flex-shrink:1}}";
|
|
1136
|
-
const MgInputStyle0 = mgInputCss;
|
|
1137
1139
|
|
|
1138
1140
|
const MgInput = class {
|
|
1139
1141
|
constructor(hostRef) {
|
|
@@ -1145,6 +1147,10 @@ const MgInput = class {
|
|
|
1145
1147
|
this.classInput = 'mg-c-input';
|
|
1146
1148
|
this.classHasError = 'mg-c-input--has-error';
|
|
1147
1149
|
this.classLabelOnTop = 'mg-c-input--label-on-top';
|
|
1150
|
+
/**
|
|
1151
|
+
* Define if label is displayed on top
|
|
1152
|
+
*/
|
|
1153
|
+
this.labelOnTop = false;
|
|
1148
1154
|
/**
|
|
1149
1155
|
* Define if label is visible
|
|
1150
1156
|
*/
|
|
@@ -1180,11 +1186,11 @@ const MgInput = class {
|
|
|
1180
1186
|
this.renderTooltip = () => (h("mg-tooltip", { identifier: `${this.identifier}-tooltip`, message: this.tooltip }, h("mg-icon", { icon: "info-circle" })));
|
|
1181
1187
|
}
|
|
1182
1188
|
watchIdentifier(newValue) {
|
|
1183
|
-
if (!
|
|
1184
|
-
throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${
|
|
1189
|
+
if (!Le(newValue)) {
|
|
1190
|
+
throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
1185
1191
|
}
|
|
1186
|
-
else if (!
|
|
1187
|
-
console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${
|
|
1192
|
+
else if (!Ot(newValue)) {
|
|
1193
|
+
console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
1188
1194
|
}
|
|
1189
1195
|
else {
|
|
1190
1196
|
this.helpTextId = `${this.identifier}-help-text`;
|
|
@@ -1206,7 +1212,7 @@ const MgInput = class {
|
|
|
1206
1212
|
}
|
|
1207
1213
|
watchTooltipPosition(newValue) {
|
|
1208
1214
|
if (!tooltipPositions.includes(newValue)) {
|
|
1209
|
-
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${
|
|
1215
|
+
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
1210
1216
|
}
|
|
1211
1217
|
}
|
|
1212
1218
|
watchErrorMessage(newValue) {
|
|
@@ -1249,10 +1255,12 @@ const MgInput = class {
|
|
|
1249
1255
|
ariaDescribedbyIDs.add(this.helpTextErrorId);
|
|
1250
1256
|
}
|
|
1251
1257
|
this.element.querySelectorAll('input,select,textarea,[role="switch"]').forEach(element => {
|
|
1252
|
-
if (ariaDescribedbyIDs.size)
|
|
1258
|
+
if (ariaDescribedbyIDs.size > 0) {
|
|
1253
1259
|
element.setAttribute('aria-describedby', Array.from(ariaDescribedbyIDs).join(' '));
|
|
1254
|
-
|
|
1260
|
+
}
|
|
1261
|
+
else {
|
|
1255
1262
|
element.removeAttribute('aria-describedby');
|
|
1263
|
+
}
|
|
1256
1264
|
});
|
|
1257
1265
|
}
|
|
1258
1266
|
/**
|
|
@@ -1273,8 +1281,8 @@ const MgInput = class {
|
|
|
1273
1281
|
*/
|
|
1274
1282
|
// eslint-disable-next-line @stencil-community/no-unused-watch
|
|
1275
1283
|
watchLabel() {
|
|
1276
|
-
if (!
|
|
1277
|
-
throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${
|
|
1284
|
+
if (!Le(this.label)) {
|
|
1285
|
+
throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${zt(this.label)}.`);
|
|
1278
1286
|
}
|
|
1279
1287
|
else {
|
|
1280
1288
|
this.watchAriaDescribedbyIDs();
|
|
@@ -1366,7 +1374,7 @@ const MgInput = class {
|
|
|
1366
1374
|
*/
|
|
1367
1375
|
render() {
|
|
1368
1376
|
const isGroup = this.isFieldset && !this.isReadonly;
|
|
1369
|
-
return (h(Host, { key: '
|
|
1377
|
+
return (h(Host, { key: '052fc371413e939c23d1881633ed8d9f2e70ad90', class: this.element.classList.toString(), role: isGroup ? 'group' : undefined, "aria-labelledby": isGroup ? `${this.identifier}-title` : undefined }, h("div", { key: 'f12463ab540800f45a8d52beb2ac57a3733d3958', class: { 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide } }, h("slot", { key: 'bb4d18b8faf540c26451aabcc35c8f8bc05e75b4', name: this.slotLabel }), this.tooltip && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()), h("div", { key: 'e46cd50480c677ff9bde03e78335ad838775577c', class: "mg-c-input__input-container" }, h("div", { key: '8a9106982a4b53669b62897aacc5fae13c482e50', class: "mg-c-input__input" }, h("slot", { key: 'd2df2fcae71b45b96d8cdb86f5e7fec2487641c6' }), this.tooltip && !this.labelOnTop && (this.tooltipPosition === 'input' || this.labelHide) && this.renderTooltip()), this.helptextMessageSlotElement && (h("div", { key: 'd85f5b8c268f842e99137d10b5b852b49ac7d395', class: "mg-c-input__help-text" }, h("slot", { key: '7f50c07fd312859efd88dc5a1b9d61552547f7d0', name: this.slotHelpText }))), !this.isDisabled && this.errorMessage && (h("div", { key: '9f2c02102f3464fe38acc70dab745901320c1eb3', class: "mg-c-input__error", "aria-live": "assertive" }, h("slot", { key: '2861117e844fa887ff8231a6e0903e36b5d3d005', name: this.slotError }))))));
|
|
1370
1378
|
}
|
|
1371
1379
|
get element() { return getElement(this); }
|
|
1372
1380
|
static get watchers() { return {
|
|
@@ -1384,7 +1392,7 @@ const MgInput = class {
|
|
|
1384
1392
|
"isFieldset": ["watchLabel"]
|
|
1385
1393
|
}; }
|
|
1386
1394
|
};
|
|
1387
|
-
MgInput.style =
|
|
1395
|
+
MgInput.style = mgInputCss;
|
|
1388
1396
|
|
|
1389
1397
|
/**
|
|
1390
1398
|
* List of all availables checkbox type
|
|
@@ -1411,7 +1419,6 @@ const MgInputCheckboxList = (props) => (h("ul", { class: "mg-c-input__input-grou
|
|
|
1411
1419
|
})));
|
|
1412
1420
|
|
|
1413
1421
|
const mgInputCheckboxCss = ".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--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.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.mg-c-input--checkbox-multi .mg-c-input__input-group-container{padding:var(--mg-b-size-4) var(--mg-b-size-8);margin:0}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container{display:flex;width:unset;flex:unset;flex-wrap:wrap;column-gap:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-container-list{display:flex;flex-flow:row wrap;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__sections{max-height:100%;padding-right:var(--mg-b-size-8);overflow-y:auto}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__section-header{display:flex;min-height:var(--mg-b-size-min-height);flex-wrap:wrap;flex-wrap:nowrap;align-items:center;gap:var(--mg-b-size-8);text-wrap:nowrap}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__section-header-tootlip{display:inline-block;width:auto;height:auto;margin:0}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__section-header-title{display:inline;margin:0;color:var(--mg-b-color-neutral-80)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__section-header-title-label{font-size:var(--mg-b-font-size)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__section-header-title--static.mg-c-input__section-header-title{margin:0 var(--mg-b-size-12)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-value{display:inline-flex;min-width:var(--mg-b-size-min-height);min-height:var(--mg-b-size-min-height);box-sizing:border-box;align-items:center;justify-content:center;padding:calc((var(--mg-b-size-min-height) - 2*var(--mg-b-size-border) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-12);border-radius:var(--mg-b-size-4);background-color:var(--mg-b-color-neutral-20);font-size:var(--mg-b-font-size)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-no-result{text-align:center}.mg-c-input.mg-c-input--checkbox-multi b{margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--disabled .mg-c-input__input-container b{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--with-values .mg-c-input__input-container{gap:var(--mg-b-size-4)}.mg-c-input.mg-c-input--checkbox-multi.mg-c-input--search-mode .mg-c-input__content{display:flex;width:calc(var(--mg-b-size-floating-element-max-width) - var(--mg-b-size-16));height:calc(50*var(--mg-b-size-8));max-height:calc(100vh - var(--mg-b-size-32));flex-direction:column;gap:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi:not(.mg-c-input--label-on-top) mg-tooltip:not(.mg-c-input__section-header-tootlip){margin-left:var(--mg-b-size-8)}.mg-c-input.mg-c-input--checkbox-multi mg-popover{--mg-c-card-spacing:var(--mg-b-size-8)}.mg-c-input.mg-c-input--readonly ul{display:flex;min-height:var(--mg-b-font-size);flex-flow:column wrap;padding:0;margin:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) 0 0;list-style:none;row-gap:var(--mg-b-size-8)}";
|
|
1414
|
-
const MgInputCheckboxStyle0 = mgInputCheckboxCss;
|
|
1415
1422
|
|
|
1416
1423
|
/**
|
|
1417
1424
|
* type CheckboxItem validation function
|
|
@@ -1423,8 +1430,8 @@ const isCheckboxItems = (items) => Array.isArray(items) &&
|
|
|
1423
1430
|
const MgInputCheckbox = class {
|
|
1424
1431
|
constructor(hostRef) {
|
|
1425
1432
|
registerInstance(this, hostRef);
|
|
1426
|
-
this.valueChange = createEvent(this, "value-change"
|
|
1427
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
1433
|
+
this.valueChange = createEvent(this, "value-change");
|
|
1434
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
1428
1435
|
// hasDisplayedError (triggered by blur event)
|
|
1429
1436
|
this.hasDisplayedError = false;
|
|
1430
1437
|
this.mode = 'custom';
|
|
@@ -1443,6 +1450,10 @@ const MgInputCheckbox = class {
|
|
|
1443
1450
|
* If not set the value equals the identifier
|
|
1444
1451
|
*/
|
|
1445
1452
|
this.name = this.identifier;
|
|
1453
|
+
/**
|
|
1454
|
+
* Define if label is displayed on top
|
|
1455
|
+
*/
|
|
1456
|
+
this.labelOnTop = false;
|
|
1446
1457
|
/**
|
|
1447
1458
|
* Define if label is visible
|
|
1448
1459
|
*/
|
|
@@ -1459,6 +1470,11 @@ const MgInputCheckbox = class {
|
|
|
1459
1470
|
* Define if mg-input-checkbox is readonly
|
|
1460
1471
|
*/
|
|
1461
1472
|
this.readonly = false;
|
|
1473
|
+
/**
|
|
1474
|
+
* Display selected values list in "multi" type
|
|
1475
|
+
* This prop is only applied with prop type "multi" or when an "unset" mode render a "multi" type.
|
|
1476
|
+
*/
|
|
1477
|
+
this.displaySelectedValues = false;
|
|
1462
1478
|
/**
|
|
1463
1479
|
* Define if input is disabled
|
|
1464
1480
|
*/
|
|
@@ -1470,7 +1486,7 @@ const MgInputCheckbox = class {
|
|
|
1470
1486
|
/**
|
|
1471
1487
|
* Component classes
|
|
1472
1488
|
*/
|
|
1473
|
-
this.classCollection = new
|
|
1489
|
+
this.classCollection = new kt([this.baseClassName, classFieldset]);
|
|
1474
1490
|
/**
|
|
1475
1491
|
* Formated value to display in list
|
|
1476
1492
|
*/
|
|
@@ -1588,7 +1604,7 @@ const MgInputCheckbox = class {
|
|
|
1588
1604
|
* Method to update searchResults
|
|
1589
1605
|
*/
|
|
1590
1606
|
this.updateSearchResults = () => {
|
|
1591
|
-
this.searchResults = this.checkboxItems.filter(item =>
|
|
1607
|
+
this.searchResults = this.checkboxItems.filter(item => Lt(item.title).includes(Lt(this.searchValue)));
|
|
1592
1608
|
};
|
|
1593
1609
|
/**
|
|
1594
1610
|
* Method to validate if one of inputs value is checked id required
|
|
@@ -1620,13 +1636,13 @@ const MgInputCheckbox = class {
|
|
|
1620
1636
|
* @returns message to display
|
|
1621
1637
|
*/
|
|
1622
1638
|
this.getSelectValuesButtonMessage = () => {
|
|
1623
|
-
if (this.selectValuesButtonKey === 'editButton' &&
|
|
1639
|
+
if (this.selectValuesButtonKey === 'editButton' && Le(this.editButtonMessage)) {
|
|
1624
1640
|
return this.editButtonMessage;
|
|
1625
1641
|
}
|
|
1626
|
-
else if (this.selectValuesButtonKey === 'showButton' &&
|
|
1642
|
+
else if (this.selectValuesButtonKey === 'showButton' && Le(this.showButtonMessage)) {
|
|
1627
1643
|
return this.showButtonMessage;
|
|
1628
1644
|
}
|
|
1629
|
-
else if (this.selectValuesButtonKey === 'selectButton' &&
|
|
1645
|
+
else if (this.selectValuesButtonKey === 'selectButton' && Le(this.selectButtonMessage)) {
|
|
1630
1646
|
return this.selectButtonMessage;
|
|
1631
1647
|
}
|
|
1632
1648
|
else {
|
|
@@ -1682,12 +1698,12 @@ const MgInputCheckbox = class {
|
|
|
1682
1698
|
this.valueChange.emit(newValue);
|
|
1683
1699
|
}
|
|
1684
1700
|
else {
|
|
1685
|
-
throw new Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, CheckboxItem. Passed value: ${
|
|
1701
|
+
throw new Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, CheckboxItem. Passed value: ${zt(newValue)}.`);
|
|
1686
1702
|
}
|
|
1687
1703
|
}
|
|
1688
1704
|
validateType(newValue) {
|
|
1689
1705
|
if (newValue !== undefined && !checkboxTypes.includes(newValue)) {
|
|
1690
|
-
throw new Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${
|
|
1706
|
+
throw new Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${zt(newValue)}.`);
|
|
1691
1707
|
}
|
|
1692
1708
|
else if (newValue === undefined) {
|
|
1693
1709
|
this.mode = 'auto';
|
|
@@ -1787,7 +1803,7 @@ const MgInputCheckbox = class {
|
|
|
1787
1803
|
if (typeof valid !== 'boolean') {
|
|
1788
1804
|
throw new Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean.');
|
|
1789
1805
|
}
|
|
1790
|
-
else if (!
|
|
1806
|
+
else if (!Le(errorMessage)) {
|
|
1791
1807
|
throw new Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string.');
|
|
1792
1808
|
}
|
|
1793
1809
|
else {
|
|
@@ -1924,7 +1940,7 @@ const MgInputCheckbox = class {
|
|
|
1924
1940
|
else {
|
|
1925
1941
|
inputContent = this.renderCheckboxMulti();
|
|
1926
1942
|
}
|
|
1927
|
-
return (h("mg-input", { key: '
|
|
1943
|
+
return (h("mg-input", { key: 'acc005b56c767a84c6b4bcc5b29769da82d12c1e', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, tooltip: this.tooltip, tooltipPosition: this.readonly && readonlyValue.length === 0 ? 'label' : this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, inputContent));
|
|
1928
1944
|
}
|
|
1929
1945
|
get element() { return getElement(this); }
|
|
1930
1946
|
static get watchers() { return {
|
|
@@ -1940,16 +1956,27 @@ const MgInputCheckbox = class {
|
|
|
1940
1956
|
"searchValue": ["validateSearchValue"]
|
|
1941
1957
|
}; }
|
|
1942
1958
|
};
|
|
1943
|
-
MgInputCheckbox.style =
|
|
1959
|
+
MgInputCheckbox.style = mgInputCheckboxCss;
|
|
1944
1960
|
|
|
1945
1961
|
const MgInputCheckboxPaginated = class {
|
|
1946
1962
|
constructor(hostRef) {
|
|
1947
1963
|
registerInstance(this, hostRef);
|
|
1948
|
-
this.massAction = createEvent(this, "mass-action"
|
|
1964
|
+
this.massAction = createEvent(this, "mass-action");
|
|
1949
1965
|
/*************
|
|
1950
1966
|
* Constantes *
|
|
1951
1967
|
*************/
|
|
1952
1968
|
this.offset = 10;
|
|
1969
|
+
/*************
|
|
1970
|
+
* Decorators *
|
|
1971
|
+
*************/
|
|
1972
|
+
/**
|
|
1973
|
+
* Define if mg-input-checkbox-list is readonly
|
|
1974
|
+
*/
|
|
1975
|
+
this.readonly = false;
|
|
1976
|
+
/**
|
|
1977
|
+
* Define if mg-input-checkbox-list is disabled
|
|
1978
|
+
*/
|
|
1979
|
+
this.disabled = false;
|
|
1953
1980
|
/**
|
|
1954
1981
|
* Current page
|
|
1955
1982
|
*/
|
|
@@ -2036,10 +2063,10 @@ const MgInputCheckboxPaginated = class {
|
|
|
2036
2063
|
* @returns HTML Element
|
|
2037
2064
|
*/
|
|
2038
2065
|
render() {
|
|
2039
|
-
const getText = (checkboxes) => (h("em", { key: '
|
|
2066
|
+
const getText = (checkboxes) => (h("em", { key: '0bf489a95090b519c85a4649d6c3b9a0e97bf0d8', class: "mg-c-input__section-header-title-label" }, `${this.messages[checkboxes.length > 1 ? 'titlePlural' : 'title']} (${checkboxes.length})`));
|
|
2040
2067
|
const [from, to] = this.getFromToIndexes();
|
|
2041
2068
|
const itemsContainerId = `items-${this.sectionKind}-container`;
|
|
2042
|
-
return (h(Host, { key: '
|
|
2069
|
+
return (h(Host, { key: 'ee67aa1705efa2b88010748b6978e0c1dec6e4de', hidden: this.checkboxes.length < 1 }, h("div", { key: 'b713e2a0e21f57d3b238b72163f3d7a4781b7026', class: "mg-c-input__section-header" }, this.sectionKind === SectionKind.SELECTED ? (h("mg-button", { variant: "flat", onClick: this.handleToggleClick, "aria-controls": itemsContainerId, "aria-expanded": this.expanded.toString() }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down' }), h("span", { class: "mg-c-input__section-header-title" }, getText(this.checkboxes)))) : (h("p", { class: "mg-c-input__section-header-title mg-c-input__section-header-title--static" }, getText(this.checkboxes))), ((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (h("mg-tooltip", { key: 'ef75381dab8028c3da4cbcefba644770322c2e7e', class: "mg-c-input__section-header-tootlip", message: this.messages.tooltip }, h("mg-button", { key: '6e33b32300e7932f09ce1152462a3cf19e452df8', variant: "link", onClick: this.massActionHandler }, this.messages.action))), this.expanded && this.getPageCount(this.checkboxes) > 1 && (h("mg-pagination", { key: "search-pagination", totalPages: this.getPageCount(this.checkboxes), currentPage: this.currentPage, "onCurrent-page-change": this.handleCurrentPageChange, hideNavigationLabels: true, hidePageCount: true, identifier: `input-checkbox-pagination-${this.sectionKind}` }))), h("div", { key: '727ef2955d5866131e421c0809244ccc42c75dd0', hidden: !this.expanded, id: itemsContainerId, class: "mg-c-input__section-content" }, h(MgInputCheckboxList, { key: 'd26de7f05b85142df7218ad9941e4b201cfb2e01', checkboxes: this.getArrayRange(this.checkboxes, from, to), displaySearchInput: true, messages: this.messages, id: `items-${this.sectionKind}`, disabled: this.disabled, name: this.name, invalid: this.invalid }))));
|
|
2043
2070
|
}
|
|
2044
2071
|
static get watchers() { return {
|
|
2045
2072
|
"checkboxes": ["watchCheckboxes"]
|
|
@@ -2049,13 +2076,12 @@ const MgInputCheckboxPaginated = class {
|
|
|
2049
2076
|
const DEFAULT_MAX_DATE = '9999-12-31';
|
|
2050
2077
|
|
|
2051
2078
|
const mgInputDateCss = ".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__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-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}}";
|
|
2052
|
-
const MgInputDateStyle0 = mgInputDateCss;
|
|
2053
2079
|
|
|
2054
2080
|
const MgInputDate = class {
|
|
2055
2081
|
constructor(hostRef) {
|
|
2056
2082
|
registerInstance(this, hostRef);
|
|
2057
|
-
this.valueChange = createEvent(this, "value-change"
|
|
2058
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
2083
|
+
this.valueChange = createEvent(this, "value-change");
|
|
2084
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
2059
2085
|
// hasDisplayedError (triggered by blur event)
|
|
2060
2086
|
this.hasDisplayedError = false;
|
|
2061
2087
|
/**
|
|
@@ -2063,6 +2089,10 @@ const MgInputDate = class {
|
|
|
2063
2089
|
* If not set the value equals the identifier
|
|
2064
2090
|
*/
|
|
2065
2091
|
this.name = this.identifier;
|
|
2092
|
+
/**
|
|
2093
|
+
* Define if label is displayed on top
|
|
2094
|
+
*/
|
|
2095
|
+
this.labelOnTop = false;
|
|
2066
2096
|
/**
|
|
2067
2097
|
* Define if label is visible
|
|
2068
2098
|
*/
|
|
@@ -2091,13 +2121,13 @@ const MgInputDate = class {
|
|
|
2091
2121
|
/**
|
|
2092
2122
|
* Component classes
|
|
2093
2123
|
*/
|
|
2094
|
-
this.classCollection = new
|
|
2124
|
+
this.classCollection = new kt(['mg-c-input--date']);
|
|
2095
2125
|
/**
|
|
2096
2126
|
* Method to validate date pattern string
|
|
2097
2127
|
* @param value - value to test
|
|
2098
2128
|
* @returns truthy when value match the pattern
|
|
2099
2129
|
*/
|
|
2100
|
-
this.isValidPattern = (value) =>
|
|
2130
|
+
this.isValidPattern = (value) => Le(value) && wt.test(value);
|
|
2101
2131
|
/**
|
|
2102
2132
|
* Format help text to display
|
|
2103
2133
|
* @param helpText - help text format
|
|
@@ -2111,23 +2141,23 @@ const MgInputDate = class {
|
|
|
2111
2141
|
}
|
|
2112
2142
|
const defaultHelpTextVariable = '{defaultHelpText}';
|
|
2113
2143
|
// If a custom helpText is provided, store it but don't return it directly
|
|
2114
|
-
let text =
|
|
2144
|
+
let text = Le(helpText) ? helpText : this.messages.input.date.helpText.expectedFormat;
|
|
2115
2145
|
// Handle defaultHelpText
|
|
2116
2146
|
if (text.includes(defaultHelpTextVariable)) {
|
|
2117
2147
|
text = text.replace(defaultHelpTextVariable, this.formatHelpText(this.messages.input.date.helpText.expectedFormat));
|
|
2118
2148
|
}
|
|
2119
2149
|
// Replace pattern and date variables
|
|
2120
|
-
text = text.replace('{pattern}', this.renderPattern()).replace('{date}',
|
|
2150
|
+
text = text.replace('{pattern}', this.renderPattern()).replace('{date}', Et(Ht(new Date('2025-12-24')), this.systemLocale));
|
|
2121
2151
|
// Add additional message for min/max if necessary
|
|
2122
2152
|
let rangeMessage;
|
|
2123
2153
|
if (((_a = this.min) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.max !== DEFAULT_MAX_DATE) {
|
|
2124
|
-
rangeMessage = this.messages.input.date.helpText.minMax.replace('{min}',
|
|
2154
|
+
rangeMessage = this.messages.input.date.helpText.minMax.replace('{min}', Et(this.min, this.systemLocale)).replace('{max}', Et(this.max, this.systemLocale));
|
|
2125
2155
|
}
|
|
2126
2156
|
else if (((_b = this.min) === null || _b === void 0 ? void 0 : _b.length) > 0) {
|
|
2127
|
-
rangeMessage = this.messages.input.date.helpText.min.replace('{min}',
|
|
2157
|
+
rangeMessage = this.messages.input.date.helpText.min.replace('{min}', Et(this.min, this.systemLocale));
|
|
2128
2158
|
}
|
|
2129
2159
|
else if (this.max !== DEFAULT_MAX_DATE) {
|
|
2130
|
-
rangeMessage = this.messages.input.date.helpText.max.replace('{max}',
|
|
2160
|
+
rangeMessage = this.messages.input.date.helpText.max.replace('{max}', Et(this.max, this.systemLocale));
|
|
2131
2161
|
}
|
|
2132
2162
|
// Combine custom helpText with range message if both exist
|
|
2133
2163
|
if (text !== undefined && rangeMessage !== undefined) {
|
|
@@ -2224,15 +2254,15 @@ const MgInputDate = class {
|
|
|
2224
2254
|
// min, max & minMax
|
|
2225
2255
|
else if (['min', 'max', 'minMax'].includes(inputError)) {
|
|
2226
2256
|
this.errorMessage = this.messages.input.date.helpText[inputError]
|
|
2227
|
-
.replace('{min}',
|
|
2228
|
-
.replace('{max}',
|
|
2257
|
+
.replace('{min}', Et(this.min, this.systemLocale))
|
|
2258
|
+
.replace('{max}', Et(this.max, this.systemLocale));
|
|
2229
2259
|
}
|
|
2230
2260
|
// wrong date format
|
|
2231
2261
|
// element.validity.badInput is default error message
|
|
2232
2262
|
else {
|
|
2233
2263
|
this.errorMessage = this.messages.input.date.error.badInput
|
|
2234
2264
|
.replace('{pattern}', this.renderPattern())
|
|
2235
|
-
.replace('{date}',
|
|
2265
|
+
.replace('{date}', Et(Ht(new Date('2025-12-24')), this.systemLocale));
|
|
2236
2266
|
}
|
|
2237
2267
|
}
|
|
2238
2268
|
};
|
|
@@ -2241,7 +2271,7 @@ const MgInputDate = class {
|
|
|
2241
2271
|
* @returns translated html pattern
|
|
2242
2272
|
*/
|
|
2243
2273
|
this.renderPattern = () => {
|
|
2244
|
-
let patternLocal =
|
|
2274
|
+
let patternLocal = Bt(this.systemLocale);
|
|
2245
2275
|
for (const key in this.messages.input.date.pattern) {
|
|
2246
2276
|
patternLocal = patternLocal.replace(key, this.messages.input.date.pattern[key]);
|
|
2247
2277
|
}
|
|
@@ -2256,9 +2286,9 @@ const MgInputDate = class {
|
|
|
2256
2286
|
// - `undefined` is not allowed in CustomEvent['detail']
|
|
2257
2287
|
this.value = null;
|
|
2258
2288
|
}
|
|
2259
|
-
else if (newValue && !
|
|
2289
|
+
else if (newValue && !Le(newValue)) {
|
|
2260
2290
|
// check value validity
|
|
2261
|
-
throw new Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${
|
|
2291
|
+
throw new Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${zt(newValue)}.`);
|
|
2262
2292
|
}
|
|
2263
2293
|
else if (newValue === null || this.isValidPattern(newValue)) {
|
|
2264
2294
|
this.valueChange.emit(newValue);
|
|
@@ -2275,7 +2305,7 @@ const MgInputDate = class {
|
|
|
2275
2305
|
}
|
|
2276
2306
|
validateMinMax(newValue) {
|
|
2277
2307
|
if (newValue && !this.isValidPattern(newValue)) {
|
|
2278
|
-
throw new Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${
|
|
2308
|
+
throw new Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${zt(newValue)}.`);
|
|
2279
2309
|
}
|
|
2280
2310
|
}
|
|
2281
2311
|
handleValidityChange(newValue, _oldValue, prop) {
|
|
@@ -2325,7 +2355,7 @@ const MgInputDate = class {
|
|
|
2325
2355
|
if (typeof valid !== 'boolean') {
|
|
2326
2356
|
throw new Error('<mg-input-date> method "setError()" param "valid" must be a boolean.');
|
|
2327
2357
|
}
|
|
2328
|
-
else if (!
|
|
2358
|
+
else if (!Le(errorMessage)) {
|
|
2329
2359
|
throw new Error('<mg-input-date> method "setError()" param "errorMessage" must be a string.');
|
|
2330
2360
|
}
|
|
2331
2361
|
else {
|
|
@@ -2391,7 +2421,7 @@ const MgInputDate = class {
|
|
|
2391
2421
|
* @returns HTML Element
|
|
2392
2422
|
*/
|
|
2393
2423
|
render() {
|
|
2394
|
-
return (h("mg-input", { key: '
|
|
2424
|
+
return (h("mg-input", { key: 'cd165b83782c74dab134a1315edd000ea3a9277b', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === null ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, Et(this.value, this.locale))) : (h("input", { type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
|
|
2395
2425
|
if (el !== null)
|
|
2396
2426
|
this.input = el;
|
|
2397
2427
|
} }))));
|
|
@@ -2406,7 +2436,7 @@ const MgInputDate = class {
|
|
|
2406
2436
|
"disabled": ["handleValidityChange", "watchDisabled"]
|
|
2407
2437
|
}; }
|
|
2408
2438
|
};
|
|
2409
|
-
MgInputDate.style =
|
|
2439
|
+
MgInputDate.style = mgInputDateCss;
|
|
2410
2440
|
|
|
2411
2441
|
/**
|
|
2412
2442
|
* List of all possibles types
|
|
@@ -2415,13 +2445,12 @@ const types = ['decimal', 'integer'];
|
|
|
2415
2445
|
const formats = ['none', 'number', 'currency', 'percent', 'unit'];
|
|
2416
2446
|
|
|
2417
2447
|
const mgInputNumericCss = ".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__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__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-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 .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}";
|
|
2418
|
-
const MgInputNumericStyle0 = mgInputNumericCss;
|
|
2419
2448
|
|
|
2420
2449
|
const MgInputNumeric = class {
|
|
2421
2450
|
constructor(hostRef) {
|
|
2422
2451
|
registerInstance(this, hostRef);
|
|
2423
|
-
this.valueChange = createEvent(this, "value-change"
|
|
2424
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
2452
|
+
this.valueChange = createEvent(this, "value-change");
|
|
2453
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
2425
2454
|
// hasDisplayedError (triggered by blur event)
|
|
2426
2455
|
this.hasDisplayedError = false;
|
|
2427
2456
|
/**
|
|
@@ -2429,6 +2458,10 @@ const MgInputNumeric = class {
|
|
|
2429
2458
|
* If not set the value equals the identifier
|
|
2430
2459
|
*/
|
|
2431
2460
|
this.name = this.identifier;
|
|
2461
|
+
/**
|
|
2462
|
+
* Define if label is displayed on top
|
|
2463
|
+
*/
|
|
2464
|
+
this.labelOnTop = false;
|
|
2432
2465
|
/**
|
|
2433
2466
|
* Define if label is visible
|
|
2434
2467
|
*/
|
|
@@ -2479,7 +2512,7 @@ const MgInputNumeric = class {
|
|
|
2479
2512
|
/**
|
|
2480
2513
|
* Component classes
|
|
2481
2514
|
*/
|
|
2482
|
-
this.classCollection = new
|
|
2515
|
+
this.classCollection = new kt(['mg-c-input--numeric']);
|
|
2483
2516
|
/**
|
|
2484
2517
|
* Handle input event
|
|
2485
2518
|
*/
|
|
@@ -2522,7 +2555,7 @@ const MgInputNumeric = class {
|
|
|
2522
2555
|
* @param value - value to format
|
|
2523
2556
|
* @returns formatted value according to locale
|
|
2524
2557
|
*/
|
|
2525
|
-
this.formatErrorValue = (value) =>
|
|
2558
|
+
this.formatErrorValue = (value) => Gt(value, this.locale, !Number.isInteger(value) && this.type === 'decimal' ? this.decimalLength : 0);
|
|
2526
2559
|
/**
|
|
2527
2560
|
* Set input error message
|
|
2528
2561
|
* @param errorMessage - errorMessage override
|
|
@@ -2577,13 +2610,13 @@ const MgInputNumeric = class {
|
|
|
2577
2610
|
this.formatValue = (value) => {
|
|
2578
2611
|
switch (this.format) {
|
|
2579
2612
|
case 'number':
|
|
2580
|
-
return
|
|
2613
|
+
return Gt(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
|
|
2581
2614
|
case 'currency':
|
|
2582
|
-
return
|
|
2615
|
+
return Pt(value, this.locale, this.currency);
|
|
2583
2616
|
case 'percent':
|
|
2584
|
-
return
|
|
2617
|
+
return Wt(value / 100, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
|
|
2585
2618
|
case 'unit':
|
|
2586
|
-
return
|
|
2619
|
+
return Xt(value, this.locale, this.unit, this.unitDisplay, this.type === 'decimal' ? this.decimalLength : undefined);
|
|
2587
2620
|
case 'none':
|
|
2588
2621
|
return value.toString();
|
|
2589
2622
|
}
|
|
@@ -2614,7 +2647,7 @@ const MgInputNumeric = class {
|
|
|
2614
2647
|
return undefined;
|
|
2615
2648
|
}
|
|
2616
2649
|
// If a custom helpText is provided, store it but don't return it directly
|
|
2617
|
-
const text =
|
|
2650
|
+
const text = Le(helpText) ? helpText : undefined;
|
|
2618
2651
|
// If neither min nor max are defined, and there's no custom helpText,
|
|
2619
2652
|
// we can return undefined as there's no message to display
|
|
2620
2653
|
if (this.min === undefined && this.max === undefined && text === undefined) {
|
|
@@ -2698,22 +2731,22 @@ const MgInputNumeric = class {
|
|
|
2698
2731
|
}
|
|
2699
2732
|
validateType(newValue) {
|
|
2700
2733
|
if (!types.includes(newValue)) {
|
|
2701
|
-
throw new Error(`<mg-input-numeric> prop "type" must be one of: ${types.join(', ')}. Passed value: ${
|
|
2734
|
+
throw new Error(`<mg-input-numeric> prop "type" must be one of: ${types.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
2702
2735
|
}
|
|
2703
2736
|
}
|
|
2704
2737
|
watchFormat(newValue) {
|
|
2705
2738
|
if (!formats.includes(newValue)) {
|
|
2706
|
-
throw new Error(`<mg-input-numeric> prop "format" must be one of: ${formats.join(', ')}. Passed value: ${
|
|
2739
|
+
throw new Error(`<mg-input-numeric> prop "format" must be one of: ${formats.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
2707
2740
|
}
|
|
2708
2741
|
}
|
|
2709
2742
|
validateIntegerLength(newValue) {
|
|
2710
2743
|
if (newValue < 1) {
|
|
2711
|
-
throw new Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${
|
|
2744
|
+
throw new Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${zt(newValue)}.`);
|
|
2712
2745
|
}
|
|
2713
2746
|
}
|
|
2714
2747
|
validateDecimalLength(newValue) {
|
|
2715
2748
|
if (newValue < 1) {
|
|
2716
|
-
throw new Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${
|
|
2749
|
+
throw new Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${zt(newValue)}.`);
|
|
2717
2750
|
}
|
|
2718
2751
|
}
|
|
2719
2752
|
/**
|
|
@@ -2747,7 +2780,7 @@ const MgInputNumeric = class {
|
|
|
2747
2780
|
if (typeof valid !== 'boolean') {
|
|
2748
2781
|
throw new Error('<mg-input-numeric> method "setError()" param "valid" must be a boolean.');
|
|
2749
2782
|
}
|
|
2750
|
-
else if (!
|
|
2783
|
+
else if (!Le(errorMessage)) {
|
|
2751
2784
|
throw new Error('<mg-input-numeric> method "setError()" param "errorMessage" must be a string.');
|
|
2752
2785
|
}
|
|
2753
2786
|
else {
|
|
@@ -2848,7 +2881,7 @@ const MgInputNumeric = class {
|
|
|
2848
2881
|
* @returns HTML Element
|
|
2849
2882
|
*/
|
|
2850
2883
|
render() {
|
|
2851
|
-
return (h("mg-input", { key: '
|
|
2884
|
+
return (h("mg-input", { key: '323e6dcdd6c2c416bfcbfa868f0fd685880f45be', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly
|
|
2852
2885
|
? this.readonlyValue && this.renderReadonly()
|
|
2853
2886
|
: [
|
|
2854
2887
|
h("input", { key: "input", type: "text", class: "mg-c-input__box mg-c-input__box--width", value: this.displayValue(), id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: "off", "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, ref: (el) => {
|
|
@@ -2873,16 +2906,15 @@ const MgInputNumeric = class {
|
|
|
2873
2906
|
"decimalLength": ["validateDecimalLength"]
|
|
2874
2907
|
}; }
|
|
2875
2908
|
};
|
|
2876
|
-
MgInputNumeric.style =
|
|
2909
|
+
MgInputNumeric.style = mgInputNumericCss;
|
|
2877
2910
|
|
|
2878
2911
|
const mgInputPasswordCss = ".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__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__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-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.mg-c-input--password .mg-c-input__input-icon{color:var(--mg-b-color-dark)}.mg-c-input.mg-c-input--password .mg-c-input__input-group{position:relative;flex-grow:1}.mg-c-input.mg-c-input--password .mg-c-input__append-button{position:absolute;right:0}.mg-c-input.mg-c-input--password .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-8))}.mg-c-input.mg-c-input--password .mg-c-input__box::-ms-reveal{display:none}";
|
|
2879
|
-
const MgInputPasswordStyle0 = mgInputPasswordCss;
|
|
2880
2912
|
|
|
2881
2913
|
const MgInputPassword = class {
|
|
2882
2914
|
constructor(hostRef) {
|
|
2883
2915
|
registerInstance(this, hostRef);
|
|
2884
|
-
this.valueChange = createEvent(this, "value-change"
|
|
2885
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
2916
|
+
this.valueChange = createEvent(this, "value-change");
|
|
2917
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
2886
2918
|
// hasDisplayedError (triggered by blur event)
|
|
2887
2919
|
this.hasDisplayedError = false;
|
|
2888
2920
|
/**
|
|
@@ -2890,6 +2922,10 @@ const MgInputPassword = class {
|
|
|
2890
2922
|
* If not set the value equals the identifier
|
|
2891
2923
|
*/
|
|
2892
2924
|
this.name = this.identifier;
|
|
2925
|
+
/**
|
|
2926
|
+
* Define if label is displayed on top
|
|
2927
|
+
*/
|
|
2928
|
+
this.labelOnTop = false;
|
|
2893
2929
|
/**
|
|
2894
2930
|
* Define if label is visible
|
|
2895
2931
|
*/
|
|
@@ -2917,7 +2953,7 @@ const MgInputPassword = class {
|
|
|
2917
2953
|
/**
|
|
2918
2954
|
* Component classes
|
|
2919
2955
|
*/
|
|
2920
|
-
this.classCollection = new
|
|
2956
|
+
this.classCollection = new kt(['mg-c-input--password']);
|
|
2921
2957
|
/**
|
|
2922
2958
|
* Indicates if password is displayed or not
|
|
2923
2959
|
*/
|
|
@@ -3037,7 +3073,7 @@ const MgInputPassword = class {
|
|
|
3037
3073
|
if (typeof valid !== 'boolean') {
|
|
3038
3074
|
throw new Error('<mg-input-password> method "setError()" param "valid" must be a boolean.');
|
|
3039
3075
|
}
|
|
3040
|
-
else if (!
|
|
3076
|
+
else if (!Le(errorMessage)) {
|
|
3041
3077
|
throw new Error('<mg-input-password> method "setError()" param "errorMessage" must be a string.');
|
|
3042
3078
|
}
|
|
3043
3079
|
else {
|
|
@@ -3094,7 +3130,7 @@ const MgInputPassword = class {
|
|
|
3094
3130
|
* @returns HTML Element
|
|
3095
3131
|
*/
|
|
3096
3132
|
render() {
|
|
3097
|
-
return (h("mg-input", { key: '
|
|
3133
|
+
return (h("mg-input", { key: '7ee11e7f8788011f24bee13f379c6c07766ee37f', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], 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 !== undefined && h("b", { class: "mg-c-input__readonly-value" }, '•'.repeat(this.value.length))) : (h("span", { class: "mg-c-input__input-group" }, h("input", { type: this.displayPassword ? 'text' : 'password', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, maxlength: this.maxlength, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
|
|
3098
3134
|
if (el !== null)
|
|
3099
3135
|
this.input = el;
|
|
3100
3136
|
} }), h("mg-button", { label: this.messages.input.password[this.displayPassword ? 'hide' : 'display'], disabled: this.disabled, variant: "flat", class: "mg-c-input__append-button", "is-icon": true, onClick: this.toggleDisplayPassword, "aria-controls": this.identifier }, h("mg-icon", { class: "mg-c-input__input-icon", icon: this.displayPassword ? 'eye-slash' : 'eye' }))))));
|
|
@@ -3108,10 +3144,9 @@ const MgInputPassword = class {
|
|
|
3108
3144
|
"mgWidth": ["watchMgWidth"]
|
|
3109
3145
|
}; }
|
|
3110
3146
|
};
|
|
3111
|
-
MgInputPassword.style =
|
|
3147
|
+
MgInputPassword.style = mgInputPasswordCss;
|
|
3112
3148
|
|
|
3113
3149
|
const mgInputRadioCss = ".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--fieldset{padding:0;border:0;margin-right:0;margin-left:0}.mg-c-input.mg-c-input--fieldset input[type=radio],.mg-c-input.mg-c-input--fieldset input[type=checkbox]{width:var(--mg-c-input-check-size);height:var(--mg-c-input-check-size);flex-shrink:0;margin:calc((var(--mg-b-font-size)*var(--mg-b-line-height) - var(--mg-c-input-check-size))/2) var(--mg-b-size-8) 0 0}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group{display:flex;align-items:start}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);gap:var(--mg-b-size-12) var(--mg-b-size-24);list-style:none}.mg-c-input.mg-c-input--fieldset .mg-c-input__input-group.mg-c-input__input-group--disabled label{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--fieldset.mg-c-input--vertical-list .mg-c-input__input-group-container,.mg-c-input.mg-c-input--fieldset.mg-c-input--checkbox-multi .mg-c-input__input-group-container{flex-direction:column}.mg-c-input.mg-c-input--fieldset.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:var(--mg-b-size-8)}.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}}";
|
|
3114
|
-
const MgInputRadioStyle0 = mgInputRadioCss;
|
|
3115
3150
|
|
|
3116
3151
|
/**
|
|
3117
3152
|
* type Option validation function
|
|
@@ -3122,8 +3157,8 @@ const isOption$3 = (option) => typeof option === 'object' && typeof option.title
|
|
|
3122
3157
|
const MgInputRadio = class {
|
|
3123
3158
|
constructor(hostRef) {
|
|
3124
3159
|
registerInstance(this, hostRef);
|
|
3125
|
-
this.valueChange = createEvent(this, "value-change"
|
|
3126
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
3160
|
+
this.valueChange = createEvent(this, "value-change");
|
|
3161
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
3127
3162
|
/************
|
|
3128
3163
|
* Internal *
|
|
3129
3164
|
************/
|
|
@@ -3169,7 +3204,7 @@ const MgInputRadio = class {
|
|
|
3169
3204
|
/**
|
|
3170
3205
|
* Component classes
|
|
3171
3206
|
*/
|
|
3172
|
-
this.classCollection = new
|
|
3207
|
+
this.classCollection = new kt(['mg-c-input--radio', classFieldset]);
|
|
3173
3208
|
/**
|
|
3174
3209
|
* Handle input event
|
|
3175
3210
|
* @param event - input event
|
|
@@ -3220,7 +3255,7 @@ const MgInputRadio = class {
|
|
|
3220
3255
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3221
3256
|
watchValue(newValue) {
|
|
3222
3257
|
var _a;
|
|
3223
|
-
if (
|
|
3258
|
+
if (At(this.items) && typeof newValue === 'string') {
|
|
3224
3259
|
this.readonlyValue = newValue;
|
|
3225
3260
|
}
|
|
3226
3261
|
else if (Array.isArray(this.items) && this.items.every(isOption$3)) {
|
|
@@ -3234,10 +3269,10 @@ const MgInputRadio = class {
|
|
|
3234
3269
|
validateItems(newValue) {
|
|
3235
3270
|
// Validate if items have required min length
|
|
3236
3271
|
if (typeof newValue === 'object' && newValue.length < 2) {
|
|
3237
|
-
throw new Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${
|
|
3272
|
+
throw new Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${zt(newValue)}.`);
|
|
3238
3273
|
}
|
|
3239
3274
|
// String array
|
|
3240
|
-
else if (
|
|
3275
|
+
else if (At(newValue)) {
|
|
3241
3276
|
this.options = newValue.map(item => ({ title: item, value: item, disabled: this.disabled }));
|
|
3242
3277
|
}
|
|
3243
3278
|
// Object array
|
|
@@ -3245,7 +3280,7 @@ const MgInputRadio = class {
|
|
|
3245
3280
|
this.options = newValue;
|
|
3246
3281
|
}
|
|
3247
3282
|
else {
|
|
3248
|
-
throw new Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${
|
|
3283
|
+
throw new Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${zt(newValue)}.`);
|
|
3249
3284
|
}
|
|
3250
3285
|
}
|
|
3251
3286
|
watchInputVerticalList(newValue) {
|
|
@@ -3307,7 +3342,7 @@ const MgInputRadio = class {
|
|
|
3307
3342
|
if (typeof valid !== 'boolean') {
|
|
3308
3343
|
throw new Error('<mg-input-radio> method "setError()" param "valid" must be a boolean.');
|
|
3309
3344
|
}
|
|
3310
|
-
else if (!
|
|
3345
|
+
else if (!Le(errorMessage)) {
|
|
3311
3346
|
throw new Error('<mg-input-radio> method "setError()" param "errorMessage" must be a string.');
|
|
3312
3347
|
}
|
|
3313
3348
|
else {
|
|
@@ -3382,10 +3417,9 @@ const MgInputRadio = class {
|
|
|
3382
3417
|
"disabled": ["handleValidityChange", "watchDisabled"]
|
|
3383
3418
|
}; }
|
|
3384
3419
|
};
|
|
3385
|
-
MgInputRadio.style =
|
|
3420
|
+
MgInputRadio.style = mgInputRadioCss;
|
|
3386
3421
|
|
|
3387
3422
|
const mgInputSelectCss = ".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__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__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-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__box{padding-top:0;padding-right:var(--mg-b-size-8);padding-bottom:0}@media screen and (max-width: 767px){.mg-c-input__box{width:100%}}";
|
|
3388
|
-
const MgInputSelectStyle0 = mgInputSelectCss;
|
|
3389
3423
|
|
|
3390
3424
|
/**
|
|
3391
3425
|
* Check if item is a well configured option
|
|
@@ -3432,8 +3466,8 @@ const groupOptions = (acc, { group, title, value, disabled }) => {
|
|
|
3432
3466
|
const MgInputSelect = class {
|
|
3433
3467
|
constructor(hostRef) {
|
|
3434
3468
|
registerInstance(this, hostRef);
|
|
3435
|
-
this.valueChange = createEvent(this, "value-change"
|
|
3436
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
3469
|
+
this.valueChange = createEvent(this, "value-change");
|
|
3470
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
3437
3471
|
// hasDisplayedError (triggered by blur event)
|
|
3438
3472
|
this.hasDisplayedError = false;
|
|
3439
3473
|
/**
|
|
@@ -3441,6 +3475,10 @@ const MgInputSelect = class {
|
|
|
3441
3475
|
* If not set the value equals the identifier
|
|
3442
3476
|
*/
|
|
3443
3477
|
this.name = this.identifier;
|
|
3478
|
+
/**
|
|
3479
|
+
* Define if label is displayed on top
|
|
3480
|
+
*/
|
|
3481
|
+
this.labelOnTop = false;
|
|
3444
3482
|
/**
|
|
3445
3483
|
* Define if label is visible
|
|
3446
3484
|
*/
|
|
@@ -3472,7 +3510,7 @@ const MgInputSelect = class {
|
|
|
3472
3510
|
/**
|
|
3473
3511
|
* Component classes
|
|
3474
3512
|
*/
|
|
3475
|
-
this.classCollection = new
|
|
3513
|
+
this.classCollection = new kt(['mg-c-input--select']);
|
|
3476
3514
|
/**
|
|
3477
3515
|
* Handle input event
|
|
3478
3516
|
*/
|
|
@@ -3502,7 +3540,7 @@ const MgInputSelect = class {
|
|
|
3502
3540
|
if (this.input.value === '') {
|
|
3503
3541
|
this.setValue(null);
|
|
3504
3542
|
}
|
|
3505
|
-
else if (
|
|
3543
|
+
else if (At(this.items) && this.items.includes(this.input.value)) {
|
|
3506
3544
|
this.setValue(this.input.value);
|
|
3507
3545
|
}
|
|
3508
3546
|
else if (allItemsAreOptions(this.items) && typeof this.input.value === 'string' && this.items.some(this.isInputValue)) {
|
|
@@ -3560,7 +3598,7 @@ const MgInputSelect = class {
|
|
|
3560
3598
|
}
|
|
3561
3599
|
validateValue(newValue) {
|
|
3562
3600
|
var _a, _b;
|
|
3563
|
-
if (
|
|
3601
|
+
if (At(this.items) && typeof newValue === 'string') {
|
|
3564
3602
|
this.readonlyValue = ((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) !== undefined ? this.input.value : newValue;
|
|
3565
3603
|
}
|
|
3566
3604
|
else if (allItemsAreOptions(this.items)) {
|
|
@@ -3577,7 +3615,7 @@ const MgInputSelect = class {
|
|
|
3577
3615
|
this.options = [];
|
|
3578
3616
|
}
|
|
3579
3617
|
// String array
|
|
3580
|
-
else if (
|
|
3618
|
+
else if (At(newValue)) {
|
|
3581
3619
|
if (typeof this.value === 'string')
|
|
3582
3620
|
this.valueExist = newValue.includes(this.value);
|
|
3583
3621
|
this.options = newValue.map(item => ({ title: item, value: item }));
|
|
@@ -3595,7 +3633,7 @@ const MgInputSelect = class {
|
|
|
3595
3633
|
}
|
|
3596
3634
|
}
|
|
3597
3635
|
else {
|
|
3598
|
-
throw new Error(`<mg-input-select> prop "items" is required, can be an empty Array or all items must be the same type: string or Option. Passed value: ${
|
|
3636
|
+
throw new Error(`<mg-input-select> prop "items" is required, can be an empty Array or all items must be the same type: string or Option. Passed value: ${zt(newValue)}.`);
|
|
3599
3637
|
}
|
|
3600
3638
|
}
|
|
3601
3639
|
watchReadonly(newValue) {
|
|
@@ -3660,7 +3698,7 @@ const MgInputSelect = class {
|
|
|
3660
3698
|
if (typeof valid !== 'boolean') {
|
|
3661
3699
|
throw new Error('<mg-input-select> method "setError()" param "valid" must be a boolean.');
|
|
3662
3700
|
}
|
|
3663
|
-
else if (!
|
|
3701
|
+
else if (!Le(errorMessage)) {
|
|
3664
3702
|
throw new Error('<mg-input-select> method "setError()" param "errorMessage" must be a string.');
|
|
3665
3703
|
}
|
|
3666
3704
|
else {
|
|
@@ -3724,7 +3762,7 @@ const MgInputSelect = class {
|
|
|
3724
3762
|
* @returns HTML Element
|
|
3725
3763
|
*/
|
|
3726
3764
|
render() {
|
|
3727
|
-
return (h("mg-input", { key: '
|
|
3765
|
+
return (h("mg-input", { key: '29773c7b59849212a3ab91b3ec1b7070e9c22a66', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.readonlyValue === null ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("select", { class: "mg-c-input__box", id: this.identifier, name: this.name, title: this.placeholder, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
|
|
3728
3766
|
if (el !== null)
|
|
3729
3767
|
this.input = el;
|
|
3730
3768
|
} }, (!this.placeholderHide || !this.valueExist) && ( // In case passed value does not match any option we display the placeholder
|
|
@@ -3740,7 +3778,7 @@ const MgInputSelect = class {
|
|
|
3740
3778
|
"mgWidth": ["watchMgWidth"]
|
|
3741
3779
|
}; }
|
|
3742
3780
|
};
|
|
3743
|
-
MgInputSelect.style =
|
|
3781
|
+
MgInputSelect.style = mgInputSelectCss;
|
|
3744
3782
|
|
|
3745
3783
|
/**
|
|
3746
3784
|
* TextType from text types
|
|
@@ -3751,7 +3789,6 @@ const helpTextTypes = ['email', 'emails', 'url'];
|
|
|
3751
3789
|
const textTypes = ['text', 'search', 'tel', ...helpTextTypes];
|
|
3752
3790
|
|
|
3753
3791
|
const mgInputTextCss = ".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__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}.mg-c-input.mg-c-input--readonly b{min-height:var(--mg-b-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon{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{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}";
|
|
3754
|
-
const MgInputTextStyle0 = mgInputTextCss;
|
|
3755
3792
|
|
|
3756
3793
|
/**
|
|
3757
3794
|
* Check if object is an option
|
|
@@ -3764,12 +3801,12 @@ const isOption$1 = (option) => typeof option === 'object' && typeof option.title
|
|
|
3764
3801
|
* @param options - Datalist options to check.
|
|
3765
3802
|
* @returns True if datalist is well structured.
|
|
3766
3803
|
*/
|
|
3767
|
-
const isDatalistOptions = (options) =>
|
|
3804
|
+
const isDatalistOptions = (options) => At(options) || (Array.isArray(options) && options.every(isOption$1));
|
|
3768
3805
|
const MgInputText = class {
|
|
3769
3806
|
constructor(hostRef) {
|
|
3770
3807
|
registerInstance(this, hostRef);
|
|
3771
|
-
this.valueChange = createEvent(this, "value-change"
|
|
3772
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
3808
|
+
this.valueChange = createEvent(this, "value-change");
|
|
3809
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
3773
3810
|
/************
|
|
3774
3811
|
* Internal *
|
|
3775
3812
|
************/
|
|
@@ -3787,13 +3824,17 @@ const MgInputText = class {
|
|
|
3787
3824
|
*/
|
|
3788
3825
|
this.name = this.identifier;
|
|
3789
3826
|
/**
|
|
3790
|
-
*
|
|
3827
|
+
* Define if label is displayed on top
|
|
3791
3828
|
*/
|
|
3792
|
-
this.
|
|
3829
|
+
this.labelOnTop = false;
|
|
3793
3830
|
/**
|
|
3794
3831
|
* Define if label is visible
|
|
3795
3832
|
*/
|
|
3796
3833
|
this.labelHide = false;
|
|
3834
|
+
/**
|
|
3835
|
+
* Input type
|
|
3836
|
+
*/
|
|
3837
|
+
this.type = 'text';
|
|
3797
3838
|
/**
|
|
3798
3839
|
* Input max length
|
|
3799
3840
|
*/
|
|
@@ -3825,13 +3866,13 @@ const MgInputText = class {
|
|
|
3825
3866
|
/**
|
|
3826
3867
|
* Component classes
|
|
3827
3868
|
*/
|
|
3828
|
-
this.classCollection = new
|
|
3869
|
+
this.classCollection = new kt(['mg-c-input--text']);
|
|
3829
3870
|
/**
|
|
3830
3871
|
* Validate pattern configuration
|
|
3831
3872
|
*/
|
|
3832
3873
|
this.validatePattern = () => {
|
|
3833
3874
|
if ((this.pattern !== undefined || this.patternErrorMessage !== undefined) && // At least one is defined
|
|
3834
|
-
(!
|
|
3875
|
+
(!Le(this.pattern) || (!helpTextTypes.includes(this.type) && !Le(this.patternErrorMessage))) // Both must be defined
|
|
3835
3876
|
) {
|
|
3836
3877
|
throw new Error(`<mg-input-text> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${this.pattern}'" and "patternErrorMessage='${this.patternErrorMessage}'".`);
|
|
3837
3878
|
}
|
|
@@ -3851,7 +3892,7 @@ const MgInputText = class {
|
|
|
3851
3892
|
*/
|
|
3852
3893
|
this.handleFocus = () => {
|
|
3853
3894
|
this.classCollection.add(this.classFocus);
|
|
3854
|
-
this.classCollection = new
|
|
3895
|
+
this.classCollection = new kt(this.classCollection.classes);
|
|
3855
3896
|
};
|
|
3856
3897
|
/**
|
|
3857
3898
|
* Handle blur event
|
|
@@ -3859,7 +3900,7 @@ const MgInputText = class {
|
|
|
3859
3900
|
this.handleBlur = () => {
|
|
3860
3901
|
// Manage focus
|
|
3861
3902
|
this.classCollection.delete(this.classFocus);
|
|
3862
|
-
this.classCollection = new
|
|
3903
|
+
this.classCollection = new kt(this.classCollection.classes);
|
|
3863
3904
|
// Display Error
|
|
3864
3905
|
this.handlerInProgress = 'blur';
|
|
3865
3906
|
this.displayError().finally(() => {
|
|
@@ -3887,11 +3928,11 @@ const MgInputText = class {
|
|
|
3887
3928
|
}
|
|
3888
3929
|
// Does not match type (email, emails, tel, url, etc.)
|
|
3889
3930
|
else if (!this.valid && this.input.validity.typeMismatch) {
|
|
3890
|
-
this.errorMessage =
|
|
3931
|
+
this.errorMessage = this.messages.input.text.errors.typeMismatch[this.type];
|
|
3891
3932
|
}
|
|
3892
3933
|
// Does not match pattern
|
|
3893
3934
|
else if (!this.valid && this.input.validity.patternMismatch) {
|
|
3894
|
-
this.errorMessage = (_a = this.patternErrorMessage) !== null && _a !== void 0 ? _a :
|
|
3935
|
+
this.errorMessage = (_a = this.patternErrorMessage) !== null && _a !== void 0 ? _a : this.messages.input.text.errors.typeMismatch[this.type];
|
|
3895
3936
|
}
|
|
3896
3937
|
// required
|
|
3897
3938
|
else if (!this.valid && this.input.validity.valueMissing) {
|
|
@@ -3954,7 +3995,7 @@ const MgInputText = class {
|
|
|
3954
3995
|
}
|
|
3955
3996
|
validateDatalistoptions(newValue) {
|
|
3956
3997
|
if (Boolean(newValue) && !isDatalistOptions(newValue)) {
|
|
3957
|
-
throw new Error(`<mg-input-text> prop "datalistoptions" values must be the same type, string or OptionType. Passed value: ${
|
|
3998
|
+
throw new Error(`<mg-input-text> prop "datalistoptions" values must be the same type, string or OptionType. Passed value: ${zt(newValue)}.`);
|
|
3958
3999
|
}
|
|
3959
4000
|
}
|
|
3960
4001
|
watchReadonly(newValue) {
|
|
@@ -3992,7 +4033,7 @@ const MgInputText = class {
|
|
|
3992
4033
|
this.validatePattern();
|
|
3993
4034
|
}
|
|
3994
4035
|
watchHelpText(newValue) {
|
|
3995
|
-
if (!
|
|
4036
|
+
if (!Le(newValue) && helpTextTypes.includes(this.type)) {
|
|
3996
4037
|
this.helpText = this.messages.input.text.helpText[this.type];
|
|
3997
4038
|
}
|
|
3998
4039
|
}
|
|
@@ -4033,7 +4074,7 @@ const MgInputText = class {
|
|
|
4033
4074
|
if (typeof valid !== 'boolean') {
|
|
4034
4075
|
throw new Error('<mg-input-text> method "setError()" param "valid" must be a boolean.');
|
|
4035
4076
|
}
|
|
4036
|
-
else if (!
|
|
4077
|
+
else if (!Le(errorMessage)) {
|
|
4037
4078
|
throw new Error('<mg-input-text> method "setError()" param "errorMessage" must be a string.');
|
|
4038
4079
|
}
|
|
4039
4080
|
else {
|
|
@@ -4099,7 +4140,7 @@ const MgInputText = class {
|
|
|
4099
4140
|
* @returns HTML Element
|
|
4100
4141
|
*/
|
|
4101
4142
|
render() {
|
|
4102
|
-
return (h("mg-input", { key: '
|
|
4143
|
+
return (h("mg-input", { key: 'ee11d031a4bb2be299f594fee631be8fd1ef33e5', 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
|
|
4103
4144
|
? this.value && this.renderReadonly()
|
|
4104
4145
|
: [
|
|
4105
4146
|
h("div", { key: "input", class: "mg-c-input__with-character-left", style: {
|
|
@@ -4126,16 +4167,15 @@ const MgInputText = class {
|
|
|
4126
4167
|
"helpText": ["watchHelpText"]
|
|
4127
4168
|
}; }
|
|
4128
4169
|
};
|
|
4129
|
-
MgInputText.style =
|
|
4170
|
+
MgInputText.style = mgInputTextCss;
|
|
4130
4171
|
|
|
4131
4172
|
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}}";
|
|
4132
|
-
const MgInputTextareaStyle0 = mgInputTextareaCss;
|
|
4133
4173
|
|
|
4134
4174
|
const MgInputTextarea = class {
|
|
4135
4175
|
constructor(hostRef) {
|
|
4136
4176
|
registerInstance(this, hostRef);
|
|
4137
|
-
this.valueChange = createEvent(this, "value-change"
|
|
4138
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
4177
|
+
this.valueChange = createEvent(this, "value-change");
|
|
4178
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
4139
4179
|
/************
|
|
4140
4180
|
* Internal *
|
|
4141
4181
|
************/
|
|
@@ -4149,6 +4189,10 @@ const MgInputTextarea = class {
|
|
|
4149
4189
|
* If not set the value equals the identifier
|
|
4150
4190
|
*/
|
|
4151
4191
|
this.name = this.identifier;
|
|
4192
|
+
/**
|
|
4193
|
+
* Define if label is displayed on top
|
|
4194
|
+
*/
|
|
4195
|
+
this.labelOnTop = false;
|
|
4152
4196
|
/**
|
|
4153
4197
|
* Define if label is visible
|
|
4154
4198
|
*/
|
|
@@ -4192,7 +4236,7 @@ const MgInputTextarea = class {
|
|
|
4192
4236
|
/**
|
|
4193
4237
|
* Component classes
|
|
4194
4238
|
*/
|
|
4195
|
-
this.classCollection = new
|
|
4239
|
+
this.classCollection = new kt(['mg-c-input--textarea']);
|
|
4196
4240
|
/**
|
|
4197
4241
|
* Handle input event
|
|
4198
4242
|
*/
|
|
@@ -4208,7 +4252,7 @@ const MgInputTextarea = class {
|
|
|
4208
4252
|
*/
|
|
4209
4253
|
this.handleFocus = () => {
|
|
4210
4254
|
this.classCollection.add(this.classFocus);
|
|
4211
|
-
this.classCollection = new
|
|
4255
|
+
this.classCollection = new kt(this.classCollection.classes);
|
|
4212
4256
|
};
|
|
4213
4257
|
/**
|
|
4214
4258
|
* Handle blur event
|
|
@@ -4216,7 +4260,7 @@ const MgInputTextarea = class {
|
|
|
4216
4260
|
this.handleBlur = () => {
|
|
4217
4261
|
// Manage focus
|
|
4218
4262
|
this.classCollection.delete(this.classFocus);
|
|
4219
|
-
this.classCollection = new
|
|
4263
|
+
this.classCollection = new kt(this.classCollection.classes);
|
|
4220
4264
|
// Display Error
|
|
4221
4265
|
this.handlerInProgress = 'blur';
|
|
4222
4266
|
this.displayError().finally(() => {
|
|
@@ -4294,8 +4338,8 @@ const MgInputTextarea = class {
|
|
|
4294
4338
|
this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
|
|
4295
4339
|
}
|
|
4296
4340
|
validatePattern(newValue) {
|
|
4297
|
-
if (newValue !== undefined && !(
|
|
4298
|
-
throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${
|
|
4341
|
+
if (newValue !== undefined && !(Le(this.pattern) && Le(this.patternErrorMessage))) {
|
|
4342
|
+
throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${zt(this.pattern)}'" and "patternErrorMessage='${zt(this.patternErrorMessage)}'".`);
|
|
4299
4343
|
}
|
|
4300
4344
|
}
|
|
4301
4345
|
validatecharacterLeftHide(newValue) {
|
|
@@ -4337,7 +4381,7 @@ const MgInputTextarea = class {
|
|
|
4337
4381
|
if (typeof valid !== 'boolean') {
|
|
4338
4382
|
throw new Error('<mg-input-textarea> method "setError()" param "valid" must be a boolean.');
|
|
4339
4383
|
}
|
|
4340
|
-
else if (!
|
|
4384
|
+
else if (!Le(errorMessage)) {
|
|
4341
4385
|
throw new Error('<mg-input-textarea> method "setError()" param "errorMessage" must be a string.');
|
|
4342
4386
|
}
|
|
4343
4387
|
else {
|
|
@@ -4399,7 +4443,7 @@ const MgInputTextarea = class {
|
|
|
4399
4443
|
* @returns HTML Element
|
|
4400
4444
|
*/
|
|
4401
4445
|
render() {
|
|
4402
|
-
return (h("mg-input", { key: '
|
|
4446
|
+
return (h("mg-input", { key: 'e7cc627386b7e46fdcb52758a525a729e55d572b', 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: {
|
|
4403
4447
|
'mg-c-input__box': true,
|
|
4404
4448
|
'mg-c-input__box--width': true,
|
|
4405
4449
|
'mg-c-input__box--resizable': this.resizable === 'both',
|
|
@@ -4422,10 +4466,9 @@ const MgInputTextarea = class {
|
|
|
4422
4466
|
"characterLeftHide": ["validatecharacterLeftHide"]
|
|
4423
4467
|
}; }
|
|
4424
4468
|
};
|
|
4425
|
-
MgInputTextarea.style =
|
|
4469
|
+
MgInputTextarea.style = mgInputTextareaCss;
|
|
4426
4470
|
|
|
4427
4471
|
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)}";
|
|
4428
|
-
const MgInputTitleStyle0 = mgInputTitleCss;
|
|
4429
4472
|
|
|
4430
4473
|
const MgInputTitle = class {
|
|
4431
4474
|
constructor(hostRef) {
|
|
@@ -4440,11 +4483,11 @@ const MgInputTitle = class {
|
|
|
4440
4483
|
this.tagName = 'label';
|
|
4441
4484
|
}
|
|
4442
4485
|
validateIdentifier(newValue) {
|
|
4443
|
-
if (!
|
|
4486
|
+
if (!Le(newValue)) {
|
|
4444
4487
|
throw new Error('<mg-input-title> prop "identifier" is required.');
|
|
4445
4488
|
}
|
|
4446
|
-
else if (!
|
|
4447
|
-
console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${
|
|
4489
|
+
else if (!Ot(newValue)) {
|
|
4490
|
+
console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
4448
4491
|
}
|
|
4449
4492
|
}
|
|
4450
4493
|
validateIsLegend(newValue) {
|
|
@@ -4474,10 +4517,9 @@ const MgInputTitle = class {
|
|
|
4474
4517
|
"isLegend": ["validateIsLegend"]
|
|
4475
4518
|
}; }
|
|
4476
4519
|
};
|
|
4477
|
-
MgInputTitle.style =
|
|
4520
|
+
MgInputTitle.style = mgInputTitleCss;
|
|
4478
4521
|
|
|
4479
4522
|
const mgInputToggleCss = ".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-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__toggle-item-container{overflow:hidden;box-sizing:border-box;padding:var(--mg-b-size-4) var(--mg-b-size-8);border:0;border-radius:calc((var(--mg-b-font-size)*var(--mg-b-line-height) + 2*var(--mg-b-size-4))/var(--mg-c-input-toggle-border-radius-ratio));background-color:unset;color:var(--mg-b-color-dark);font-weight:unset;text-overflow:ellipsis;white-space:nowrap}.mg-c-input__toggle-item-container:first-of-type{background-color:color-mix(in srgb, var(--mg-b-color-app), white 80%);color:var(--mg-b-color-app);font-weight:600}.mg-c-input__button-toggle{display:flex;min-width:0;padding:var(--mg-b-size-4);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:calc((var(--mg-b-font-size)*var(--mg-b-line-height) + 2*(var(--mg-b-size-4) + var(--mg-b-size-4) + var(--mg-c-input-border-width)))/var(--mg-c-input-toggle-border-radius-ratio));background-color:var(--mg-b-color-light);cursor:pointer;font-family:var(--mg-b-font-family);font-size:inherit;line-height:inherit}.mg-c-input__button-toggle:disabled{cursor:default}.mg-c-input.mg-c-input--toggle .mg-c-input__input-container{min-width:0;flex:auto}.mg-c-input.mg-c-input--toggle-is-active .mg-c-input__toggle-item-container:first-of-type{background-color:unset;color:var(--mg-b-color-dark);font-weight:unset}.mg-c-input.mg-c-input--toggle-is-active .mg-c-input__toggle-item-container:last-of-type{background-color:color-mix(in srgb, var(--mg-b-color-app), white 80%);color:var(--mg-b-color-info);font-weight:600}.mg-c-input.mg-c-input--toggle-icon .mg-c-input__toggle-item-container{display:flex;width:calc(var(--mg-b-font-size)*var(--mg-b-line-height) + 2*var(--mg-b-size-4));height:calc(var(--mg-b-font-size)*var(--mg-b-line-height) + 2*var(--mg-b-size-4));align-items:center;justify-content:center;padding:0;visibility:hidden}.mg-c-input.mg-c-input--toggle-icon .mg-c-input__toggle-item-container:first-of-type{visibility:visible}.mg-c-input.mg-c-input--toggle-icon .mg-c-input__toggle-item-container ::slotted(mg-icon){display:flex}.mg-c-input.mg-c-input--toggle-icon.mg-c-input--toggle-is-active .mg-c-input__toggle-item-container:first-of-type{visibility:hidden}.mg-c-input.mg-c-input--toggle-icon.mg-c-input--toggle-is-active .mg-c-input__toggle-item-container:last-of-type{visibility:visible}.mg-c-input.mg-c-input--toggle-on-off .mg-c-input__toggle-item-container:first-of-type{background-color:var(--mg-b-color-neutral-30);color:var(--mg-b-color-dark);font-weight:600}.mg-c-input.mg-c-input--toggle-on-off.mg-c-input--toggle-is-active .mg-c-input__toggle-item-container:first-of-type{background-color:unset;color:var(--mg-b-color-dark);font-weight:unset}";
|
|
4480
|
-
const MgInputToggleStyle0 = mgInputToggleCss;
|
|
4481
4523
|
|
|
4482
4524
|
/**
|
|
4483
4525
|
* type Option validation function
|
|
@@ -4488,8 +4530,8 @@ const isOption = (option) => typeof option === 'object' && typeof option.title =
|
|
|
4488
4530
|
const MgInputToggle = class {
|
|
4489
4531
|
constructor(hostRef) {
|
|
4490
4532
|
registerInstance(this, hostRef);
|
|
4491
|
-
this.valueChange = createEvent(this, "value-change"
|
|
4492
|
-
this.inputValid = createEvent(this, "input-valid"
|
|
4533
|
+
this.valueChange = createEvent(this, "value-change");
|
|
4534
|
+
this.inputValid = createEvent(this, "input-valid");
|
|
4493
4535
|
/************
|
|
4494
4536
|
* Internal *
|
|
4495
4537
|
************/
|
|
@@ -4502,6 +4544,10 @@ const MgInputToggle = class {
|
|
|
4502
4544
|
* If not set the value equals the identifier
|
|
4503
4545
|
*/
|
|
4504
4546
|
this.name = this.identifier;
|
|
4547
|
+
/**
|
|
4548
|
+
* Define if label is displayed on top
|
|
4549
|
+
*/
|
|
4550
|
+
this.labelOnTop = false;
|
|
4505
4551
|
/**
|
|
4506
4552
|
* Define if label is visible
|
|
4507
4553
|
*/
|
|
@@ -4529,7 +4575,7 @@ const MgInputToggle = class {
|
|
|
4529
4575
|
/**
|
|
4530
4576
|
* Component classes
|
|
4531
4577
|
*/
|
|
4532
|
-
this.classCollection = new
|
|
4578
|
+
this.classCollection = new kt(['mg-c-input--toggle']);
|
|
4533
4579
|
/**
|
|
4534
4580
|
* Checked internal value
|
|
4535
4581
|
*/
|
|
@@ -4590,10 +4636,10 @@ const MgInputToggle = class {
|
|
|
4590
4636
|
}
|
|
4591
4637
|
validateItems(newValue) {
|
|
4592
4638
|
if (typeof newValue === 'object' && this.items.length !== 2) {
|
|
4593
|
-
throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${
|
|
4639
|
+
throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${zt(newValue)}.`);
|
|
4594
4640
|
}
|
|
4595
4641
|
// String array
|
|
4596
|
-
else if (
|
|
4642
|
+
else if (At(newValue)) {
|
|
4597
4643
|
this.options = newValue.map(item => ({ title: item, value: item }));
|
|
4598
4644
|
}
|
|
4599
4645
|
// Object array
|
|
@@ -4601,7 +4647,7 @@ const MgInputToggle = class {
|
|
|
4601
4647
|
this.options = newValue;
|
|
4602
4648
|
}
|
|
4603
4649
|
else {
|
|
4604
|
-
throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${
|
|
4650
|
+
throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${zt(newValue)}.`);
|
|
4605
4651
|
}
|
|
4606
4652
|
}
|
|
4607
4653
|
watchIsOnOff(newValue) {
|
|
@@ -4649,7 +4695,7 @@ const MgInputToggle = class {
|
|
|
4649
4695
|
if (typeof valid !== 'boolean') {
|
|
4650
4696
|
throw new Error('<mg-input-toggle> method "setError()" param "valid" must be a boolean.');
|
|
4651
4697
|
}
|
|
4652
|
-
else if (!
|
|
4698
|
+
else if (!Le(errorMessage)) {
|
|
4653
4699
|
throw new Error('<mg-input-toggle> method "setError()" param "errorMessage" must be a string.');
|
|
4654
4700
|
}
|
|
4655
4701
|
else {
|
|
@@ -4716,7 +4762,7 @@ const MgInputToggle = class {
|
|
|
4716
4762
|
*/
|
|
4717
4763
|
render() {
|
|
4718
4764
|
const checkedItem = this.getCheckedItem(this.checked);
|
|
4719
|
-
return (h("mg-input", { key: '
|
|
4765
|
+
return (h("mg-input", { key: '24c8068a592b0c49a0080931793de9f161b39c26', 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" }))))));
|
|
4720
4766
|
}
|
|
4721
4767
|
get element() { return getElement(this); }
|
|
4722
4768
|
static get watchers() { return {
|
|
@@ -4729,7 +4775,7 @@ const MgInputToggle = class {
|
|
|
4729
4775
|
"checked": ["handleChecked"]
|
|
4730
4776
|
}; }
|
|
4731
4777
|
};
|
|
4732
|
-
MgInputToggle.style =
|
|
4778
|
+
MgInputToggle.style = mgInputToggleCss;
|
|
4733
4779
|
|
|
4734
4780
|
/**
|
|
4735
4781
|
*
|
|
@@ -4812,7 +4858,6 @@ class OverflowBehavior {
|
|
|
4812
4858
|
}
|
|
4813
4859
|
|
|
4814
4860
|
const mgItemMoreCss = ".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}";
|
|
4815
|
-
const MgItemMoreStyle0 = mgItemMoreCss;
|
|
4816
4861
|
|
|
4817
4862
|
const MgItemMore = class {
|
|
4818
4863
|
constructor(hostRef) {
|
|
@@ -4832,17 +4877,17 @@ const MgItemMore = class {
|
|
|
4832
4877
|
}
|
|
4833
4878
|
validateIcon(newValue) {
|
|
4834
4879
|
if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.icon !== 'string'))
|
|
4835
|
-
throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${
|
|
4880
|
+
throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${zt(newValue)}.`);
|
|
4836
4881
|
}
|
|
4837
4882
|
validateSlotLabel(newValue) {
|
|
4838
4883
|
if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))
|
|
4839
|
-
throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${
|
|
4884
|
+
throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${zt(newValue)}.`);
|
|
4840
4885
|
else if (typeof newValue.label !== 'string')
|
|
4841
4886
|
this.slotlabel.label = this.messages.menuLabel;
|
|
4842
4887
|
}
|
|
4843
4888
|
validateSize(newValue) {
|
|
4844
4889
|
if (newValue && !sizes$5.includes(newValue))
|
|
4845
|
-
throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${
|
|
4890
|
+
throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${zt(newValue)}.`);
|
|
4846
4891
|
}
|
|
4847
4892
|
/*************
|
|
4848
4893
|
* Lifecycle *
|
|
@@ -4889,7 +4934,7 @@ const MgItemMore = class {
|
|
|
4889
4934
|
*/
|
|
4890
4935
|
render() {
|
|
4891
4936
|
const menuItemIdentifier = 'mg-item-more';
|
|
4892
|
-
return (h(Host, { key: '
|
|
4937
|
+
return (h(Host, { key: 'd7811bdedea2159c351185958976bda08c21ba20', role: "listitem", "data-mg-popover-guard": `${menuItemIdentifier}-popover` }, this.parentMenu && (h("mg-menu-item", { key: '66f7fe8056bf40a034c49ea1b2f97b3eff8cedc5', "data-overflow-more": true, "data-size": this.parentMenu.size, "data-style-direction": directions$1.HORIZONTAL, identifier: menuItemIdentifier }, h("mg-icon", { key: '06c7e052299f37d913605c2d0e938eaee6b820ba', icon: this.icon.icon, size: this.size, slot: "image" }), h("span", { key: '9b8e2da9edb472f6822e8ed1878d1540e459c96a', class: { 'mg-u-visually-hidden': !this.slotlabel.display }, slot: "label" }, this.slotlabel.label), h("mg-menu", { key: '5b8f0a9b0208bf881b5f5348d296a80dd2e60f0b', direction: directions$1.VERTICAL, label: this.messages.menuLabel, size: this.size, ref: ref => {
|
|
4893
4938
|
if (ref !== null)
|
|
4894
4939
|
this.itemMoreContainer = ref;
|
|
4895
4940
|
} })))));
|
|
@@ -4901,10 +4946,9 @@ const MgItemMore = class {
|
|
|
4901
4946
|
"size": ["validateSize"]
|
|
4902
4947
|
}; }
|
|
4903
4948
|
};
|
|
4904
|
-
MgItemMore.style =
|
|
4949
|
+
MgItemMore.style = mgItemMoreCss;
|
|
4905
4950
|
|
|
4906
4951
|
const mgMenuCss = ".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}";
|
|
4907
|
-
const MgMenuStyle0 = mgMenuCss;
|
|
4908
4952
|
|
|
4909
4953
|
const MgMenu = class {
|
|
4910
4954
|
constructor(hostRef) {
|
|
@@ -4916,7 +4960,7 @@ const MgMenu = class {
|
|
|
4916
4960
|
/**
|
|
4917
4961
|
* Component display direction.
|
|
4918
4962
|
*/
|
|
4919
|
-
this.direction =
|
|
4963
|
+
this.direction = 'horizontal';
|
|
4920
4964
|
/**
|
|
4921
4965
|
* Define mg-menu size
|
|
4922
4966
|
*/
|
|
@@ -4976,12 +5020,12 @@ const MgMenu = class {
|
|
|
4976
5020
|
}
|
|
4977
5021
|
validateLabel(newValue) {
|
|
4978
5022
|
if (newValue === undefined && !this.element.hasAttribute('aria-label')) {
|
|
4979
|
-
throw new Error(`<${this.name}> prop "label" is required. Passed value: ${
|
|
5023
|
+
throw new Error(`<${this.name}> prop "label" is required. Passed value: ${zt(newValue)}.`);
|
|
4980
5024
|
}
|
|
4981
5025
|
}
|
|
4982
5026
|
validateDirection(newValue) {
|
|
4983
5027
|
if (![directions$1.VERTICAL, directions$1.HORIZONTAL].includes(newValue)) {
|
|
4984
|
-
throw new Error(`<${this.name}> prop "direction" must be one of: ${directions$1.HORIZONTAL}, ${directions$1.VERTICAL}. Passed value: ${
|
|
5028
|
+
throw new Error(`<${this.name}> prop "direction" must be one of: ${directions$1.HORIZONTAL}, ${directions$1.VERTICAL}. Passed value: ${zt(newValue)}.`);
|
|
4985
5029
|
}
|
|
4986
5030
|
else {
|
|
4987
5031
|
this.updateMenuItems();
|
|
@@ -4997,7 +5041,7 @@ const MgMenu = class {
|
|
|
4997
5041
|
}
|
|
4998
5042
|
validateSize(newValue) {
|
|
4999
5043
|
if (!sizes$5.includes(newValue)) {
|
|
5000
|
-
throw new Error(`<${this.name}> prop "size" must be one of: ${sizes$5.join(', ')}. Passed value: ${
|
|
5044
|
+
throw new Error(`<${this.name}> prop "size" must be one of: ${sizes$5.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5001
5045
|
}
|
|
5002
5046
|
}
|
|
5003
5047
|
/**
|
|
@@ -5013,7 +5057,7 @@ const MgMenu = class {
|
|
|
5013
5057
|
if (focusedItem === itemToWatch)
|
|
5014
5058
|
return;
|
|
5015
5059
|
// reset expanded on previous active menu item
|
|
5016
|
-
if (focusedItem)
|
|
5060
|
+
if (focusedItem !== null)
|
|
5017
5061
|
focusedItem.removeAttribute('data-has-focus');
|
|
5018
5062
|
// update focusedMenuItem with new value
|
|
5019
5063
|
itemToWatch.setAttribute('data-has-focus', 'true');
|
|
@@ -5044,15 +5088,15 @@ const MgMenu = class {
|
|
|
5044
5088
|
const isElementChild = (element) => {
|
|
5045
5089
|
if (element === this.element)
|
|
5046
5090
|
return true;
|
|
5047
|
-
else if (
|
|
5091
|
+
else if (element.parentElement === null)
|
|
5048
5092
|
return false;
|
|
5049
5093
|
else
|
|
5050
5094
|
return isElementChild(element.parentElement);
|
|
5051
5095
|
};
|
|
5052
|
-
if (
|
|
5096
|
+
if (event.target.closest('mg-menu') === null || !isElementChild(event.target)) {
|
|
5053
5097
|
const focusedItem = this.element.querySelector('[data-has-focus]');
|
|
5054
5098
|
// reset expanded on previous active menu item
|
|
5055
|
-
if (focusedItem)
|
|
5099
|
+
if (focusedItem !== null)
|
|
5056
5100
|
focusedItem.removeAttribute('data-has-focus');
|
|
5057
5101
|
}
|
|
5058
5102
|
});
|
|
@@ -5065,7 +5109,7 @@ const MgMenu = class {
|
|
|
5065
5109
|
* @returns HTML Element
|
|
5066
5110
|
*/
|
|
5067
5111
|
render() {
|
|
5068
|
-
return (h(Host, { key: '
|
|
5112
|
+
return (h(Host, { key: 'b07fbc2127a17e22f41750c603a36c76924d97f3', role: "list", "aria-label": this.label }, h("slot", { key: '0f1070474d19411fc1e52b5151ad6c61c2f07627' })));
|
|
5069
5113
|
}
|
|
5070
5114
|
get element() { return getElement(this); }
|
|
5071
5115
|
static get watchers() { return {
|
|
@@ -5075,16 +5119,15 @@ const MgMenu = class {
|
|
|
5075
5119
|
"size": ["validateSize"]
|
|
5076
5120
|
}; }
|
|
5077
5121
|
};
|
|
5078
|
-
MgMenu.style =
|
|
5122
|
+
MgMenu.style = mgMenuCss;
|
|
5079
5123
|
|
|
5080
5124
|
const mgMenuItemCss = ".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-item-color: Defines menu item global color, used for bottom line and active tabs. Default value: `--mg-b-color-app`.\n * @prop --mg-c-menu-item-color-text: Defines the color of the menu item. Unset by default, fallback on `--mg-b-color-dark`.\n * @prop --mg-c-menu-item-navigation-button-max-width: Defines the max-width property for the navigation button. Unset by default.\n */.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{height:var(--mg-b-size-40);padding:var(--mg-b-size-12) var(--mg-b-size-16)}.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button,.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button ::slotted([slot=label]),.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button ::slotted([slot=metadata]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium ::slotted([slot=label]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium ::slotted([slot=metadata]){font-size:var(--mg-b-font-size)}.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--horizontal,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium.mg-c-menu-item__navigation-button--horizontal{padding-bottom:var(--mg-b-size-12)}.mg-c-menu-item.mg-c-menu-item--size-medium .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--vertical,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium.mg-c-menu-item__navigation-button--vertical{padding-left:var(--mg-b-size-16)}.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{height:var(--mg-b-size-48);padding:var(--mg-b-size-12) var(--mg-b-size-32)}.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button,.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button ::slotted([slot=label]),.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button ::slotted([slot=metadata]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large ::slotted([slot=label]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large ::slotted([slot=metadata]){font-size:var(--mg-b-font-size-h4)}.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--horizontal,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large.mg-c-menu-item__navigation-button--horizontal{padding-bottom:var(--mg-b-size-12)}.mg-c-menu-item.mg-c-menu-item--size-large .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--vertical,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large.mg-c-menu-item__navigation-button--vertical{padding-left:var(--mg-b-size-32)}.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{height:var(--mg-b-size-72);padding:var(--mg-b-size-12) var(--mg-b-size-40)}.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button,.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button ::slotted([slot=label]),.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button ::slotted([slot=metadata]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge ::slotted([slot=label]),.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge ::slotted([slot=metadata]){font-size:var(--mg-b-font-size-h4)}.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--horizontal,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge.mg-c-menu-item__navigation-button--horizontal{padding-bottom:var(--mg-b-size-12)}.mg-c-menu-item.mg-c-menu-item--size-xlarge .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--vertical,.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge.mg-c-menu-item__navigation-button--vertical{padding-left:var(--mg-b-size-40)}.mg-c-menu-item__navigation-button{display:flex;box-sizing:border-box;align-items:center;border:none;background-color:unset;color:var(--mg-c-menu-item-color-text, var(--mg-b-color-dark));column-gap:var(--mg-c-menu-item-navigation-button-column-gap, var(--mg-b-size-8));cursor:pointer;font-family:var(--mg-b-font-family);font-weight:400;line-height:var(--mg-b-line-height);text-decoration:none;white-space:nowrap}.mg-c-menu-item__navigation-button:disabled,.mg-c-menu-item__navigation-button--disabled{cursor:default;opacity:var(--mg-b-opacity-element-disabled)}.mg-c-menu-item__navigation-button:focus-visible{z-index:10}.mg-c-menu-item__navigation-button:hover:not(.mg-c-menu-item__navigation-button--disabled),.mg-c-menu-item__navigation-button:focus-visible:not(.mg-c-menu-item__navigation-button--disabled){background-color:color-mix(in srgb, var(--mg-c-menu-item-color), transparent 90%)}.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--active{color:var(--mg-c-menu-item-color);font-weight:600}.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--active.mg-c-menu-item__navigation-button--horizontal{box-shadow:inset 0 calc(-1*var(--mg-b-size-4)) var(--mg-c-menu-item-color)}.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--active.mg-c-menu-item__navigation-button--vertical{box-shadow:inset var(--mg-b-size-4) 0 var(--mg-c-menu-item-color)}.mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--hidden{display:none}:host([data-style-direction=vertical][data-level=\"1\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(1*var(--mg-b-size-16))}:host([data-level=\"1\"]) .mg-c-menu-item__collapse-container{z-index:10}:host([data-style-direction=vertical][data-level=\"2\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(2*var(--mg-b-size-16))}:host([data-level=\"2\"]) .mg-c-menu-item__collapse-container{z-index:20}:host([data-style-direction=vertical][data-level=\"3\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(3*var(--mg-b-size-16))}:host([data-level=\"3\"]) .mg-c-menu-item__collapse-container{z-index:30}:host([data-style-direction=vertical][data-level=\"4\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(4*var(--mg-b-size-16))}:host([data-level=\"4\"]) .mg-c-menu-item__collapse-container{z-index:40}:host([data-style-direction=vertical][data-level=\"5\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(5*var(--mg-b-size-16))}:host([data-level=\"5\"]) .mg-c-menu-item__collapse-container{z-index:50}:host([data-style-direction=vertical][data-level=\"6\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-medium{padding-left:calc(6*var(--mg-b-size-16))}:host([data-level=\"6\"]) .mg-c-menu-item__collapse-container{z-index:60}:host([data-style-direction=vertical][data-level=\"1\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(1*var(--mg-b-size-32))}:host([data-level=\"1\"]) .mg-c-menu-item__collapse-container{z-index:10}:host([data-style-direction=vertical][data-level=\"2\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(2*var(--mg-b-size-32))}:host([data-level=\"2\"]) .mg-c-menu-item__collapse-container{z-index:20}:host([data-style-direction=vertical][data-level=\"3\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(3*var(--mg-b-size-32))}:host([data-level=\"3\"]) .mg-c-menu-item__collapse-container{z-index:30}:host([data-style-direction=vertical][data-level=\"4\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(4*var(--mg-b-size-32))}:host([data-level=\"4\"]) .mg-c-menu-item__collapse-container{z-index:40}:host([data-style-direction=vertical][data-level=\"5\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(5*var(--mg-b-size-32))}:host([data-level=\"5\"]) .mg-c-menu-item__collapse-container{z-index:50}:host([data-style-direction=vertical][data-level=\"6\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-large{padding-left:calc(6*var(--mg-b-size-32))}:host([data-level=\"6\"]) .mg-c-menu-item__collapse-container{z-index:60}:host([data-style-direction=vertical][data-level=\"1\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(1*var(--mg-b-size-40))}:host([data-level=\"1\"]) .mg-c-menu-item__collapse-container{z-index:10}:host([data-style-direction=vertical][data-level=\"2\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(2*var(--mg-b-size-40))}:host([data-level=\"2\"]) .mg-c-menu-item__collapse-container{z-index:20}:host([data-style-direction=vertical][data-level=\"3\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(3*var(--mg-b-size-40))}:host([data-level=\"3\"]) .mg-c-menu-item__collapse-container{z-index:30}:host([data-style-direction=vertical][data-level=\"4\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(4*var(--mg-b-size-40))}:host([data-level=\"4\"]) .mg-c-menu-item__collapse-container{z-index:40}:host([data-style-direction=vertical][data-level=\"5\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(5*var(--mg-b-size-40))}:host([data-level=\"5\"]) .mg-c-menu-item__collapse-container{z-index:50}:host([data-style-direction=vertical][data-level=\"6\"]) .mg-c-menu-item__navigation-button.mg-c-menu-item__navigation-button--size-xlarge{padding-left:calc(6*var(--mg-b-size-40))}:host([data-level=\"6\"]) .mg-c-menu-item__collapse-container{z-index:60}.mg-c-menu-item{max-width:var(--mg-c-menu-item-navigation-button-max-width)}.mg-c-menu-item__collapse-container{z-index:10;width:max-content}.mg-c-menu-item__navigation-button-center{min-width:0}.mg-c-menu-item__navigation-button-text-content{display:flex;width:100%;align-items:center}.mg-c-menu-item__navigation-button-text-content-notification,.mg-c-menu-item__navigation-button-text-content ::slotted([slot=information]){margin-left:var(--mg-b-size-8);font-size:var(--mg-b-font-size)}.mg-c-menu-item__navigation-button-new-tab{margin-left:var(--mg-b-size-4)}.mg-c-menu-item__navigation-button-chevron{display:var(--mg-c-menu-item-chevron-display);margin-left:auto;transition:200ms}.mg-c-menu-item__navigation-button-chevron--rotate.mg-c-menu-item__navigation-button-chevron{transform:rotate(180deg)}:host{position:relative;display:flex;--mg-c-popover-padding-vertical:0;--mg-c-popover-padding-horizontal:0;--mg-c-popover-max-width:unset}:host([data-style-direction=vertical]){flex-direction:column}:host([data-style-direction=vertical]) .mg-c-menu-item__navigation-button{width:100%}:host([data-style-direction=vertical]) .mg-c-menu-item__collapse-container{position:unset;top:unset;left:unset;width:unset}:host([data-style-direction=vertical]) .mg-c-menu-item-chevron{margin-left:auto}:host([data-overflow-more]){--mg-c-menu-item-navigation-button-column-gap:0}:host([data-overflow-more]) .mg-c-menu-item__navigation-button-chevron{--mg-c-menu-item-chevron-display:none}:host([data-overflow-more]) .mg-c-menu-item__navigation-button-text-content ::slotted([slot=information]){margin-left:0}:host([data-overflow-more]) ::slotted(mg-menu){--mg-c-menu-item-navigation-button-column-gap:var(--mg-b-size-8)}:host([data-style-direction=horizontal]) .mg-c-menu-item__collapse-container.mg-c-menu-item__collapse-container--first-level,:host([data-overflow-more]) .mg-c-menu-item__collapse-container.mg-c-menu-item__collapse-container--first-level{background-color:var(--mg-b-color-light)}:host([data-style-direction=horizontal]) .mg-c-menu-item__collapse-container.mg-c-menu-item__collapse-container--first-level ::slotted(mg-menu),:host([data-overflow-more]) .mg-c-menu-item__collapse-container.mg-c-menu-item__collapse-container--first-level ::slotted(mg-menu){padding:var(--mg-b-size-8) 0}::slotted([slot=label]),::slotted([slot=metadata]){display:block;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}::slotted(*){display:flex;flex-direction:column}:host([status=disabled]){pointer-events:none}:host([hidden]){display:none}";
|
|
5081
|
-
const MgMenuItemStyle0 = mgMenuItemCss;
|
|
5082
5125
|
|
|
5083
5126
|
const MgMenuItem = class {
|
|
5084
5127
|
constructor(hostRef) {
|
|
5085
5128
|
registerInstance(this, hostRef);
|
|
5086
|
-
this.itemLoaded = createEvent(this, "item-loaded"
|
|
5087
|
-
this.itemUpdated = createEvent(this, "item-updated"
|
|
5129
|
+
this.itemLoaded = createEvent(this, "item-loaded");
|
|
5130
|
+
this.itemUpdated = createEvent(this, "item-updated");
|
|
5088
5131
|
/************
|
|
5089
5132
|
* Internal *
|
|
5090
5133
|
************/
|
|
@@ -5096,11 +5139,11 @@ const MgMenuItem = class {
|
|
|
5096
5139
|
/**
|
|
5097
5140
|
* Identifier is used to control mg-popover
|
|
5098
5141
|
*/
|
|
5099
|
-
this.identifier =
|
|
5142
|
+
this.identifier = xt('mg-menu-item');
|
|
5100
5143
|
/**
|
|
5101
5144
|
* Define menu-item status.
|
|
5102
5145
|
*/
|
|
5103
|
-
this.status =
|
|
5146
|
+
this.status = 'visible';
|
|
5104
5147
|
/**
|
|
5105
5148
|
* Define menu-item content expanded.
|
|
5106
5149
|
*/
|
|
@@ -5115,7 +5158,7 @@ const MgMenuItem = class {
|
|
|
5115
5158
|
/**
|
|
5116
5159
|
* Component button classes
|
|
5117
5160
|
*/
|
|
5118
|
-
this.navigationButtonClassList = new
|
|
5161
|
+
this.navigationButtonClassList = new kt([this.navigationButton]);
|
|
5119
5162
|
/**
|
|
5120
5163
|
* Does component have children.
|
|
5121
5164
|
*/
|
|
@@ -5140,7 +5183,7 @@ const MgMenuItem = class {
|
|
|
5140
5183
|
* @returns truthy if component display popover
|
|
5141
5184
|
*/
|
|
5142
5185
|
this.hasPopover = () => this.isDirection(directions$1.HORIZONTAL) &&
|
|
5143
|
-
((this.isInMainMenu() && Array.from(this.element.children).some(element =>
|
|
5186
|
+
((this.isInMainMenu() && Array.from(this.element.children).some(element => element.querySelector('[slot]') === null)) || this.isItemMore) &&
|
|
5144
5187
|
this.href === undefined;
|
|
5145
5188
|
/**
|
|
5146
5189
|
* Method to control if one of component children have active status
|
|
@@ -5154,7 +5197,7 @@ const MgMenuItem = class {
|
|
|
5154
5197
|
* Is component an interactive item
|
|
5155
5198
|
* @returns truthy if element is clickable
|
|
5156
5199
|
*/
|
|
5157
|
-
this.isInteractiveItem = () => this.hasChildren || !
|
|
5200
|
+
this.isInteractiveItem = () => this.hasChildren || !Le(this.href);
|
|
5158
5201
|
/**
|
|
5159
5202
|
* Is component contextual direction match the given direction
|
|
5160
5203
|
* @param direction - in parent menu
|
|
@@ -5207,7 +5250,7 @@ const MgMenuItem = class {
|
|
|
5207
5250
|
}
|
|
5208
5251
|
['label', 'metadata'].forEach(slot => {
|
|
5209
5252
|
Array.from(this.element.querySelectorAll(`[slot="${slot}"]`)).forEach(element => {
|
|
5210
|
-
if (!
|
|
5253
|
+
if (!Le(element.textContent))
|
|
5211
5254
|
throw new Error(`<${this.name}> slot "${slot}" must have text content.`);
|
|
5212
5255
|
if ((guard && !element.hasAttribute('title')) || !guard)
|
|
5213
5256
|
element.setAttribute('title', element.textContent);
|
|
@@ -5274,8 +5317,8 @@ const MgMenuItem = class {
|
|
|
5274
5317
|
this.renderSlot = () => h("slot", null);
|
|
5275
5318
|
}
|
|
5276
5319
|
watchIdentifier(newValue) {
|
|
5277
|
-
if (!
|
|
5278
|
-
console.error(`<mg-menu-item> prop "identifier" value is invalid. Passed value: ${
|
|
5320
|
+
if (!Ot(newValue)) {
|
|
5321
|
+
console.error(`<mg-menu-item> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
5279
5322
|
}
|
|
5280
5323
|
else {
|
|
5281
5324
|
this.popoverIdentifier = `${this.identifier}-popover`;
|
|
@@ -5283,7 +5326,7 @@ const MgMenuItem = class {
|
|
|
5283
5326
|
}
|
|
5284
5327
|
watchTarget(newValue) {
|
|
5285
5328
|
if (newValue && !targets.includes(newValue)) {
|
|
5286
|
-
throw new Error(`<mg-link> prop "target" must be one of: ${targets.join(', ')}. Passed value: ${
|
|
5329
|
+
throw new Error(`<mg-link> prop "target" must be one of: ${targets.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5287
5330
|
}
|
|
5288
5331
|
}
|
|
5289
5332
|
watchStatus(newValue, oldValue) {
|
|
@@ -5293,7 +5336,7 @@ const MgMenuItem = class {
|
|
|
5293
5336
|
}
|
|
5294
5337
|
watchExpanded(newValue) {
|
|
5295
5338
|
if (typeof newValue !== 'boolean') {
|
|
5296
|
-
throw new Error(`<${this.name}> prop "expanded" must be a boolean. Passed value: ${
|
|
5339
|
+
throw new Error(`<${this.name}> prop "expanded" must be a boolean. Passed value: ${zt(newValue)}.`);
|
|
5297
5340
|
}
|
|
5298
5341
|
else {
|
|
5299
5342
|
this.updateExpanded(newValue);
|
|
@@ -5350,7 +5393,7 @@ const MgMenuItem = class {
|
|
|
5350
5393
|
*/
|
|
5351
5394
|
updatePopoverGuard() {
|
|
5352
5395
|
const subItem = this.element.querySelector('*:not([slot])');
|
|
5353
|
-
if (
|
|
5396
|
+
if (subItem === null)
|
|
5354
5397
|
return;
|
|
5355
5398
|
if (this.hasPopover())
|
|
5356
5399
|
subItem.dataset.mgPopoverGuard = this.popoverIdentifier;
|
|
@@ -5408,7 +5451,7 @@ const MgMenuItem = class {
|
|
|
5408
5451
|
* @returns promise process wich emit the 'item-updated' event
|
|
5409
5452
|
*/
|
|
5410
5453
|
componentShouldUpdate() {
|
|
5411
|
-
return
|
|
5454
|
+
return Mt(() => {
|
|
5412
5455
|
this.itemUpdated.emit();
|
|
5413
5456
|
});
|
|
5414
5457
|
}
|
|
@@ -5435,7 +5478,7 @@ const MgMenuItem = class {
|
|
|
5435
5478
|
['mg-c-menu-item__collapse-container']: true,
|
|
5436
5479
|
['mg-c-menu-item__collapse-container--first-level']: (this.isInMainMenu() || this.isItemMore) && this.isDirection(directions$1.HORIZONTAL),
|
|
5437
5480
|
});
|
|
5438
|
-
return (h(Host, { key: '
|
|
5481
|
+
return (h(Host, { key: '6ef0374dfd3afdea0554df426c06e1fdc5549f82', role: this.isItemMore ? 'presentation' : 'listitem' }, this.hasPopover() ? (h("mg-popover", { display: this.expanded, placement: "bottom-start", arrowHide: true, "onDisplay-change": this.handlePopoverDisplay, identifier: this.popoverIdentifier, "data-fallback-placement": "bottom-end" // use for the last element of the menu if it is placed on the right side
|
|
5439
5482
|
}, this.renderInteractiveElement(), h("div", { class: getContainerClasses(), slot: "content" }, this.renderSlot()))) : ([
|
|
5440
5483
|
this.renderInteractiveElement(),
|
|
5441
5484
|
h("div", { key: "vertical-container", class: getContainerClasses(), hidden: !this.expanded }, this.renderSlot()),
|
|
@@ -5454,7 +5497,7 @@ const MgMenuItem = class {
|
|
|
5454
5497
|
"data-has-focus": ["watchDataHasFocus"]
|
|
5455
5498
|
}; }
|
|
5456
5499
|
};
|
|
5457
|
-
MgMenuItem.style =
|
|
5500
|
+
MgMenuItem.style = mgMenuItemCss;
|
|
5458
5501
|
|
|
5459
5502
|
/**
|
|
5460
5503
|
* List available variants
|
|
@@ -5466,7 +5509,6 @@ const variants$1 = ['info', 'warning', 'success', 'danger'];
|
|
|
5466
5509
|
const variantStyles = ['bar-left', 'background'];
|
|
5467
5510
|
|
|
5468
5511
|
const mgMessageCss = "/*!\n * @prop --mg-c-message-border-radius: Defines the border radius of the message. Default value: `--mg-b-size-radius`.\n */:host{--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-message-border-radius);--mg-c-card-border:none;--mg-c-card-overflow:hidden}.mg-c-message{display:inline-block;min-height:var(--mg-b-size-min-height)}.mg-c-message.mg-c-message--danger .mg-c-message__icon{color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-red-20, color-mix(in srgb, var(--mg-b-color-danger), white 80%))}.mg-c-message.mg-c-message--info .mg-c-message__icon{color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-blue-20, color-mix(in srgb, var(--mg-b-color-info), white 80%))}.mg-c-message.mg-c-message--success .mg-c-message__icon{color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-green-20, color-mix(in srgb, var(--mg-b-color-success), white 80%))}.mg-c-message.mg-c-message--warning .mg-c-message__icon{color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-yellow-20, color-mix(in srgb, var(--mg-b-color-warning), white 80%))}.mg-c-message ::slotted(*){padding:0;margin:0}.mg-c-message__icon{position:absolute;top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);left:calc(var(--mg-b-size-4) + var(--mg-b-size-8));line-height:1}.mg-c-message__content{display:flex;flex-wrap:wrap;padding:0 var(--mg-b-size-8) 0 calc(var(--mg-b-size-4) + var(--mg-b-size-8) + var(--mg-b-size-16) + var(--mg-b-size-8));place-content:stretch flex-end}.mg-c-message__content-slot{flex-grow:1;margin:var(--mg-b-size-8) 0}.mg-c-message__content-separator{display:inline-block;width:var(--mg-b-size-40);height:0}.mg-c-message__content-actions-slot{padding:var(--mg-b-size-8) 0;text-align:right}.mg-c-message__bar{position:absolute;top:0;left:0;width:var(--mg-b-size-4);height:100%}.mg-c-message ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset}.mg-c-message,.mg-c-message mg-message{max-width:100%}";
|
|
5469
|
-
const MgMessageStyle0 = mgMessageCss;
|
|
5470
5512
|
|
|
5471
5513
|
const MgMessage = class {
|
|
5472
5514
|
constructor(hostRef) {
|
|
@@ -5486,7 +5528,7 @@ const MgMessage = class {
|
|
|
5486
5528
|
/**
|
|
5487
5529
|
* Component classes
|
|
5488
5530
|
*/
|
|
5489
|
-
this.classCollection = new
|
|
5531
|
+
this.classCollection = new kt(['mg-c-message']);
|
|
5490
5532
|
/**
|
|
5491
5533
|
* Define if component is using actions slot
|
|
5492
5534
|
*/
|
|
@@ -5510,7 +5552,7 @@ const MgMessage = class {
|
|
|
5510
5552
|
}
|
|
5511
5553
|
watchVariant(newValue, oldValue) {
|
|
5512
5554
|
if (!variants$1.includes(newValue)) {
|
|
5513
|
-
throw new Error(`<mg-message> prop "variant" must be one of: ${variants$1.join(', ')}. Passed value: ${
|
|
5555
|
+
throw new Error(`<mg-message> prop "variant" must be one of: ${variants$1.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5514
5556
|
}
|
|
5515
5557
|
else {
|
|
5516
5558
|
if (newValue !== undefined)
|
|
@@ -5521,7 +5563,7 @@ const MgMessage = class {
|
|
|
5521
5563
|
}
|
|
5522
5564
|
watchVariantStyle(newValue, oldValue) {
|
|
5523
5565
|
if (!variantStyles.includes(newValue)) {
|
|
5524
|
-
throw new Error(`<mg-message> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${
|
|
5566
|
+
throw new Error(`<mg-message> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5525
5567
|
}
|
|
5526
5568
|
else {
|
|
5527
5569
|
if (newValue !== undefined)
|
|
@@ -5559,7 +5601,7 @@ const MgMessage = class {
|
|
|
5559
5601
|
"variantStyle": ["watchVariantStyle"]
|
|
5560
5602
|
}; }
|
|
5561
5603
|
};
|
|
5562
|
-
MgMessage.style =
|
|
5604
|
+
MgMessage.style = mgMessageCss;
|
|
5563
5605
|
|
|
5564
5606
|
/**
|
|
5565
5607
|
* List of all possibles dialog roles
|
|
@@ -5567,25 +5609,24 @@ MgMessage.style = MgMessageStyle0;
|
|
|
5567
5609
|
const dialogRoles = ['dialog', 'alertdialog'];
|
|
5568
5610
|
|
|
5569
5611
|
const mgModalCss = "/*!\n * @prop --mg-c-modal-border-radius: Defines the border radius of the modal. Default value: `--mg-b-size-radius`.\n * @prop --mg-c-modal-title-font-size: Defines the font size of the modal title. Default value: `--mg-b-font-size-h3`.\n */:host{--mg-c-card-border-radius:var(--mg-c-modal-border-radius);--mg-c-card-spacing:var(--mg-b-size-16) var(--mg-b-size-24);--mg-c-card-border:none}.mg-c-modal{border:none;background:none;color:inherit}.mg-c-modal[open]{display:flex;padding:var(--mg-b-size-24) var(--mg-b-size-8)}.mg-c-modal::backdrop{background-color:var(--mg-b-color-light);opacity:.85}.mg-c-modal mg-card{display:flex;width:calc(75*var(--mg-b-size-8));max-width:100%;max-height:100%}.mg-c-modal__dialog{position:relative;display:flex;height:fit-content;max-height:100%;flex-direction:column;align-self:center;row-gap:var(--mg-b-size-24)}.mg-c-modal__title{margin:0;font-family:var(--mg-b-font-family-heading);font-size:var(--mg-c-modal-title-font-size);font-weight:600}.mg-c-modal__close-button{height:var(--mg-c-modal-title-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-c-modal-title-font-size)*var(--mg-b-line-height))/2*-1);margin-right:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2*-1);margin-left:var(--mg-b-size-16);float:right}.mg-c-modal__content{padding:var(--mg-b-size-16);margin:calc(var(--mg-b-size-16)*-1);overflow-y:auto}.mg-c-modal ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset}";
|
|
5570
|
-
const MgModalStyle0 = mgModalCss;
|
|
5571
5612
|
|
|
5572
5613
|
const MgModal = class {
|
|
5573
5614
|
constructor(hostRef) {
|
|
5574
5615
|
registerInstance(this, hostRef);
|
|
5575
|
-
this.componentShow = createEvent(this, "component-show"
|
|
5576
|
-
this.componentHide = createEvent(this, "component-hide"
|
|
5577
|
-
this.componentClose = createEvent(this, "component-close"
|
|
5616
|
+
this.componentShow = createEvent(this, "component-show");
|
|
5617
|
+
this.componentHide = createEvent(this, "component-hide");
|
|
5618
|
+
this.componentClose = createEvent(this, "component-close");
|
|
5578
5619
|
// IDs
|
|
5579
5620
|
this.titleId = '';
|
|
5580
5621
|
/**
|
|
5581
5622
|
* Identifier is used for the element ID (id is a reserved prop in Stencil.js)
|
|
5582
5623
|
* If not set, it will be created.
|
|
5583
5624
|
*/
|
|
5584
|
-
this.identifier =
|
|
5625
|
+
this.identifier = xt('mg-modal');
|
|
5585
5626
|
/**
|
|
5586
5627
|
* Modal dialog role.
|
|
5587
5628
|
*/
|
|
5588
|
-
this.dialogRole =
|
|
5629
|
+
this.dialogRole = 'dialog';
|
|
5589
5630
|
/**
|
|
5590
5631
|
* Define if modal has a cross button
|
|
5591
5632
|
*/
|
|
@@ -5601,7 +5642,7 @@ const MgModal = class {
|
|
|
5601
5642
|
/**
|
|
5602
5643
|
* Component classes
|
|
5603
5644
|
*/
|
|
5604
|
-
this.classCollection = new
|
|
5645
|
+
this.classCollection = new kt(['mg-c-modal']);
|
|
5605
5646
|
/***********
|
|
5606
5647
|
* Handles *
|
|
5607
5648
|
***********/
|
|
@@ -5614,17 +5655,17 @@ const MgModal = class {
|
|
|
5614
5655
|
};
|
|
5615
5656
|
}
|
|
5616
5657
|
watchIdentifier(newValue) {
|
|
5617
|
-
if (!
|
|
5618
|
-
throw new Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${
|
|
5658
|
+
if (!Ot(newValue)) {
|
|
5659
|
+
throw new Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
5619
5660
|
}
|
|
5620
5661
|
}
|
|
5621
5662
|
validateDialogRole(newValue) {
|
|
5622
5663
|
if (!dialogRoles.includes(newValue))
|
|
5623
|
-
throw new Error(`<mg-modal> prop "dialogRole" must be one of: ${dialogRoles.join(', ')}. Passed value: ${
|
|
5664
|
+
throw new Error(`<mg-modal> prop "dialogRole" must be one of: ${dialogRoles.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5624
5665
|
}
|
|
5625
5666
|
validateModalTitle(newValue) {
|
|
5626
|
-
if (!
|
|
5627
|
-
throw new Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${
|
|
5667
|
+
if (!Le(newValue)) {
|
|
5668
|
+
throw new Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${zt(newValue)}.`);
|
|
5628
5669
|
}
|
|
5629
5670
|
}
|
|
5630
5671
|
watchOpen(newValue) {
|
|
@@ -5673,11 +5714,11 @@ const MgModal = class {
|
|
|
5673
5714
|
* @returns HTML Element
|
|
5674
5715
|
*/
|
|
5675
5716
|
render() {
|
|
5676
|
-
return (h("dialog", { key: '
|
|
5717
|
+
return (h("dialog", { key: 'fff52c253f0aeaceec427982c5fea96fc948a4f5', role: this.dialogRole, id: this.identifier, class: this.classCollection.join(), "aria-labelledby": this.titleId, ref: (el) => {
|
|
5677
5718
|
if (el !== null) {
|
|
5678
5719
|
this.dialog = el;
|
|
5679
5720
|
}
|
|
5680
|
-
} }, h("mg-card", { key: '
|
|
5721
|
+
} }, h("mg-card", { key: '597aee771927b73fc59c082075d74c76c9d8130c' }, h("div", { key: '75136546eefd38191ecf536e5c10cfbeb7172dc4', class: "mg-c-modal__dialog" }, h("header", { key: '09c79927ddffa0d461eabfa195849cdabe37a6ac', class: "mg-c-modal__header" }, this.closeButton && (h("span", { key: 'b37aabbf4a77ebaa4ca72e72f477aece9c9484de', class: "mg-c-modal__close-button" }, h("mg-button", { key: 'a4ca599e0665489f2cba2d3e668c92baff0a3fdb', "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose }, h("mg-icon", { key: 'd77c434f5e2aa6d82772ab3af10a93c6f580c709', icon: "cross" })))), h("h1", { key: '6daf305683895d5cc50960b4ce86dd2ffebc3246', class: "mg-c-modal__title", id: this.titleId }, this.modalTitle)), h("article", { key: '075ac4bfa9ab3e495b58a340719a8e0cefaac8c4', class: "mg-c-modal__content" }, h("slot", { key: '7013d03bfbd806671ad4cf081df9c7fe842f285c' })), this.hasActions && (h("footer", { key: '20ba80cc79e6d43cf2b820425ee0e4f75953da19', class: "mg-c-modal__footer" }, h("slot", { key: 'cfa6c3920891dfceecd0f01fbab2a1496db66f35', name: "actions" })))))));
|
|
5681
5722
|
}
|
|
5682
5723
|
get element() { return getElement(this); }
|
|
5683
5724
|
static get watchers() { return {
|
|
@@ -5687,7 +5728,7 @@ const MgModal = class {
|
|
|
5687
5728
|
"open": ["watchOpen"]
|
|
5688
5729
|
}; }
|
|
5689
5730
|
};
|
|
5690
|
-
MgModal.style =
|
|
5731
|
+
MgModal.style = mgModalCss;
|
|
5691
5732
|
|
|
5692
5733
|
const NavigationAction = {
|
|
5693
5734
|
NEXT: 'next',
|
|
@@ -5695,7 +5736,6 @@ const NavigationAction = {
|
|
|
5695
5736
|
};
|
|
5696
5737
|
|
|
5697
5738
|
const mgPaginationCss = ".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-pagination{display:flex;align-items:center;gap:var(--mg-b-spacing-actions)}.mg-c-pagination__page-count{display:flex;align-items:center;gap:var(--mg-b-size-4)}.mg-c-pagination.mg-c-pagination--hide-page-count{gap:0}";
|
|
5698
|
-
const MgPaginationStyle0 = mgPaginationCss;
|
|
5699
5739
|
|
|
5700
5740
|
/**
|
|
5701
5741
|
* Range generator
|
|
@@ -5722,12 +5762,20 @@ const range = (start, end, step = 1) => Array.from(Array(Math.ceil((end + 1 - st
|
|
|
5722
5762
|
const MgPagination = class {
|
|
5723
5763
|
constructor(hostRef) {
|
|
5724
5764
|
registerInstance(this, hostRef);
|
|
5725
|
-
this.currentPageChange = createEvent(this, "current-page-change"
|
|
5765
|
+
this.currentPageChange = createEvent(this, "current-page-change");
|
|
5726
5766
|
/**
|
|
5727
5767
|
* Identifier is used for the element ID (id is a reserved prop in Stencil.js)
|
|
5728
5768
|
* If not set, it will be created.
|
|
5729
5769
|
*/
|
|
5730
|
-
this.identifier =
|
|
5770
|
+
this.identifier = xt('mg-pagination');
|
|
5771
|
+
/**
|
|
5772
|
+
* Hide navigation label
|
|
5773
|
+
*/
|
|
5774
|
+
this.hideNavigationLabels = false;
|
|
5775
|
+
/**
|
|
5776
|
+
* Hide select input
|
|
5777
|
+
*/
|
|
5778
|
+
this.hidePageCount = false;
|
|
5731
5779
|
/**
|
|
5732
5780
|
* Component total pages
|
|
5733
5781
|
*/
|
|
@@ -5764,18 +5812,18 @@ const MgPagination = class {
|
|
|
5764
5812
|
};
|
|
5765
5813
|
}
|
|
5766
5814
|
watchIdentifier(newValue) {
|
|
5767
|
-
if (!
|
|
5768
|
-
console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${
|
|
5815
|
+
if (!Ot(newValue)) {
|
|
5816
|
+
console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
5769
5817
|
}
|
|
5770
5818
|
}
|
|
5771
5819
|
validateTotalPages(newValue) {
|
|
5772
5820
|
if (newValue < 1) {
|
|
5773
|
-
throw new Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${
|
|
5821
|
+
throw new Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${zt(newValue)}.`);
|
|
5774
5822
|
}
|
|
5775
5823
|
}
|
|
5776
5824
|
validateCurrentPage(newValue) {
|
|
5777
5825
|
if (newValue < 1) {
|
|
5778
|
-
throw new Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${
|
|
5826
|
+
throw new Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${zt(newValue)}.`);
|
|
5779
5827
|
}
|
|
5780
5828
|
else if (newValue > this.totalPages) {
|
|
5781
5829
|
throw new Error('<mg-pagination> prop "currentPage" can not be greater than total page.');
|
|
@@ -5805,10 +5853,10 @@ const MgPagination = class {
|
|
|
5805
5853
|
* @returns HTML Element
|
|
5806
5854
|
*/
|
|
5807
5855
|
render() {
|
|
5808
|
-
const navigationActionButton = (disabled, action) => (h("mg-button", { key: '
|
|
5856
|
+
const navigationActionButton = (disabled, action) => (h("mg-button", { key: '3c29dbe0db55d6eda6d53ee174e0e38c086beddf', label: this.messages.pagination[`${action}Page`],
|
|
5809
5857
|
// eslint-disable-next-line react/jsx-no-bind
|
|
5810
|
-
onClick: () => this.handleGoToPage(action, disabled), disabled: disabled, variant: "flat", isIcon: this.hideNavigationLabels }, action === NavigationAction.PREVIOUS && h("mg-icon", { key: '
|
|
5811
|
-
return (h(Host, { key: '
|
|
5858
|
+
onClick: () => this.handleGoToPage(action, disabled), disabled: disabled, variant: "flat", isIcon: this.hideNavigationLabels }, action === NavigationAction.PREVIOUS && h("mg-icon", { key: '677232241e8eb8beca9b9ce4a6f997dd69a5e3c1', icon: "chevron-left" }), !this.hideNavigationLabels && this.messages.general[action], action === NavigationAction.NEXT && h("mg-icon", { key: '83f0db42841d81a3bc2cea5bec4106b1f102a6e5', icon: "chevron-right" })));
|
|
5859
|
+
return (h(Host, { key: '26dea8cd6c77188eddec2e1b35dcf01d8ee458eb', hidden: this.totalPages < 2 }, h("nav", { key: 'afe38df7e48edb84598774aad6ca72225ef074e8', role: "navigation", "aria-label": this.label, id: this.identifier, class: { 'mg-c-pagination': true, 'mg-c-pagination--hide-page-count': this.hidePageCount } }, navigationActionButton(this.currentPage <= 1, NavigationAction.PREVIOUS), !this.hidePageCount && (h("div", { key: '1cfd5d883a640fc274fe5f6c8baec734e4479486', class: "mg-c-pagination__page-count" }, h("mg-input-select", { key: 'e58e285a97a1dedf7410a0240ea5607808d66db1', identifier: `${this.identifier}-select`, items: range(1, this.totalPages).map(page => page.toString()), label: this.messages.pagination.selectPage, "label-hide": true, "on-value-change": this.handleSelect, value: this.currentPage.toString(), "placeholder-hide": true }), h("span", { key: 'd5d2cc3dc4324d1a3e2386eaf1da03024313fe24', class: "mg-u-visually-hidden" }, this.messages.pagination.page, " ", this.currentPage), "/ ", this.totalPages, " ", this.totalPages > 1 ? this.messages.pagination.pages : this.messages.pagination.page)), navigationActionButton(this.currentPage >= this.totalPages, NavigationAction.NEXT))));
|
|
5812
5860
|
}
|
|
5813
5861
|
get element() { return getElement(this); }
|
|
5814
5862
|
static get watchers() { return {
|
|
@@ -5817,7 +5865,7 @@ const MgPagination = class {
|
|
|
5817
5865
|
"currentPage": ["validateCurrentPage"]
|
|
5818
5866
|
}; }
|
|
5819
5867
|
};
|
|
5820
|
-
MgPagination.style =
|
|
5868
|
+
MgPagination.style = mgPaginationCss;
|
|
5821
5869
|
|
|
5822
5870
|
/**
|
|
5823
5871
|
* Available expand toggle display options
|
|
@@ -5829,18 +5877,17 @@ const expandToggleDisplays = ['text', 'icon'];
|
|
|
5829
5877
|
const titlePositions = ['left', 'right'];
|
|
5830
5878
|
|
|
5831
5879
|
const mgPanelCss = "/*!\n * @prop --mg-c-panel-border-radius: Defines the border radius of the panel. Default value: `--mg-b-size-radius`.\n * @prop --mg-c-panel-color-background: Defines the background of the panel. Default value: `color-mix(in srgb, var(--mg-b-color-info), white 97%)`.\n * @prop --mg-c-panel-box-shadow: Defines the box shadow of the panel. Default value: `--mg-b-box-shadow`.\n * @prop --mg-c-panel-content-spacing: Defines the padding of the panel content. Default value: `--mg-b-size-16`.\n */:host{--mg-c-card-border:none;--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-panel-border-radius);--mg-c-card-color-background:var(--mg-c-panel-color-background);--mg-c-card-box-shadow:var(--mg-c-panel-box-shadow)}.mg-c-panel__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;padding:0 var(--mg-b-size-4)}.mg-c-panel__header-title,.mg-c-panel__header-content{display:flex;margin:var(--mg-b-size-4) 0}.mg-c-panel__header-content{min-height:var(--mg-b-size-min-height);flex:1 auto;align-items:center;padding-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-input-text{flex-grow:1;margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-button+mg-button:not([slot=append-input]){margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title.mg-c-panel__header-title--full{flex:1 1 auto}.mg-c-panel__collapse-button-content{--mg-b-font-size:var(--mg-b-font-size-h5);--mg-c-button-font-weight:600}.mg-c-panel__collapse-button-icon.mg-c-panel__collapse-button-icon--reverse{transform:rotate(180deg)}.mg-c-panel__content{padding:var(--mg-c-panel-content-spacing)}.mg-c-panel ::slotted([slot=header-right]){display:flex;flex-wrap:wrap;margin-left:auto;gap:var(--mg-b-spacing-actions)}.mg-c-panel ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset}";
|
|
5832
|
-
const MgPanelStyle0 = mgPanelCss;
|
|
5833
5880
|
|
|
5834
5881
|
const MgPanel = class {
|
|
5835
5882
|
constructor(hostRef) {
|
|
5836
5883
|
registerInstance(this, hostRef);
|
|
5837
|
-
this.titleChange = createEvent(this, "title-change"
|
|
5838
|
-
this.expandedChange = createEvent(this, "expanded-change"
|
|
5884
|
+
this.titleChange = createEvent(this, "title-change");
|
|
5885
|
+
this.expandedChange = createEvent(this, "expanded-change");
|
|
5839
5886
|
/**
|
|
5840
5887
|
* Identifier is used for the element ID (id is a reserved prop in Stencil.js)
|
|
5841
5888
|
* If not set, it will be created.
|
|
5842
5889
|
*/
|
|
5843
|
-
this.identifier =
|
|
5890
|
+
this.identifier = xt('mg-panel');
|
|
5844
5891
|
/**
|
|
5845
5892
|
* Define if panel title is editable
|
|
5846
5893
|
*/
|
|
@@ -5848,7 +5895,7 @@ const MgPanel = class {
|
|
|
5848
5895
|
/**
|
|
5849
5896
|
* Define title position
|
|
5850
5897
|
*/
|
|
5851
|
-
this.titlePosition =
|
|
5898
|
+
this.titlePosition = 'left';
|
|
5852
5899
|
/**
|
|
5853
5900
|
* Panel is opened
|
|
5854
5901
|
*/
|
|
@@ -5856,11 +5903,15 @@ const MgPanel = class {
|
|
|
5856
5903
|
/**
|
|
5857
5904
|
* Define expand toggle button display
|
|
5858
5905
|
*/
|
|
5859
|
-
this.expandToggleDisplay =
|
|
5906
|
+
this.expandToggleDisplay = 'text';
|
|
5907
|
+
/**
|
|
5908
|
+
* Disable possibility to toggle expand
|
|
5909
|
+
*/
|
|
5910
|
+
this.expandToggleDisabled = false;
|
|
5860
5911
|
/**
|
|
5861
5912
|
* Component classes
|
|
5862
5913
|
*/
|
|
5863
|
-
this.classCollection = new
|
|
5914
|
+
this.classCollection = new kt(['mg-c-panel']);
|
|
5864
5915
|
/**
|
|
5865
5916
|
* Title is in edition mode
|
|
5866
5917
|
*/
|
|
@@ -5959,13 +6010,13 @@ const MgPanel = class {
|
|
|
5959
6010
|
};
|
|
5960
6011
|
}
|
|
5961
6012
|
watchIdentifier(newValue) {
|
|
5962
|
-
if (!
|
|
5963
|
-
console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${
|
|
6013
|
+
if (!Ot(newValue)) {
|
|
6014
|
+
console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
5964
6015
|
}
|
|
5965
6016
|
}
|
|
5966
6017
|
validatePanelTitle(newValue) {
|
|
5967
|
-
if (!
|
|
5968
|
-
throw new Error(`<mg-panel> prop "panelTitle" is required and must be a string. Passed value: ${
|
|
6018
|
+
if (!Le(newValue))
|
|
6019
|
+
throw new Error(`<mg-panel> prop "panelTitle" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
5969
6020
|
this.titleChange.emit(newValue);
|
|
5970
6021
|
}
|
|
5971
6022
|
validateTitlePattern(newValue) {
|
|
@@ -5974,14 +6025,14 @@ const MgPanel = class {
|
|
|
5974
6025
|
}
|
|
5975
6026
|
validateTitlePosition(newValue) {
|
|
5976
6027
|
if (!titlePositions.includes(newValue))
|
|
5977
|
-
throw new Error(`<mg-panel> prop "titlePosition" must be one of: ${titlePositions.join(', ')}. Passed value: ${
|
|
6028
|
+
throw new Error(`<mg-panel> prop "titlePosition" must be one of: ${titlePositions.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5978
6029
|
}
|
|
5979
6030
|
handleExpanded(newValue) {
|
|
5980
6031
|
this.expandedChange.emit(newValue);
|
|
5981
6032
|
}
|
|
5982
6033
|
validateExpandToggleDisplay(newValue) {
|
|
5983
6034
|
if (!expandToggleDisplays.includes(newValue))
|
|
5984
|
-
throw new Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${expandToggleDisplays.join(', ')}. Passed value: ${
|
|
6035
|
+
throw new Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${expandToggleDisplays.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
5985
6036
|
if (newValue === 'icon' && this.titleEditable)
|
|
5986
6037
|
this.titleEditable = false;
|
|
5987
6038
|
}
|
|
@@ -6016,7 +6067,7 @@ const MgPanel = class {
|
|
|
6016
6067
|
*/
|
|
6017
6068
|
render() {
|
|
6018
6069
|
const headerId = `${this.identifier}-header`;
|
|
6019
|
-
return (h("section", { key: '
|
|
6070
|
+
return (h("section", { key: '82d79e85a6d6e376482b89fa9d03f5e381499dbc', class: this.classCollection.join(), id: this.identifier }, h("mg-card", { key: '6b1753575b2faece344d14d473ded961bc6ac7a1' }, h("header", { key: 'aae91889ab75aacfee1eb0b164fb60ee90d3be30', class: { 'mg-c-panel__header': true, 'mg-c-panel__header--reverse': this.titlePosition === 'right' }, id: headerId }, this.renderHeaderChildren()), h("article", { key: 'eb2cc533c8181e962c21666d67cf920b2e17cdd6', class: "mg-c-panel__content", id: `${this.identifier}-content`, "aria-labelledby": headerId, hidden: !this.expanded }, h("slot", { key: '8a638a7194bd57a4b3f849401436e5a05160080a' })))));
|
|
6020
6071
|
}
|
|
6021
6072
|
get element() { return getElement(this); }
|
|
6022
6073
|
static get watchers() { return {
|
|
@@ -6029,16 +6080,13 @@ const MgPanel = class {
|
|
|
6029
6080
|
"expandToggleDisplay": ["validateExpandToggleDisplay"]
|
|
6030
6081
|
}; }
|
|
6031
6082
|
};
|
|
6032
|
-
MgPanel.style =
|
|
6083
|
+
MgPanel.style = mgPanelCss;
|
|
6033
6084
|
|
|
6034
6085
|
/**
|
|
6035
6086
|
* Custom positioning reference element.
|
|
6036
6087
|
* @see https://floating-ui.com/docs/virtual-elements
|
|
6037
6088
|
*/
|
|
6038
6089
|
|
|
6039
|
-
const sides$1 = ['top', 'right', 'bottom', 'left'];
|
|
6040
|
-
const alignments$1 = ['start', 'end'];
|
|
6041
|
-
const placements$1 = /*#__PURE__*/sides$1.reduce((acc, side) => acc.concat(side, side + "-" + alignments$1[0], side + "-" + alignments$1[1]), []);
|
|
6042
6090
|
const min = Math.min;
|
|
6043
6091
|
const max = Math.max;
|
|
6044
6092
|
const round = Math.round;
|
|
@@ -6462,109 +6510,6 @@ const arrow$1 = options => ({
|
|
|
6462
6510
|
}
|
|
6463
6511
|
});
|
|
6464
6512
|
|
|
6465
|
-
function getPlacementList(alignment, autoAlignment, allowedPlacements) {
|
|
6466
|
-
const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
|
|
6467
|
-
return allowedPlacementsSortedByAlignment.filter(placement => {
|
|
6468
|
-
if (alignment) {
|
|
6469
|
-
return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
|
|
6470
|
-
}
|
|
6471
|
-
return true;
|
|
6472
|
-
});
|
|
6473
|
-
}
|
|
6474
|
-
/**
|
|
6475
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
6476
|
-
* that has the most space available automatically, without needing to specify a
|
|
6477
|
-
* preferred placement. Alternative to `flip`.
|
|
6478
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
6479
|
-
*/
|
|
6480
|
-
const autoPlacement = function (options) {
|
|
6481
|
-
if (options === void 0) {
|
|
6482
|
-
options = {};
|
|
6483
|
-
}
|
|
6484
|
-
return {
|
|
6485
|
-
name: 'autoPlacement',
|
|
6486
|
-
options,
|
|
6487
|
-
async fn(state) {
|
|
6488
|
-
var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
|
|
6489
|
-
const {
|
|
6490
|
-
rects,
|
|
6491
|
-
middlewareData,
|
|
6492
|
-
placement,
|
|
6493
|
-
platform,
|
|
6494
|
-
elements
|
|
6495
|
-
} = state;
|
|
6496
|
-
const {
|
|
6497
|
-
crossAxis = false,
|
|
6498
|
-
alignment,
|
|
6499
|
-
allowedPlacements = placements$1,
|
|
6500
|
-
autoAlignment = true,
|
|
6501
|
-
...detectOverflowOptions
|
|
6502
|
-
} = evaluate(options, state);
|
|
6503
|
-
const placements$1$1 = alignment !== undefined || allowedPlacements === placements$1 ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
|
|
6504
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
6505
|
-
const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
|
|
6506
|
-
const currentPlacement = placements$1$1[currentIndex];
|
|
6507
|
-
if (currentPlacement == null) {
|
|
6508
|
-
return {};
|
|
6509
|
-
}
|
|
6510
|
-
const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
|
|
6511
|
-
|
|
6512
|
-
// Make `computeCoords` start from the right place.
|
|
6513
|
-
if (placement !== currentPlacement) {
|
|
6514
|
-
return {
|
|
6515
|
-
reset: {
|
|
6516
|
-
placement: placements$1$1[0]
|
|
6517
|
-
}
|
|
6518
|
-
};
|
|
6519
|
-
}
|
|
6520
|
-
const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
|
|
6521
|
-
const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
|
|
6522
|
-
placement: currentPlacement,
|
|
6523
|
-
overflows: currentOverflows
|
|
6524
|
-
}];
|
|
6525
|
-
const nextPlacement = placements$1$1[currentIndex + 1];
|
|
6526
|
-
|
|
6527
|
-
// There are more placements to check.
|
|
6528
|
-
if (nextPlacement) {
|
|
6529
|
-
return {
|
|
6530
|
-
data: {
|
|
6531
|
-
index: currentIndex + 1,
|
|
6532
|
-
overflows: allOverflows
|
|
6533
|
-
},
|
|
6534
|
-
reset: {
|
|
6535
|
-
placement: nextPlacement
|
|
6536
|
-
}
|
|
6537
|
-
};
|
|
6538
|
-
}
|
|
6539
|
-
const placementsSortedByMostSpace = allOverflows.map(d => {
|
|
6540
|
-
const alignment = getAlignment(d.placement);
|
|
6541
|
-
return [d.placement, alignment && crossAxis ?
|
|
6542
|
-
// Check along the mainAxis and main crossAxis side.
|
|
6543
|
-
d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
|
|
6544
|
-
// Check only the mainAxis.
|
|
6545
|
-
d.overflows[0], d.overflows];
|
|
6546
|
-
}).sort((a, b) => a[1] - b[1]);
|
|
6547
|
-
const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
|
|
6548
|
-
// Aligned placements should not check their opposite crossAxis
|
|
6549
|
-
// side.
|
|
6550
|
-
getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
|
|
6551
|
-
const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
|
|
6552
|
-
if (resetPlacement !== placement) {
|
|
6553
|
-
return {
|
|
6554
|
-
data: {
|
|
6555
|
-
index: currentIndex + 1,
|
|
6556
|
-
overflows: allOverflows
|
|
6557
|
-
},
|
|
6558
|
-
reset: {
|
|
6559
|
-
placement: resetPlacement
|
|
6560
|
-
}
|
|
6561
|
-
};
|
|
6562
|
-
}
|
|
6563
|
-
return {};
|
|
6564
|
-
}
|
|
6565
|
-
};
|
|
6566
|
-
};
|
|
6567
|
-
|
|
6568
6513
|
/**
|
|
6569
6514
|
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
6570
6515
|
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
@@ -6691,206 +6636,6 @@ const flip$1 = function (options) {
|
|
|
6691
6636
|
};
|
|
6692
6637
|
};
|
|
6693
6638
|
|
|
6694
|
-
function getSideOffsets(overflow, rect) {
|
|
6695
|
-
return {
|
|
6696
|
-
top: overflow.top - rect.height,
|
|
6697
|
-
right: overflow.right - rect.width,
|
|
6698
|
-
bottom: overflow.bottom - rect.height,
|
|
6699
|
-
left: overflow.left - rect.width
|
|
6700
|
-
};
|
|
6701
|
-
}
|
|
6702
|
-
function isAnySideFullyClipped(overflow) {
|
|
6703
|
-
return sides$1.some(side => overflow[side] >= 0);
|
|
6704
|
-
}
|
|
6705
|
-
/**
|
|
6706
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
6707
|
-
* when it is not in the same clipping context as the reference element.
|
|
6708
|
-
* @see https://floating-ui.com/docs/hide
|
|
6709
|
-
*/
|
|
6710
|
-
const hide = function (options) {
|
|
6711
|
-
if (options === void 0) {
|
|
6712
|
-
options = {};
|
|
6713
|
-
}
|
|
6714
|
-
return {
|
|
6715
|
-
name: 'hide',
|
|
6716
|
-
options,
|
|
6717
|
-
async fn(state) {
|
|
6718
|
-
const {
|
|
6719
|
-
rects
|
|
6720
|
-
} = state;
|
|
6721
|
-
const {
|
|
6722
|
-
strategy = 'referenceHidden',
|
|
6723
|
-
...detectOverflowOptions
|
|
6724
|
-
} = evaluate(options, state);
|
|
6725
|
-
switch (strategy) {
|
|
6726
|
-
case 'referenceHidden':
|
|
6727
|
-
{
|
|
6728
|
-
const overflow = await detectOverflow(state, {
|
|
6729
|
-
...detectOverflowOptions,
|
|
6730
|
-
elementContext: 'reference'
|
|
6731
|
-
});
|
|
6732
|
-
const offsets = getSideOffsets(overflow, rects.reference);
|
|
6733
|
-
return {
|
|
6734
|
-
data: {
|
|
6735
|
-
referenceHiddenOffsets: offsets,
|
|
6736
|
-
referenceHidden: isAnySideFullyClipped(offsets)
|
|
6737
|
-
}
|
|
6738
|
-
};
|
|
6739
|
-
}
|
|
6740
|
-
case 'escaped':
|
|
6741
|
-
{
|
|
6742
|
-
const overflow = await detectOverflow(state, {
|
|
6743
|
-
...detectOverflowOptions,
|
|
6744
|
-
altBoundary: true
|
|
6745
|
-
});
|
|
6746
|
-
const offsets = getSideOffsets(overflow, rects.floating);
|
|
6747
|
-
return {
|
|
6748
|
-
data: {
|
|
6749
|
-
escapedOffsets: offsets,
|
|
6750
|
-
escaped: isAnySideFullyClipped(offsets)
|
|
6751
|
-
}
|
|
6752
|
-
};
|
|
6753
|
-
}
|
|
6754
|
-
default:
|
|
6755
|
-
{
|
|
6756
|
-
return {};
|
|
6757
|
-
}
|
|
6758
|
-
}
|
|
6759
|
-
}
|
|
6760
|
-
};
|
|
6761
|
-
};
|
|
6762
|
-
|
|
6763
|
-
function getBoundingRect(rects) {
|
|
6764
|
-
const minX = min(...rects.map(rect => rect.left));
|
|
6765
|
-
const minY = min(...rects.map(rect => rect.top));
|
|
6766
|
-
const maxX = max(...rects.map(rect => rect.right));
|
|
6767
|
-
const maxY = max(...rects.map(rect => rect.bottom));
|
|
6768
|
-
return {
|
|
6769
|
-
x: minX,
|
|
6770
|
-
y: minY,
|
|
6771
|
-
width: maxX - minX,
|
|
6772
|
-
height: maxY - minY
|
|
6773
|
-
};
|
|
6774
|
-
}
|
|
6775
|
-
function getRectsByLine(rects) {
|
|
6776
|
-
const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
|
|
6777
|
-
const groups = [];
|
|
6778
|
-
let prevRect = null;
|
|
6779
|
-
for (let i = 0; i < sortedRects.length; i++) {
|
|
6780
|
-
const rect = sortedRects[i];
|
|
6781
|
-
if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
|
|
6782
|
-
groups.push([rect]);
|
|
6783
|
-
} else {
|
|
6784
|
-
groups[groups.length - 1].push(rect);
|
|
6785
|
-
}
|
|
6786
|
-
prevRect = rect;
|
|
6787
|
-
}
|
|
6788
|
-
return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
|
|
6789
|
-
}
|
|
6790
|
-
/**
|
|
6791
|
-
* Provides improved positioning for inline reference elements that can span
|
|
6792
|
-
* over multiple lines, such as hyperlinks or range selections.
|
|
6793
|
-
* @see https://floating-ui.com/docs/inline
|
|
6794
|
-
*/
|
|
6795
|
-
const inline = function (options) {
|
|
6796
|
-
if (options === void 0) {
|
|
6797
|
-
options = {};
|
|
6798
|
-
}
|
|
6799
|
-
return {
|
|
6800
|
-
name: 'inline',
|
|
6801
|
-
options,
|
|
6802
|
-
async fn(state) {
|
|
6803
|
-
const {
|
|
6804
|
-
placement,
|
|
6805
|
-
elements,
|
|
6806
|
-
rects,
|
|
6807
|
-
platform,
|
|
6808
|
-
strategy
|
|
6809
|
-
} = state;
|
|
6810
|
-
// A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
|
|
6811
|
-
// ClientRect's bounds, despite the event listener being triggered. A
|
|
6812
|
-
// padding of 2 seems to handle this issue.
|
|
6813
|
-
const {
|
|
6814
|
-
padding = 2,
|
|
6815
|
-
x,
|
|
6816
|
-
y
|
|
6817
|
-
} = evaluate(options, state);
|
|
6818
|
-
const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
|
|
6819
|
-
const clientRects = getRectsByLine(nativeClientRects);
|
|
6820
|
-
const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
|
|
6821
|
-
const paddingObject = getPaddingObject(padding);
|
|
6822
|
-
function getBoundingClientRect() {
|
|
6823
|
-
// There are two rects and they are disjoined.
|
|
6824
|
-
if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
|
|
6825
|
-
// Find the first rect in which the point is fully inside.
|
|
6826
|
-
return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
|
|
6827
|
-
}
|
|
6828
|
-
|
|
6829
|
-
// There are 2 or more connected rects.
|
|
6830
|
-
if (clientRects.length >= 2) {
|
|
6831
|
-
if (getSideAxis(placement) === 'y') {
|
|
6832
|
-
const firstRect = clientRects[0];
|
|
6833
|
-
const lastRect = clientRects[clientRects.length - 1];
|
|
6834
|
-
const isTop = getSide(placement) === 'top';
|
|
6835
|
-
const top = firstRect.top;
|
|
6836
|
-
const bottom = lastRect.bottom;
|
|
6837
|
-
const left = isTop ? firstRect.left : lastRect.left;
|
|
6838
|
-
const right = isTop ? firstRect.right : lastRect.right;
|
|
6839
|
-
const width = right - left;
|
|
6840
|
-
const height = bottom - top;
|
|
6841
|
-
return {
|
|
6842
|
-
top,
|
|
6843
|
-
bottom,
|
|
6844
|
-
left,
|
|
6845
|
-
right,
|
|
6846
|
-
width,
|
|
6847
|
-
height,
|
|
6848
|
-
x: left,
|
|
6849
|
-
y: top
|
|
6850
|
-
};
|
|
6851
|
-
}
|
|
6852
|
-
const isLeftSide = getSide(placement) === 'left';
|
|
6853
|
-
const maxRight = max(...clientRects.map(rect => rect.right));
|
|
6854
|
-
const minLeft = min(...clientRects.map(rect => rect.left));
|
|
6855
|
-
const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
|
|
6856
|
-
const top = measureRects[0].top;
|
|
6857
|
-
const bottom = measureRects[measureRects.length - 1].bottom;
|
|
6858
|
-
const left = minLeft;
|
|
6859
|
-
const right = maxRight;
|
|
6860
|
-
const width = right - left;
|
|
6861
|
-
const height = bottom - top;
|
|
6862
|
-
return {
|
|
6863
|
-
top,
|
|
6864
|
-
bottom,
|
|
6865
|
-
left,
|
|
6866
|
-
right,
|
|
6867
|
-
width,
|
|
6868
|
-
height,
|
|
6869
|
-
x: left,
|
|
6870
|
-
y: top
|
|
6871
|
-
};
|
|
6872
|
-
}
|
|
6873
|
-
return fallback;
|
|
6874
|
-
}
|
|
6875
|
-
const resetRects = await platform.getElementRects({
|
|
6876
|
-
reference: {
|
|
6877
|
-
getBoundingClientRect
|
|
6878
|
-
},
|
|
6879
|
-
floating: elements.floating,
|
|
6880
|
-
strategy
|
|
6881
|
-
});
|
|
6882
|
-
if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
|
|
6883
|
-
return {
|
|
6884
|
-
reset: {
|
|
6885
|
-
rects: resetRects
|
|
6886
|
-
}
|
|
6887
|
-
};
|
|
6888
|
-
}
|
|
6889
|
-
return {};
|
|
6890
|
-
}
|
|
6891
|
-
};
|
|
6892
|
-
};
|
|
6893
|
-
|
|
6894
6639
|
// For type backwards-compatibility, the `OffsetOptions` type was also
|
|
6895
6640
|
// Derivable.
|
|
6896
6641
|
|
|
@@ -7121,90 +6866,6 @@ const limitShift$1 = function (options) {
|
|
|
7121
6866
|
};
|
|
7122
6867
|
};
|
|
7123
6868
|
|
|
7124
|
-
/**
|
|
7125
|
-
* Provides data that allows you to change the size of the floating element —
|
|
7126
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
7127
|
-
* width of the reference element.
|
|
7128
|
-
* @see https://floating-ui.com/docs/size
|
|
7129
|
-
*/
|
|
7130
|
-
const size = function (options) {
|
|
7131
|
-
if (options === void 0) {
|
|
7132
|
-
options = {};
|
|
7133
|
-
}
|
|
7134
|
-
return {
|
|
7135
|
-
name: 'size',
|
|
7136
|
-
options,
|
|
7137
|
-
async fn(state) {
|
|
7138
|
-
var _state$middlewareData, _state$middlewareData2;
|
|
7139
|
-
const {
|
|
7140
|
-
placement,
|
|
7141
|
-
rects,
|
|
7142
|
-
platform,
|
|
7143
|
-
elements
|
|
7144
|
-
} = state;
|
|
7145
|
-
const {
|
|
7146
|
-
apply = () => {},
|
|
7147
|
-
...detectOverflowOptions
|
|
7148
|
-
} = evaluate(options, state);
|
|
7149
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
7150
|
-
const side = getSide(placement);
|
|
7151
|
-
const alignment = getAlignment(placement);
|
|
7152
|
-
const isYAxis = getSideAxis(placement) === 'y';
|
|
7153
|
-
const {
|
|
7154
|
-
width,
|
|
7155
|
-
height
|
|
7156
|
-
} = rects.floating;
|
|
7157
|
-
let heightSide;
|
|
7158
|
-
let widthSide;
|
|
7159
|
-
if (side === 'top' || side === 'bottom') {
|
|
7160
|
-
heightSide = side;
|
|
7161
|
-
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
7162
|
-
} else {
|
|
7163
|
-
widthSide = side;
|
|
7164
|
-
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
7165
|
-
}
|
|
7166
|
-
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
7167
|
-
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
7168
|
-
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
|
|
7169
|
-
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
|
|
7170
|
-
const noShift = !state.middlewareData.shift;
|
|
7171
|
-
let availableHeight = overflowAvailableHeight;
|
|
7172
|
-
let availableWidth = overflowAvailableWidth;
|
|
7173
|
-
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
|
|
7174
|
-
availableWidth = maximumClippingWidth;
|
|
7175
|
-
}
|
|
7176
|
-
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
|
|
7177
|
-
availableHeight = maximumClippingHeight;
|
|
7178
|
-
}
|
|
7179
|
-
if (noShift && !alignment) {
|
|
7180
|
-
const xMin = max(overflow.left, 0);
|
|
7181
|
-
const xMax = max(overflow.right, 0);
|
|
7182
|
-
const yMin = max(overflow.top, 0);
|
|
7183
|
-
const yMax = max(overflow.bottom, 0);
|
|
7184
|
-
if (isYAxis) {
|
|
7185
|
-
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
7186
|
-
} else {
|
|
7187
|
-
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
7188
|
-
}
|
|
7189
|
-
}
|
|
7190
|
-
await apply({
|
|
7191
|
-
...state,
|
|
7192
|
-
availableWidth,
|
|
7193
|
-
availableHeight
|
|
7194
|
-
});
|
|
7195
|
-
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
7196
|
-
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
7197
|
-
return {
|
|
7198
|
-
reset: {
|
|
7199
|
-
rects: true
|
|
7200
|
-
}
|
|
7201
|
-
};
|
|
7202
|
-
}
|
|
7203
|
-
return {};
|
|
7204
|
-
}
|
|
7205
|
-
};
|
|
7206
|
-
};
|
|
7207
|
-
|
|
7208
6869
|
function hasWindow() {
|
|
7209
6870
|
return typeof window !== 'undefined';
|
|
7210
6871
|
}
|
|
@@ -8014,14 +7675,6 @@ function autoUpdate(reference, floating, update, options) {
|
|
|
8014
7675
|
*/
|
|
8015
7676
|
const offset = offset$1;
|
|
8016
7677
|
|
|
8017
|
-
/**
|
|
8018
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
8019
|
-
* that has the most space available automatically, without needing to specify a
|
|
8020
|
-
* preferred placement. Alternative to `flip`.
|
|
8021
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
8022
|
-
*/
|
|
8023
|
-
autoPlacement;
|
|
8024
|
-
|
|
8025
7678
|
/**
|
|
8026
7679
|
* Optimizes the visibility of the floating element by shifting it in order to
|
|
8027
7680
|
* keep it in view when it will overflow the clipping boundary.
|
|
@@ -8037,21 +7690,6 @@ const shift = shift$1;
|
|
|
8037
7690
|
*/
|
|
8038
7691
|
const flip = flip$1;
|
|
8039
7692
|
|
|
8040
|
-
/**
|
|
8041
|
-
* Provides data that allows you to change the size of the floating element —
|
|
8042
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
8043
|
-
* width of the reference element.
|
|
8044
|
-
* @see https://floating-ui.com/docs/size
|
|
8045
|
-
*/
|
|
8046
|
-
size;
|
|
8047
|
-
|
|
8048
|
-
/**
|
|
8049
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
8050
|
-
* when it is not in the same clipping context as the reference element.
|
|
8051
|
-
* @see https://floating-ui.com/docs/hide
|
|
8052
|
-
*/
|
|
8053
|
-
hide;
|
|
8054
|
-
|
|
8055
7693
|
/**
|
|
8056
7694
|
* Provides data to position an inner element of the floating element so that it
|
|
8057
7695
|
* appears centered to the reference element.
|
|
@@ -8059,13 +7697,6 @@ hide;
|
|
|
8059
7697
|
*/
|
|
8060
7698
|
const arrow = arrow$1;
|
|
8061
7699
|
|
|
8062
|
-
/**
|
|
8063
|
-
* Provides improved positioning for inline reference elements that can span
|
|
8064
|
-
* over multiple lines, such as hyperlinks or range selections.
|
|
8065
|
-
* @see https://floating-ui.com/docs/inline
|
|
8066
|
-
*/
|
|
8067
|
-
inline;
|
|
8068
|
-
|
|
8069
7700
|
/**
|
|
8070
7701
|
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
8071
7702
|
*/
|
|
@@ -8125,18 +7756,17 @@ const isFloatingUIPlacement = (placement) => placements.filter(p => !p.includes(
|
|
|
8125
7756
|
const alignments = ['start', null, 'end'];
|
|
8126
7757
|
|
|
8127
7758
|
const mgPopoverCss = "/*!\n * @prop --mg-c-popover-color-background: Defines the background color of the popover. Default value: `--mg-b-color-light`.\n * @prop --mg-c-popover-color-text: Defines the font color of the popover. Default value: `--mg-b-color-font-dark`.\n * @prop --mg-c-popover-title-font-size: Defines the font size of the popover title. Default value: `--mg-b-font-size-h5`.\n * @prop --mg-c-popover-padding-vertical: Defines the vertical padding of the popover. Default value: `unset`, fallback to `--mg-b-size-16`.\n * @prop --mg-c-popover-padding-horizontal: Defines the horizontal padding of the popover. Default value: `unset`, fallback to `--mg-b-size-16`.\n * @prop --mg-c-popover-max-width: Defines the max-width of the popover. Default value: `--mg-b-size-floating-element-max-width`.\n * @prop --mg-c-popover-min-width: Defines the min-width of the popover. Default value: `unset`.\n */:host{--mg-c-card-spacing:var(--mg-c-popover-padding-vertical, var(--mg-b-size-16)) var(--mg-c-popover-padding-horizontal, var(--mg-b-size-16));--mg-c-card-border:none;--mg-c-card-border-radius:var(--mg-b-size-radius);--mg-c-card-color-background:var(--mg-c-popover-color-background);position:relative;display:contents}:host::slotted(*){display:inline-block}";
|
|
8128
|
-
const MgPopoverStyle0 = mgPopoverCss;
|
|
8129
7759
|
|
|
8130
7760
|
const MgPopover = class {
|
|
8131
7761
|
constructor(hostRef) {
|
|
8132
7762
|
registerInstance(this, hostRef);
|
|
8133
|
-
this.displayChange = createEvent(this, "display-change"
|
|
8134
|
-
this.componentClose = createEvent(this, "component-close"
|
|
7763
|
+
this.displayChange = createEvent(this, "display-change");
|
|
7764
|
+
this.componentClose = createEvent(this, "component-close");
|
|
8135
7765
|
/**
|
|
8136
7766
|
* Sets an `id` attribute.
|
|
8137
7767
|
* Needed by the input for accessibility `aria-decribedby`.
|
|
8138
7768
|
*/
|
|
8139
|
-
this.identifier =
|
|
7769
|
+
this.identifier = xt('mg-popover');
|
|
8140
7770
|
/**
|
|
8141
7771
|
* Popover placement
|
|
8142
7772
|
*/
|
|
@@ -8331,8 +7961,8 @@ const MgPopover = class {
|
|
|
8331
7961
|
};
|
|
8332
7962
|
}
|
|
8333
7963
|
validateIdentifier(newValue) {
|
|
8334
|
-
if (!
|
|
8335
|
-
throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${
|
|
7964
|
+
if (!Ot(newValue)) {
|
|
7965
|
+
throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
8336
7966
|
}
|
|
8337
7967
|
// use renderPopoverContent to update popover-content id
|
|
8338
7968
|
this.renderPopoverContent();
|
|
@@ -8373,7 +8003,7 @@ const MgPopover = class {
|
|
|
8373
8003
|
*/
|
|
8374
8004
|
componentWillLoad() {
|
|
8375
8005
|
// Get windows to attach events
|
|
8376
|
-
this.windows =
|
|
8006
|
+
this.windows = Rt(window);
|
|
8377
8007
|
// render mg-popover-content slot
|
|
8378
8008
|
this.renderPopoverContent();
|
|
8379
8009
|
this.validateCloseButton(this.closeButton);
|
|
@@ -8438,7 +8068,7 @@ const MgPopover = class {
|
|
|
8438
8068
|
* @returns HTML Element
|
|
8439
8069
|
*/
|
|
8440
8070
|
render() {
|
|
8441
|
-
return (h(Host, { key: '
|
|
8071
|
+
return (h(Host, { key: 'a2c883c6f1458bfc76d77d944afe99210d0ecdb3' }, h("slot", { key: 'c3d2e25f47c5761be6594cb6cd487e4960e5d30b' }), h("slot", { key: '93bb53d3eac2c2b966eacb00b772faa403b5a86c', name: "content" })));
|
|
8442
8072
|
}
|
|
8443
8073
|
get element() { return getElement(this); }
|
|
8444
8074
|
static get watchers() { return {
|
|
@@ -8449,15 +8079,14 @@ const MgPopover = class {
|
|
|
8449
8079
|
"display": ["handleDisplay"]
|
|
8450
8080
|
}; }
|
|
8451
8081
|
};
|
|
8452
|
-
MgPopover.style =
|
|
8082
|
+
MgPopover.style = mgPopoverCss;
|
|
8453
8083
|
|
|
8454
8084
|
const mgPopoverContentCss = ":host{position:relative;z-index:2000;display:none;padding:var(--mg-b-size-8);color:var(--mg-c-popover-color-text)}:host([data-show]){display:block}:host([data-placement^=left-start]),:host([data-placement^=left-end]),:host([data-placement^=right-start]),:host([data-placement^=right-end]){padding:0 var(--mg-b-size-8)}.mg-c-popover-content{--mg-c-card-max-width:var(--mg-c-popover-max-width);--mg-c-card-min-width:var(--mg-c-popover-min-width)}.mg-c-popover-content mg-button{margin-top:calc(-1*(var(--mg-b-size-min-height) - var(--mg-c-popover-title-font-size)*var(--mg-b-line-height))/2);margin-right:calc(-1*(var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);margin-left:var(--mg-b-size-32);float:right}.mg-c-popover-content__title ::slotted([slot=title]){margin:0 0 var(--mg-b-size-8) !important;font-size:var(--mg-c-popover-title-font-size) !important;font-weight:600 !important}.mg-c-popover-content ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset}:host([data-placement^=top][data-arrow-hide]){padding-bottom:0}:host([data-placement^=bottom][data-arrow-hide]){padding-top:0}:host([data-placement$=end][data-arrow-hide]),:host([data-placement^=left][data-arrow-hide]){padding-right:0}:host([data-placement$=start][data-arrow-hide]),:host([data-placement^=right][data-arrow-hide]){padding-left:0}::slotted([slot=arrow]){position:absolute;width:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius) + 2*var(--mg-b-size-8));height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius) + 2*var(--mg-b-size-8));visibility:hidden}::slotted([slot=arrow])::before{position:absolute;content:\"\";visibility:visible}:host([data-arrow-hide]) ::slotted([slot=arrow]){display:none}:host([data-placement^=top]) ::slotted([slot=arrow]),:host([data-placement^=bottom]) ::slotted([slot=arrow]){height:var(--mg-b-size-8)}:host([data-placement^=top]) ::slotted([slot=arrow])::before,:host([data-placement^=bottom]) ::slotted([slot=arrow])::before{left:calc(var(--mg-c-card-border-radius) + var(--mg-b-size-8));border-right:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-left:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-placement^=top]) ::slotted([slot=arrow]){bottom:var(--mg-b-size-border);filter:drop-shadow(0 0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-placement^=top]) ::slotted([slot=arrow])::before{border-top:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=bottom]) ::slotted([slot=arrow]){top:var(--mg-b-size-border);filter:drop-shadow(0 -0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-placement^=bottom]) ::slotted([slot=arrow])::before{border-bottom:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left]) ::slotted([slot=arrow]),:host([data-placement^=right]) ::slotted([slot=arrow]){width:var(--mg-b-size-8)}:host([data-placement^=left]) ::slotted([slot=arrow])::before,:host([data-placement^=right]) ::slotted([slot=arrow])::before{top:calc(var(--mg-c-card-border-radius) + var(--mg-b-size-8));border-top:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-placement^=left]) ::slotted([slot=arrow]){right:var(--mg-b-size-border);filter:drop-shadow(0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-placement^=left]) ::slotted([slot=arrow])::before{border-left:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=right]) ::slotted([slot=arrow]){left:var(--mg-b-size-border);filter:drop-shadow(-0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-placement^=right]) ::slotted([slot=arrow])::before{border-right:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left-start]) ::slotted([slot=arrow]),:host([data-placement^=left-end]) ::slotted([slot=arrow]),:host([data-placement^=right-start]) ::slotted([slot=arrow]),:host([data-placement^=right-end]) ::slotted([slot=arrow]){height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius))}:host([data-placement^=left-start]) ::slotted([slot=arrow])::before,:host([data-placement^=left-end]) ::slotted([slot=arrow])::before,:host([data-placement^=right-start]) ::slotted([slot=arrow])::before,:host([data-placement^=right-end]) ::slotted([slot=arrow])::before{top:var(--mg-c-card-border-radius)}";
|
|
8455
|
-
const MgPopoverContentStyle0 = mgPopoverContentCss;
|
|
8456
8085
|
|
|
8457
8086
|
const MgPopoverContent = class {
|
|
8458
8087
|
constructor(hostRef) {
|
|
8459
8088
|
registerInstance(this, hostRef);
|
|
8460
|
-
this.hideContent = createEvent(this, "hide-content"
|
|
8089
|
+
this.hideContent = createEvent(this, "hide-content");
|
|
8461
8090
|
/**
|
|
8462
8091
|
* Define if popover has a cross button
|
|
8463
8092
|
*/
|
|
@@ -8465,7 +8094,7 @@ const MgPopoverContent = class {
|
|
|
8465
8094
|
/**
|
|
8466
8095
|
* Component classes
|
|
8467
8096
|
*/
|
|
8468
|
-
this.classCollection = new
|
|
8097
|
+
this.classCollection = new kt(['mg-c-popover-content']);
|
|
8469
8098
|
/**
|
|
8470
8099
|
* Handle action for close button
|
|
8471
8100
|
*/
|
|
@@ -8489,7 +8118,7 @@ const MgPopoverContent = class {
|
|
|
8489
8118
|
componentDidLoad() {
|
|
8490
8119
|
const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
|
|
8491
8120
|
const slottedTitleElement = this.element.querySelector('[slot="title"]');
|
|
8492
|
-
if (slottedTitleElement && !
|
|
8121
|
+
if (slottedTitleElement && !Tt(slottedTitleElement, headingTags)) {
|
|
8493
8122
|
throw new Error(`<mg-popover> Slotted title must be a heading: ${headingTags.join(', ')}.`);
|
|
8494
8123
|
}
|
|
8495
8124
|
}
|
|
@@ -8502,15 +8131,14 @@ const MgPopoverContent = class {
|
|
|
8502
8131
|
}
|
|
8503
8132
|
get element() { return getElement(this); }
|
|
8504
8133
|
};
|
|
8505
|
-
MgPopoverContent.style =
|
|
8134
|
+
MgPopoverContent.style = mgPopoverContentCss;
|
|
8506
8135
|
|
|
8507
8136
|
const mgSkipLinksCss = ".mg-c-skip-links{position:absolute;display:flex;min-height:var(--mg-b-size-56);align-items:center;background:var(--mg-b-color-light);opacity:0;transform:translateY(-100%)}.mg-c-skip-links:focus-within{position:relative;opacity:1;transform:translateY(0)}.mg-c-skip-links__list{display:flex;flex-wrap:wrap;align-items:center;padding:0 var(--mg-b-size-16);margin:0;gap:var(--mg-b-spacing-actions);list-style:none}.mg-c-skip-links__link{display:inline-block;padding:var(--mg-b-size-8) var(--mg-b-size-16);color:var(--mg-b-color-dark)}.mg-c-skip-links__link:hover{background:hsl(var(--mg-b-color-dark-h), var(--mg-b-color-dark-s), var(--mg-b-color-dark-l), 10%)}";
|
|
8508
|
-
const MgSkipLinksStyle0 = mgSkipLinksCss;
|
|
8509
8137
|
|
|
8510
8138
|
const MgSkipLinks = class {
|
|
8511
8139
|
constructor(hostRef) {
|
|
8512
8140
|
registerInstance(this, hostRef);
|
|
8513
|
-
this.goToAnchor = createEvent(this, "go-to-anchor"
|
|
8141
|
+
this.goToAnchor = createEvent(this, "go-to-anchor");
|
|
8514
8142
|
/***********
|
|
8515
8143
|
* Methods *
|
|
8516
8144
|
**********/
|
|
@@ -8524,7 +8152,7 @@ const MgSkipLinks = class {
|
|
|
8524
8152
|
};
|
|
8525
8153
|
}
|
|
8526
8154
|
validateLinks(links) {
|
|
8527
|
-
if (links === undefined || links.length === 0 || links.some(link => !
|
|
8155
|
+
if (links === undefined || links.length === 0 || links.some(link => !Le(link.href) || !link.href.startsWith('#') || !Le(link.label))) {
|
|
8528
8156
|
throw new Error(`<mg-skip-links> prop "links": Cannot be empty and each link must contains an href starting with a "#" and a non empty label attributes.`);
|
|
8529
8157
|
}
|
|
8530
8158
|
}
|
|
@@ -8550,7 +8178,7 @@ const MgSkipLinks = class {
|
|
|
8550
8178
|
"links": ["validateLinks"]
|
|
8551
8179
|
}; }
|
|
8552
8180
|
};
|
|
8553
|
-
MgSkipLinks.style =
|
|
8181
|
+
MgSkipLinks.style = mgSkipLinksCss;
|
|
8554
8182
|
|
|
8555
8183
|
/**
|
|
8556
8184
|
* Sizes
|
|
@@ -8566,7 +8194,6 @@ const textAlignments = ['left', 'center', 'right'];
|
|
|
8566
8194
|
const dataTypes = ['string', 'numeric', 'date'];
|
|
8567
8195
|
|
|
8568
8196
|
const mgTableCss = ".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}}@font-face{font-family:\"Open Sans\";src:url(\"fonts/OpenSans-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Open Sans\";font-weight:600;src:url(\"fonts/OpenSans-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Open Sans\";font-weight:700;src:url(\"fonts/OpenSans-Bold.ttf\") format(\"truetype\")}p{margin:0}p+p{margin-top:var(--mg-b-size-8)}h1,.mg-u-h1{font-family:var(--mg-b-font-family-heading);font-weight:bold}h2,.mg-u-h2{font-family:var(--mg-b-font-family-heading);font-weight:bold}h3,.mg-u-h3{font-family:var(--mg-b-font-family-heading);font-weight:bold}h4,.mg-u-h4{font-family:var(--mg-b-font-family-heading);font-weight:bold}h5,.mg-u-h5{font-family:var(--mg-b-font-family-heading);font-weight:bold}h6,.mg-u-h6{font-family:var(--mg-b-font-family-heading);font-weight:bold}h1,.mg-u-h1{font-size:var(--mg-b-font-size-h1)}h2,.mg-u-h2{font-size:var(--mg-b-font-size-h2)}h3,.mg-u-h3{font-size:var(--mg-b-font-size-h3)}h4,.mg-u-h4{font-size:var(--mg-b-font-size-h4)}h5,.mg-u-h5{font-size:var(--mg-b-font-size-h5)}h6,.mg-u-h6{font-size:var(--mg-b-font-size-h6)}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}small{font-size:var(--mg-b-small-font-size)}.mg-u-text-left{text-align:left !important}.mg-u-text-center{text-align:center !important}.mg-u-text-right{text-align:right !important}.mg-c-table{--mg-c-table-cell-spacing:var(--mg-b-size-8) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-40);--mg-c-table-header-cell-height:calc(var(--mg-b-size-min-height) + 2 * var(--mg-b-size-8));overflow:hidden;border:none;border-radius:var(--mg-b-size-8);background:var(--mg-b-color-light);border-collapse:separate;border-spacing:0;color:var(--mg-b-color-dark)}.mg-c-table td,.mg-c-table th{height:var(--mg-c-table-cell-height);box-sizing:border-box;padding:var(--mg-c-table-cell-spacing);text-align:start}.mg-c-table thead td,.mg-c-table th{font-weight:600}.mg-c-table thead{height:var(--mg-c-table-header-cell-height);background-color:var(--mg-b-color-app);color:var(--mg-b-color-light)}.mg-c-table :not(thead) tr:nth-child(even){background:color-mix(in srgb, var(--mg-b-color-app), transparent 80%)}.mg-c-table.mg-c-table--size-small{--mg-c-table-cell-spacing:var(--mg-b-size-4) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-32);--mg-c-table-header-cell-height:var(--mg-b-size-32)}.mg-c-table.mg-c-table--size-large{--mg-c-table-cell-height:var(--mg-c-table-header-cell-height)}.mg-c-table.mg-c-table--size-xlarge{--mg-c-table-cell-spacing:var(--mg-b-size-12) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-64);--mg-c-table-header-cell-height:var(--mg-b-size-64)}.mg-c-table.mg-c-table--full-width{width:100%}.mg-c-table-wrapper{overflow:auto}.mg-c-table thead td,.mg-c-table thead th{position:relative}.mg-c-table thead td .mg-c-table__sort-button,.mg-c-table thead th .mg-c-table__sort-button{padding:0;border:none;margin:0;background:none;color:inherit;font-size:inherit;font-weight:600}.mg-c-table thead td .mg-c-table__sort-button::after,.mg-c-table thead th .mg-c-table__sort-button::after{position:absolute;content:\"\";inset:0}.mg-c-table thead td .mg-c-table__sort-button:hover,.mg-c-table thead th .mg-c-table__sort-button:hover{cursor:pointer}.mg-c-table thead td .mg-c-table__sort-button mg-icon,.mg-c-table thead th .mg-c-table__sort-button mg-icon{margin-left:var(--mg-b-size-4)}.mg-c-table thead td:has(.mg-c-table__sort-button):hover,.mg-c-table thead td[aria-sort=descending],.mg-c-table thead td[aria-sort=ascending],.mg-c-table thead th:has(.mg-c-table__sort-button):hover,.mg-c-table thead th[aria-sort=descending],.mg-c-table thead th[aria-sort=ascending]{background-color:color-mix(in srgb, var(--mg-b-color-app), black 10%)}";
|
|
8569
|
-
const MgTableStyle0 = mgTableCss;
|
|
8570
8197
|
|
|
8571
8198
|
/**
|
|
8572
8199
|
* Check if value is a valid align object
|
|
@@ -8631,11 +8258,11 @@ const MgTable = class {
|
|
|
8631
8258
|
/**
|
|
8632
8259
|
* Class collection
|
|
8633
8260
|
*/
|
|
8634
|
-
this.classCollection = new
|
|
8261
|
+
this.classCollection = new kt([this.componentClass]);
|
|
8635
8262
|
}
|
|
8636
8263
|
watchSize(newValue, oldValue) {
|
|
8637
8264
|
if (!sizes$1.includes(newValue)) {
|
|
8638
|
-
throw new Error(`<mg-table> prop "size" must be one of: ${sizes$1.join(', ')}. Passed value: ${
|
|
8265
|
+
throw new Error(`<mg-table> prop "size" must be one of: ${sizes$1.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
8639
8266
|
}
|
|
8640
8267
|
else {
|
|
8641
8268
|
if (oldValue !== undefined) {
|
|
@@ -8654,7 +8281,7 @@ const MgTable = class {
|
|
|
8654
8281
|
}
|
|
8655
8282
|
watchColumns(newValue) {
|
|
8656
8283
|
if (newValue !== undefined && !isValidColumnsObject(newValue)) {
|
|
8657
|
-
throw new Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${
|
|
8284
|
+
throw new Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${zt(newValue)}.`);
|
|
8658
8285
|
}
|
|
8659
8286
|
}
|
|
8660
8287
|
/**
|
|
@@ -8783,8 +8410,8 @@ const MgTable = class {
|
|
|
8783
8410
|
// Ensure caption is not visible (otherwhise the table does not have rounded corners)
|
|
8784
8411
|
captionTable.className = 'mg-u-visually-hidden';
|
|
8785
8412
|
// Link caption to div
|
|
8786
|
-
if (!
|
|
8787
|
-
captionTable.setAttribute('id',
|
|
8413
|
+
if (!Le(captionTable.id)) {
|
|
8414
|
+
captionTable.setAttribute('id', xt(`${this.componentClass}-caption`));
|
|
8788
8415
|
}
|
|
8789
8416
|
divWrapper.setAttribute('aria-labelledby', captionTable.id);
|
|
8790
8417
|
// Add sortable caption if neeeded
|
|
@@ -8829,7 +8456,7 @@ const MgTable = class {
|
|
|
8829
8456
|
"columns": ["watchColumns"]
|
|
8830
8457
|
}; }
|
|
8831
8458
|
};
|
|
8832
|
-
MgTable.style =
|
|
8459
|
+
MgTable.style = mgTableCss;
|
|
8833
8460
|
|
|
8834
8461
|
/**
|
|
8835
8462
|
* Available tabs items status
|
|
@@ -8846,7 +8473,6 @@ const Status = {
|
|
|
8846
8473
|
const sizes = ['medium', 'large'];
|
|
8847
8474
|
|
|
8848
8475
|
const mgTabsCss = "/*!\n * @prop --mg-c-tabs-color: Defines tabs global color, used for bottom line and active tabs. Default value: `--mg-b-color-app`.\n * @prop --mg-c-tabs-color-text: Defines tabs text color. Unset by default, fallback on `--mg-b-color-dark`.\n */.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium{padding:var(--mg-b-size-12) var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button,.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button ::slotted([slot=label]),.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button ::slotted([slot=metadata]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium ::slotted([slot=label]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium ::slotted([slot=metadata]){font-size:var(--mg-b-font-size)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--horizontal,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium.mg-c-tabs__navigation-button--horizontal{padding-bottom:var(--mg-b-size-12)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--vertical,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium.mg-c-tabs__navigation-button--vertical{padding-left:var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large{padding:var(--mg-b-size-16) var(--mg-b-size-32)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button,.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button ::slotted([slot=label]),.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button ::slotted([slot=metadata]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large ::slotted([slot=label]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large ::slotted([slot=metadata]){font-size:var(--mg-b-font-size-h4)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--horizontal,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large.mg-c-tabs__navigation-button--horizontal{padding-bottom:var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--vertical,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large.mg-c-tabs__navigation-button--vertical{padding-left:var(--mg-b-size-32)}.mg-c-tabs__navigation-button{display:flex;box-sizing:border-box;align-items:center;border:none;background-color:unset;color:var(--mg-c-tabs-color-text, var(--mg-b-color-dark));column-gap:var(--mg-c-tabs-navigation-button-column-gap, var(--mg-b-size-8));cursor:pointer;font-family:var(--mg-b-font-family);font-weight:400;line-height:var(--mg-b-line-height);text-decoration:none;white-space:nowrap}.mg-c-tabs__navigation-button:disabled,.mg-c-tabs__navigation-button--disabled{cursor:default;opacity:var(--mg-b-opacity-element-disabled)}.mg-c-tabs__navigation-button:focus-visible{z-index:10}.mg-c-tabs__navigation-button:hover:not(.mg-c-tabs__navigation-button--disabled),.mg-c-tabs__navigation-button:focus-visible:not(.mg-c-tabs__navigation-button--disabled){background-color:color-mix(in srgb, var(--mg-c-tabs-color), transparent 90%)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active{color:var(--mg-c-tabs-color);font-weight:600}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--horizontal{box-shadow:inset 0 calc(-1*var(--mg-b-size-4)) var(--mg-c-tabs-color)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--vertical{box-shadow:inset var(--mg-b-size-4) 0 var(--mg-c-tabs-color)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--hidden{display:none}.mg-c-tabs__header{display:flex;flex-flow:row wrap;border-bottom:var(--mg-b-size-border) solid color-mix(in srgb, var(--mg-c-tabs-color), transparent 90%)}.mg-c-tabs__content-container:focus-visible{outline:none}.mg-c-tabs__navigation-button-text{flex:0 0 content}";
|
|
8849
|
-
const MgTabsStyle0 = mgTabsCss;
|
|
8850
8476
|
|
|
8851
8477
|
/**
|
|
8852
8478
|
* type TabItem validation function
|
|
@@ -8857,7 +8483,7 @@ const isTabItem = (tab) => typeof tab === 'object' && typeof tab.label === 'stri
|
|
|
8857
8483
|
const MgTabs = class {
|
|
8858
8484
|
constructor(hostRef) {
|
|
8859
8485
|
registerInstance(this, hostRef);
|
|
8860
|
-
this.activeTabChange = createEvent(this, "active-tab-change"
|
|
8486
|
+
this.activeTabChange = createEvent(this, "active-tab-change");
|
|
8861
8487
|
/************
|
|
8862
8488
|
* Internal *
|
|
8863
8489
|
************/
|
|
@@ -8869,7 +8495,7 @@ const MgTabs = class {
|
|
|
8869
8495
|
* Identifier is used for the element ID (id is a reserved prop in Stencil.js)
|
|
8870
8496
|
* If not set, it will be created.
|
|
8871
8497
|
*/
|
|
8872
|
-
this.identifier =
|
|
8498
|
+
this.identifier = xt('mg-tabs');
|
|
8873
8499
|
/**
|
|
8874
8500
|
* Define tabs size
|
|
8875
8501
|
*/
|
|
@@ -8881,7 +8507,7 @@ const MgTabs = class {
|
|
|
8881
8507
|
/**
|
|
8882
8508
|
* Component classes
|
|
8883
8509
|
*/
|
|
8884
|
-
this.classCollection = new
|
|
8510
|
+
this.classCollection = new kt(['mg-c-tabs']);
|
|
8885
8511
|
/**
|
|
8886
8512
|
* Validate that new tab status can be `Status.ACTIVE`
|
|
8887
8513
|
* @param tab - tab item
|
|
@@ -8979,7 +8605,7 @@ const MgTabs = class {
|
|
|
8979
8605
|
*/
|
|
8980
8606
|
this.resetFocus = () => {
|
|
8981
8607
|
// update asynchronously tabindex to prevent get focus on new tabindex at then end of event process
|
|
8982
|
-
|
|
8608
|
+
Mt(() => {
|
|
8983
8609
|
this.tabFocus = undefined;
|
|
8984
8610
|
Array.from(this.element.shadowRoot.querySelectorAll('[data-index]')).forEach((tab, index) => {
|
|
8985
8611
|
tab.setAttribute('tabindex', this.activeTab - this.startIndex !== index ? '-1' : '0');
|
|
@@ -8996,30 +8622,30 @@ const MgTabs = class {
|
|
|
8996
8622
|
};
|
|
8997
8623
|
}
|
|
8998
8624
|
watchIdentifier(newValue) {
|
|
8999
|
-
if (!
|
|
9000
|
-
console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${
|
|
8625
|
+
if (!Ot(newValue)) {
|
|
8626
|
+
console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
9001
8627
|
}
|
|
9002
8628
|
}
|
|
9003
8629
|
validateLabel(newValue) {
|
|
9004
|
-
if (!
|
|
9005
|
-
throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${
|
|
8630
|
+
if (!Le(newValue)) {
|
|
8631
|
+
throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
9006
8632
|
}
|
|
9007
8633
|
}
|
|
9008
8634
|
validateSize(newValue) {
|
|
9009
8635
|
if (!sizes.includes(newValue)) {
|
|
9010
|
-
throw new Error(`<mg-tabs> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${
|
|
8636
|
+
throw new Error(`<mg-tabs> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
9011
8637
|
}
|
|
9012
8638
|
this.classCollection.add(`mg-c-tabs--size-${this.size}`);
|
|
9013
8639
|
}
|
|
9014
8640
|
validateItems(newValue) {
|
|
9015
8641
|
// String array
|
|
9016
|
-
if (
|
|
8642
|
+
if (At(newValue))
|
|
9017
8643
|
this.tabs = newValue.map(item => ({ label: item, status: Status.VISIBLE }));
|
|
9018
8644
|
// Object array
|
|
9019
8645
|
else if (Array.isArray(newValue) && newValue.length > 0 && newValue.every(isTabItem))
|
|
9020
8646
|
this.tabs = newValue;
|
|
9021
8647
|
else
|
|
9022
|
-
throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${
|
|
8648
|
+
throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${zt(newValue)}.`);
|
|
9023
8649
|
}
|
|
9024
8650
|
validateActiveTab(newValue) {
|
|
9025
8651
|
// when `active-tab` is undefined we set default value by searching an item with `Status.ACTIVE` or we use the `startIndex` has fallback value
|
|
@@ -9044,7 +8670,7 @@ const MgTabs = class {
|
|
|
9044
8670
|
this.activeTabChange.emit(newValue);
|
|
9045
8671
|
}
|
|
9046
8672
|
else {
|
|
9047
|
-
throw new Error(`<mg-tabs> prop "activeTab" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be "activable". Passed value: ${
|
|
8673
|
+
throw new Error(`<mg-tabs> prop "activeTab" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be "activable". Passed value: ${zt(newValue)}.`);
|
|
9048
8674
|
}
|
|
9049
8675
|
}
|
|
9050
8676
|
/*************
|
|
@@ -9096,7 +8722,7 @@ const MgTabs = class {
|
|
|
9096
8722
|
"activeTab": ["validateActiveTab"]
|
|
9097
8723
|
}; }
|
|
9098
8724
|
};
|
|
9099
|
-
MgTabs.style =
|
|
8725
|
+
MgTabs.style = mgTabsCss;
|
|
9100
8726
|
|
|
9101
8727
|
/**
|
|
9102
8728
|
* List of all possibles variants
|
|
@@ -9104,7 +8730,6 @@ MgTabs.style = MgTabsStyle0;
|
|
|
9104
8730
|
const variants = ['primary', 'secondary', 'success', 'warning', 'danger', 'info'];
|
|
9105
8731
|
|
|
9106
8732
|
const mgTagCss = "/*!\n * @prop --mg-c-tag-height: Defines the height of the tag. Default value is `--mg-b-size-24`.\n * @prop --mg-c-tag-border-radius: Defines the border radius of the tag. Default value is `--mg-b-size-radius`.\n * @prop --mg-c-tag-font-size: Defines the font size of the tag. Default value is `--mg-b-font-size-small`.\n */:host{display:inline-block}.mg-c-tag{display:inline-flex;min-height:var(--mg-c-tag-height);box-sizing:border-box;align-items:center;padding:calc((var(--mg-c-tag-height) - 2*var(--mg-b-size-border) - var(--mg-c-tag-font-size)*var(--mg-b-line-height))/2) calc(var(--mg-b-size-8) - var(--mg-b-size-border));border:var(--mg-b-size-border) solid;border-radius:var(--mg-c-tag-border-radius);font-size:var(--mg-c-tag-font-size);font-weight:600;text-align:center;vertical-align:middle}.mg-c-tag.mg-c-tag--primary{border-color:var(--mg-b-color-neutral-110);background-color:var(--mg-b-color-neutral-110);color:var(--mg-b-color-text-on-primary)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--secondary{border-color:var(--mg-b-color-neutral-10);background-color:var(--mg-b-color-neutral-10);color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-10)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--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-tag.mg-c-tag--danger.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft{border-color:var(--mg-b-color-red-20);background-color:var(--mg-b-color-red-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--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-tag.mg-c-tag--info.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft{border-color:var(--mg-b-color-blue-20);background-color:var(--mg-b-color-blue-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--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-tag.mg-c-tag--success.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft{border-color:var(--mg-b-color-green-20);background-color:var(--mg-b-color-green-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--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-tag.mg-c-tag--warning.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft{border-color:var(--mg-b-color-yellow-20);background-color:var(--mg-b-color-yellow-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-warning)}::slotted(mg-icon){margin-right:var(--mg-b-size-4)}slot{display:inline-flex;align-items:center}";
|
|
9107
|
-
const MgTagStyle0 = mgTagCss;
|
|
9108
8733
|
|
|
9109
8734
|
const MgTag = class {
|
|
9110
8735
|
constructor(hostRef) {
|
|
@@ -9118,15 +8743,23 @@ const MgTag = class {
|
|
|
9118
8743
|
/**
|
|
9119
8744
|
* Define tag variant
|
|
9120
8745
|
*/
|
|
9121
|
-
this.variant =
|
|
8746
|
+
this.variant = 'primary';
|
|
8747
|
+
/**
|
|
8748
|
+
* Define if tag is using outline style
|
|
8749
|
+
*/
|
|
8750
|
+
this.outline = false;
|
|
8751
|
+
/**
|
|
8752
|
+
* Define if tag is using soft style
|
|
8753
|
+
*/
|
|
8754
|
+
this.soft = false;
|
|
9122
8755
|
/**
|
|
9123
8756
|
* Component classes
|
|
9124
8757
|
*/
|
|
9125
|
-
this.classCollection = new
|
|
8758
|
+
this.classCollection = new kt(['mg-c-tag']);
|
|
9126
8759
|
}
|
|
9127
8760
|
validateVariant(newValue, oldValue) {
|
|
9128
8761
|
if (!variants.includes(newValue)) {
|
|
9129
|
-
throw new Error(`<mg-tag> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${
|
|
8762
|
+
throw new Error(`<mg-tag> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${zt(newValue)}.`);
|
|
9130
8763
|
}
|
|
9131
8764
|
else {
|
|
9132
8765
|
if (oldValue !== undefined) {
|
|
@@ -9159,7 +8792,7 @@ const MgTag = class {
|
|
|
9159
8792
|
* @param textContent - html element textContent property
|
|
9160
8793
|
*/
|
|
9161
8794
|
validateTextContent(textContent) {
|
|
9162
|
-
if (!
|
|
8795
|
+
if (!Le(textContent))
|
|
9163
8796
|
throw new Error('<mg-tag> slot must contain a text content.');
|
|
9164
8797
|
}
|
|
9165
8798
|
/*************
|
|
@@ -9179,7 +8812,7 @@ const MgTag = class {
|
|
|
9179
8812
|
* @returns HTML Element
|
|
9180
8813
|
*/
|
|
9181
8814
|
render() {
|
|
9182
|
-
return (h("span", { key: '
|
|
8815
|
+
return (h("span", { key: '2517dd6020afcf91017c9cfb6a1f3037c0b6a7c4', class: this.classCollection.join() }, h("slot", { key: '0f0f0f82274342a87d98125631174f40060105af' })));
|
|
9183
8816
|
}
|
|
9184
8817
|
get element() { return getElement(this); }
|
|
9185
8818
|
static get watchers() { return {
|
|
@@ -9188,7 +8821,7 @@ const MgTag = class {
|
|
|
9188
8821
|
"soft": ["validateSoft"]
|
|
9189
8822
|
}; }
|
|
9190
8823
|
};
|
|
9191
|
-
MgTag.style =
|
|
8824
|
+
MgTag.style = mgTagCss;
|
|
9192
8825
|
|
|
9193
8826
|
const Guard = {
|
|
9194
8827
|
FOCUS: 'focus',
|
|
@@ -9198,7 +8831,6 @@ const Guard = {
|
|
|
9198
8831
|
};
|
|
9199
8832
|
|
|
9200
8833
|
const mgTooltipCss = "/*!\n * @prop --mg-c-tooltip-border-radius: Defines the border radius of the tooltip. Default value: `--mg-b-size-radius`.\n * @prop --mg-c-tooltip-color-background: Defines the background color of the tooltip. Default value: `--mg-b-color-dark`.\n * @prop --mg-c-tooltip-color-text: Defines the font color of the tooltip. Default value: `--mg-b-color-light`.\n */:host{display:inline-block}";
|
|
9201
|
-
const MgTooltipStyle0 = mgTooltipCss;
|
|
9202
8834
|
|
|
9203
8835
|
/**
|
|
9204
8836
|
* HTMLMgButtonElement type guard
|
|
@@ -9213,7 +8845,7 @@ const MgTooltip = class {
|
|
|
9213
8845
|
* Sets an `id` attribute.
|
|
9214
8846
|
* Needed by the input for accessibility `aria-decribedby`.
|
|
9215
8847
|
*/
|
|
9216
|
-
this.identifier =
|
|
8848
|
+
this.identifier = xt('mg-tooltip');
|
|
9217
8849
|
/**
|
|
9218
8850
|
* Tooltip placement
|
|
9219
8851
|
*/
|
|
@@ -9233,7 +8865,7 @@ const MgTooltip = class {
|
|
|
9233
8865
|
// Make the tooltip visible
|
|
9234
8866
|
this.mgTooltipContent.dataset.show = '';
|
|
9235
8867
|
// hide when click outside on nextTick to prevent event to trigger after creation
|
|
9236
|
-
|
|
8868
|
+
Mt(() => {
|
|
9237
8869
|
this.windows.forEach((localWindow) => {
|
|
9238
8870
|
localWindow.addEventListener('click', this.handleClickOutside, false);
|
|
9239
8871
|
localWindow.addEventListener('keydown', this.handlePressEscape, false);
|
|
@@ -9452,15 +9084,15 @@ const MgTooltip = class {
|
|
|
9452
9084
|
};
|
|
9453
9085
|
}
|
|
9454
9086
|
watchIdentifier(newValue) {
|
|
9455
|
-
if (!
|
|
9456
|
-
throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${
|
|
9087
|
+
if (!Ot(newValue)) {
|
|
9088
|
+
throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
|
|
9457
9089
|
}
|
|
9458
9090
|
// use renderTooltipContent to update tooltip-content id
|
|
9459
9091
|
this.renderTooltipContent();
|
|
9460
9092
|
}
|
|
9461
9093
|
watchMessage(newValue) {
|
|
9462
|
-
if (!
|
|
9463
|
-
throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${
|
|
9094
|
+
if (!Le(newValue)) {
|
|
9095
|
+
throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${zt(newValue)}.`);
|
|
9464
9096
|
}
|
|
9465
9097
|
if (this.mgTooltipContent !== undefined)
|
|
9466
9098
|
this.mgTooltipContent.message = newValue;
|
|
@@ -9519,7 +9151,7 @@ const MgTooltip = class {
|
|
|
9519
9151
|
*/
|
|
9520
9152
|
componentWillLoad() {
|
|
9521
9153
|
// Get windows to attach events
|
|
9522
|
-
this.windows =
|
|
9154
|
+
this.windows = Rt(window);
|
|
9523
9155
|
// Get tooltip element
|
|
9524
9156
|
this.renderTooltipContent();
|
|
9525
9157
|
//validate properties
|
|
@@ -9538,7 +9170,7 @@ const MgTooltip = class {
|
|
|
9538
9170
|
// get slotted element wich is not the tooltip
|
|
9539
9171
|
const slotElement = this.element.querySelector(`*:not(#${this.identifier})`);
|
|
9540
9172
|
// Get interactive element
|
|
9541
|
-
const interactiveElement = slotElement.matches(
|
|
9173
|
+
const interactiveElement = slotElement.matches(jt) ? slotElement : (_a = slotElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(jt);
|
|
9542
9174
|
this.setTooltipedElement(interactiveElement || slotElement);
|
|
9543
9175
|
// Check if slotted element is a disabled mg-button
|
|
9544
9176
|
// In this case we wrap the mg-button into a div to enable the tooltip
|
|
@@ -9587,7 +9219,7 @@ const MgTooltip = class {
|
|
|
9587
9219
|
* @returns HTML Element
|
|
9588
9220
|
*/
|
|
9589
9221
|
render() {
|
|
9590
|
-
return (h(Host, { key: '
|
|
9222
|
+
return (h(Host, { key: '31d97272cfd3448abf9ed9cda62fdec0a356d422' }, h("slot", { key: '8fbf8343471f53591caacc3ff4c4b8aaf4577c4f' }), h("slot", { key: '6f4eab4c33e9ec07e0fe7ffa63de4921f4b27e0c', name: "content" })));
|
|
9591
9223
|
}
|
|
9592
9224
|
get element() { return getElement(this); }
|
|
9593
9225
|
static get watchers() { return {
|
|
@@ -9598,10 +9230,9 @@ const MgTooltip = class {
|
|
|
9598
9230
|
"disabled": ["watchDisabled"]
|
|
9599
9231
|
}; }
|
|
9600
9232
|
};
|
|
9601
|
-
MgTooltip.style =
|
|
9233
|
+
MgTooltip.style = mgTooltipCss;
|
|
9602
9234
|
|
|
9603
9235
|
const mgTooltipContentCss = ":host{z-index:1000;display:none;max-width:var(--mg-b-size-floating-element-max-width);box-sizing:border-box;padding:var(--mg-b-size-4) var(--mg-b-size-8);border-radius:var(--mg-c-tooltip-border-radius);background-color:var(--mg-c-tooltip-color-background);color:var(--mg-c-tooltip-color-text);font-family:var(--mg-b-font-family);font-size:var(--mg-b-font-size);font-weight:400;text-align:start}:host([data-show]){display:block}::slotted([slot=arrow]){visibility:hidden}::slotted([slot=arrow])::before{content:\"\";transform:rotate(45deg);visibility:visible}::slotted([slot=arrow]),::slotted([slot=arrow])::before{position:absolute;z-index:9999;width:var(--mg-b-size-8);height:var(--mg-b-size-8);background-color:var(--mg-c-tooltip-color-background)}:host([data-placement^=top])>::slotted([slot=arrow]){bottom:calc(-1*var(--mg-b-size-4))}:host([data-placement^=bottom])>::slotted([slot=arrow]){top:calc(-1*var(--mg-b-size-4))}:host([data-placement^=left])>::slotted([slot=arrow]){right:calc(-1*var(--mg-b-size-4))}:host([data-placement^=right])>::slotted([slot=arrow]){left:calc(-1*var(--mg-b-size-4))}";
|
|
9604
|
-
const MgTooltipContentStyle0 = mgTooltipContentCss;
|
|
9605
9236
|
|
|
9606
9237
|
const MgTooltipContent = class {
|
|
9607
9238
|
constructor(hostRef) {
|
|
@@ -9618,8 +9249,9 @@ const MgTooltipContent = class {
|
|
|
9618
9249
|
return (h(Host, { key: '2221de3ca0ef7c9d6e46e24b19c69007fababf81', role: "tooltip" }, h("span", { key: '9e14f7f5b3f5e5060ed9f42e8d7259b17575168e', innerHTML: this.message, class: "mg-tooltip-content__message" }), h("slot", { key: 'bc083567d77e8f4ffccee98b96036ba8ac494fb6', name: "arrow" })));
|
|
9619
9250
|
}
|
|
9620
9251
|
};
|
|
9621
|
-
MgTooltipContent.style =
|
|
9252
|
+
MgTooltipContent.style = mgTooltipContentCss;
|
|
9622
9253
|
|
|
9623
9254
|
export { MgActionMore as mg_action_more, MgBadge as mg_badge, MgButton as mg_button, MgCard as mg_card, MgCharacterLeft as mg_character_left, MgDetails as mg_details, MgDivider as mg_divider, MgForm as mg_form, MgIcon as mg_icon, MgIllustratedMessage as mg_illustrated_message, MgInput as mg_input, MgInputCheckbox as mg_input_checkbox, MgInputCheckboxPaginated as mg_input_checkbox_paginated, MgInputDate as mg_input_date, MgInputNumeric as mg_input_numeric, MgInputPassword as mg_input_password, MgInputRadio as mg_input_radio, MgInputSelect as mg_input_select, MgInputText as mg_input_text, MgInputTextarea as mg_input_textarea, MgInputTitle as mg_input_title, MgInputToggle as mg_input_toggle, MgItemMore as mg_item_more, MgMenu as mg_menu, MgMenuItem as mg_menu_item, MgMessage as mg_message, MgModal as mg_modal, MgPagination as mg_pagination, MgPanel as mg_panel, MgPopover as mg_popover, MgPopoverContent as mg_popover_content, MgSkipLinks as mg_skip_links, MgTable as mg_table, MgTabs as mg_tabs, MgTag as mg_tag, MgTooltip as mg_tooltip, MgTooltipContent as mg_tooltip_content };
|
|
9255
|
+
//# sourceMappingURL=mg-action-more.mg-badge.mg-button.mg-card.mg-character-left.mg-details.mg-divider.mg-form.mg-icon.mg-illustrated-message.mg-input.mg-input-checkbox.mg-input-checkbox-paginated.mg-input-date.mg-input-numeric.mg-input-password.mg-input-radio.mg-input-select.mg-input-text.mg-input-textarea.mg-input-title.mg-input-toggle.mg-item-more.mg-menu.mg-menu-item.mg-message.mg-modal.mg-pagination.mg-panel.mg-popover.mg-popover-content.mg-skip-links.mg-table.mg-tabs.mg-tag.mg-tooltip.mg-tooltip-content.entry.js.map
|
|
9624
9256
|
|
|
9625
9257
|
//# sourceMappingURL=mg-action-more_37.entry.js.map
|