@mgdis/mg-components 5.29.0 → 6.0.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 → README.md} +1 -1
- package/dist/cjs/{index-8a3adbd1.js → index-08ee93bf.js} +18 -70
- package/dist/cjs/index-08ee93bf.js.map +1 -0
- package/dist/cjs/{index-e1a25816.js → index-d57c96a9.js} +14 -13
- package/dist/cjs/index-d57c96a9.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/mg-action-more_36.cjs.entry.js +606 -781
- package/dist/cjs/mg-action-more_36.cjs.entry.js.map +1 -1
- package/dist/cjs/mg-alert.cjs.entry.js +161 -0
- package/dist/cjs/mg-alert.cjs.entry.js.map +1 -0
- package/dist/cjs/mg-components.cjs.js +2 -2
- package/dist/cjs/mg-loader.cjs.entry.js +6 -6
- package/dist/cjs/mg-loader.cjs.entry.js.map +1 -1
- package/dist/collection/assets/icons/index.js +1 -1
- package/dist/collection/assets/icons/index.js.map +1 -1
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/atoms/{mg-character-left → internals/mg-character-left}/mg-character-left.js +9 -5
- package/dist/collection/components/atoms/internals/mg-character-left/mg-character-left.js.map +1 -0
- package/dist/collection/components/atoms/{mg-input-title → internals/mg-input-title}/mg-input-title.js +4 -4
- package/dist/collection/components/atoms/internals/mg-input-title/mg-input-title.js.map +1 -0
- package/dist/collection/components/atoms/mg-badge/mg-badge.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-badge/mg-badge.js +6 -6
- package/dist/collection/components/atoms/mg-badge/mg-badge.js.map +1 -1
- package/dist/collection/components/atoms/mg-button/mg-button.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-button/mg-button.js +4 -22
- package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
- package/dist/collection/components/atoms/mg-card/mg-card.js +1 -113
- package/dist/collection/components/atoms/mg-card/mg-card.js.map +1 -1
- package/dist/collection/components/atoms/mg-divider/mg-divider.js +9 -9
- package/dist/collection/components/atoms/mg-divider/mg-divider.js.map +1 -1
- package/dist/collection/components/atoms/mg-icon/mg-icon.conf.js +1 -1
- package/dist/collection/components/atoms/mg-icon/mg-icon.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-icon/mg-icon.js +11 -11
- package/dist/collection/components/atoms/mg-icon/mg-icon.js.map +1 -1
- package/dist/collection/components/atoms/mg-tag/mg-tag.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-tag/mg-tag.js +3 -3
- package/dist/collection/components/atoms/mg-tag/mg-tag.js.map +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.conf.js +6 -7
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.conf.js.map +1 -1
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +36 -20
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input/mg-input.conf.js +0 -9
- package/dist/collection/components/molecules/inputs/mg-input/mg-input.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input/mg-input.js +15 -60
- 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 +16 -48
- 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.conf.js +5 -23
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +127 -30
- package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js +1 -8
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +20 -21
- package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.conf.js +1 -8
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +45 -30
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +8 -8
- package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +10 -10
- package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +12 -12
- package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js.map +1 -1
- package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +71 -35
- 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 +21 -21
- 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 +7 -7
- 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 -0
- package/dist/collection/components/molecules/{mg-item-more → internals/mg-item-more}/mg-item-more.js +24 -20
- package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js.map +1 -0
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.conf.js +6 -7
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.conf.js.map +1 -1
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js +21 -16
- package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js.map +1 -1
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.conf.js +7 -16
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.conf.js.map +1 -1
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js +17 -17
- package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js.map +1 -1
- 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 +30 -15
- package/dist/collection/components/molecules/mg-action-more/mg-action-more.js.map +1 -1
- package/dist/collection/components/molecules/mg-alert/mg-alert.conf.js +9 -0
- package/dist/collection/components/molecules/mg-alert/mg-alert.conf.js.map +1 -0
- package/dist/collection/components/molecules/mg-alert/mg-alert.js +270 -0
- package/dist/collection/components/molecules/mg-alert/mg-alert.js.map +1 -0
- package/dist/collection/components/molecules/mg-details/mg-details.js +3 -3
- package/dist/collection/components/molecules/mg-details/mg-details.js.map +1 -1
- package/dist/collection/components/molecules/mg-form/mg-form.js +5 -5
- package/dist/collection/components/molecules/mg-form/mg-form.js.map +1 -1
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.conf.js +6 -0
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.conf.js.map +1 -0
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +16 -10
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js.map +1 -1
- package/dist/collection/components/molecules/mg-loader/mg-loader.js +3 -3
- package/dist/collection/components/molecules/mg-loader/mg-loader.js.map +1 -1
- package/dist/collection/components/molecules/mg-message/mg-message.conf.js +5 -1
- package/dist/collection/components/molecules/mg-message/mg-message.conf.js.map +1 -1
- package/dist/collection/components/molecules/mg-message/mg-message.js +46 -230
- package/dist/collection/components/molecules/mg-message/mg-message.js.map +1 -1
- package/dist/collection/components/molecules/mg-modal/mg-modal.js +35 -121
- package/dist/collection/components/molecules/mg-modal/mg-modal.js.map +1 -1
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.conf.js +4 -5
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.conf.js.map +1 -1
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +7 -7
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js.map +1 -1
- package/dist/collection/components/molecules/mg-panel/mg-panel.js +9 -9
- package/dist/collection/components/molecules/mg-panel/mg-panel.js.map +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +2 -2
- package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js.map +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.js +4 -3
- package/dist/collection/components/molecules/mg-popover/mg-popover.js.map +1 -1
- package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +1 -1
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.conf.js +7 -8
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.conf.js.map +1 -1
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +24 -13
- package/dist/collection/components/molecules/mg-tabs/mg-tabs.js.map +1 -1
- package/dist/collection/locales/en/messages.json +1 -1
- package/dist/collection/locales/fr/messages.json +1 -1
- package/dist/collection/types/index.js +2 -0
- package/dist/collection/types/index.js.map +1 -0
- package/dist/collection/utils/behaviors.utils.js +8 -9
- package/dist/collection/utils/behaviors.utils.js.map +1 -1
- package/dist/collection/utils/playwright.fixture.js +3 -3
- package/dist/collection/utils/playwright.fixture.js.map +1 -1
- package/dist/components/index.es.js +6 -6
- package/dist/components/index.es.js.map +1 -1
- package/dist/components/index2.js +6 -6
- package/dist/components/mg-action-more.js +34 -18
- package/dist/components/mg-action-more.js.map +1 -1
- package/dist/components/mg-alert.d.ts +11 -0
- package/dist/components/mg-alert.js +212 -0
- package/dist/components/mg-alert.js.map +1 -0
- package/dist/components/mg-badge2.js +8 -8
- package/dist/components/mg-badge2.js.map +1 -1
- package/dist/components/mg-button2.js +7 -9
- package/dist/components/mg-button2.js.map +1 -1
- package/dist/components/mg-card2.js +3 -68
- package/dist/components/mg-card2.js.map +1 -1
- package/dist/components/mg-character-left2.js +4 -3
- package/dist/components/mg-character-left2.js.map +1 -1
- package/dist/components/mg-details.js +5 -5
- package/dist/components/mg-details.js.map +1 -1
- package/dist/components/mg-divider.js +1 -40
- package/dist/components/mg-divider.js.map +1 -1
- package/dist/components/mg-divider2.js +44 -0
- package/dist/components/mg-divider2.js.map +1 -0
- package/dist/components/mg-form.js +5 -5
- package/dist/components/mg-form.js.map +1 -1
- package/dist/components/mg-icon2.js +11 -11
- package/dist/components/mg-icon2.js.map +1 -1
- package/dist/components/mg-illustrated-message.js +6 -6
- package/dist/components/mg-illustrated-message.js.map +1 -1
- package/dist/components/mg-input-checkbox-paginated.js +1 -1
- package/dist/components/mg-input-checkbox-paginated2.js +15 -44
- package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
- package/dist/components/mg-input-checkbox.js +82 -33
- package/dist/components/mg-input-checkbox.js.map +1 -1
- package/dist/components/mg-input-date.js +27 -36
- package/dist/components/mg-input-date.js.map +1 -1
- package/dist/components/mg-input-numeric.js +46 -38
- package/dist/components/mg-input-numeric.js.map +1 -1
- package/dist/components/mg-input-password.js +11 -11
- package/dist/components/mg-input-password.js.map +1 -1
- package/dist/components/mg-input-radio.js +12 -12
- package/dist/components/mg-input-radio.js.map +1 -1
- package/dist/components/mg-input-select2.js +14 -14
- package/dist/components/mg-input-select2.js.map +1 -1
- package/dist/components/mg-input-text2.js +58 -29
- package/dist/components/mg-input-text2.js.map +1 -1
- package/dist/components/mg-input-textarea.js +22 -22
- package/dist/components/mg-input-textarea.js.map +1 -1
- package/dist/components/mg-input-title2.js +4 -4
- package/dist/components/mg-input-title2.js.map +1 -1
- package/dist/components/mg-input-toggle.js +9 -9
- package/dist/components/mg-input-toggle.js.map +1 -1
- package/dist/components/mg-input2.js +19 -57
- package/dist/components/mg-input2.js.map +1 -1
- package/dist/components/mg-item-more2.js +35 -31
- package/dist/components/mg-item-more2.js.map +1 -1
- package/dist/components/mg-loader.js +5 -5
- package/dist/components/mg-loader.js.map +1 -1
- package/dist/components/mg-menu-item2.js +28 -38
- package/dist/components/mg-menu-item2.js.map +1 -1
- package/dist/components/mg-message.js +1 -224
- package/dist/components/mg-message.js.map +1 -1
- package/dist/components/mg-message2.js +135 -0
- package/dist/components/mg-message2.js.map +1 -0
- package/dist/components/mg-modal.js +32 -110
- package/dist/components/mg-modal.js.map +1 -1
- package/dist/components/mg-pagination2.js +12 -13
- package/dist/components/mg-pagination2.js.map +1 -1
- package/dist/components/mg-panel.js +10 -10
- package/dist/components/mg-panel.js.map +1 -1
- package/dist/components/mg-popover-content2.js +3 -3
- package/dist/components/mg-popover-content2.js.map +1 -1
- package/dist/components/mg-popover2.js +7 -6
- package/dist/components/mg-popover2.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-tabs.js +32 -22
- package/dist/components/mg-tabs.js.map +1 -1
- package/dist/components/mg-tag.js +5 -5
- package/dist/components/mg-tag.js.map +1 -1
- package/dist/components/mg-tooltip-content2.js +2 -2
- package/dist/components/mg-tooltip-content2.js.map +1 -1
- package/dist/components/mg-tooltip2.js +47 -32
- package/dist/components/mg-tooltip2.js.map +1 -1
- package/dist/esm/{index-0df3b137.js → index-089d0323.js} +18 -71
- package/dist/esm/index-089d0323.js.map +1 -0
- package/dist/esm/{index-eed80cc2.js → index-cc97a562.js} +12 -12
- package/dist/esm/index-cc97a562.js.map +1 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/mg-action-more_36.entry.js +606 -781
- package/dist/esm/mg-action-more_36.entry.js.map +1 -1
- package/dist/esm/mg-alert.entry.js +157 -0
- package/dist/esm/mg-alert.entry.js.map +1 -0
- package/dist/esm/mg-components.js +3 -3
- package/dist/esm/mg-loader.entry.js +6 -6
- package/dist/esm/mg-loader.entry.js.map +1 -1
- package/dist/mg-components/locales/en/messages.json +1 -1
- package/dist/mg-components/locales/fr/messages.json +1 -1
- package/dist/mg-components/mg-components.css +1 -1
- 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/p-26b67dfd.entry.js +2 -0
- package/dist/mg-components/p-26b67dfd.entry.js.map +1 -0
- package/dist/mg-components/p-2b89fe8b.entry.js +2 -0
- package/dist/mg-components/p-2b89fe8b.entry.js.map +1 -0
- package/dist/mg-components/p-48e033cf.js +3 -0
- package/dist/mg-components/p-48e033cf.js.map +1 -0
- package/dist/mg-components/p-6f5c7ec5.entry.js +2 -0
- package/dist/mg-components/p-6f5c7ec5.entry.js.map +1 -0
- package/dist/mg-components/p-898d194f.js +2 -0
- package/dist/mg-components/p-898d194f.js.map +1 -0
- package/dist/types/assets/icons/index.d.ts +0 -1
- package/dist/types/components/atoms/{mg-character-left → internals/mg-character-left}/mg-character-left.d.ts +3 -0
- package/dist/types/components/atoms/{mg-input-title → internals/mg-input-title}/mg-input-title.d.ts +1 -1
- package/dist/types/components/atoms/mg-badge/mg-badge.conf.d.ts +2 -1
- package/dist/types/components/atoms/mg-button/mg-button.conf.d.ts +2 -1
- package/dist/types/components/atoms/mg-button/mg-button.d.ts +0 -4
- package/dist/types/components/atoms/mg-card/mg-card.d.ts +0 -33
- package/dist/types/components/atoms/mg-divider/mg-divider.d.ts +1 -1
- package/dist/types/components/atoms/mg-icon/mg-icon.conf.d.ts +5 -4
- package/dist/types/components/atoms/mg-tag/mg-tag.conf.d.ts +2 -1
- package/dist/types/components/atoms/mg-tooltip/mg-tooltip.conf.d.ts +2 -6
- package/dist/types/components/atoms/mg-tooltip/mg-tooltip.d.ts +7 -2
- package/dist/types/components/molecules/inputs/mg-input/mg-input.conf.d.ts +2 -6
- package/dist/types/components/molecules/inputs/mg-input/mg-input.d.ts +0 -9
- package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.d.ts +6 -13
- package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.d.ts +4 -18
- package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.d.ts +30 -3
- package/dist/types/components/molecules/inputs/mg-input-date/mg-input-date.conf.d.ts +2 -7
- package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.conf.d.ts +3 -7
- package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.d.ts +6 -1
- package/dist/types/components/molecules/inputs/mg-input-select/mg-input-select.conf.d.ts +2 -3
- package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.conf.d.ts +5 -0
- package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.d.ts +10 -4
- package/dist/types/components/molecules/inputs/mg-input-textarea/mg-input-textarea.d.ts +3 -3
- package/dist/types/components/molecules/{mg-item-more → internals/mg-item-more}/mg-item-more.conf.d.ts +2 -2
- package/dist/types/components/molecules/{mg-item-more → internals/mg-item-more}/mg-item-more.d.ts +3 -0
- package/dist/types/components/molecules/menu/mg-menu/mg-menu.conf.d.ts +9 -7
- package/dist/types/components/molecules/menu/mg-menu/mg-menu.d.ts +2 -3
- package/dist/types/components/molecules/menu/mg-menu-item/mg-menu-item.conf.d.ts +5 -17
- package/dist/types/components/molecules/menu/mg-menu-item/mg-menu-item.d.ts +4 -4
- package/dist/types/components/molecules/mg-action-more/mg-action-more.conf.d.ts +7 -1
- package/dist/types/components/molecules/mg-action-more/mg-action-more.d.ts +2 -2
- package/dist/types/components/molecules/mg-alert/mg-alert.conf.d.ts +17 -0
- package/dist/types/components/molecules/mg-alert/mg-alert.d.ts +89 -0
- package/dist/types/components/molecules/mg-details/mg-details.d.ts +4 -0
- package/dist/types/components/molecules/mg-form/mg-form.d.ts +4 -0
- package/dist/types/components/molecules/mg-illustrated-message/mg-illustrated-message.conf.d.ts +10 -0
- package/dist/types/components/molecules/mg-illustrated-message/mg-illustrated-message.d.ts +7 -1
- package/dist/types/components/molecules/mg-message/mg-message.conf.d.ts +11 -2
- package/dist/types/components/molecules/mg-message/mg-message.d.ts +11 -62
- package/dist/types/components/molecules/mg-modal/mg-modal.d.ts +13 -39
- package/dist/types/components/molecules/mg-pagination/mg-pagination.conf.d.ts +4 -4
- package/dist/types/components/molecules/mg-panel/mg-panel.d.ts +4 -0
- package/dist/types/components/molecules/mg-tabs/mg-tabs.conf.d.ts +7 -11
- package/dist/types/components/molecules/mg-tabs/mg-tabs.d.ts +9 -0
- package/dist/types/components.d.ts +157 -166
- package/dist/types/locales/index.d.ts +1 -1
- package/dist/types/types/index.d.ts +27 -0
- package/dist/types/utils/behaviors.utils.d.ts +5 -5
- package/ide/intellij/web-types.json +791 -671
- package/ide/vscode/css-custom-data.json +389 -0
- package/ide/vscode/html-custom-data.json +217 -547
- package/package.json +8 -5
- package/dist/cjs/index-8a3adbd1.js.map +0 -1
- package/dist/cjs/index-e1a25816.js.map +0 -1
- package/dist/collection/components/atoms/mg-card/mg-card.conf.js +0 -9
- package/dist/collection/components/atoms/mg-card/mg-card.conf.js.map +0 -1
- package/dist/collection/components/atoms/mg-character-left/mg-character-left.js.map +0 -1
- package/dist/collection/components/atoms/mg-input-title/mg-input-title.js.map +0 -1
- package/dist/collection/components/molecules/mg-item-more/mg-item-more.conf.js.map +0 -1
- package/dist/collection/components/molecules/mg-item-more/mg-item-more.js.map +0 -1
- package/dist/collection/fonts/OpenSans-Bold.ttf +0 -0
- package/dist/collection/fonts/OpenSans-Regular.ttf +0 -0
- package/dist/collection/fonts/OpenSans-SemiBold.ttf +0 -0
- package/dist/collection/styles/fonts.css +0 -1
- package/dist/collection/styles/global.css +0 -1
- package/dist/collection/styles/main.css +0 -1
- package/dist/collection/styles/mg-components-utils.css +0 -1
- package/dist/collection/styles/variables.css +0 -1
- package/dist/collection/variables.css +0 -1
- package/dist/esm/index-0df3b137.js.map +0 -1
- package/dist/esm/index-eed80cc2.js.map +0 -1
- package/dist/mg-components/fonts/OpenSans-Bold.ttf +0 -0
- package/dist/mg-components/fonts/OpenSans-Regular.ttf +0 -0
- package/dist/mg-components/fonts/OpenSans-SemiBold.ttf +0 -0
- package/dist/mg-components/p-88f6c2f9.entry.js +0 -2
- package/dist/mg-components/p-88f6c2f9.entry.js.map +0 -1
- package/dist/mg-components/p-e5db08c5.entry.js +0 -2
- package/dist/mg-components/p-e5db08c5.entry.js.map +0 -1
- package/dist/mg-components/p-efce3d8c.js +0 -2
- package/dist/mg-components/p-efce3d8c.js.map +0 -1
- package/dist/mg-components/p-f95b4418.js +0 -3
- package/dist/mg-components/p-f95b4418.js.map +0 -1
- package/dist/mg-components/styles/fonts.css +0 -1
- package/dist/mg-components/styles/global.css +0 -1
- package/dist/mg-components/styles/main.css +0 -1
- package/dist/mg-components/styles/mg-components-utils.css +0 -1
- package/dist/mg-components/styles/variables.css +0 -1
- package/dist/mg-components/variables.css +0 -1
- package/dist/types/components/atoms/mg-card/mg-card.conf.d.ts +0 -16
- /package/dist/collection/components/molecules/{mg-item-more → internals/mg-item-more}/mg-item-more.conf.js +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
|
-
import { isValidString } from "@mgdis/stencil-helpers";
|
|
2
|
+
import { isValidString, toString } from "@mgdis/stencil-helpers";
|
|
3
3
|
import { tooltipPositions, classFieldset, classReadonly, classDisabled, classVerticalList } from "./mg-input.conf";
|
|
4
4
|
/**
|
|
5
5
|
* @slot - Input content
|
|
@@ -16,25 +16,6 @@ export class MgInput {
|
|
|
16
16
|
this.classInput = 'mg-c-input';
|
|
17
17
|
this.classHasError = 'mg-c-input--has-error';
|
|
18
18
|
this.classLabelOnTop = 'mg-c-input--label-on-top';
|
|
19
|
-
/**
|
|
20
|
-
* Get readonly values
|
|
21
|
-
* @returns formated readonly value
|
|
22
|
-
*/
|
|
23
|
-
this.getReadonlyValues = () => {
|
|
24
|
-
var _a;
|
|
25
|
-
if (Array.isArray(this.readonlyValue) && !this.isVerticalList) {
|
|
26
|
-
return this.readonlyValue.join(', ');
|
|
27
|
-
}
|
|
28
|
-
else if (Array.isArray(this.readonlyValue) && this.readonlyValue.length > 1) {
|
|
29
|
-
return this.readonlyValue;
|
|
30
|
-
}
|
|
31
|
-
else if (Array.isArray(this.readonlyValue) && this.readonlyValue.length === 1) {
|
|
32
|
-
return this.readonlyValue[0];
|
|
33
|
-
}
|
|
34
|
-
else {
|
|
35
|
-
return ((_a = this.readonlyValue) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.readonlyValue : '';
|
|
36
|
-
}
|
|
37
|
-
};
|
|
38
19
|
/**
|
|
39
20
|
* Get tooltip node
|
|
40
21
|
* @returns mg-tooltip
|
|
@@ -47,7 +28,6 @@ export class MgInput {
|
|
|
47
28
|
this.tooltip = undefined;
|
|
48
29
|
this.tooltipPosition = 'input';
|
|
49
30
|
this.required = false;
|
|
50
|
-
this.readonlyValue = undefined;
|
|
51
31
|
this.errorMessage = undefined;
|
|
52
32
|
this.helpText = undefined;
|
|
53
33
|
this.ariaDescribedbyIDs = undefined;
|
|
@@ -58,7 +38,7 @@ export class MgInput {
|
|
|
58
38
|
}
|
|
59
39
|
watchIdentifier(newValue) {
|
|
60
40
|
if (!isValidString(newValue)) {
|
|
61
|
-
throw new Error(
|
|
41
|
+
throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${toString(newValue)}.`);
|
|
62
42
|
}
|
|
63
43
|
else {
|
|
64
44
|
this.helpTextId = `${this.identifier}-help-text`;
|
|
@@ -80,12 +60,12 @@ export class MgInput {
|
|
|
80
60
|
}
|
|
81
61
|
watchTooltipPosition(newValue) {
|
|
82
62
|
if (!tooltipPositions.includes(newValue)) {
|
|
83
|
-
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}
|
|
63
|
+
throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${toString(newValue)}.`);
|
|
84
64
|
}
|
|
85
65
|
}
|
|
86
66
|
watchErrorMessage(newValue) {
|
|
87
67
|
var _a;
|
|
88
|
-
if (newValue) {
|
|
68
|
+
if (newValue !== undefined) {
|
|
89
69
|
this.element.classList.add(this.classHasError);
|
|
90
70
|
this.renderErrorMessage();
|
|
91
71
|
}
|
|
@@ -97,7 +77,7 @@ export class MgInput {
|
|
|
97
77
|
}
|
|
98
78
|
watchHelpText(newValue) {
|
|
99
79
|
var _a;
|
|
100
|
-
if (newValue) {
|
|
80
|
+
if (newValue && !this.isReadonly) {
|
|
101
81
|
this.renderHelpText();
|
|
102
82
|
}
|
|
103
83
|
else {
|
|
@@ -106,16 +86,18 @@ export class MgInput {
|
|
|
106
86
|
}
|
|
107
87
|
}
|
|
108
88
|
watchAriaDescribedbyIDs() {
|
|
89
|
+
if (this.isReadonly)
|
|
90
|
+
return;
|
|
109
91
|
// a11y IDs
|
|
110
92
|
const ariaDescribedbyIDs = new Set(this.ariaDescribedbyIDs);
|
|
111
93
|
// Help text
|
|
112
|
-
if (this.helpText) {
|
|
94
|
+
if (this.helpText !== undefined) {
|
|
113
95
|
this.renderHelpText();
|
|
114
96
|
if (!ariaDescribedbyIDs.has(this.helpTextId))
|
|
115
97
|
ariaDescribedbyIDs.add(this.helpTextId);
|
|
116
98
|
}
|
|
117
99
|
// Error Message
|
|
118
|
-
if (this.errorMessage) {
|
|
100
|
+
if (this.errorMessage !== undefined) {
|
|
119
101
|
this.renderErrorMessage();
|
|
120
102
|
if (!ariaDescribedbyIDs.has(this.helpTextErrorId))
|
|
121
103
|
ariaDescribedbyIDs.add(this.helpTextErrorId);
|
|
@@ -143,7 +125,7 @@ export class MgInput {
|
|
|
143
125
|
// eslint-disable-next-line @stencil-community/no-unused-watch
|
|
144
126
|
watchLabel() {
|
|
145
127
|
if (!isValidString(this.label)) {
|
|
146
|
-
throw new Error(
|
|
128
|
+
throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${toString(this.label)}.`);
|
|
147
129
|
}
|
|
148
130
|
else {
|
|
149
131
|
this.watchAriaDescribedbyIDs();
|
|
@@ -183,7 +165,7 @@ export class MgInput {
|
|
|
183
165
|
*/
|
|
184
166
|
renderErrorMessage() {
|
|
185
167
|
this.errorMessageSlotElement = this.element.querySelector(`[slot=${this.slotError}]`);
|
|
186
|
-
if (
|
|
168
|
+
if (this.errorMessageSlotElement === null) {
|
|
187
169
|
this.errorMessageSlotElement = document.createElement('div');
|
|
188
170
|
this.errorMessageSlotElement.setAttribute('slot', this.slotError);
|
|
189
171
|
this.element.appendChild(this.errorMessageSlotElement);
|
|
@@ -196,7 +178,7 @@ export class MgInput {
|
|
|
196
178
|
*/
|
|
197
179
|
renderHelpText() {
|
|
198
180
|
this.helptextMessageSlotElement = this.element.querySelector(`[slot=${this.slotHelpText}]`);
|
|
199
|
-
if (
|
|
181
|
+
if (this.helptextMessageSlotElement === null) {
|
|
200
182
|
this.helptextMessageSlotElement = document.createElement('div');
|
|
201
183
|
this.helptextMessageSlotElement.setAttribute('slot', this.slotHelpText);
|
|
202
184
|
this.element.appendChild(this.helptextMessageSlotElement);
|
|
@@ -213,19 +195,19 @@ export class MgInput {
|
|
|
213
195
|
componentWillLoad() {
|
|
214
196
|
this.watchIdentifier(this.identifier);
|
|
215
197
|
this.watchLabel();
|
|
198
|
+
this.watchClass();
|
|
216
199
|
this.watchLabelOnTop(this.labelOnTop);
|
|
217
200
|
this.watchLabelConfig();
|
|
218
201
|
this.watchTooltipPosition(this.tooltipPosition);
|
|
219
202
|
this.watchHelpText(this.helpText);
|
|
220
203
|
this.watchErrorMessage(this.errorMessage);
|
|
221
|
-
this.watchClass();
|
|
222
204
|
}
|
|
223
205
|
/**
|
|
224
206
|
* Validate slots
|
|
225
207
|
*/
|
|
226
208
|
componentDidLoad() {
|
|
227
209
|
this.watchAriaDescribedbyIDs();
|
|
228
|
-
if (!this.isReadonly && !this.isFieldset &&
|
|
210
|
+
if (!this.isReadonly && !this.isFieldset && this.element.querySelector(`#${this.identifier}`) === null) {
|
|
229
211
|
throw new Error(`<mg-input> "identifier" prop has no target for id: ${this.identifier}. Add an id to the targeted input.`);
|
|
230
212
|
}
|
|
231
213
|
}
|
|
@@ -234,18 +216,8 @@ export class MgInput {
|
|
|
234
216
|
* @returns HTML Element
|
|
235
217
|
*/
|
|
236
218
|
render() {
|
|
237
|
-
const readonlyValue = this.getReadonlyValues();
|
|
238
219
|
const isGroup = this.isFieldset && !this.isReadonly;
|
|
239
|
-
return (h(Host, { key: '
|
|
240
|
-
? [
|
|
241
|
-
Array.isArray(readonlyValue) ? (h("ul", { key: "readonly-value-list" }, readonlyValue.map(value => (h("li", { key: value }, h("strong", null, value)))))) : (h("strong", { key: "readonly-value" }, readonlyValue)),
|
|
242
|
-
h("slot", { key: "default-slot" }),
|
|
243
|
-
]
|
|
244
|
-
: [
|
|
245
|
-
h("div", { class: "mg-c-input__input", key: "tooltip" }, h("slot", null), this.tooltip && !this.labelOnTop && (this.tooltipPosition === 'input' || this.labelHide) && this.renderTooltip()),
|
|
246
|
-
this.helpText && (h("div", { class: "mg-c-input__help-text", key: "help-text" }, h("slot", { name: this.slotHelpText }))),
|
|
247
|
-
!this.isDisabled && this.errorMessage && (h("div", { class: "mg-c-input__error", "aria-live": "assertive", key: "error-message" }, h("slot", { name: this.slotError }))),
|
|
248
|
-
])));
|
|
220
|
+
return (h(Host, { key: 'de2441ca25015a07653e09f5cda0d9588062840d', class: this.element.classList.toString(), role: isGroup ? 'group' : undefined, "aria-labelledby": isGroup ? `${this.identifier}-title` : undefined }, h("div", { key: '39cfcc83a6965e55310220f05334d3f364c502c1', class: { 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide } }, h("slot", { key: '6413efe7254806a84e283cd15365dc0d78c18afe', name: this.slotLabel }), this.tooltip && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()), h("div", { key: '7047fbaff93f273d134745e4d991eb91c28ef7f5', class: "mg-c-input__input-container" }, h("div", { key: '3cb904222def3d4f68cf000ae292e0dc221a954c', class: "mg-c-input__input" }, h("slot", { key: '552f670ef98a4ce43dbbf6bb54038152c87b6472' }), this.tooltip && !this.labelOnTop && (this.tooltipPosition === 'input' || this.labelHide) && this.renderTooltip()), this.helptextMessageSlotElement && (h("div", { key: '945232348ed6d14f6f018dcb8003ef46c68c6b44', class: "mg-c-input__help-text" }, h("slot", { key: '782770bebf5600f75f59930b5d9665ef93a0404b', name: this.slotHelpText }))), !this.isDisabled && this.errorMessage && (h("div", { key: '96398b6849c7c26474037c1f783dc02d70f1ad65', class: "mg-c-input__error", "aria-live": "assertive" }, h("slot", { key: 'dc7cf70f5145e790f246b9ac0955f24105927adc', name: this.slotError }))))));
|
|
249
221
|
}
|
|
250
222
|
static get is() { return "mg-input"; }
|
|
251
223
|
static get encapsulation() { return "shadow"; }
|
|
@@ -389,23 +361,6 @@ export class MgInput {
|
|
|
389
361
|
"reflect": false,
|
|
390
362
|
"defaultValue": "false"
|
|
391
363
|
},
|
|
392
|
-
"readonlyValue": {
|
|
393
|
-
"type": "string",
|
|
394
|
-
"mutable": false,
|
|
395
|
-
"complexType": {
|
|
396
|
-
"original": "string | string[]",
|
|
397
|
-
"resolved": "string | string[]",
|
|
398
|
-
"references": {}
|
|
399
|
-
},
|
|
400
|
-
"required": false,
|
|
401
|
-
"optional": false,
|
|
402
|
-
"docs": {
|
|
403
|
-
"tags": [],
|
|
404
|
-
"text": "Defines value to display in readonly mode"
|
|
405
|
-
},
|
|
406
|
-
"attribute": "readonly-value",
|
|
407
|
-
"reflect": false
|
|
408
|
-
},
|
|
409
364
|
"errorMessage": {
|
|
410
365
|
"type": "string",
|
|
411
366
|
"mutable": false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mg-input.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input/mg-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Element, Watch, Host, State } from '@stencil/core';\nimport { isValidString } from '@mgdis/stencil-helpers';\nimport { tooltipPositions, type TooltipPosition, classFieldset, classReadonly, classDisabled, classVerticalList } from './mg-input.conf';\n\n/**\n * @slot - Input content\n * @slot label - Label content\n * @slot help-text - Help text content\n * @slot error - error content\n */\n@Component({\n tag: 'mg-input',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input.css',\n shadow: true,\n})\nexport class MgInput {\n /************\n * Internal *\n ************/\n\n // HTML selectors\n private helpTextId: string;\n private helpTextErrorId: string;\n private readonly slotLabel = 'label';\n private readonly slotError = 'error';\n private readonly slotHelpText = 'help-text';\n\n // slots elements\n private errorMessageSlotElement: HTMLElement;\n private helptextMessageSlotElement: HTMLElement;\n\n // style\n private readonly classInput = 'mg-c-input';\n private readonly classHasError = 'mg-c-input--has-error';\n private readonly classLabelOnTop = 'mg-c-input--label-on-top';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputElement;\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n @Watch('identifier')\n watchIdentifier(newValue: MgInput['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-input> prop \"identifier\" is required.');\n } else {\n this.helpTextId = `${this.identifier}-help-text`;\n this.helpTextErrorId = `${this.identifier}-error`;\n }\n }\n\n /**\n * Define input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n @Watch('labelOnTop')\n watchLabelOnTop(newValue: MgInput['labelOnTop']): void {\n if (newValue) {\n this.element.classList.add(this.classLabelOnTop);\n } else {\n this.element.classList.remove(this.classLabelOnTop);\n }\n }\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide: boolean = false;\n @Watch('labelHide')\n @Watch('labelOnTop')\n watchLabelConfig(): void {\n if (this.labelHide && this.labelOnTop) {\n throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n }\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n @Watch('tooltipPosition')\n watchTooltipPosition(newValue: MgInput['tooltipPosition']) {\n if (!tooltipPositions.includes(newValue)) {\n throw new Error(`<mg-input> prop \"tooltipPosition\" must be one of: ${tooltipPositions.join(', ')}`);\n }\n }\n\n /**\n * Define if input is required\n */\n @Prop() required: boolean = false;\n\n /**\n * Defines value to display in readonly mode\n */\n @Prop() readonlyValue: string | string[];\n\n /**\n * Define error message to display\n */\n @Prop() errorMessage?: string;\n @Watch('errorMessage')\n watchErrorMessage(newValue: MgInput['errorMessage']): void {\n if (newValue) {\n this.element.classList.add(this.classHasError);\n this.renderErrorMessage();\n } else {\n this.element.classList.remove(this.classHasError);\n this.errorMessageSlotElement?.remove();\n this.errorMessageSlotElement = undefined;\n }\n }\n\n /**\n * Define help text to display\n */\n @Prop() helpText?: string;\n @Watch('helpText')\n watchHelpText(newValue: MgInput['helpText']): void {\n if (newValue) {\n this.renderHelpText();\n } else {\n this.helptextMessageSlotElement?.remove();\n this.helptextMessageSlotElement = undefined;\n }\n }\n\n /**\n * Define aria-describedby ids to link with\n */\n @Prop() ariaDescribedbyIDs: string[];\n @Watch('identifier')\n @Watch('errorMessage')\n @Watch('helpText')\n @Watch('ariaDescribedbyIDs')\n watchAriaDescribedbyIDs(): void {\n // a11y IDs\n const ariaDescribedbyIDs = new Set(this.ariaDescribedbyIDs);\n // Help text\n if (this.helpText) {\n this.renderHelpText();\n if (!ariaDescribedbyIDs.has(this.helpTextId)) ariaDescribedbyIDs.add(this.helpTextId);\n }\n\n // Error Message\n if (this.errorMessage) {\n this.renderErrorMessage();\n if (!ariaDescribedbyIDs.has(this.helpTextErrorId)) ariaDescribedbyIDs.add(this.helpTextErrorId);\n }\n\n this.element.querySelectorAll('input,select,textarea,[role=\"switch\"]').forEach(element => {\n element.setAttribute('aria-describedby', Array.from(ariaDescribedbyIDs).join(' '));\n });\n }\n\n /**\n * Component classes\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('class')\n watchClass(): void {\n if (!this.element.classList.contains(this.classInput)) {\n this.element.classList.add(this.classInput);\n }\n this.isFieldset = this.element.classList.contains(classFieldset);\n this.isReadonly = this.element.classList.contains(classReadonly);\n this.isDisabled = this.element.classList.contains(classDisabled);\n this.isVerticalList = this.element.classList.contains(classVerticalList);\n }\n\n /**\n * Trigger label update\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('class')\n @Watch('label')\n watchLabel(): void {\n if (!isValidString(this.label)) {\n throw new Error('<mg-input> prop \"label\" is required.');\n } else {\n this.watchAriaDescribedbyIDs();\n this.renderLabel();\n }\n }\n\n /**\n * Element is fieldset\n */\n @State() isFieldset: boolean = false;\n\n /**\n * Element is readonly\n */\n @State() isReadonly: boolean = false;\n\n /**\n * Element is disabled\n */\n @State() isDisabled: boolean = false;\n\n /**\n * Element is disabled\n */\n @State() isVerticalList: boolean = false;\n\n /************\n * Methods *\n ************/\n\n /**\n * Render input label\n */\n private renderLabel(): void {\n let labelSlotElement: HTMLMgInputTitleElement = this.element.querySelector(`[slot=${this.slotLabel}]`);\n\n // first remove previous labelslot if exist\n labelSlotElement?.remove();\n\n // create title element\n labelSlotElement = document.createElement('mg-input-title');\n [\n ['slot', this.slotLabel],\n ['identifier', this.identifier],\n ['readonly', this.isReadonly.toString()],\n ['required', ((this.required && !this.isDisabled) || false).toString()],\n ['is-legend', this.isFieldset.toString()],\n ].forEach(([attr, val]) => {\n labelSlotElement.setAttribute(attr, val);\n });\n\n // create label element\n const label = document.createElement('span');\n label.classList.add('mg-c-input-title__text');\n label.textContent = this.label;\n\n labelSlotElement.appendChild(label);\n this.element.appendChild(labelSlotElement);\n }\n\n /**\n * Render error message\n */\n private renderErrorMessage(): void {\n this.errorMessageSlotElement = this.element.querySelector(`[slot=${this.slotError}]`);\n if (!this.errorMessageSlotElement) {\n this.errorMessageSlotElement = document.createElement('div');\n this.errorMessageSlotElement.setAttribute('slot', this.slotError);\n this.element.appendChild(this.errorMessageSlotElement);\n }\n this.errorMessageSlotElement.setAttribute('id', this.helpTextErrorId);\n this.errorMessageSlotElement.innerHTML = this.errorMessage;\n }\n\n /**\n * Render help text message\n */\n private renderHelpText(): void {\n this.helptextMessageSlotElement = this.element.querySelector(`[slot=${this.slotHelpText}]`);\n if (!this.helptextMessageSlotElement) {\n this.helptextMessageSlotElement = document.createElement('div');\n this.helptextMessageSlotElement.setAttribute('slot', this.slotHelpText);\n this.element.appendChild(this.helptextMessageSlotElement);\n }\n this.helptextMessageSlotElement.setAttribute('id', this.helpTextId);\n this.helptextMessageSlotElement.innerHTML = this.helpText;\n }\n\n /**\n * Get readonly values\n * @returns formated readonly value\n */\n private getReadonlyValues = (): string | string[] => {\n if (Array.isArray(this.readonlyValue) && !this.isVerticalList) {\n return this.readonlyValue.join(', ');\n } else if (Array.isArray(this.readonlyValue) && this.readonlyValue.length > 1) {\n return this.readonlyValue;\n } else if (Array.isArray(this.readonlyValue) && this.readonlyValue.length === 1) {\n return this.readonlyValue[0];\n } else {\n return this.readonlyValue?.length > 0 ? this.readonlyValue : '';\n }\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n this.watchIdentifier(this.identifier);\n this.watchLabel();\n this.watchLabelOnTop(this.labelOnTop);\n this.watchLabelConfig();\n this.watchTooltipPosition(this.tooltipPosition);\n this.watchHelpText(this.helpText);\n this.watchErrorMessage(this.errorMessage);\n this.watchClass();\n }\n\n /**\n * Validate slots\n */\n componentDidLoad(): void {\n this.watchAriaDescribedbyIDs();\n if (!this.isReadonly && !this.isFieldset && !this.element.querySelector(`#${this.identifier}`)) {\n throw new Error(`<mg-input> \"identifier\" prop has no target for id: ${this.identifier}. Add an id to the targeted input.`);\n }\n }\n\n /**\n * Get tooltip node\n * @returns mg-tooltip\n */\n private renderTooltip = (): HTMLMgTooltipElement => (\n <mg-tooltip identifier={`${this.identifier}-tooltip`} message={this.tooltip}>\n <mg-icon icon=\"info-circle\"></mg-icon>\n </mg-tooltip>\n );\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const readonlyValue = this.getReadonlyValues();\n const isGroup = this.isFieldset && !this.isReadonly;\n return (\n <Host class={this.element.classList.toString()} role={isGroup ? 'group' : undefined} aria-labelledby={isGroup ? `${this.identifier}-title` : undefined}>\n <div class={{ 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide }}>\n <slot name={this.slotLabel}></slot>\n {this.tooltip && !this.isReadonly && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()}\n </div>\n <div class=\"mg-c-input__input-container\">\n {this.isReadonly\n ? [\n Array.isArray(readonlyValue) ? (\n <ul key=\"readonly-value-list\">\n {readonlyValue.map(value => (\n <li key={value}>\n <strong>{value}</strong>\n </li>\n ))}\n </ul>\n ) : (\n <strong key=\"readonly-value\">{readonlyValue}</strong>\n ),\n <slot key=\"default-slot\"></slot>,\n ]\n : [\n <div class=\"mg-c-input__input\" key=\"tooltip\">\n <slot></slot>\n {this.tooltip && !this.labelOnTop && (this.tooltipPosition === 'input' || this.labelHide) && this.renderTooltip()}\n </div>,\n this.helpText && (\n <div class=\"mg-c-input__help-text\" key=\"help-text\">\n <slot name={this.slotHelpText}></slot>\n </div>\n ),\n !this.isDisabled && this.errorMessage && (\n <div class=\"mg-c-input__error\" aria-live=\"assertive\" key=\"error-message\">\n <slot name={this.slotError}></slot>\n </div>\n ),\n ]}\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"mg-input.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input/mg-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Element, Watch, Host, State } from '@stencil/core';\nimport { isValidString, toString } from '@mgdis/stencil-helpers';\nimport { tooltipPositions, type TooltipPosition, classFieldset, classReadonly, classDisabled, classVerticalList } from './mg-input.conf';\n\n/**\n * @slot - Input content\n * @slot label - Label content\n * @slot help-text - Help text content\n * @slot error - error content\n */\n@Component({\n tag: 'mg-input',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input.css',\n shadow: true,\n})\nexport class MgInput {\n /************\n * Internal *\n ************/\n\n // HTML selectors\n private helpTextId: string;\n private helpTextErrorId: string;\n private readonly slotLabel = 'label';\n private readonly slotError = 'error';\n private readonly slotHelpText = 'help-text';\n\n // slots elements\n private errorMessageSlotElement: HTMLElement;\n private helptextMessageSlotElement: HTMLElement;\n\n // style\n private readonly classInput = 'mg-c-input';\n private readonly classHasError = 'mg-c-input--has-error';\n private readonly classLabelOnTop = 'mg-c-input--label-on-top';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputElement;\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n @Watch('identifier')\n watchIdentifier(newValue: MgInput['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error(`<mg-input> prop \"identifier\" is required and must be a string. Passed value: ${toString(newValue)}.`);\n } else {\n this.helpTextId = `${this.identifier}-help-text`;\n this.helpTextErrorId = `${this.identifier}-error`;\n }\n }\n\n /**\n * Define input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n @Watch('labelOnTop')\n watchLabelOnTop(newValue: MgInput['labelOnTop']): void {\n if (newValue) {\n this.element.classList.add(this.classLabelOnTop);\n } else {\n this.element.classList.remove(this.classLabelOnTop);\n }\n }\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide: boolean = false;\n @Watch('labelHide')\n @Watch('labelOnTop')\n watchLabelConfig(): void {\n if (this.labelHide && this.labelOnTop) {\n throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n }\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n @Watch('tooltipPosition')\n watchTooltipPosition(newValue: MgInput['tooltipPosition']) {\n if (!tooltipPositions.includes(newValue)) {\n throw new Error(`<mg-input> prop \"tooltipPosition\" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define if input is required\n */\n @Prop() required: boolean = false;\n\n /**\n * Define error message to display\n */\n @Prop() errorMessage?: string;\n @Watch('errorMessage')\n watchErrorMessage(newValue: MgInput['errorMessage']): void {\n if (newValue !== undefined) {\n this.element.classList.add(this.classHasError);\n this.renderErrorMessage();\n } else {\n this.element.classList.remove(this.classHasError);\n this.errorMessageSlotElement?.remove();\n this.errorMessageSlotElement = undefined;\n }\n }\n\n /**\n * Define help text to display\n */\n @Prop() helpText?: string;\n @Watch('helpText')\n watchHelpText(newValue: MgInput['helpText']): void {\n if (newValue && !this.isReadonly) {\n this.renderHelpText();\n } else {\n this.helptextMessageSlotElement?.remove();\n this.helptextMessageSlotElement = undefined;\n }\n }\n\n /**\n * Define aria-describedby ids to link with\n */\n @Prop() ariaDescribedbyIDs: string[];\n @Watch('identifier')\n @Watch('errorMessage')\n @Watch('helpText')\n @Watch('ariaDescribedbyIDs')\n watchAriaDescribedbyIDs(): void {\n if (this.isReadonly) return;\n // a11y IDs\n const ariaDescribedbyIDs = new Set(this.ariaDescribedbyIDs);\n // Help text\n if (this.helpText !== undefined) {\n this.renderHelpText();\n if (!ariaDescribedbyIDs.has(this.helpTextId)) ariaDescribedbyIDs.add(this.helpTextId);\n }\n\n // Error Message\n if (this.errorMessage !== undefined) {\n this.renderErrorMessage();\n if (!ariaDescribedbyIDs.has(this.helpTextErrorId)) ariaDescribedbyIDs.add(this.helpTextErrorId);\n }\n\n this.element.querySelectorAll('input,select,textarea,[role=\"switch\"]').forEach(element => {\n element.setAttribute('aria-describedby', Array.from(ariaDescribedbyIDs).join(' '));\n });\n }\n\n /**\n * Component classes\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('class')\n watchClass(): void {\n if (!this.element.classList.contains(this.classInput)) {\n this.element.classList.add(this.classInput);\n }\n this.isFieldset = this.element.classList.contains(classFieldset);\n this.isReadonly = this.element.classList.contains(classReadonly);\n this.isDisabled = this.element.classList.contains(classDisabled);\n this.isVerticalList = this.element.classList.contains(classVerticalList);\n }\n\n /**\n * Trigger label update\n */\n // eslint-disable-next-line @stencil-community/no-unused-watch\n @Watch('class')\n @Watch('label')\n watchLabel(): void {\n if (!isValidString(this.label)) {\n throw new Error(`<mg-input> prop \"label\" is required and must be a string. Passed value: ${toString(this.label)}.`);\n } else {\n this.watchAriaDescribedbyIDs();\n this.renderLabel();\n }\n }\n\n /**\n * Element is fieldset\n */\n @State() isFieldset: boolean = false;\n\n /**\n * Element is readonly\n */\n @State() isReadonly: boolean = false;\n\n /**\n * Element is disabled\n */\n @State() isDisabled: boolean = false;\n\n /**\n * Element is disabled\n */\n @State() isVerticalList: boolean = false;\n\n /************\n * Methods *\n ************/\n\n /**\n * Render input label\n */\n private renderLabel(): void {\n let labelSlotElement: HTMLMgInputTitleElement = this.element.querySelector(`[slot=${this.slotLabel}]`);\n\n // first remove previous labelslot if exist\n labelSlotElement?.remove();\n\n // create title element\n labelSlotElement = document.createElement('mg-input-title');\n [\n ['slot', this.slotLabel],\n ['identifier', this.identifier],\n ['readonly', this.isReadonly.toString()],\n ['required', ((this.required && !this.isDisabled) || false).toString()],\n ['is-legend', this.isFieldset.toString()],\n ].forEach(([attr, val]) => {\n labelSlotElement.setAttribute(attr, val);\n });\n\n // create label element\n const label = document.createElement('span');\n label.classList.add('mg-c-input-title__text');\n label.textContent = this.label;\n\n labelSlotElement.appendChild(label);\n this.element.appendChild(labelSlotElement);\n }\n\n /**\n * Render error message\n */\n private renderErrorMessage(): void {\n this.errorMessageSlotElement = this.element.querySelector(`[slot=${this.slotError}]`);\n if (this.errorMessageSlotElement === null) {\n this.errorMessageSlotElement = document.createElement('div');\n this.errorMessageSlotElement.setAttribute('slot', this.slotError);\n this.element.appendChild(this.errorMessageSlotElement);\n }\n this.errorMessageSlotElement.setAttribute('id', this.helpTextErrorId);\n this.errorMessageSlotElement.innerHTML = this.errorMessage;\n }\n\n /**\n * Render help text message\n */\n private renderHelpText(): void {\n this.helptextMessageSlotElement = this.element.querySelector(`[slot=${this.slotHelpText}]`);\n if (this.helptextMessageSlotElement === null) {\n this.helptextMessageSlotElement = document.createElement('div');\n this.helptextMessageSlotElement.setAttribute('slot', this.slotHelpText);\n this.element.appendChild(this.helptextMessageSlotElement);\n }\n this.helptextMessageSlotElement.setAttribute('id', this.helpTextId);\n this.helptextMessageSlotElement.innerHTML = this.helpText;\n }\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n this.watchIdentifier(this.identifier);\n this.watchLabel();\n this.watchClass();\n this.watchLabelOnTop(this.labelOnTop);\n this.watchLabelConfig();\n this.watchTooltipPosition(this.tooltipPosition);\n this.watchHelpText(this.helpText);\n this.watchErrorMessage(this.errorMessage);\n }\n\n /**\n * Validate slots\n */\n componentDidLoad(): void {\n this.watchAriaDescribedbyIDs();\n if (!this.isReadonly && !this.isFieldset && this.element.querySelector(`#${this.identifier}`) === null) {\n throw new Error(`<mg-input> \"identifier\" prop has no target for id: ${this.identifier}. Add an id to the targeted input.`);\n }\n }\n\n /**\n * Get tooltip node\n * @returns mg-tooltip\n */\n private renderTooltip = (): HTMLMgTooltipElement => (\n <mg-tooltip identifier={`${this.identifier}-tooltip`} message={this.tooltip}>\n <mg-icon icon=\"info-circle\"></mg-icon>\n </mg-tooltip>\n );\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const isGroup = this.isFieldset && !this.isReadonly;\n return (\n <Host class={this.element.classList.toString()} role={isGroup ? 'group' : undefined} aria-labelledby={isGroup ? `${this.identifier}-title` : undefined}>\n <div class={{ 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide }}>\n <slot name={this.slotLabel}></slot>\n {this.tooltip && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()}\n </div>\n <div class=\"mg-c-input__input-container\">\n <div class=\"mg-c-input__input\">\n <slot></slot>\n {this.tooltip && !this.labelOnTop && (this.tooltipPosition === 'input' || this.labelHide) && this.renderTooltip()}\n </div>\n {this.helptextMessageSlotElement && (\n <div class=\"mg-c-input__help-text\">\n <slot name={this.slotHelpText}></slot>\n </div>\n )}\n {!this.isDisabled && this.errorMessage && (\n <div class=\"mg-c-input__error\" aria-live=\"assertive\">\n <slot name={this.slotError}></slot>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
|
-
import { SectionKind
|
|
2
|
+
import { SectionKind } from "../mg-input-checkbox.conf";
|
|
3
3
|
import { MgInputCheckboxList } from "../MgInputCheckboxList";
|
|
4
4
|
/**
|
|
5
5
|
* Internal component use to manage sections instances
|
|
6
|
+
* @internal
|
|
6
7
|
*/
|
|
7
8
|
export class MgInputCheckboxPaginated {
|
|
8
9
|
constructor() {
|
|
@@ -37,7 +38,7 @@ export class MgInputCheckboxPaginated {
|
|
|
37
38
|
* @param items - items to count
|
|
38
39
|
* @returns page count from items
|
|
39
40
|
*/
|
|
40
|
-
this.getPageCount = (
|
|
41
|
+
this.getPageCount = (items) => ((items === null || items === void 0 ? void 0 : items.length) > 0 ? Math.ceil(items.length / this.offset) : 0);
|
|
41
42
|
/**
|
|
42
43
|
* Handle mg-pagination current page change event
|
|
43
44
|
* @param event - pagination current page change event
|
|
@@ -51,12 +52,10 @@ export class MgInputCheckboxPaginated {
|
|
|
51
52
|
this.invalid = undefined;
|
|
52
53
|
this.currentPage = 1;
|
|
53
54
|
this.checkboxes = [];
|
|
54
|
-
this.sectionKind = undefined;
|
|
55
55
|
this.messages = undefined;
|
|
56
|
-
this.titleKind = undefined;
|
|
57
56
|
this.expanded = true;
|
|
58
57
|
}
|
|
59
|
-
|
|
58
|
+
watchCheckboxes(newValue, oldValue) {
|
|
60
59
|
const pageCountNewValue = this.getPageCount(newValue);
|
|
61
60
|
const pageCountOldValue = this.getPageCount(oldValue);
|
|
62
61
|
// after each array.length update we reset pagination
|
|
@@ -68,12 +67,7 @@ export class MgInputCheckboxPaginated {
|
|
|
68
67
|
else if (pageCountOldValue === this.currentPage && pageCountNewValue < this.currentPage) {
|
|
69
68
|
this.currentPage--;
|
|
70
69
|
}
|
|
71
|
-
|
|
72
|
-
validateSectionKind(newValue) {
|
|
73
|
-
if (newValue === SectionKind.SELECTED)
|
|
74
|
-
this.titleKind = SectionTitleKind.BUTTON;
|
|
75
|
-
else
|
|
76
|
-
this.titleKind = SectionTitleKind.TEXT;
|
|
70
|
+
this.sectionKind = newValue[0].value ? SectionKind.SELECTED : SectionKind.NOT_SELECTED;
|
|
77
71
|
}
|
|
78
72
|
/**
|
|
79
73
|
* Get from and to index
|
|
@@ -89,20 +83,20 @@ export class MgInputCheckboxPaginated {
|
|
|
89
83
|
* Lifecycle *
|
|
90
84
|
*************/
|
|
91
85
|
/**
|
|
92
|
-
*
|
|
86
|
+
* Validate props
|
|
93
87
|
*/
|
|
94
88
|
componentWillLoad() {
|
|
95
|
-
this.
|
|
89
|
+
this.watchCheckboxes(this.checkboxes);
|
|
96
90
|
}
|
|
97
91
|
/**
|
|
98
92
|
* Render
|
|
99
93
|
* @returns HTML Element
|
|
100
94
|
*/
|
|
101
95
|
render() {
|
|
102
|
-
const getText = (checkboxes) => (h("em", { key: '
|
|
96
|
+
const getText = (checkboxes) => (h("em", { key: '05d577bded8e2602d1dedf9a36f695904d491242', class: "mg-c-input__section-header-title-label" }, `${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`));
|
|
103
97
|
const [from, to] = this.getFromToIndexes();
|
|
104
98
|
const itemsContainerId = `items-${this.sectionKind}-container`;
|
|
105
|
-
return (h(Host, { key: '
|
|
99
|
+
return (h(Host, { key: '49b95a0882cc475aab4a810ccd8f292d83b59a9a', hidden: this.checkboxes.length < 1 }, h("div", { key: '2db5103f9784add1effb7a5dcafa8f8196601d14', 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', size: "small" }), 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: '1bf161092691a606697a543de71e78c574b0dea0', class: "mg-c-input__section-header-tootlip", message: this.messages.tooltip }, h("mg-button", { key: '3f9090d137c2ea967e098b06a4ed2bd36da34267', 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: '6b405d35f0ffba82352dbf1a9a1e9abed274b5f2', hidden: !this.expanded, id: itemsContainerId, class: "mg-c-input__section-content" }, h(MgInputCheckboxList, { key: 'd3ef36cc9431352bedff1de8fa5f1cfc8070bfa5', 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 }))));
|
|
106
100
|
}
|
|
107
101
|
static get is() { return "mg-input-checkbox-paginated"; }
|
|
108
102
|
static get encapsulation() { return "scoped"; }
|
|
@@ -216,29 +210,6 @@ export class MgInputCheckboxPaginated {
|
|
|
216
210
|
},
|
|
217
211
|
"defaultValue": "[]"
|
|
218
212
|
},
|
|
219
|
-
"sectionKind": {
|
|
220
|
-
"type": "string",
|
|
221
|
-
"mutable": false,
|
|
222
|
-
"complexType": {
|
|
223
|
-
"original": "SectionKind",
|
|
224
|
-
"resolved": "SectionKind.NOT_SELECTED | SectionKind.SELECTED",
|
|
225
|
-
"references": {
|
|
226
|
-
"SectionKind": {
|
|
227
|
-
"location": "import",
|
|
228
|
-
"path": "../mg-input-checkbox.conf",
|
|
229
|
-
"id": "src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts::SectionKind"
|
|
230
|
-
}
|
|
231
|
-
}
|
|
232
|
-
},
|
|
233
|
-
"required": false,
|
|
234
|
-
"optional": true,
|
|
235
|
-
"docs": {
|
|
236
|
-
"tags": [],
|
|
237
|
-
"text": "Define section kind"
|
|
238
|
-
},
|
|
239
|
-
"attribute": "section-kind",
|
|
240
|
-
"reflect": false
|
|
241
|
-
},
|
|
242
213
|
"messages": {
|
|
243
214
|
"type": "unknown",
|
|
244
215
|
"mutable": false,
|
|
@@ -263,7 +234,6 @@ export class MgInputCheckboxPaginated {
|
|
|
263
234
|
}
|
|
264
235
|
static get states() {
|
|
265
236
|
return {
|
|
266
|
-
"titleKind": {},
|
|
267
237
|
"expanded": {}
|
|
268
238
|
};
|
|
269
239
|
}
|
|
@@ -279,12 +249,13 @@ export class MgInputCheckboxPaginated {
|
|
|
279
249
|
"text": "Emit 'mass-action' event\nused to informe that select-all/unselect-all button listner is triggered"
|
|
280
250
|
},
|
|
281
251
|
"complexType": {
|
|
282
|
-
"original": "
|
|
283
|
-
"resolved": "
|
|
252
|
+
"original": "SectionKindType",
|
|
253
|
+
"resolved": "\"not-selected\" | \"selected\"",
|
|
284
254
|
"references": {
|
|
285
|
-
"
|
|
286
|
-
"location": "
|
|
287
|
-
"
|
|
255
|
+
"SectionKindType": {
|
|
256
|
+
"location": "import",
|
|
257
|
+
"path": "../mg-input-checkbox.conf",
|
|
258
|
+
"id": "src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts::SectionKindType"
|
|
288
259
|
}
|
|
289
260
|
}
|
|
290
261
|
}
|
|
@@ -293,10 +264,7 @@ export class MgInputCheckboxPaginated {
|
|
|
293
264
|
static get watchers() {
|
|
294
265
|
return [{
|
|
295
266
|
"propName": "checkboxes",
|
|
296
|
-
"methodName": "
|
|
297
|
-
}, {
|
|
298
|
-
"propName": "sectionKind",
|
|
299
|
-
"methodName": "validateSectionKind"
|
|
267
|
+
"methodName": "watchCheckboxes"
|
|
300
268
|
}];
|
|
301
269
|
}
|
|
302
270
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mg-input-checkbox-paginated.js","sourceRoot":"","sources":["../../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, SectionKind, SectionTitleKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/**\n * Internal component use to manage sections instances\n */\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /*************\n * Constantes *\n *************/\n private readonly offset = 10;\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define if mg-input-checkbox-list is readonly\n */\n @Prop() readonly?: boolean;\n\n /**\n * Define if mg-input-checkbox-list is disabled\n */\n @Prop() disabled?: boolean;\n\n /**\n * Define mg-input-checkbox input name\n */\n @Prop() name?: string;\n\n /**\n * Define mg-input-checkbox input invalid\n */\n @Prop() invalid?: boolean;\n\n /**\n * Current page\n */\n @Prop({ mutable: true }) currentPage = 1;\n\n /**\n * Define checkboxes to paginate\n */\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n validateCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue: MgInputCheckboxPaginated['checkboxes']): void {\n const pageCountNewValue = this.getPageCount(newValue);\n const pageCountOldValue = this.getPageCount(oldValue);\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (pageCountNewValue === 1 || (pageCountNewValue !== 0 && this.currentPage === 0)) {\n this.currentPage = 1;\n }\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (pageCountOldValue === this.currentPage && pageCountNewValue < this.currentPage) {\n this.currentPage--;\n }\n }\n\n /**\n * Define section kind\n */\n @Prop() sectionKind?: SectionKind;\n @Watch('sectionKind')\n validateSectionKind(newValue: MgInputCheckboxPaginated['sectionKind']): void {\n if (newValue === SectionKind.SELECTED) this.titleKind = SectionTitleKind.BUTTON;\n else this.titleKind = SectionTitleKind.TEXT;\n }\n\n /**\n * Define component message\n */\n @Prop() messages: Record<string, string>;\n\n /**\n * Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n */\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<HTMLMgInputCheckboxPaginatedElement['sectionKind']>;\n\n /**\n * Define section title\n */\n @State() titleKind: SectionTitleKind;\n\n /**\n * Is checked items values expanded\n */\n @State() expanded = true;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * Mass action handler\n */\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /**\n * Toggle items button handler\n */\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n */\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /**\n * Get from and to index\n * @returns [from,to] index\n */\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const from = isFirstPage ? 0 : (this.currentPage - 1) * this.offset;\n const to = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [from, to];\n }\n\n /**\n * Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n */\n private getPageCount = (item: unknown[]): number => Math.ceil(item.length / this.offset);\n\n /**\n * Handle mg-pagination current page change event\n * @param event - pagination current page change event\n */\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n this.validateSectionKind(this.sectionKind);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => (\n <em class=\"mg-c-input__section-header-title-label\">{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>\n );\n const [from, to] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-c-input__section-header\">\n {this.titleKind === SectionTitleKind.BUTTON ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-c-input__section-header-title\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-c-input__section-header-title mg-c-input__section-header-title--static\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-tooltip class=\"mg-c-input__section-header-tootlip\" message={this.messages.tooltip} data-popper-strategy=\"absolute\">\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n </mg-tooltip>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-c-input__section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, from, to)}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n disabled={this.disabled}\n name={this.name}\n invalid={this.invalid}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"mg-input-checkbox-paginated.js","sourceRoot":"","sources":["../../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, type SectionKindType, SectionKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/**\n * Internal component use to manage sections instances\n * @internal\n */\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /*************\n * Constantes *\n *************/\n private readonly offset = 10;\n private sectionKind: SectionKindType;\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define if mg-input-checkbox-list is readonly\n */\n @Prop() readonly?: boolean;\n\n /**\n * Define if mg-input-checkbox-list is disabled\n */\n @Prop() disabled?: boolean;\n\n /**\n * Define mg-input-checkbox input name\n */\n @Prop() name?: string;\n\n /**\n * Define mg-input-checkbox input invalid\n */\n @Prop() invalid?: boolean;\n\n /**\n * Current page\n */\n @Prop({ mutable: true }) currentPage = 1;\n\n /**\n * Define checkboxes to paginate\n */\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n watchCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue?: MgInputCheckboxPaginated['checkboxes']): void {\n const pageCountNewValue = this.getPageCount(newValue);\n const pageCountOldValue = this.getPageCount(oldValue);\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (pageCountNewValue === 1 || (pageCountNewValue !== 0 && this.currentPage === 0)) {\n this.currentPage = 1;\n }\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (pageCountOldValue === this.currentPage && pageCountNewValue < this.currentPage) {\n this.currentPage--;\n }\n this.sectionKind = newValue[0].value ? SectionKind.SELECTED : SectionKind.NOT_SELECTED;\n }\n\n /**\n * Define component message\n */\n @Prop() messages: Record<string, string>;\n\n /**\n * Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n */\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<SectionKindType>;\n\n /**\n * Is checked items values expanded\n */\n @State() expanded = true;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * Mass action handler\n */\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /**\n * Toggle items button handler\n */\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n */\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /**\n * Get from and to index\n * @returns [from,to] index\n */\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const from = isFirstPage ? 0 : (this.currentPage - 1) * this.offset;\n const to = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [from, to];\n }\n\n /**\n * Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n */\n private getPageCount = (items: unknown[]): number => (items?.length > 0 ? Math.ceil(items.length / this.offset) : 0);\n\n /**\n * Handle mg-pagination current page change event\n * @param event - pagination current page change event\n */\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Validate props\n */\n componentWillLoad(): void {\n this.watchCheckboxes(this.checkboxes);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => (\n <em class=\"mg-c-input__section-header-title-label\">{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>\n );\n const [from, to] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-c-input__section-header\">\n {this.sectionKind === SectionKind.SELECTED ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-c-input__section-header-title\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-c-input__section-header-title mg-c-input__section-header-title--static\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-tooltip class=\"mg-c-input__section-header-tootlip\" message={this.messages.tooltip}>\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n </mg-tooltip>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-c-input__section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, from, to)}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n disabled={this.disabled}\n name={this.name}\n invalid={this.invalid}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"]}
|
package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js
CHANGED
|
@@ -3,28 +3,10 @@
|
|
|
3
3
|
*/
|
|
4
4
|
export const checkboxTypes = ['checkbox', 'multi'];
|
|
5
5
|
/**
|
|
6
|
-
* mg-input-checkbox-paginated section kind
|
|
6
|
+
* mg-input-checkbox-paginated section kind value
|
|
7
7
|
*/
|
|
8
|
-
export
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
})(SectionKind || (SectionKind = {}));
|
|
13
|
-
/**
|
|
14
|
-
* mg-input-checkbox-paginated section title kind
|
|
15
|
-
*/
|
|
16
|
-
export var SectionTitleKind;
|
|
17
|
-
(function (SectionTitleKind) {
|
|
18
|
-
SectionTitleKind["BUTTON"] = "button";
|
|
19
|
-
SectionTitleKind["TEXT"] = "text";
|
|
20
|
-
})(SectionTitleKind || (SectionTitleKind = {}));
|
|
21
|
-
/**
|
|
22
|
-
* Define select values button key
|
|
23
|
-
*/
|
|
24
|
-
export var SelectValuesButtonKey;
|
|
25
|
-
(function (SelectValuesButtonKey) {
|
|
26
|
-
SelectValuesButtonKey["EDIT"] = "editButton";
|
|
27
|
-
SelectValuesButtonKey["SHOW"] = "showButton";
|
|
28
|
-
SelectValuesButtonKey["SELECT"] = "selectButton";
|
|
29
|
-
})(SelectValuesButtonKey || (SelectValuesButtonKey = {}));
|
|
8
|
+
export const SectionKind = {
|
|
9
|
+
SELECTED: 'selected',
|
|
10
|
+
NOT_SELECTED: 'not-selected',
|
|
11
|
+
};
|
|
30
12
|
//# sourceMappingURL=mg-input-checkbox.conf.js.map
|
package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mg-input-checkbox.conf.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts"],"names":[],"mappings":"AAwBA;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,OAAO,CAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"mg-input-checkbox.conf.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts"],"names":[],"mappings":"AAwBA;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,OAAO,CAAU,CAAC;AAY5D;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAoC;IAC1D,QAAQ,EAAE,UAAU;IACpB,YAAY,EAAE,cAAc;CAC7B,CAAC","sourcesContent":["/**\n * interface CheckboxValue\n * use to match returned value\n */\nexport interface CheckboxValue {\n title: string;\n value: boolean | null;\n disabled?: boolean;\n required?: boolean;\n}\n\n/**\n * interface CheckboxItem\n * use to match checkbox attributes\n */\nexport interface CheckboxItem extends CheckboxValue {\n _id: string;\n _handleInput: (event: InputEvent & { target: HTMLInputElement }) => void;\n _handleBlur: () => void;\n _handleKeydown: (event: KeyboardEvent & { target: HTMLElement }) => void;\n _handleMouseEnter: () => void;\n _handleMouseLeave: () => void;\n}\n\n/**\n * List of all availables checkbox type\n */\nexport const checkboxTypes = ['checkbox', 'multi'] as const;\n\n/**\n * ChecboxType from checkbox types\n */\nexport type CheckboxType = (typeof checkboxTypes)[number];\n\n/**\n * mg-input-checkbox-paginated section kind type\n */\nexport type SectionKindType = 'selected' | 'not-selected';\n\n/**\n * mg-input-checkbox-paginated section kind value\n */\nexport const SectionKind: Record<string, SectionKindType> = {\n SELECTED: 'selected',\n NOT_SELECTED: 'not-selected',\n};\n\n/**\n * Base mg-input-checkbox interface\n */\nexport interface IMgInputCheckboxBase {\n disabled?: boolean;\n name?: string;\n invalid?: boolean;\n}\n\n/**\n * mg-input-checkbox-list interface\n */\nexport interface MgInputCheckboxListProps extends IMgInputCheckboxBase {\n displaySearchInput: boolean;\n messages: Record<string, unknown>;\n checkboxes: CheckboxItem[];\n id: string;\n}\n"]}
|