@ukic/web-components 2.25.1 → 2.26.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/{helpers-4af10d35.js → helpers-94b33ab0.js} +3 -1
- package/dist/cjs/helpers-94b33ab0.js.map +1 -0
- package/dist/cjs/ic-accordion-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +1 -1
- package/dist/cjs/ic-back-to-top.cjs.entry.js +1 -1
- package/dist/cjs/ic-badge.cjs.entry.js +1 -1
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/ic-button_3.cjs.entry.js +11 -6
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card.cjs.entry.js +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/ic-chip.cjs.entry.js +9 -3
- package/dist/cjs/ic-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-row.cjs.entry.js +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js +1 -1
- package/dist/cjs/ic-divider.cjs.entry.js +1 -1
- package/dist/cjs/ic-empty-state.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer-link-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer-link.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer.cjs.entry.js +1 -1
- package/dist/cjs/ic-hero.cjs.entry.js +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +1 -1
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +1 -1
- package/dist/cjs/ic-input-label_2.cjs.entry.js +1 -1
- package/dist/cjs/ic-link.cjs.entry.js +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-menu-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-button.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-menu.cjs.entry.js +1 -1
- package/dist/cjs/ic-page-header.cjs.entry.js +1 -1
- package/dist/cjs/ic-pagination-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-pagination.cjs.entry.js +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +1 -1
- package/dist/cjs/ic-radio-group.cjs.entry.js +41 -22
- package/dist/cjs/ic-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-option.cjs.entry.js +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +1 -1
- package/dist/cjs/ic-select.cjs.entry.js +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +1 -1
- package/dist/cjs/ic-status-tag.cjs.entry.js +1 -1
- package/dist/cjs/ic-step.cjs.entry.js +1 -1
- package/dist/cjs/ic-stepper.cjs.entry.js +1 -1
- package/dist/cjs/ic-switch.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab.cjs.entry.js +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js +1 -1
- package/dist/cjs/ic-theme.cjs.entry.js +1 -1
- package/dist/cjs/ic-toast.cjs.entry.js +1 -1
- package/dist/cjs/ic-toggle-button.cjs.entry.js +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +1 -1
- package/dist/cjs/ic-typography.cjs.entry.js +47 -12
- package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ic-chip/ic-chip.css +1 -0
- package/dist/collection/components/ic-chip/ic-chip.js +8 -2
- package/dist/collection/components/ic-chip/ic-chip.js.map +1 -1
- package/dist/collection/components/ic-chip/test/basic/ic-chip.spec.js +15 -0
- package/dist/collection/components/ic-chip/test/basic/ic-chip.spec.js.map +1 -1
- package/dist/collection/components/ic-radio-group/ic-radio-group.js +40 -21
- package/dist/collection/components/ic-radio-group/ic-radio-group.js.map +1 -1
- package/dist/collection/components/ic-tooltip/ic-tooltip.js +56 -6
- package/dist/collection/components/ic-tooltip/ic-tooltip.js.map +1 -1
- package/dist/collection/components/ic-typography/ic-typography.css +8 -0
- package/dist/collection/components/ic-typography/ic-typography.js +148 -13
- package/dist/collection/components/ic-typography/ic-typography.js.map +1 -1
- package/dist/collection/components/ic-typography/test/basic/ic-typography.spec.js +55 -0
- package/dist/collection/components/ic-typography/test/basic/ic-typography.spec.js.map +1 -1
- package/dist/collection/utils/helpers.js +1 -0
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/components/helpers.js +2 -1
- package/dist/components/helpers.js.map +1 -1
- package/dist/components/ic-alert2.js +1 -1
- package/dist/components/ic-back-to-top.js +1 -1
- package/dist/components/ic-badge.js +1 -1
- package/dist/components/ic-breadcrumb-group.js +1 -1
- package/dist/components/ic-breadcrumb2.js +1 -1
- package/dist/components/ic-button2.js +1 -1
- package/dist/components/ic-card.js +1 -1
- package/dist/components/ic-checkbox-group.js +1 -1
- package/dist/components/ic-checkbox.js +1 -1
- package/dist/components/ic-chip.js +9 -3
- package/dist/components/ic-chip.js.map +1 -1
- package/dist/components/ic-data-row.js +1 -1
- package/dist/components/ic-dialog.js +1 -1
- package/dist/components/ic-divider2.js +1 -1
- package/dist/components/ic-empty-state.js +1 -1
- package/dist/components/ic-footer-link-group.js +1 -1
- package/dist/components/ic-footer-link.js +1 -1
- package/dist/components/ic-footer.js +1 -1
- package/dist/components/ic-hero.js +1 -1
- package/dist/components/ic-horizontal-scroll2.js +1 -1
- package/dist/components/ic-input-component-container2.js +1 -1
- package/dist/components/ic-input-label2.js +1 -1
- package/dist/components/ic-input-validation2.js +1 -1
- package/dist/components/ic-link2.js +1 -1
- package/dist/components/ic-loading-indicator2.js +1 -1
- package/dist/components/ic-menu-group.js +1 -1
- package/dist/components/ic-menu-item2.js +1 -1
- package/dist/components/ic-navigation-button.js +1 -1
- package/dist/components/ic-navigation-group.js +1 -1
- package/dist/components/ic-navigation-item.js +1 -1
- package/dist/components/ic-navigation-menu2.js +1 -1
- package/dist/components/ic-page-header.js +1 -1
- package/dist/components/ic-pagination-item2.js +1 -1
- package/dist/components/ic-popover-menu.js +1 -1
- package/dist/components/ic-radio-group.js +41 -22
- package/dist/components/ic-radio-group.js.map +1 -1
- package/dist/components/ic-radio-option.js +1 -1
- package/dist/components/ic-search-bar.js +1 -1
- package/dist/components/ic-select.js +1 -1
- package/dist/components/ic-side-navigation.js +1 -1
- package/dist/components/ic-step.js +1 -1
- package/dist/components/ic-stepper.js +1 -1
- package/dist/components/ic-switch.js +1 -1
- package/dist/components/ic-tab-panel.js +1 -1
- package/dist/components/ic-text-field2.js +1 -1
- package/dist/components/ic-theme.js +1 -1
- package/dist/components/ic-toast.js +1 -1
- package/dist/components/ic-tooltip2.js +12 -5
- package/dist/components/ic-tooltip2.js.map +1 -1
- package/dist/components/ic-top-navigation.js +1 -1
- package/dist/components/ic-typography2.js +53 -15
- package/dist/components/ic-typography2.js.map +1 -1
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-967d5546.entry.js → p-02262e76.entry.js} +2 -2
- package/dist/core/{p-98708868.entry.js → p-03f23a55.entry.js} +2 -2
- package/dist/core/{p-5128fc04.entry.js → p-093600a2.entry.js} +2 -2
- package/dist/core/{p-59732bc5.entry.js → p-13a6e7ea.entry.js} +2 -2
- package/dist/core/{p-80b87940.entry.js → p-13ec2a00.entry.js} +2 -2
- package/dist/core/{p-13f2c9dc.entry.js → p-1ae6aadb.entry.js} +2 -2
- package/dist/core/{p-a646c117.entry.js → p-1d6e6ebe.entry.js} +2 -2
- package/dist/core/{p-1d9fceb1.entry.js → p-223889da.entry.js} +2 -2
- package/dist/core/{p-f13195ab.entry.js → p-227f6a41.entry.js} +2 -2
- package/dist/core/{p-d69f353b.entry.js → p-230187a8.entry.js} +2 -2
- package/dist/core/p-2d930c9c.entry.js +2 -0
- package/dist/core/p-2d930c9c.entry.js.map +1 -0
- package/dist/core/{p-6a4a0752.entry.js → p-3af60dee.entry.js} +2 -2
- package/dist/core/{p-191d2571.entry.js → p-3b4c9571.entry.js} +2 -2
- package/dist/core/{p-8ce2dfd4.entry.js → p-3f2d4108.entry.js} +2 -2
- package/dist/core/{p-4a64ec92.entry.js → p-49e997c7.entry.js} +2 -2
- package/dist/core/{p-1f4698e7.entry.js → p-55b11f6f.entry.js} +2 -2
- package/dist/core/{p-261debaf.entry.js → p-5ccd3703.entry.js} +2 -2
- package/dist/core/{p-6e36ff34.entry.js → p-60746e10.entry.js} +2 -2
- package/dist/core/{p-eb1d00a7.entry.js → p-60f7f555.entry.js} +2 -2
- package/dist/core/{p-4ecf210f.entry.js → p-69576aa0.entry.js} +2 -2
- package/dist/core/{p-24e6c926.entry.js → p-7c2b59fe.entry.js} +2 -2
- package/dist/core/{p-cf3a721c.entry.js → p-836e71de.entry.js} +2 -2
- package/dist/core/{p-08781606.entry.js → p-843ed766.entry.js} +2 -2
- package/dist/core/{p-1eb6fc19.entry.js → p-8c325d9b.entry.js} +2 -2
- package/dist/core/{p-37d152b9.entry.js → p-9146a7f9.entry.js} +2 -2
- package/dist/core/{p-a8aea311.entry.js → p-936ab032.entry.js} +2 -2
- package/dist/core/{p-70a7cfa5.entry.js → p-96505636.entry.js} +2 -2
- package/dist/core/{p-5bba7e31.entry.js → p-9c9ba3cd.entry.js} +2 -2
- package/dist/core/{p-038a2ea1.entry.js → p-a6ff78aa.entry.js} +2 -2
- package/dist/core/{p-85f6a2ef.entry.js → p-a75f3c4d.entry.js} +2 -2
- package/dist/core/{p-1ef00a47.entry.js → p-ad67c84f.entry.js} +2 -2
- package/dist/core/{p-2bc8a51d.entry.js → p-aeb001d7.entry.js} +2 -2
- package/dist/core/{p-7e5936a3.entry.js → p-b2ceb541.entry.js} +2 -2
- package/dist/core/{p-14c47aed.entry.js → p-b9be021b.entry.js} +2 -2
- package/dist/core/p-b9be021b.entry.js.map +1 -0
- package/dist/core/{p-014342a2.entry.js → p-bb963aa4.entry.js} +2 -2
- package/dist/core/{p-03434b02.entry.js → p-be5d5f93.entry.js} +2 -2
- package/dist/core/{p-4a9eecd7.entry.js → p-c1d5e7f2.entry.js} +2 -2
- package/dist/core/{p-277c3199.entry.js → p-c59474bb.entry.js} +2 -2
- package/dist/core/{p-a9a2987c.entry.js → p-cb14349b.entry.js} +2 -2
- package/dist/core/p-d21f0d15.entry.js +2 -0
- package/dist/core/p-d21f0d15.entry.js.map +1 -0
- package/dist/core/{p-d19d50b6.entry.js → p-d3750771.entry.js} +2 -2
- package/dist/core/{p-ea61b524.entry.js → p-db52d416.entry.js} +2 -2
- package/dist/core/{p-c1db024d.entry.js → p-dbc0f5da.entry.js} +2 -2
- package/dist/core/{p-4ad38ad7.entry.js → p-dcd475cc.entry.js} +2 -2
- package/dist/core/{p-3b41756e.entry.js → p-dd9d8e68.entry.js} +2 -2
- package/dist/core/{p-a332f7d8.entry.js → p-def5ba6b.entry.js} +2 -2
- package/dist/core/{p-0a2cdf34.entry.js → p-e6bad80b.entry.js} +2 -2
- package/dist/core/{p-bb2f2048.entry.js → p-e7fa6804.entry.js} +2 -2
- package/dist/core/{p-92b9b56a.entry.js → p-e8fa0095.entry.js} +2 -2
- package/dist/core/p-ed2b2bd7.entry.js +2 -0
- package/dist/core/p-ed2b2bd7.entry.js.map +1 -0
- package/dist/core/{p-15138df1.entry.js → p-ee1c9f20.entry.js} +2 -2
- package/dist/core/{p-41b93fc2.entry.js → p-f735a277.entry.js} +2 -2
- package/dist/core/{p-36cd5d32.js → p-fef9e8c9.js} +2 -2
- package/dist/core/p-fef9e8c9.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-354dbb8d.js → helpers-3905ccc4.js} +3 -2
- package/dist/esm/helpers-3905ccc4.js.map +1 -0
- package/dist/esm/ic-accordion-group.entry.js +1 -1
- package/dist/esm/ic-accordion.entry.js +1 -1
- package/dist/esm/ic-alert.entry.js +1 -1
- package/dist/esm/ic-back-to-top.entry.js +1 -1
- package/dist/esm/ic-badge.entry.js +1 -1
- package/dist/esm/ic-breadcrumb-group.entry.js +1 -1
- package/dist/esm/ic-breadcrumb.entry.js +1 -1
- package/dist/esm/ic-button_3.entry.js +11 -6
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card.entry.js +1 -1
- package/dist/esm/ic-checkbox-group.entry.js +1 -1
- package/dist/esm/ic-checkbox.entry.js +1 -1
- package/dist/esm/ic-chip.entry.js +9 -3
- package/dist/esm/ic-chip.entry.js.map +1 -1
- package/dist/esm/ic-data-row.entry.js +1 -1
- package/dist/esm/ic-dialog.entry.js +1 -1
- package/dist/esm/ic-divider.entry.js +1 -1
- package/dist/esm/ic-empty-state.entry.js +1 -1
- package/dist/esm/ic-footer-link-group.entry.js +1 -1
- package/dist/esm/ic-footer-link.entry.js +1 -1
- package/dist/esm/ic-footer.entry.js +1 -1
- package/dist/esm/ic-hero.entry.js +1 -1
- package/dist/esm/ic-horizontal-scroll.entry.js +1 -1
- package/dist/esm/ic-input-component-container_3.entry.js +1 -1
- package/dist/esm/ic-input-label_2.entry.js +1 -1
- package/dist/esm/ic-link.entry.js +1 -1
- package/dist/esm/ic-menu-group.entry.js +1 -1
- package/dist/esm/ic-menu-item.entry.js +1 -1
- package/dist/esm/ic-navigation-button.entry.js +1 -1
- package/dist/esm/ic-navigation-group.entry.js +1 -1
- package/dist/esm/ic-navigation-item.entry.js +1 -1
- package/dist/esm/ic-navigation-menu.entry.js +1 -1
- package/dist/esm/ic-page-header.entry.js +1 -1
- package/dist/esm/ic-pagination-item.entry.js +1 -1
- package/dist/esm/ic-pagination.entry.js +1 -1
- package/dist/esm/ic-popover-menu.entry.js +1 -1
- package/dist/esm/ic-radio-group.entry.js +41 -22
- package/dist/esm/ic-radio-group.entry.js.map +1 -1
- package/dist/esm/ic-radio-option.entry.js +1 -1
- package/dist/esm/ic-search-bar.entry.js +1 -1
- package/dist/esm/ic-select.entry.js +1 -1
- package/dist/esm/ic-side-navigation.entry.js +1 -1
- package/dist/esm/ic-status-tag.entry.js +1 -1
- package/dist/esm/ic-step.entry.js +1 -1
- package/dist/esm/ic-stepper.entry.js +1 -1
- package/dist/esm/ic-switch.entry.js +1 -1
- package/dist/esm/ic-tab-group.entry.js +1 -1
- package/dist/esm/ic-tab-panel.entry.js +1 -1
- package/dist/esm/ic-tab.entry.js +1 -1
- package/dist/esm/ic-text-field.entry.js +1 -1
- package/dist/esm/ic-theme.entry.js +1 -1
- package/dist/esm/ic-toast.entry.js +1 -1
- package/dist/esm/ic-toggle-button.entry.js +1 -1
- package/dist/esm/ic-top-navigation.entry.js +1 -1
- package/dist/esm/ic-typography.entry.js +48 -13
- package/dist/esm/ic-typography.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-chip/ic-chip.d.ts +2 -0
- package/dist/types/components/ic-radio-group/ic-radio-group.d.ts +3 -0
- package/dist/types/components/ic-tooltip/ic-tooltip.d.ts +7 -0
- package/dist/types/components/ic-typography/ic-typography.d.ts +23 -1
- package/dist/types/components.d.ts +30 -0
- package/dist/types/utils/helpers.d.ts +1 -0
- package/hydrate/index.js +112 -41
- package/package.json +2 -2
- package/dist/cjs/helpers-4af10d35.js.map +0 -1
- package/dist/core/p-14c47aed.entry.js.map +0 -1
- package/dist/core/p-1e33ac04.entry.js +0 -2
- package/dist/core/p-1e33ac04.entry.js.map +0 -1
- package/dist/core/p-36cd5d32.js.map +0 -1
- package/dist/core/p-e928928a.entry.js +0 -2
- package/dist/core/p-e928928a.entry.js.map +0 -1
- package/dist/core/p-f861a72a.entry.js +0 -2
- package/dist/core/p-f861a72a.entry.js.map +0 -1
- package/dist/esm/helpers-354dbb8d.js.map +0 -1
- /package/dist/core/{p-967d5546.entry.js.map → p-02262e76.entry.js.map} +0 -0
- /package/dist/core/{p-98708868.entry.js.map → p-03f23a55.entry.js.map} +0 -0
- /package/dist/core/{p-5128fc04.entry.js.map → p-093600a2.entry.js.map} +0 -0
- /package/dist/core/{p-59732bc5.entry.js.map → p-13a6e7ea.entry.js.map} +0 -0
- /package/dist/core/{p-80b87940.entry.js.map → p-13ec2a00.entry.js.map} +0 -0
- /package/dist/core/{p-13f2c9dc.entry.js.map → p-1ae6aadb.entry.js.map} +0 -0
- /package/dist/core/{p-a646c117.entry.js.map → p-1d6e6ebe.entry.js.map} +0 -0
- /package/dist/core/{p-1d9fceb1.entry.js.map → p-223889da.entry.js.map} +0 -0
- /package/dist/core/{p-f13195ab.entry.js.map → p-227f6a41.entry.js.map} +0 -0
- /package/dist/core/{p-d69f353b.entry.js.map → p-230187a8.entry.js.map} +0 -0
- /package/dist/core/{p-6a4a0752.entry.js.map → p-3af60dee.entry.js.map} +0 -0
- /package/dist/core/{p-191d2571.entry.js.map → p-3b4c9571.entry.js.map} +0 -0
- /package/dist/core/{p-8ce2dfd4.entry.js.map → p-3f2d4108.entry.js.map} +0 -0
- /package/dist/core/{p-4a64ec92.entry.js.map → p-49e997c7.entry.js.map} +0 -0
- /package/dist/core/{p-1f4698e7.entry.js.map → p-55b11f6f.entry.js.map} +0 -0
- /package/dist/core/{p-261debaf.entry.js.map → p-5ccd3703.entry.js.map} +0 -0
- /package/dist/core/{p-6e36ff34.entry.js.map → p-60746e10.entry.js.map} +0 -0
- /package/dist/core/{p-eb1d00a7.entry.js.map → p-60f7f555.entry.js.map} +0 -0
- /package/dist/core/{p-4ecf210f.entry.js.map → p-69576aa0.entry.js.map} +0 -0
- /package/dist/core/{p-24e6c926.entry.js.map → p-7c2b59fe.entry.js.map} +0 -0
- /package/dist/core/{p-cf3a721c.entry.js.map → p-836e71de.entry.js.map} +0 -0
- /package/dist/core/{p-08781606.entry.js.map → p-843ed766.entry.js.map} +0 -0
- /package/dist/core/{p-1eb6fc19.entry.js.map → p-8c325d9b.entry.js.map} +0 -0
- /package/dist/core/{p-37d152b9.entry.js.map → p-9146a7f9.entry.js.map} +0 -0
- /package/dist/core/{p-a8aea311.entry.js.map → p-936ab032.entry.js.map} +0 -0
- /package/dist/core/{p-70a7cfa5.entry.js.map → p-96505636.entry.js.map} +0 -0
- /package/dist/core/{p-5bba7e31.entry.js.map → p-9c9ba3cd.entry.js.map} +0 -0
- /package/dist/core/{p-038a2ea1.entry.js.map → p-a6ff78aa.entry.js.map} +0 -0
- /package/dist/core/{p-85f6a2ef.entry.js.map → p-a75f3c4d.entry.js.map} +0 -0
- /package/dist/core/{p-1ef00a47.entry.js.map → p-ad67c84f.entry.js.map} +0 -0
- /package/dist/core/{p-2bc8a51d.entry.js.map → p-aeb001d7.entry.js.map} +0 -0
- /package/dist/core/{p-7e5936a3.entry.js.map → p-b2ceb541.entry.js.map} +0 -0
- /package/dist/core/{p-014342a2.entry.js.map → p-bb963aa4.entry.js.map} +0 -0
- /package/dist/core/{p-03434b02.entry.js.map → p-be5d5f93.entry.js.map} +0 -0
- /package/dist/core/{p-4a9eecd7.entry.js.map → p-c1d5e7f2.entry.js.map} +0 -0
- /package/dist/core/{p-277c3199.entry.js.map → p-c59474bb.entry.js.map} +0 -0
- /package/dist/core/{p-a9a2987c.entry.js.map → p-cb14349b.entry.js.map} +0 -0
- /package/dist/core/{p-d19d50b6.entry.js.map → p-d3750771.entry.js.map} +0 -0
- /package/dist/core/{p-ea61b524.entry.js.map → p-db52d416.entry.js.map} +0 -0
- /package/dist/core/{p-c1db024d.entry.js.map → p-dbc0f5da.entry.js.map} +0 -0
- /package/dist/core/{p-4ad38ad7.entry.js.map → p-dcd475cc.entry.js.map} +0 -0
- /package/dist/core/{p-3b41756e.entry.js.map → p-dd9d8e68.entry.js.map} +0 -0
- /package/dist/core/{p-a332f7d8.entry.js.map → p-def5ba6b.entry.js.map} +0 -0
- /package/dist/core/{p-0a2cdf34.entry.js.map → p-e6bad80b.entry.js.map} +0 -0
- /package/dist/core/{p-bb2f2048.entry.js.map → p-e7fa6804.entry.js.map} +0 -0
- /package/dist/core/{p-92b9b56a.entry.js.map → p-e8fa0095.entry.js.map} +0 -0
- /package/dist/core/{p-15138df1.entry.js.map → p-ee1c9f20.entry.js.map} +0 -0
- /package/dist/core/{p-41b93fc2.entry.js.map → p-f735a277.entry.js.map} +0 -0
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icButtonCss","buttonIds","Button","this","buttonIdNum","hasTooltip","inheritedAttributes","describedbyEl","describedById","mutationObserver","hostMutationObserver","handleClick","el","type","hasRouterSlot","closest","hiddenFormButton","document","createElement","setAttribute","style","display","appendChild","click","remove","handleKeyDown","ev","key","closeButtonTooltip","onFocus","icFocus","emit","onBlur","icBlur","mutationCallback","describedByContent","innerText","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","attribute","getAttribute","title","ariaLabel","IC_INHERITED_ARIA","includes","forceUpdate","setHasTooltip","disableTooltip","variant","watchDisabledHandler","removeDisabledFalse","disabled","disconnectedCallback","undefined","disconnect","componentWillUpdate","loading","setProperty","getBoundingClientRect","width","componentWillLoad","_a","inheritAttributes","restInheritedAttributes","__rest","id","parentElement","querySelector","componentDidLoad","updateTheme","MutationObserver","observe","characterData","childList","subtree","attributes","componentWillRender","iconEl","hasIconSlot","handleHostClick","event","fileUpload","renderFileHiddenInput","icFileSelection","multiple","fileInputName","selectedFiles","accept","stopImmediatePropagation","dropdown","dropdownExpanded","themeChangeHandler","detail","mode","setFocus","buttonEl","focus","tooltip","shadowRoot","isTooltipVisible","displayTooltip","preventDefault","position","selectorPrefix","routerSlot","textContent","newTheme","foregroundColor","getThemeFromContext","IcThemeForegroundEnum","Default","appearance","render","TagType","href","buttonAttrs","form","formaction","formenctype","formmethod","formnovalidate","formtarget","download","rel","target","referrerpolicy","hreflang","describedby","buttonId","ButtonContent","h","Object","assign","class","ref","part","name","Dark","Light","innerHTML","arrowDropdown","Host","size","fullWidth","isSlotUsed","transparentBackground","onClick","onKeyDown","ariaOwnsId","ariaControlsId","label","placement","tooltipPlacement","silent","icLoadingIndicatorCss","LoadingIndicator","updateCircularProgressMeter","indeterminate","circularMeter","String","progress","getLabel","labelIndex","setLabel","Promise","interval","setInterval","labelList","length","labelDuration","getLabelVariant","outerElement","offsetWidth","setCircleLineWidth","compactStepCircularLineWidth","classList","contains","toastDismissTimerCircularLineWidth","circularLineWidth","circularDiameter","setLinearDeterminateWidth","innerElement","Math","min","max","proportion","showSecond","add","calcOuterClass","cls","updateLabel","isPropDefined","split","indicatorLabel","setCircleXY","r","x","y","nextRadius","setDashSteps","radius","dashArray","PI","watchPropHandler","watchProgressHandler","clearInterval","Number","componentDidUpdate","description","innerLabel","role","viewBox","cx","cy","icTooltipCss","Tooltip","delayedHideEvents","dialogOverflow","instantHideEvents","mouseOverTool","persistTooltip","onDialog","showEvents","disableHover","disableClick","getTooltipTranslate","dialogEl","child","children","tooltipX","tooltipY","left","bottom","top","right","height","toolTip","show","icDialogEl","popperInstance","createPopper","modifiers","options","offset","element","arrow","scroll","resize","console","warn","hide","removeAttribute","destroy","checkCloseTooltip","setTimeout","mouseEnterTooltip","mouseLeaveTooltip","manageEventListeners","action","method","onComponentRequiredPropUndefined","prop","propName","componentDidRender","typographyEl","maxLines","resolve","hasAttribute"],"sources":["src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","src/components/ic-button/ic-button.tsx","src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","src/components/ic-loading-indicator/ic-loading-indicator.tsx","src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","src/components/ic-tooltip/ic-tooltip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n* @prop --min-width: Minimum width of the button.\n* @prop --height: The height of the button.\n*/\n\n:host {\n display: inline-block;\n position: relative;\n\n --button-default: var(--ic-action-default);\n --button-default-hover: var(--ic-action-default-hover);\n --button-default-active: var(--ic-action-default-active);\n --button-default-background-hover: var(--ic-action-default-bg-hover);\n --button-default-background-active: var(--ic-action-default-bg-active);\n --icon-width: 100%;\n --icon-height: 100%;\n}\n\n.button,\n::slotted(a) {\n font-family: var(--ic-font-body-family);\n text-decoration: none;\n font-weight: 600;\n font-size: 0.875rem;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n min-width: var(--min-width, 6.25rem);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n}\n\n:host(.with-badge) .button {\n border-radius: 0.2188rem;\n}\n\n.button:hover,\n::slotted(a:hover) {\n cursor: pointer;\n}\n\n.button:focus,\n::slotted(a:focus) {\n box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible,\n::slotted(a:focus-visible) {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button,\n:host(.dark) ::slotted(a) {\n --button-default: var(--ic-action-dark);\n --button-default-hover: var(--ic-action-dark);\n --button-default-active: var(--ic-action-dark);\n --button-default-background-hover: var(--ic-action-dark-bg-hover);\n --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button,\n:host(.light) ::slotted(a) {\n --button-default: var(--ic-action-light);\n --button-default-hover: var(--ic-action-light);\n --button-default-active: var(--ic-action-light);\n --button-default-background-hover: var(--ic-action-light-bg-hover);\n --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.white-background) .button,\n:host(.white-background) ::slotted(a) {\n --button-default-background-hover: var(--ic-action-default-bg-hover-no-alpha);\n --button-default-background-active: var(\n --ic-action-default-bg-active-no-alpha\n );\n\n background-color: var(--ic-architectural-white);\n}\n\n:host(.white-background.dark) .button,\n:host(.white-background.dark) ::slotted(a) {\n --button-default-background-hover: var(--ic-action-dark-bg-hover-no-alpha);\n --button-default-background-active: var(--ic-action-dark-bg-active-no-alpha);\n}\n\n:host(.button-variant-primary.light) .button,\n:host(.button-variant-primary.light) ::slotted(a) {\n color: var(--ic-color-primary-text);\n\n --button-default-hover: var(--ic-action-light-hover);\n --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button,\n:host(.button-variant-primary.dark) ::slotted(a) {\n --button-default-hover: var(--ic-action-dark-hover);\n --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.disabled) ::slotted(a),\n:host(.loading),\n:host(.loading) .button {\n pointer-events: none;\n}\n\n:host(.top-icon) .button {\n flex-direction: column;\n\n --height: fit-content;\n}\n\n:host(.top-icon) .button .icon-container {\n margin-right: 0;\n}\n\n/* Variants */\n\n/* Primary */\n\n:host(.button-variant-primary) .button,\n:host(.button-variant-primary) ::slotted(a) {\n color: var(--ic-color-white-text);\n background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover {\n background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary.loading) .button,\n:host(.button-variant-primary) .button:active {\n background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button,\n:host(.button-variant-primary.disabled) ::slotted(a) {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button,\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n background: var(--ic-architectural-600);\n color: var(--ic-architectural-500);\n}\n\n/* Secondary */\n\n:host(.button-variant-secondary) .button,\n:host(.button-variant-secondary) ::slotted(a) {\n border: var(--ic-border-width) solid var(--button-default);\n color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover,\n:host(.button-variant-secondary) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover);\n border-color: var(--button-default-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active,\n:host(.button-variant-secondary) ::slotted(a:active),\n:host(.button-variant-secondary.loading) .button {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) ::slotted(a) {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) ::slotted(a) {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n}\n\n/* Tertiary */\n\n:host(.button-variant-tertiary) .button,\n:host(.button-variant-tertiary) ::slotted(a) {\n color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover,\n:host(.button-variant-tertiary) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active,\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-tertiary.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) ::slotted(a) {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) ::slotted(a) {\n color: var(--ic-architectural-500);\n}\n\n/* Destructive */\n\n:host(.button-variant-destructive) .button,\n:host(.button-variant-destructive) ::slotted(a) {\n color: var(--ic-color-white-text);\n background-color: var(--ic-action-destructive);\n text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover {\n background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active,\n:host(.button-variant-destructive.loading) .button {\n background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button,\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n/* Icon */\n\n:host(.button-variant-icon) .button,\n:host(.button-variant-icon) ::slotted(a) {\n color: var(--button-default);\n min-width: 0;\n gap: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon) .icon-container {\n width: var(--ic-space-lg) !important;\n height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon) .button:hover,\n:host(.button-variant-icon) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)),\n:host(.button-variant-icon.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) ::slotted(a) {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n/***********************\n * Icon Variants\n ***********************/\n\n/* Icon-primary */\n\n:host(.button-variant-icon-primary) .button,\n:host(.button-variant-icon-primary) ::slotted(a) {\n color: var(--ic-color-white-text);\n background-color: var(--button-default);\n min-width: 0;\n gap: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-primary) .icon-container {\n width: var(--ic-space-lg) !important;\n height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-primary) .button:hover,\n:host(.button-variant-icon-primary) ::slotted(a:hover) {\n background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-primary) .button:active,\n:host(.button-variant-icon-primary) ::slotted(a:active),\n:host(.button-variant-icon-primary.loading) .button {\n background: var(--button-default-active);\n}\n\n:host(.button-variant-icon-primary.loading) .button ic-loading-indicator {\n --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-primary.disabled) .button,\n:host(.button-variant-icon-primary.disabled) ::slotted(a) {\n color: var(--ic-architectural-300);\n background: var(--ic-architectural-200);\n}\n\n:host(.button-variant-icon-primary.light) .button,\n:host(.button-variant-icon-primary.light) ::slotted(a) {\n color: var(--ic-color-primary-text);\n}\n\n:host(.button-variant-icon-primary.light) .button:hover,\n:host(.button-variant-icon-primary.light) ::slotted(a:hover) {\n background: var(--ic-action-light-hover);\n}\n\n:host(.button-variant-icon-primary.light) .button:active,\n:host(.button-variant-icon-primary.light) ::slotted(a:active),\n:host(.button-variant-icon-primary.light.loading) .button,\n:host(.button-variant-icon-primary.light.loading) ::slotted(a) {\n background: var(--ic-action-light-active);\n}\n\n:host(.button-variant-icon-primary.dark) .button:hover,\n:host(.button-variant-icon-primary.dark) ::slotted(a:hover) {\n background: var(--ic-action-dark-hover);\n}\n\n:host(.button-variant-icon-primary.dark) .button:active,\n:host(.button-variant-icon-primary.dark) ::slotted(a:active),\n:host(.button-variant-icon-primary.dark.loading) .button,\n:host(.button-variant-icon-primary.dark.loading) ::slotted(a) {\n background: var(--ic-action-dark-active);\n}\n\n/* Icon-secondary */\n\n:host(.button-variant-icon-secondary) .button,\n:host(.button-variant-icon-secondary) ::slotted(a) {\n border: var(--ic-border-width) solid var(--button-default);\n color: var(--button-default);\n min-width: 0;\n gap: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-secondary) .icon-container {\n width: var(--ic-space-lg) !important;\n height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-secondary) .button:hover,\n:host(.button-variant-icon-secondary) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover);\n border-color: var(--button-default-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-secondary) .button:active,\n:host(.button-variant-icon-secondary) ::slotted(a:active),\n:host(.button-variant-icon-secondary.loading) .button {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-secondary.disabled) .button,\n:host(.button-variant-icon-secondary.disabled) .button:hover,\n:host(.button-variant-icon-secondary.disabled) .button:active,\n:host(.button-variant-icon-secondary.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:active) {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-icon-secondary.light.disabled) .button,\n:host(.button-variant-icon-secondary.light.disabled) .button:hover,\n:host(.button-variant-icon-secondary.light.disabled) .button:active,\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:active) {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n}\n\n/* Icon-tertiary */\n\n:host(.button-variant-icon-tertiary) .button,\n:host(.button-variant-icon-tertiary) ::slotted(a) {\n color: var(--button-default);\n min-width: 0;\n gap: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-tertiary) .icon-container {\n width: var(--ic-space-lg) !important;\n height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-tertiary) .button:hover,\n:host(.button-variant-icon-tertiary) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-tertiary) .button:active,\n:host(.button-variant-icon-tertiary) ::slotted(a:active),\n:host(.button-variant-icon-tertiary.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-tertiary.disabled) .button,\n:host(.button-variant-icon-tertiary.disabled) .button:hover,\n:host(.button-variant-icon-tertiary.disabled) .button:active,\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:active) {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n/* Icon-destructive */\n\n:host(.button-variant-icon-destructive) .button,\n:host(.button-variant-icon-destructive) ::slotted(a) {\n color: var(--ic-color-white-text);\n background-color: var(--ic-action-destructive);\n min-width: 0;\n gap: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-destructive) .icon-container {\n width: var(--ic-space-lg) !important;\n height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-destructive) .button:hover,\n:host(.button-variant-icon-destructive) ::slotted(a:hover) {\n background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-icon-destructive) .button:active,\n:host(.button-variant-icon-destructive) ::slotted(a:active),\n:host(.button-variant-icon-destructive.loading) .button {\n background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-icon-destructive.loading) .button ic-loading-indicator {\n --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-destructive.disabled) .button,\n:host(.button-variant-icon-destructive.disabled) .button:hover,\n:host(.button-variant-icon-destructive.disabled) .button:active,\n:host(.button-variant-icon-destructive.disabled) ::slotted(a),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:active) {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n/* Sizing */\n\n:host(.button-size-default) .button {\n height: var(--height, 2.5rem);\n padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n height: var(--height, var(--ic-space-xl));\n padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n height: var(--height, var(--ic-space-xxl));\n padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button,\n:host(.button-size-default.button-variant-icon-primary) .button,\n:host(.button-size-default.button-variant-icon-secondary) .button,\n:host(.button-size-default.button-variant-icon-tertiary) .button,\n:host(.button-size-default.button-variant-icon-destructive) .button,\n:host(.button-size-default.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n height: var(--height, var(--ic-space-xl));\n width: var(--ic-space-xl);\n padding: 0.375rem;\n}\n\n:host(.button-size-small.button-variant-icon) .button,\n:host(.button-size-small.button-variant-icon-primary) .button,\n:host(.button-size-small.button-variant-icon-secondary) .button,\n:host(.button-size-small.button-variant-icon-tertiary) .button,\n:host(.button-size-small.button-variant-icon-destructive) .button,\n:host(.button-size-small.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n height: var(--height, var(--ic-space-lg));\n width: var(--ic-space-lg);\n padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button,\n:host(.button-size-large.button-variant-icon-primary) .button,\n:host(.button-size-large.button-variant-icon-secondary) .button,\n:host(.button-size-large.button-variant-icon-tertiary) .button,\n:host(.button-size-large.button-variant-icon-destructive) .button,\n:host(.button-size-large.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n height: var(--height, 2.5rem);\n width: 2.5rem;\n padding: var(--ic-space-xs);\n}\n\n/* Width */\n:host(.full-width),\n:host(.full-width) .button,\n:host(.full-width) ::slotted(a) {\n width: 100%;\n}\n\n/* Loading */\n\ndiv.loading-container {\n position: relative;\n align-items: center;\n width: 100%;\n}\n\nic-loading-indicator {\n --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n 0% {\n width: 0%;\n left: 0%;\n }\n\n 25% {\n width: 0%;\n left: 0%;\n opacity: 0;\n }\n\n 50% {\n width: 100%;\n left: 0%;\n opacity: 1;\n }\n\n 75% {\n width: 0%;\n left: 100%;\n }\n\n 100% {\n width: 0%;\n left: 100%;\n opacity: 0;\n }\n}\n\n/* Icons */\n\ndiv.icon-container {\n box-sizing: border-box;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n display: flex;\n justify-content: center;\n align-items: center;\n margin-right: var(--ic-space-xs);\n}\n\ndiv.right-icon {\n margin-right: auto;\n margin-left: var(--ic-space-xs);\n}\n\n:host(.full-width) .right-icon {\n margin-right: var(--ic-space-xs);\n}\n\n::slotted(:not(ic-badge)) {\n width: var(--icon-width) !important;\n height: var(--icon-height) !important;\n fill: currentcolor !important;\n pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n margin: 0;\n pointer-events: none;\n}\n\n/** SEARCH **/\n\n:host(.search-submit-button) ::slotted(svg) {\n --icon-height: 1.25rem;\n --icon-width: 1.25rem;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n --icon-height: 1rem;\n --icon-width: 1rem;\n}\n\n:host(.clear-button) {\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus,\n:host(.calendar-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n box-shadow: none;\n background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n display: flex;\n align-items: center;\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n --icon-height: 0.875rem;\n --icon-width: 0.875rem;\n}\n\n:host(.popout-menu-button) .button {\n height: var(--height);\n justify-content: left;\n border-radius: 0;\n white-space: pre-line;\n text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n display: none;\n}\n\n:host .ic-tooltip {\n display: block;\n}\n\n/** Dropdown **/\n:host .arrow-dropdown {\n margin-top: auto;\n}\n\n:host .dropdown-expanded {\n transform: rotate(180deg);\n margin-bottom: var(--ic-space-xxxs);\n}\n\n:host(.dropdown-no-icon) .button {\n padding-right: var(--ic-space-xs);\n}\n\n/** Slotted router item **/\nslot[name=\"router-item\"]::slotted(a) {\n pointer-events: all;\n}\n\n::slotted(a) {\n font-size: 0.875rem !important;\n border: none !important;\n vertical-align: middle !important;\n}\n\n:host(.white-background) ::slotted(a) {\n background-color: var(--ic-architectural-white) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a) {\n background-color: var(--button-default) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:hover) {\n background-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:active) {\n background-color: var(--button-default-active) !important;\n}\n\n:host(.button-variant-primary.disabled) ::slotted(a),\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n background: var(--ic-architectural-200) !important;\n}\n\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n background: var(--ic-architectural-600) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a) {\n border: var(--ic-border-width) solid var(--button-default) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover) !important;\n border-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:active) {\n border-color: var(--button-default-active) !important;\n background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-secondary.disabled) ::slotted(a),\n:host(.button-variant-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.disabled) ::slotted(a),\n:host(.button-variant-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.disabled) ::slotted(a:active) {\n border-color: var(--ic-architectural-300) !important;\n background: none !important;\n}\n\n:host(.button-variant-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:active) {\n border-color: var(--ic-architectural-500) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:hover),\n:host(.button-variant-icon) ::slotted(a:hover) {\n background-color: var(--button-default-background-hover) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:active:not(:focus)),\n:host(.button-variant-tertiary) ::slotted(a:active:focus),\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)) {\n background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-icon.disabled) ::slotted(a),\n:host(.button-variant-icon.disabled) ::slotted(a:hover),\n:host(.button-variant-icon.disabled) ::slotted(a:active) {\n background: none !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a) {\n background-color: var(--ic-action-destructive) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:hover) {\n background-color: var(--ic-action-destructive-hover) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:active) {\n background-color: var(--ic-action-destructive-active) !important;\n}\n\n:host(.button-size-default) ::slotted(a) {\n height: var(--height, 2.5rem) !important;\n padding: var(--ic-space-xs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-small) ::slotted(a) {\n height: var(--height, var(--ic-space-xl)) !important;\n padding: var(--ic-space-xxs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-large) ::slotted(a) {\n height: var(--height, var(--ic-space-xxl)) !important;\n padding: var(--ic-space-sm) var(--ic-space-md) !important;\n}\n\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n height: var(--height, var(--ic-space-xl)) !important;\n padding: 0.375rem !important;\n}\n\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n padding: var(--ic-space-xxs) !important;\n}\n\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n padding: var(--ic-space-xs) !important;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .button,\n ::slotted(a) {\n border: 0.125rem solid transparent !important;\n }\n}\n\n/** Pagination **/\n\n:host(.flip) ::slotted(svg) {\n transform: scaleX(-1);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n State,\n forceUpdate,\n h,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n getThemeFromContext,\n inheritAttributes,\n isSlotUsed,\n removeDisabledFalse,\n renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcSizes,\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Deprecated. This slot should not be used anymore. Use left-icon or right-icon slot instead.\n * @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n */\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n private buttonEl: HTMLElement;\n private buttonIdNum = buttonIds++;\n private hasTooltip: boolean = false;\n private id: string;\n private inheritedAttributes: { [k: string]: string } = {};\n private describedbyEl: HTMLElement = null;\n private describedById: string = null;\n private mutationObserver: MutationObserver = null;\n private hostMutationObserver: MutationObserver = null;\n private routerSlot: HTMLElement;\n\n @Element() el: HTMLIcButtonElement;\n\n @State() ariaLabel: string = null;\n @State() describedByContent: string = null;\n @State() title: string = null;\n\n /**\n * If `fileUpload` is set to `true`, this is the accepted list of file types.\n */\n @Prop() accept?: string = \"*\";\n\n /**\n * The appearance of the button, e.g. dark, light, or the default.\n */\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaControlsId: string | boolean;\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaOwnsId: string | boolean;\n\n /**\n * If `true`, the button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n */\n @Prop() disableTooltip?: boolean = false;\n\n /**\n * If `true`, the user can save the linked URL instead of navigating to it.\n */\n @Prop() download?: string | boolean = false;\n\n /**\n * If `true`, the button will show a dropdown icon.\n */\n @Prop() dropdown?: boolean = false;\n\n /**\n * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n */\n @Prop({ mutable: true, reflect: true }) dropdownExpanded?: boolean = false;\n\n /**\n * If `true`, when the button is clicked the native file explorer will be launched.\n */\n @Prop() fileUpload?: boolean = false;\n\n /**\n * The name of the control for the file input, which is submitted with the form data.\n */\n @Prop() fileInputName: string = `ic-button-file-upload-input-${buttonIds++}`;\n\n /**\n * The <form> element to associate the button with.\n */\n @Prop() form?: string;\n\n /**\n * The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner.\n */\n @Prop() formaction?: string;\n\n /**\n * The way the submitted form data is encoded.\n */\n @Prop() formenctype?: string;\n\n /**\n * The HTTP method used to submit the form.\n */\n @Prop() formmethod?: string;\n\n /**\n * If `true`, the form will not be validated when submitted.\n */\n @Prop() formnovalidate?: boolean;\n\n /**\n * The place to display the response from submitting the form. It overrides the target attribute of the button's form owner.\n */\n @Prop() formtarget?: string;\n\n /**\n * If `true`, the button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The URL that the link points to. This will render the button as an \"a\" tag.\n */\n @Prop() href?: string;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n\n /**\n * If `true`, the button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n\n /**\n * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n */\n @Prop() multiple?: boolean = false;\n\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n\n /**\n * The list of the files that have been selected by a user.\n */\n @Prop() selectedFiles: FileList;\n\n /**\n * The size of the button to be displayed.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n /**\n * The position of the tooltip in relation to the button.\n */\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n\n /**\n * If `true`, the secondary variant of button will have a transparent background rather than white.\n */\n @Prop() transparentBackground?: boolean = true;\n\n /**\n * The type of the button.\n */\n @Prop() type?: IcButtonTypes = \"button\";\n\n /**\n * The variant of the button to be displayed.\n */\n @Prop() variant?: IcButtonVariants = \"primary\";\n\n /**\n * Emitted when button has blur\n */\n @Event() icBlur!: EventEmitter<void>;\n\n /**\n * If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n */\n @Event() icFileSelection!: EventEmitter<FileList>;\n\n /**\n * Emitted when button has focus\n */\n @Event() icFocus!: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.mutationObserver !== null && this.mutationObserver !== undefined) {\n this.mutationObserver.disconnect();\n }\n if (\n this.hostMutationObserver !== null &&\n this.hostMutationObserver !== undefined\n ) {\n this.hostMutationObserver.disconnect();\n }\n }\n\n componentWillUpdate(): void {\n if (this.loading) {\n this.el.style.setProperty(\n \"--min-width\",\n `${this.el.getBoundingClientRect().width}px`\n );\n }\n this.setHasTooltip();\n }\n\n componentWillLoad(): void {\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n this.title = title;\n this.ariaLabel = ariaLabel;\n this.inheritedAttributes = restInheritedAttributes;\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n this.id = this.el.id || null;\n this.setHasTooltip();\n\n if (!this.hasTooltip) {\n const describedById = this.inheritedAttributes[\"aria-describedby\"];\n if (describedById !== undefined) {\n this.describedById = describedById;\n const el = this.el.parentElement.querySelector<HTMLElement>(\n `#${describedById}`\n );\n if (el) {\n this.describedByContent = el.innerText;\n this.describedbyEl = el;\n }\n }\n }\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n\n if (typeof MutationObserver !== \"undefined\") {\n if (this.describedById) {\n this.mutationObserver = new MutationObserver(this.mutationCallback);\n this.mutationObserver.observe(this.describedbyEl, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n }\n\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n });\n }\n }\n\n componentWillRender(): void {\n const iconEl = this.hasIconSlot(\"left\")\n ? this.el.querySelector(`[slot=\"left-icon\"]`)\n : this.hasIconSlot(\"right\")\n ? this.el.querySelector(`[slot=\"right-icon\"]`)\n : null;\n iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (!this.hasRouterSlot()) {\n if (this.fileUpload) {\n renderFileHiddenInput(\n this.icFileSelection,\n this.el,\n this.multiple,\n this.fileInputName,\n this.selectedFiles,\n this.disabled,\n this.accept\n );\n }\n if (this.disabled || this.loading) {\n event.stopImmediatePropagation();\n }\n if (this.dropdown) {\n this.dropdownExpanded = !this.dropdownExpanded;\n }\n }\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n this.updateTheme(detail.mode);\n }\n\n /**\n * Sets focus on the native `button`.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private async closeButtonTooltip(ev: KeyboardEvent): Promise<void> {\n const tooltip = this.el.shadowRoot.querySelector(\"ic-tooltip\");\n if (await tooltip.isTooltipVisible()) {\n tooltip.displayTooltip(false);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n }\n\n private hasIconSlot(position?: \"left\" | \"right\" | \"top\"): boolean {\n const selectorPrefix = position ? `${position}-` : \"\";\n return this.el.querySelector(`[slot=\"${selectorPrefix}icon\"]`) !== null;\n }\n\n private hasRouterSlot(): boolean {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n if (this.routerSlot) {\n this.routerSlot.ariaLabel = this.routerSlot.textContent;\n }\n return !!this.routerSlot;\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" || this.el.type === \"reset\") &&\n !this.hasRouterSlot() &&\n !!this.el.closest(\"FORM\")\n ) {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n this.el.closest(\"FORM\").appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n };\n\n private handleKeyDown = (ev: KeyboardEvent): void => {\n if (ev.key === \"Escape\" && this.hasTooltip) {\n this.closeButtonTooltip(ev);\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n // triggered when text content of sibling element in light DOM changes\n private mutationCallback = (): void => {\n this.describedByContent = this.describedbyEl.innerText;\n };\n\n // triggered when attributes of host element change\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n let forceComponentUpdate = false;\n mutationList.forEach(({ attributeName }) => {\n const attribute = this.el.getAttribute(attributeName);\n if (attributeName === \"title\") this.title = attribute;\n else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n if (IC_INHERITED_ARIA.includes(attributeName)) {\n this.inheritedAttributes[attributeName] = attribute;\n forceComponentUpdate = true;\n }\n });\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private setHasTooltip = (): void => {\n this.hasTooltip =\n !this.disableTooltip && (!!this.title || this.variant === \"icon\");\n };\n\n render() {\n const TagType = (this.href && \"a\") || \"button\";\n const { title, ariaLabel, inheritedAttributes } = this;\n const buttonAttrs =\n TagType === \"button\"\n ? {\n type: this.type,\n disabled: this.disabled,\n form: this.form,\n formaction: this.formaction,\n formenctype: this.formenctype,\n formmethod: this.formmethod,\n formnovalidate: this.formnovalidate,\n formtarget: this.formtarget,\n }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n\n let describedby: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedby =\n this.variant === \"icon\" && !!ariaLabel\n ? null\n : `ic-tooltip-${buttonId}`;\n } else {\n describedby = this.describedById;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading || this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n {...buttonAttrs}\n {...inheritedAttributes}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n aria-describedby={describedby}\n part=\"button\"\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.hasIconSlot(\"left\") && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"left-icon\" />\n </div>\n )}\n {this.hasIconSlot(\"top\") &&\n !this.hasIconSlot(\"left\") &&\n !this.hasIconSlot(\"right\") &&\n !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"top-icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" ||\n this.variant === \"destructive\" ||\n this.appearance === IcThemeForegroundEnum.Dark ||\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n {this.hasIconSlot(\"right\") && !this.loading && !this.dropdown && (\n <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n <slot name=\"right-icon\" />\n </div>\n )}\n {this.dropdown &&\n !this.loading &&\n this.variant !== \"icon\" &&\n this.variant !== \"destructive\" && (\n <span\n class={{\n [\"arrow-dropdown\"]: !this.dropdownExpanded,\n [\"dropdown-expanded\"]: this.dropdownExpanded,\n }}\n innerHTML={arrowDropdown}\n />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n [\"with-badge\"]: isSlotUsed(this.el, \"badge\"),\n [\"dropdown-no-icon\"]:\n this.dropdown &&\n !isSlotUsed(this.el, \"icon\") &&\n !isSlotUsed(this.el, \"left-icon\"),\n [\"top-icon\"]: isSlotUsed(this.el, \"top-icon\"),\n [\"white-background\"]:\n this.variant === \"secondary\" &&\n !this.transparentBackground &&\n this.appearance !== \"light\",\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n aria-owns={this.ariaOwnsId}\n aria-controls={this.ariaControlsId}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n >\n {this.hasTooltip && (\n <ic-tooltip\n id={describedby}\n label={title || ariaLabel}\n target={buttonId}\n placement={this.tooltipPlacement}\n silent={this.variant === \"icon\" && !!ariaLabel}\n >\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n )}\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n {!this.hasTooltip &&\n (this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n ))}\n {this.describedByContent && (\n <span id={describedby} class=\"ic-button-describedby\">\n {this.describedByContent}\n </span>\n )}\n </Host>\n );\n }\n}\n","@import \"../../global/normalize.css\";\n\n:host {\n /**\n * @prop --circular-diameter: Diameter of the circular-indicator\n */\n\n display: block;\n\n --linear-border-radius: 0.25rem;\n --inner-color: var(--ic-action-default);\n --outer-color: var(--ic-architectural-100);\n --label-color: var(--ic-color-primary-text);\n --margin: none;\n --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n --inner-color: var(--ic-architectural-white);\n --outer-color: var(--ic-architectural-800);\n --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host([size=\"small\"]) {\n --circular-diameter: 2.5rem;\n --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n --circular-diameter: 5rem;\n}\n\n:host([size=\"large\"]) {\n --circular-diameter: 7.5rem;\n}\n\n:host([size=\"icon\"]) {\n display: inline-block;\n\n --margin: var(--ic-space-xxxs);\n --circular-diameter: 1.25rem;\n}\n\n:host(.label) {\n --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n color: var(--label-color);\n margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n height: var(--circular-diameter);\n width: var(--circular-diameter);\n}\n\n.ic-loading-circular-outer.indeterminate {\n animation: circular-animation 1s linear;\n animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n background-color: var(--outer-color);\n height: var(--linear-line-height);\n width: 100%;\n border-radius: var(--linear-border-radius);\n overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n position: relative;\n height: 100%;\n background-color: var(--inner-color);\n border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n transition: width 0.5s;\n width: var(--linear-width);\n}\n\n:host(.full-width) {\n --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n 0% {\n width: 0%;\n left: -1%;\n }\n\n 25% {\n width: 0%;\n left: -1%;\n }\n\n 50% {\n width: 101%;\n left: -1%;\n }\n\n 75% {\n width: 0%;\n left: 101%;\n }\n\n 100% {\n width: 0%;\n left: 101%;\n }\n}\n\n.ic-loading-circular-svg {\n position: relative;\n width: 100%;\n height: 100%;\n transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: var(--compact-step-outer-color, var(--outer-color));\n stroke-width: var(--circular-line-width);\n stroke-linecap: round;\n}\n\n/* --stroke-dash-array calculated via dashArray method */\n.ic-loading-circular-svg circle:nth-child(2) {\n --circular-indeterminate: calc(\n (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n );\n\n stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n stroke: var(--compact-step-inner-color, var(--inner-color));\n}\n\n:host(.inner-label) .ic-loading-circular-inner {\n display: grid;\n}\n\n:host(.inner-label) .ic-loading-circular-svg,\n.inner-text {\n grid-column: 1;\n grid-row: 1;\n}\n\n:host(.not-required.compact-step-progress-indicator)\n .ic-loading-circular-svg\n circle:nth-child(2) {\n stroke: var(--ic-architectural-300);\n}\n\n.inner-text {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--ic-space-lg);\n height: inherit;\n overflow: hidden;\n margin: auto;\n color: var(--compact-step-inner-color, var(--ic-status-info));\n}\n\n:host(.not-required.compact-step-progress-indicator) .inner-text {\n color: var(--ic-color-tertiary-text);\n}\n\n:host(.light.not-required.compact-step-progress-indicator) .inner-text {\n color: var(--ic-architectural-400);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .indeterminate > .ic-loading-circular-inner {\n forced-color-adjust: none;\n }\n\n .ic-loading-linear-outer {\n border: var(--ic-hc-border);\n }\n\n .ic-loading-linear-inner {\n background-color: canvastext;\n }\n\n .ic-loading-circular-svg circle {\n stroke: Background;\n }\n\n .ic-loading-circular-svg circle:nth-child(2) {\n stroke: canvastext;\n }\n\n :host(.not-required.compact-step-progress-indicator)\n .ic-loading-circular-svg\n circle:nth-child(2) {\n stroke: GrayText;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n IcLoadingCircleXYR,\n IcLoadingSizes,\n IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n IcThemeForegroundEnum,\n IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\nimport { isPropDefined } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-loading-indicator\",\n styleUrl: \"ic-loading-indicator.css\",\n shadow: true,\n})\nexport class LoadingIndicator {\n private circularMeter: SVGCircleElement;\n private innerElement?: HTMLDivElement;\n private interval: ReturnType<typeof setInterval>;\n private labelList: string[];\n private outerElement?: HTMLDivElement;\n\n @Element() el: HTMLIcLoadingIndicatorElement;\n\n @State() circularDiameter: number;\n @State() circularLineWidth: number;\n @State() indeterminate: boolean;\n @State() indicatorLabel: string;\n @State() showSecond: boolean = false;\n\n /**\n * The appearance of the loading indicator, e.g. dark or light.\n */\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n /**\n * The description that will be set as the aria-label of the loading indicator when not using a visible label.\n */\n @Prop() description?: string = \"Loading\";\n\n /**\n * If `true`, when linear, the full-width variant (i.e. without a border radius) will be displayed.\n */\n @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n /**\n * @internal The step number of a compact step, managed by ic-step.\n */\n @Prop() innerLabel?: number;\n\n /**\n * The time in milliseconds before the label changes.\n */\n @Prop() labelDuration?: number = 8000;\n\n /**\n * The maximum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n */\n @Prop() max?: number = 100;\n\n /**\n * The minimum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n */\n @Prop() min?: number = 0;\n\n /**\n * The size of the loading indicator.\n */\n @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n /**\n * The type of indicator, either linear or circular.\n */\n @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n /**\n * The label to be displayed beneath the loading indicator.\n * Display a changing label by separating multiple messages with forward slashes.\n */\n @Prop() label?: string;\n\n @Watch(\"label\")\n watchPropHandler(): void {\n this.updateLabel();\n }\n\n /**\n * The current amount of progress made.\n * If not provided, component acts as an indeterminate loading indicator.\n */\n @Prop() progress?: number;\n\n @Watch(\"progress\")\n watchProgressHandler(): void {\n if (this.type === \"circular\") {\n this.updateCircularProgressMeter();\n }\n }\n\n disconnectedCallback(): void {\n clearInterval(this.interval);\n }\n\n componentWillLoad(): void {\n this.indeterminate = this.progress === undefined;\n this.updateLabel();\n this.el.setAttribute(\"exportparts\", \"ic-loading-container\");\n }\n\n componentDidLoad(): void {\n if (this.type === \"circular\") {\n this.setCircleLineWidth();\n this.circularMeter = this.el.shadowRoot.querySelector(\n \".ic-loading-circular-svg circle:nth-child(2)\"\n );\n this.updateCircularProgressMeter();\n }\n\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n componentWillUpdate(): void {\n this.indeterminate = this.progress === undefined;\n }\n\n componentDidUpdate(): void {\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n private updateCircularProgressMeter = () => {\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--progress-value\",\n String(this.progress)\n );\n }\n };\n\n private getLabel = (\n labelIndex: number,\n setLabel: (label: string) => void\n ) => {\n return new Promise(() => {\n this.interval = setInterval(() => {\n if (labelIndex < this.labelList.length - 1) {\n labelIndex++;\n } else {\n labelIndex = 0;\n }\n setLabel(this.labelList[labelIndex]);\n }, this.labelDuration);\n });\n };\n\n private getLabelVariant = () => {\n let variant: \"label\" | \"h4\" | \"h2\" = \"h4\";\n const width = this.outerElement?.offsetWidth;\n if (this.size === \"small\" || (this.type === \"circular\" && width < 60)) {\n variant = \"label\";\n } else if (\n this.size === \"large\" ||\n (this.type === \"circular\" && width >= 120)\n ) {\n variant = \"h2\";\n }\n return variant;\n };\n\n // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n private setCircleLineWidth = () => {\n const { offsetWidth: width } = this.outerElement;\n\n const compactStepCircularLineWidth = this.el.classList.contains(\n \"compact-step-progress-indicator\"\n )\n ? 40\n : 0;\n const toastDismissTimerCircularLineWidth = this.el.classList.contains(\n \"toast-dismiss-timer\"\n )\n ? 20\n : 0;\n\n if (\n width ||\n compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth\n ) {\n this.circularLineWidth =\n (compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth ||\n width) * 0.1;\n this.circularDiameter =\n compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth ||\n width;\n this.outerElement.style.setProperty(\n \"--circular-line-width\",\n `${this.circularLineWidth}px`\n );\n }\n };\n\n private setLinearDeterminateWidth = () => {\n if (!this.innerElement) return;\n // Ensure progress cannot be out of bounds\n\n const progress = Math.min(this.max, Math.max(this.min, this.progress));\n const proportion = (progress - this.min) / (this.max - this.min);\n this.showSecond = proportion > 0.5;\n if (this.showSecond) {\n this.innerElement.classList.remove(\"clip\");\n } else {\n this.innerElement.classList.add(\"clip\");\n }\n this.innerElement.style.setProperty(\n \"--linear-width\",\n `${proportion * 100}%`\n );\n };\n\n private calcOuterClass = (): string => {\n let cls = `ic-loading-${this.type}-outer`;\n cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n return cls;\n };\n\n private updateLabel = (): void => {\n if (isPropDefined(this.label)) {\n this.labelList = this.label.split(\"/\");\n const labelIndex = 0;\n this.indicatorLabel = this.labelList[labelIndex];\n if (this.labelList.length > 1) {\n this.getLabel(labelIndex, (label) => {\n this.indicatorLabel = label;\n });\n }\n }\n };\n\n private setCircleXY = (): IcLoadingCircleXYR => {\n if (this.circularDiameter > 0) {\n const r = this.circularDiameter / 2;\n const x = r;\n const y = r;\n const nextRadius = r - this.circularLineWidth / 2;\n this.setDashSteps(nextRadius);\n\n return { x, y, r: nextRadius };\n }\n return { x: 0, y: 0, r: 0 };\n };\n\n private setDashSteps = (radius: number) => {\n const dashArray = 2 * Math.PI * radius;\n const progress = Math.min(Math.max(this.progress, this.min), this.max);\n const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n this.circularMeter.style.setProperty(\n \"--stroke-dasharray\",\n `${dashArray}px`\n );\n\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--circular-steps-max\",\n String(this.max)\n );\n this.circularMeter.style.setProperty(\n \"--stroke-dashoffset\",\n `${proportion * dashArray}px`\n );\n }\n };\n\n render() {\n const { appearance, label, description, size, fullWidth, innerLabel } =\n this;\n const { x, y, r } = this.setCircleXY();\n\n return (\n <Host\n class={{\n [\"light\"]: appearance === IcThemeForegroundEnum.Light,\n [\"label\"]: !!label,\n [\"full-width\"]: fullWidth,\n [\"inner-label\"]: !!innerLabel,\n }}\n >\n <div class=\"ic-loading-container\" part=\"ic-loading-container\">\n <div\n ref={(el) => (this.outerElement = el as HTMLDivElement)}\n class={this.calcOuterClass()}\n role=\"progressbar\"\n aria-labelledby={\n this.label && this.size !== \"icon\" && \"ic-loading-label\"\n }\n aria-label={description}\n aria-valuenow={this.progress}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n >\n <div\n ref={(el) => (this.innerElement = el as HTMLDivElement)}\n class={`ic-loading-${this.type}-inner`}\n >\n {this.innerLabel &&\n this.innerLabel !== undefined &&\n this.size === \"small\" && (\n <ic-typography variant=\"subtitle-small\" class=\"inner-text\">\n {this.innerLabel}\n </ic-typography>\n )}\n {this.type === \"circular\" && (\n <svg\n class=\"ic-loading-circular-svg\"\n viewBox={`0 0 ${this.circularDiameter || 0} ${\n this.circularDiameter || 0\n }`}\n >\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n </svg>\n )}\n </div>\n </div>\n {label && size !== \"icon\" && (\n <ic-typography\n id=\"ic-loading-label\"\n class=\"ic-loading-label\"\n role=\"status\"\n variant={this.getLabelVariant()}\n >\n <p>{this.indicatorLabel}</p>\n </ic-typography>\n )}\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-tooltip: z-index of tooltip\n */\n\n:host(.ic-tooltip) {\n width: max-content;\n height: max-content;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container {\n background-color: var(--ic-architectural-800);\n color: #ffff;\n text-align: center;\n padding: var(--ic-space-xxxs) var(--ic-space-xs);\n border-radius: var(--ic-border-radius);\n border: var(--ic-border-width) solid var(--ic-architectural-40);\n position: absolute;\n max-width: 20rem;\n display: none;\n z-index: var(--ic-z-index-tooltip);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n .ic-tooltip-container,\n:host(.tooltip-disabled) .ic-tooltip-container {\n display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n .ic-tooltip-container[data-show] {\n display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n position: absolute;\n background: inherit;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n visibility: hidden;\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n visibility: visible;\n content: \"\";\n border: var(--ic-border-width) solid var(--ic-architectural-40);\n width: 100%;\n height: 100%;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n display: block;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow {\n height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n left: 0;\n top: var(--ic-space-xxxs);\n border-top: 0;\n transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow {\n top: calc(-1 * var(--ic-space-xxs));\n height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n left: 0;\n top: var(--ic-space-1px);\n border-bottom: 0;\n transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow {\n width: var(--ic-space-xxxs);\n right: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n border-left: 0;\n top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow {\n width: var(--ic-space-xxxs);\n left: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n border-right: 0;\n top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.on-dialog) .ic-tooltip-container {\n transform: translate(\n var(--tooltip-translate-x),\n var(--tooltip-translate-y)\n ) !important;\n}\n\n@media screen and (max-width: 576px) {\n :host(.ic-tooltip) .ic-tooltip-container {\n max-width: 18.875rem;\n }\n}\n\n@media (forced-colors: active) {\n :host(.ic-tooltip) .ic-tooltip-container,\n :host(.ic-tooltip) .ic-tooltip-arrow::before {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Element, Host, Prop, h, Method } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-tooltip\",\n styleUrl: \"ic-tooltip.css\",\n shadow: true,\n})\nexport class Tooltip {\n private arrow: HTMLDivElement;\n private delayedHideEvents = [\"mouseleave\"];\n private dialogOverflow = false;\n private icDialogEl: HTMLIcDialogElement;\n private instantHideEvents = [\"focusout\"];\n private mouseOverTool: boolean = false;\n private persistTooltip = false;\n private popperInstance: Instance;\n private onDialog: boolean = false;\n private showEvents = [\n !this.disableHover && \"mouseenter\",\n !this.disableHover && \"focusin\",\n !this.disableClick && \"click\",\n ];\n private toolTip: HTMLDivElement;\n\n @Element() el: HTMLIcTooltipElement;\n\n /**\n * @internal If `true`, the tooltip will not be displayed on click, it will require hover or using the display method.\n */\n @Prop() disableClick?: boolean = false;\n\n /**\n * If `true`, the tooltip will not be displayed on hover, it will require a click.\n */\n @Prop() disableHover?: boolean = false;\n\n /**\n * The number of lines to display before truncating the text.\n */\n @Prop() maxLines?: number;\n\n /**\n * The position of the tooltip in relation to the parent element.\n */\n @Prop({ mutable: true }) placement?: IcTooltipPlacements = \"bottom\";\n\n /**\n * @internal Sets the tooltip to aria-hidden, when used as part of components that are already announced.\n */\n @Prop() silent?: boolean = false;\n\n /**\n * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n */\n @Prop({ reflect: true }) target?: string;\n\n /**\n * The text to display on the tooltip.\n */\n @Prop() label!: string;\n\n disconnectedCallback(): void {\n this.manageEventListeners(\"remove\");\n if (this.popperInstance !== undefined) {\n this.popperInstance.destroy();\n }\n }\n\n componentDidLoad(): void {\n this.manageEventListeners(\"add\");\n\n this.icDialogEl = this.el.closest(\"ic-dialog\");\n this.dialogOverflow =\n this.icDialogEl?.getAttribute(\"data-overflow\") === \"true\";\n\n this.onDialog = this.icDialogEl !== null;\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tooltip\"\n );\n }\n\n componentDidRender(): void {\n const typographyEl = this.el.shadowRoot.querySelector(\n \".ic-tooltip-container > ic-typography\"\n );\n this.maxLines > 0 &&\n typographyEl.setAttribute(\n \"style\",\n `--truncation-max-lines: ${this.maxLines}`\n );\n }\n /**\n * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n * @param show Whether to show or hide the tooltip\n * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n */\n @Method()\n async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n this.persistTooltip = persistTooltip;\n show ? this.show() : this.hide();\n }\n\n /**\n * @internal Method to return if tooltip is currently visible.\n */\n @Method()\n async isTooltipVisible(): Promise<boolean> {\n return Promise.resolve(this.toolTip.hasAttribute(\"data-show\"));\n }\n\n private getTooltipTranslate = (dialogEl: DOMRect) => {\n const child = this.el.children[0].getBoundingClientRect();\n let tooltipX;\n let tooltipY;\n switch (this.placement) {\n case \"bottom\":\n tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n tooltipY = child.bottom - dialogEl.top;\n break;\n case \"bottom-start\":\n tooltipX = child.left - dialogEl.left;\n tooltipY = child.bottom - dialogEl.top;\n break;\n case \"bottom-end\":\n tooltipX = child.right - dialogEl.right;\n tooltipY = child.bottom - dialogEl.top;\n break;\n case \"top\":\n tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n tooltipY = child.top - dialogEl.bottom;\n break;\n case \"top-start\":\n tooltipX = child.left - dialogEl.left;\n tooltipY = child.top - dialogEl.bottom;\n break;\n case \"top-end\":\n tooltipX = child.right - dialogEl.right;\n tooltipY = child.top - dialogEl.bottom;\n break;\n case \"left\":\n case \"left-start\":\n tooltipX = child.right - dialogEl.right - child.width;\n tooltipY = child.bottom - dialogEl.top - child.height;\n break;\n case \"left-end\":\n tooltipX = child.right - dialogEl.right - child.width;\n tooltipY = child.top - dialogEl.bottom + child.height;\n break;\n case \"right\":\n case \"right-start\":\n tooltipX = child.left - dialogEl.left + child.width;\n tooltipY = child.bottom - dialogEl.top - child.height;\n break;\n case \"right-end\":\n tooltipX = child.left - dialogEl.left + child.width;\n tooltipY = child.top - dialogEl.bottom + child.height;\n break;\n }\n if (this.dialogOverflow && tooltipX < 0) {\n if (this.placement.includes(\"top\") || this.placement.includes(\"bottom\")) {\n this.toolTip.style.setProperty(\n \"--tooltip-arrow-translate\",\n `${tooltipX}px`\n );\n tooltipX = child.left - dialogEl.left;\n }\n if (this.placement.includes(\"left\")) {\n this.placement = \"right\";\n tooltipX = child.left - dialogEl.left + child.width;\n }\n }\n\n this.toolTip.style.setProperty(\"--tooltip-translate-x\", `${tooltipX}px`);\n this.toolTip.style.setProperty(\"--tooltip-translate-y\", `${tooltipY}px`);\n };\n\n private show = () => {\n if (this.label) {\n this.toolTip.setAttribute(\"data-show\", \"\");\n\n if (this.onDialog) {\n this.el.classList.add(\"on-dialog\");\n const dialogEl = this.icDialogEl.shadowRoot\n .querySelector(\"dialog\")\n .getBoundingClientRect();\n\n this.getTooltipTranslate(dialogEl);\n }\n\n this.popperInstance = createPopper(this.el, this.toolTip, {\n placement: this.placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 10],\n },\n },\n {\n name: \"arrow\",\n options: {\n element: this.arrow,\n },\n },\n {\n name: \"eventListeners\",\n options: { scroll: false, resize: false },\n },\n ],\n });\n } else {\n console.warn(`Tooltip can't display without prop 'label' set`);\n }\n };\n\n private hide = () => {\n this.toolTip.removeAttribute(\"data-show\");\n this.persistTooltip = false;\n if (this.popperInstance !== undefined) {\n this.popperInstance.destroy();\n }\n };\n\n private checkCloseTooltip = () => {\n setTimeout(() => {\n if (!this.mouseOverTool && !this.persistTooltip) {\n this.hide();\n }\n }, 100);\n };\n\n private mouseEnterTooltip = () => {\n this.mouseOverTool = true;\n };\n\n private mouseLeaveTooltip = () => {\n this.mouseOverTool = false;\n this.checkCloseTooltip();\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && !this.persistTooltip) {\n this.hide();\n }\n };\n\n private manageEventListeners = (action: \"add\" | \"remove\") => {\n const method =\n action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n this.showEvents.forEach((event) => {\n this.el[method](event, this.show);\n if (this.toolTip !== undefined) {\n this.toolTip[method](event, this.mouseEnterTooltip);\n }\n });\n\n if (!this.persistTooltip) {\n this.instantHideEvents.forEach((event) => {\n this.el[method](event, this.hide);\n });\n }\n\n this.delayedHideEvents.forEach((event) => {\n this.el[method](event, this.checkCloseTooltip);\n if (this.toolTip !== undefined) {\n this.toolTip[method](event, this.mouseLeaveTooltip);\n }\n });\n\n document[method](\"keydown\", this.handleKeyDown);\n };\n\n render() {\n const { label, maxLines, silent } = this;\n return (\n <Host class={{ \"ic-tooltip\": true }}>\n <div\n ref={(el) => (this.toolTip = el as HTMLDivElement)}\n role=\"tooltip\"\n class=\"ic-tooltip-container\"\n aria-hidden={`${silent}`}\n >\n <ic-typography maxLines={maxLines} variant=\"caption\">\n {label}\n </ic-typography>\n <div\n ref={(el) => (this.arrow = el as HTMLDivElement)}\n class=\"ic-tooltip-arrow\"\n ></div>\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,h as i,H as e,g as o}from"./p-6b5e91e2.js";import{f as a}from"./p-36cd5d32.js";import"./p-26b7b18f.js";const s='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;position:relative}:host(.ic-typography-vertical-margins-h1){margin:0 0 var(--ic-space-xl)}:host(.ic-typography-vertical-margins-h2){margin:var(--ic-space-xxl) 0 var(--ic-space-lg)}:host(.ic-typography-vertical-margins-h3){margin:var(--ic-space-xl) 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-h4){margin:var(--ic-space-lg) 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-subtitle-large),:host(.ic-typography-vertical-margins-subtitle-small),:host(.ic-typography-vertical-margins-body),:host(.ic-typography-vertical-margins-code-large),:host(.ic-typography-vertical-margins-code-small),:host(.ic-typography-vertical-margins-code-extra-small){margin:0 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-caption),:host(.ic-typography-vertical-margins-caption-uppercase){margin:0 0 var(--ic-space-xs)}:host(.ic-typography-vertical-margins-h2:first-child),:host(.ic-typography-vertical-margins-h3:first-child),:host(.ic-typography-vertical-margins-h4:first-child){margin-top:0}:host(.ic-typography-h1){font:var(--ic-font-h1) !important}:host(.ic-typography-h2){font:var(--ic-font-h2);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-h3){font:var(--ic-font-h3)}:host(.ic-typography-h4){font:var(--ic-font-h4);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-subtitle-large){font:var(--ic-font-subtitle-large);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-subtitle-small){font:var(--ic-font-subtitle-small);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-body){font:var(--ic-font-body);letter-spacing:var(--ic-font-letter-spacing-0pt005)}:host(.ic-typography-caption){font:var(--ic-font-caption);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-caption-uppercase){font:var(--ic-font-caption);letter-spacing:var(--ic-font-letter-spacing-0pt0025);text-transform:uppercase}:host(.ic-typography-label){font:var(--ic-font-label);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-label-uppercase){font:var(--ic-font-label);letter-spacing:var(--ic-font-letter-spacing-0pt025);text-transform:uppercase}:host(.ic-typography-code-large){font:var(--ic-font-code-large);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-code-small){font:var(--ic-font-code-small);letter-spacing:var(--ic-font-letter-spacing-0pt005)}:host(.ic-typography-code-extra-small){font:var(--ic-font-code-extra-small);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-badge){font:var(--ic-font-badge);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-badge-small){font:var(--ic-font-badge-small);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-no-wrap){white-space:nowrap}:host ::slotted(h1),:host ::slotted(h2),:host ::slotted(h3),:host ::slotted(h4),:host ::slotted(h5),:host ::slotted(h6),:host ::slotted(p),:host ::slotted(label){font:inherit;letter-spacing:inherit}.trunc-wrapper{display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--truncation-max-lines, initial);-webkit-line-clamp:var(--truncation-max-lines, initial);overflow:hidden}.trunc-btn{border:none;background:none;padding:0;color:var(--ic-color-primary-text);text-decoration:underline;font-weight:var(--ic-font-weight-bold);transition:var(--ic-easing-transition-fast)}.trunc-btn:hover,.trunc-btn.focus{outline:none;border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none;cursor:pointer}:host(.strikethrough){text-decoration:line-through}:host(.underline){text-decoration:underline}:host(.underline.strikethrough){text-decoration:line-through underline}:host(.italic){font-style:italic !important}:host(.bold){font-weight:var(--ic-font-weight-bold)}@supports (text-underline-offset: 25%){.trunc-btn:hover,.trunc-btn.focus{text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const n=class{constructor(i){t(this,i);this.focusBtnFromKeyboard=true;this.lastMarkerTop=0;this.lastWidth=0;this.resizeObserver=null;this.truncatedHeight=0;this.toggleExpanded=()=>{this.expanded=!this.expanded};this.checkMaxLines=t=>{const i=Math.floor(t/24);if(i>this.maxLines){this.el.setAttribute("style",`--truncation-max-lines: ${this.maxLines}`);this.truncatedHeight=this.el.clientHeight;this.truncated=true}};this.checkMarkerPosition=(t,i)=>{if(i-t<this.truncatedHeight){this.truncated=false;this.expanded=false}else{this.truncated=true}};this.getElementTop=t=>t.getClientRects?t.getClientRects()[0].top:0;this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{clearTimeout(this.resizeInterval);this.resizeInterval=window.setTimeout(this.resizeObserverCallback,50)}));this.resizeObserver.observe(this.truncWrapperEl)};this.resizeObserverCallback=()=>{if(this.lastWidth===this.el.clientWidth){return}if(this.truncatedHeight===0){this.checkMaxLines(this.el.clientHeight);return}const t=this.getElementTop(this.marker);if(t===this.lastMarkerTop){return}this.checkMarkerPosition(this.getElementTop(this.el),t);this.lastMarkerTop=t;this.lastWidth=this.el.clientWidth};this.truncButtonFocus=()=>{if(this.focusBtnFromKeyboard){this.truncButtonFocussed=true}};this.truncButtonBlur=()=>{this.focusBtnFromKeyboard=true;this.truncButtonFocussed=false};this.truncButtonFocusFromMouse=()=>{this.focusBtnFromKeyboard=false};this.truncated=false;this.truncButtonFocussed=false;this.applyVerticalMargins=false;this.bold=false;this.italic=false;this.maxLines=undefined;this.strikethrough=false;this.underline=false;this.variant="body";this.expanded=false}watchExpandedHandler(){this.el.setAttribute("style",`--truncation-max-lines: ${this.expanded?"initial":this.maxLines}`)}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentDidLoad(){var t,i;if((this.variant==="body"||((i=(t=this.el.getRootNode())===null||t===void 0?void 0:t.host)===null||i===void 0?void 0:i.tagName)==="IC-TOOLTIP")&&this.maxLines>0){const t=document.createElement("span");t.style.visibility="hidden";this.el.appendChild(t);this.marker=t;this.lastWidth=this.el.clientWidth;this.checkMaxLines(this.el.clientHeight);a(this.runResizeObserver)}}render(){var t,o;const{variant:a,applyVerticalMargins:s,maxLines:n,truncated:r,expanded:l,strikethrough:c,underline:h,italic:p,bold:d}=this;return i(e,{class:{[`ic-typography-${a}`]:true,[`ic-typography-vertical-margins-${a}`]:s,["bold"]:d,["italic"]:p,["strikethrough"]:c,["underline"]:h}},(a==="body"||((o=(t=this.el.getRootNode())===null||t===void 0?void 0:t.host)===null||o===void 0?void 0:o.tagName)==="IC-TOOLTIP")&&n>0?i("div",{class:"trunc-wrapper",ref:t=>this.truncWrapperEl=t},i("slot",null)):i("slot",null),a==="body"&&n>0&&r&&i("button",{class:{"trunc-btn":true,focus:this.truncButtonFocussed},onFocus:this.truncButtonFocus,onBlur:this.truncButtonBlur,onMouseDown:this.truncButtonFocusFromMouse,onClick:this.toggleExpanded},l?"See less":"See more"))}get el(){return o(this)}static get watchers(){return{expanded:["watchExpandedHandler"]}}};n.style=s;export{n as ic_typography};
|
2
|
-
//# sourceMappingURL=p-1e33ac04.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icTypographyCss","Typography","this","focusBtnFromKeyboard","lastMarkerTop","lastWidth","resizeObserver","truncatedHeight","toggleExpanded","expanded","checkMaxLines","height","numLines","Math","floor","maxLines","el","setAttribute","clientHeight","truncated","checkMarkerPosition","elTop","markerTop","getElementTop","getClientRects","top","runResizeObserver","ResizeObserver","clearTimeout","resizeInterval","window","setTimeout","resizeObserverCallback","observe","truncWrapperEl","clientWidth","marker","truncButtonFocus","truncButtonFocussed","truncButtonBlur","truncButtonFocusFromMouse","watchExpandedHandler","disconnectedCallback","disconnect","componentDidLoad","variant","_b","_a","getRootNode","host","tagName","document","createElement","style","visibility","appendChild","checkResizeObserver","render","applyVerticalMargins","strikethrough","underline","italic","bold","h","Host","class","ref","focus","onFocus","onBlur","onMouseDown","onClick"],"sources":["src/components/ic-typography/ic-typography.css?tag=ic-typography&encapsulation=shadow","src/components/ic-typography/ic-typography.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n position: relative;\n}\n\n:host(.ic-typography-vertical-margins-h1) {\n margin: 0 0 var(--ic-space-xl);\n}\n\n:host(.ic-typography-vertical-margins-h2) {\n margin: var(--ic-space-xxl) 0 var(--ic-space-lg);\n}\n\n:host(.ic-typography-vertical-margins-h3) {\n margin: var(--ic-space-xl) 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-h4) {\n margin: var(--ic-space-lg) 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-subtitle-large),\n:host(.ic-typography-vertical-margins-subtitle-small),\n:host(.ic-typography-vertical-margins-body),\n:host(.ic-typography-vertical-margins-code-large),\n:host(.ic-typography-vertical-margins-code-small),\n:host(.ic-typography-vertical-margins-code-extra-small) {\n margin: 0 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-caption),\n:host(.ic-typography-vertical-margins-caption-uppercase) {\n margin: 0 0 var(--ic-space-xs);\n}\n\n:host(.ic-typography-vertical-margins-h2:first-child),\n:host(.ic-typography-vertical-margins-h3:first-child),\n:host(.ic-typography-vertical-margins-h4:first-child) {\n margin-top: 0;\n}\n\n:host(.ic-typography-h1) {\n font: var(--ic-font-h1) !important;\n}\n\n:host(.ic-typography-h2) {\n font: var(--ic-font-h2);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-h3) {\n font: var(--ic-font-h3);\n}\n\n:host(.ic-typography-h4) {\n font: var(--ic-font-h4);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-subtitle-large) {\n font: var(--ic-font-subtitle-large);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-subtitle-small) {\n font: var(--ic-font-subtitle-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-body) {\n font: var(--ic-font-body);\n letter-spacing: var(--ic-font-letter-spacing-0pt005);\n}\n\n:host(.ic-typography-caption) {\n font: var(--ic-font-caption);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-caption-uppercase) {\n font: var(--ic-font-caption);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n text-transform: uppercase;\n}\n\n:host(.ic-typography-label) {\n font: var(--ic-font-label);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-label-uppercase) {\n font: var(--ic-font-label);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n text-transform: uppercase;\n}\n\n:host(.ic-typography-code-large) {\n font: var(--ic-font-code-large);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-code-small) {\n font: var(--ic-font-code-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt005);\n}\n\n:host(.ic-typography-code-extra-small) {\n font: var(--ic-font-code-extra-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-badge) {\n font: var(--ic-font-badge);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-badge-small) {\n font: var(--ic-font-badge-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-no-wrap) {\n white-space: nowrap;\n}\n\n:host ::slotted(h1),\n:host ::slotted(h2),\n:host ::slotted(h3),\n:host ::slotted(h4),\n:host ::slotted(h5),\n:host ::slotted(h6),\n:host ::slotted(p),\n:host ::slotted(label) {\n font: inherit;\n letter-spacing: inherit;\n}\n\n.trunc-wrapper {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n line-clamp: var(--truncation-max-lines, initial);\n -webkit-line-clamp: var(--truncation-max-lines, initial);\n overflow: hidden;\n}\n\n.trunc-btn {\n border: none;\n background: none;\n padding: 0;\n color: var(--ic-color-primary-text);\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n transition: var(--ic-easing-transition-fast);\n}\n\n.trunc-btn:hover,\n.trunc-btn.focus {\n outline: none;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n cursor: pointer;\n}\n\n:host(.strikethrough) {\n text-decoration: line-through;\n}\n\n:host(.underline) {\n text-decoration: underline;\n}\n\n:host(.underline.strikethrough) {\n text-decoration: line-through underline;\n}\n\n:host(.italic) {\n font-style: italic !important;\n}\n\n:host(.bold) {\n font-weight: var(--ic-font-weight-bold);\n}\n\n@supports (text-underline-offset: 25%) {\n .trunc-btn:hover,\n .trunc-btn.focus {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n :host,\n .trunc-btn {\n color: var(--ic-architectural-white);\n }\n} */\n","import { Component, Prop, h, Element, Host, State, Watch } from \"@stencil/core\";\n\nimport { IcTypographyVariants } from \"../../utils/types\";\nimport { checkResizeObserver } from \"../../utils/helpers\";\n\n@Component({\n styleUrl: \"ic-typography.css\",\n tag: \"ic-typography\",\n shadow: true,\n})\nexport class Typography {\n private focusBtnFromKeyboard: boolean = true;\n private lastMarkerTop: number = 0;\n private lastWidth: number = 0;\n private marker: HTMLElement;\n private resizeInterval: number;\n private resizeObserver: ResizeObserver = null;\n private truncatedHeight: number = 0;\n private truncWrapperEl: Element;\n\n @Element() el: HTMLIcTypographyElement;\n\n @State() truncated: boolean = false;\n @State() truncButtonFocussed: boolean = false;\n\n /**\n * If `true`, appropriate top and bottom margins will be applied to the typography.\n */\n @Prop() applyVerticalMargins?: boolean = false;\n\n /**\n * If `true`, the typography will have a bold font weight.\n * Note: This will have no impact on variants that already use an equivalent or higher font weight (h1, h2, and subtitle-large).\n */\n @Prop() bold?: boolean = false;\n\n /**\n * If `true`, the typography will have an italic font style.\n */\n @Prop() italic?: boolean = false;\n\n /**\n * The number of lines to display before truncating the text, only used for the 'body' variant.\n */\n @Prop() maxLines?: number;\n\n /**\n * If `true`, the typography will have a line through it.\n */\n @Prop() strikethrough?: boolean = false;\n\n /**\n * If `true`, the typography will have a line under it.\n */\n @Prop() underline?: boolean = false;\n\n /**\n * The ICDS typography style to use.\n */\n @Prop() variant?: IcTypographyVariants = \"body\";\n\n @State() expanded: boolean = false;\n\n @Watch(\"expanded\")\n watchExpandedHandler(): void {\n this.el.setAttribute(\n \"style\",\n `--truncation-max-lines: ${this.expanded ? \"initial\" : this.maxLines}`\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentDidLoad(): void {\n if (\n (this.variant === \"body\" ||\n (this.el.getRootNode() as ShadowRoot)?.host?.tagName ===\n \"IC-TOOLTIP\") &&\n this.maxLines > 0\n ) {\n const marker = document.createElement(\"span\");\n marker.style.visibility = \"hidden\";\n this.el.appendChild(marker);\n this.marker = marker;\n this.lastWidth = this.el.clientWidth;\n this.checkMaxLines(this.el.clientHeight);\n checkResizeObserver(this.runResizeObserver);\n }\n }\n\n private toggleExpanded = () => {\n this.expanded = !this.expanded;\n };\n\n private checkMaxLines = (height: number) => {\n //24 is the height of a single line\n const numLines = Math.floor(height / 24);\n if (numLines > this.maxLines) {\n this.el.setAttribute(\"style\", `--truncation-max-lines: ${this.maxLines}`);\n this.truncatedHeight = this.el.clientHeight;\n this.truncated = true;\n }\n };\n\n private checkMarkerPosition = (elTop: number, markerTop: number) => {\n if (markerTop - elTop < this.truncatedHeight) {\n this.truncated = false;\n this.expanded = false;\n } else {\n this.truncated = true;\n }\n };\n\n private getElementTop = (el: HTMLElement) => {\n return el.getClientRects ? el.getClientRects()[0].top : 0;\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeInterval);\n this.resizeInterval = window.setTimeout(this.resizeObserverCallback, 50);\n });\n this.resizeObserver.observe(this.truncWrapperEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.lastWidth === this.el.clientWidth) {\n return;\n }\n\n if (this.truncatedHeight === 0) {\n this.checkMaxLines(this.el.clientHeight);\n return;\n }\n\n const markerTop = this.getElementTop(this.marker);\n if (markerTop === this.lastMarkerTop) {\n return;\n }\n\n this.checkMarkerPosition(this.getElementTop(this.el), markerTop);\n this.lastMarkerTop = markerTop;\n this.lastWidth = this.el.clientWidth;\n };\n\n private truncButtonFocus = (): void => {\n if (this.focusBtnFromKeyboard) {\n this.truncButtonFocussed = true;\n }\n };\n\n private truncButtonBlur = (): void => {\n this.focusBtnFromKeyboard = true;\n this.truncButtonFocussed = false;\n };\n\n private truncButtonFocusFromMouse = (): void => {\n this.focusBtnFromKeyboard = false;\n };\n\n render() {\n const {\n variant,\n applyVerticalMargins,\n maxLines,\n truncated,\n expanded,\n strikethrough,\n underline,\n italic,\n bold,\n } = this;\n\n return (\n <Host\n class={{\n [`ic-typography-${variant}`]: true,\n [`ic-typography-vertical-margins-${variant}`]: applyVerticalMargins,\n [\"bold\"]: bold,\n [\"italic\"]: italic,\n [\"strikethrough\"]: strikethrough,\n [\"underline\"]: underline,\n }}\n >\n {(variant === \"body\" ||\n (this.el.getRootNode() as ShadowRoot)?.host?.tagName ===\n \"IC-TOOLTIP\") &&\n maxLines > 0 ? (\n <div class=\"trunc-wrapper\" ref={(el) => (this.truncWrapperEl = el)}>\n <slot />\n </div>\n ) : (\n <slot />\n )}\n {variant === \"body\" && maxLines > 0 && truncated && (\n <button\n class={{ \"trunc-btn\": true, focus: this.truncButtonFocussed }}\n onFocus={this.truncButtonFocus}\n onBlur={this.truncButtonBlur}\n onMouseDown={this.truncButtonFocusFromMouse}\n onClick={this.toggleExpanded}\n >\n {expanded ? \"See less\" : \"See more\"}\n </button>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["VARIANT_ICONS","neutral","icon","neutralIcon","ariaLabel","info","infoIcon","warning","warningIcon","error","errorIcon","success","successIcon","IC_INHERITED_ARIA","IC_DEVICE_SIZES","XS","S","M","L","XL","IC_BLOCK_COLOR_COMPONENTS","IC_FIXED_COLOR_COMPONENTS","IC_BLOCK_COLOR_EXCEPTIONS","BLACK_MIN_COLOR_BRIGHTNESS","WHITE_MAX_COLOR_BRIGHTNESS","DARK_MODE_THRESHOLD","icInput","linkIcInput","inheritAttributes","element","attributes","attributeObject","forEach","attr","hasAttribute","value","getAttribute","removeAttribute","debounceEvent","event","wait","original","_original","emit","debounce","bind","func","timer","args","clearTimeout","setTimeout","renderHiddenInput","always","container","name","disabled","undefined","hasShadowDom","inputs","querySelectorAll","inputEls","Array","from","filtered","filter","el","parentElement","input","ownerDocument","createElement","type","classList","add","appendChild","Date","toISOString","renderFileHiddenInput","multiple","accept","hidden","files","onchange","click","removeHiddenInput","remove","shadowRoot","attachShadow","getInputHelperTextID","id","getInputValidationTextID","getInputDescribedByText","inputId","helperText","validationText","trim","getThemeFromContext","themeFromEvent","getRootNode","host","blockColorParent","closest","join","parentTag","tagName","toLowerCase","currentTag","_a","includes","IcThemeForegroundEnum","Default","contains","Dark","Light","isMobileOrTablet","navigator","maxTouchPoints","test","userAgent","handleHiddenFormButtonClick","form","button","hiddenFormButton","document","setAttribute","style","display","isEmptyString","length","isPropDefined","prop","getLabelFromValue","options","valueField","labelField","ungroupedOptions","map","option","children","push","matchingValue","find","getFilteredMenuOptions","includeDescriptions","searchString","position","label","description","lowerSearchString","startsWith","deviceSizeMatches","size","window","matchMedia","matches","getCurrentDeviceSize","DEVICE_SIZES","UNDEFINED","getCssProperty","cssVar","getComputedStyle","documentElement","getPropertyValue","getThemeColorBrightness","themeRed","themeGreen","themeBlue","parseInt","getThemeForegroundColor","brightness","getSlot","querySelector","slotHasContent","getSlotContent","slot","getSlotElements","slotContent","firstElementChild","elements","assignedElements","childNodes","getNavItemParentDetails","navType","parent","Number","replace","hasValidationStatus","status","isSlotUsed","slotName","some","child","onComponentPropUndefinedChange","oldValue","newValue","callback","onComponentRequiredPropUndefined","props","component","propName","console","kebabToCamelCase","kebabCase","split","word","index","substring","toUpperCase","checkResizeObserver","callbackFn","ResizeObserver","hex2dec","v","hexToRgba","hex","hexChars","char","repeat","r","slice","g","b","a","rgbaStrToObj","rgbaStr","isRGBA","rgbValues","elementOverflowsX","scrollWidth","clientWidth","hasClassificationBanner","addFormResetListener","addEventListener","removeFormResetListener","removeEventListener","pxToRem","px","base","removeDisabledFalse","convertToRGBA","color","firstChar","capitalize","text","charAt","checkSlotInChildMutations","addedNodes","removedNodes","hasSlot","nodeList","node","isArray"],"sources":["src/utils/constants.ts","src/utils/helpers.ts"],"sourcesContent":["import errorIcon from \"../assets/error-icon.svg\";\nimport infoIcon from \"../assets/info-icon.svg\";\nimport neutralIcon from \"../assets/neutral-icon.svg\";\nimport successIcon from \"../assets/success-icon.svg\";\nimport warningIcon from \"../assets/warning-icon.svg\";\n\n// Global status icons\nexport const VARIANT_ICONS = {\n neutral: {\n icon: neutralIcon,\n ariaLabel: \"Neutral\",\n },\n info: {\n icon: infoIcon,\n ariaLabel: \"For your information\",\n },\n warning: {\n icon: warningIcon,\n ariaLabel: \"Warning\",\n },\n error: {\n icon: errorIcon,\n ariaLabel: \"Error\",\n },\n success: {\n icon: successIcon,\n ariaLabel: \"Success\",\n },\n};\n\n// Global ARIA attributes\nexport const IC_INHERITED_ARIA = [\n \"aria-atomic\",\n \"aria-autocomplete\",\n \"aria-busy\",\n \"aria-controls\",\n \"aria-current\",\n \"aria-describedby\",\n \"aria-description\",\n \"aria-details\",\n \"aria-disabled\",\n \"aria-dropeffect\",\n \"aria-errormessage\",\n \"aria-expanded\",\n \"aria-flowto\",\n \"aria-grabbed\",\n \"aria-haspopup\",\n \"aria-hidden\",\n \"aria-invalid\",\n \"aria-keyshortcuts\",\n \"aria-label\",\n \"aria-labelledby\",\n \"aria-live\",\n \"aria-owns\",\n \"aria-relevant\",\n \"aria-roledescription\",\n];\n\nexport const IC_DEVICE_SIZES = {\n XS: 576,\n S: 768,\n M: 992,\n L: 1200,\n XL: 99999,\n};\n\nexport const IC_BLOCK_COLOR_COMPONENTS = [\n \"ic-hero\",\n \"ic-top-navigation\",\n \"ic-footer\",\n \"ic-side-navigation\",\n \"ic-alert\",\n];\n\nexport const IC_FIXED_COLOR_COMPONENTS = [\"ic-alert\"];\n\nexport interface IcColorExceptions {\n [details: string]: string[];\n}\n\nexport const IC_BLOCK_COLOR_EXCEPTIONS: IcColorExceptions = {\n \"ic-alert\": [\"ic-link\"],\n};\n\n/* Range within which the chosen theme colour would not have a sufficient brightness difference with either of the black or white foreground colours\n * The brightness difference must be greater than 125 to provide good colour visibility\n * Calculated by:\n * - Using the brightness formula for both colours: https://www.w3.org/TR/AERT/#color-contrast\n * - Adding 125 to the brightness of the black foreground colour - RGB(11, 12, 12)\n * - Subtracting 125 from the brightness of the white foreground colour - RGB(255, 255, 255)\n */\nexport const BLACK_MIN_COLOR_BRIGHTNESS = 136.701;\nexport const WHITE_MAX_COLOR_BRIGHTNESS = 130;\n","import { EventEmitter } from \"@stencil/core\";\nimport {\n IcCallbackFunctionNoReturn,\n IcInformationStatusOrEmpty,\n IcNavParentDetails,\n IcPropObject,\n IcSearchMatchPositions,\n IcColorRGBA,\n IcDeviceSizes,\n IcColor,\n} from \"./types\";\n\nimport {\n IcMenuOption,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../utils/types\";\nimport {\n IC_BLOCK_COLOR_COMPONENTS,\n IC_BLOCK_COLOR_EXCEPTIONS,\n IC_FIXED_COLOR_COMPONENTS,\n} from \"./constants\";\n\nconst DARK_MODE_THRESHOLD = 133.3505;\nconst icInput = \"ic-input\";\nconst linkIcInput = \"input.ic-input\";\n\n/**\n * converts an enum of strings into an array of strings\n */\nexport const stringEnumToArray = (\n theEnum: Record<string, string | number>\n): string[] => {\n const arr: string[] = [];\n Object.values(theEnum).forEach((val) => {\n if (isNaN(Number(val))) {\n const str = val as string;\n arr.push(str);\n }\n });\n return arr;\n};\n\n/**\n * Used to inherit global attributes set on the host. Called in componentWillLoad and assigned\n * to a variable that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\nexport const inheritAttributes = (\n element: HTMLElement,\n attributes: string[] = []\n): { [key: string]: string } => {\n const attributeObject: { [key: string]: string } = {};\n\n attributes.forEach((attr) => {\n if (element.hasAttribute(attr)) {\n const value = element.getAttribute(attr);\n if (value !== null) {\n attributeObject[attr] = value;\n }\n element.removeAttribute(attr);\n }\n });\n\n return attributeObject;\n};\n\nexport const debounceEvent = (\n event: EventEmitter,\n wait: number\n): EventEmitter => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const original = (event as any)._original || event;\n return {\n _original: event,\n emit: debounce(original.emit.bind(original), wait),\n } as EventEmitter;\n};\n\nexport const debounce = (\n func: (...args: unknown[]) => void,\n wait = 0\n): unknown => {\n let timer: ReturnType<typeof setTimeout>;\n return (...args: unknown[]) => {\n clearTimeout(timer);\n timer = setTimeout(func, wait, ...args);\n };\n};\n\n/**\n * This method is used to add a hidden input to a host element that contains\n * a Shadow DOM. It does not add the input inside of the Shadow root which\n * allows it to be picked up inside of forms. It should contain the same\n * values as the host element.\n *\n * @param always Add a hidden input even if the container does not use Shadow\n * @param container The element where the input will be added\n * @param name The name of the input\n * @param value The value of the input\n * @param disabled If true, the input is disabled\n */\nexport const renderHiddenInput = (\n always: boolean,\n container: HTMLElement,\n name: string,\n value: string | Date | undefined | null,\n disabled: boolean\n): void => {\n if (name !== undefined && (always || hasShadowDom(container))) {\n const inputs = container.querySelectorAll(linkIcInput);\n const inputEls = Array.from(inputs);\n const filtered = inputEls.filter((el) => container === el.parentElement);\n\n let input = filtered[0] as HTMLInputElement;\n if (input === null || input === undefined) {\n input = container.ownerDocument.createElement(\"input\");\n input.type = \"hidden\";\n input.classList.add(icInput);\n container.appendChild(input);\n }\n input.disabled = disabled;\n input.name = name;\n\n if (value instanceof Date) {\n input.value = value ? value.toISOString() : null;\n } else {\n input.value = value || \"\";\n }\n }\n};\n\n/**\n * This method is used to add a hidden file input to a host element that contains\n * a Shadow DOM. It does not add the input inside of the Shadow root which\n * allows it to be picked up inside of forms. It should contain the same\n * values as the host element.\n *\n * @param event: The event that is emitted once a file is selected.\n * @param container The element where the input will be added\n * @param multiple If true, multiple files can be selected\n * @param name The name of the input\n * @param value The value of the input\n * @param disabled If true, the input is disabled\n * @param accept A string of the accepted files\n */\nexport const renderFileHiddenInput = (\n event: EventEmitter,\n container: HTMLElement,\n multiple: boolean,\n name: string,\n value: FileList | undefined | null,\n disabled: boolean,\n accept: string\n): void => {\n if (name !== undefined && hasShadowDom(container)) {\n const inputs = container.querySelectorAll(linkIcInput);\n const inputEls = Array.from(inputs);\n const filtered = inputEls.filter((el) => container === el.parentElement);\n\n let input = filtered[0] as HTMLInputElement;\n if (input === null || input === undefined) {\n input = container.ownerDocument.createElement(\"input\");\n input.classList.add(icInput);\n container.appendChild(input);\n }\n input.type = \"file\";\n input.hidden = true;\n input.multiple = multiple;\n input.name = name;\n input.files = value;\n input.disabled = disabled;\n input.accept = accept;\n input.onchange = () => {\n event.emit(input.files);\n };\n input.click();\n }\n};\n\nexport const removeHiddenInput = (container: HTMLElement): void => {\n const inputs = container.querySelectorAll(\"input.ic-input\");\n const inputEls = Array.from(inputs);\n const filtered = inputEls.filter((el) => container === el.parentElement);\n const input = filtered[0] as HTMLInputElement;\n input?.remove();\n};\n\nexport const hasShadowDom = (el: HTMLElement): boolean =>\n !!el.shadowRoot && !!el.attachShadow;\n\nexport const getInputHelperTextID = (id: string): string => id + \"-helper-text\";\n\nexport const getInputValidationTextID = (id: string): string =>\n id + \"-validation-text\";\n\nexport const getInputDescribedByText = (\n inputId: string,\n helperText: boolean,\n validationText: boolean\n): string =>\n `${helperText ? getInputHelperTextID(inputId) : \"\"} ${\n validationText ? getInputValidationTextID(inputId) : \"\"\n }`.trim();\n\n/**\n * This method helps to understand the context in which a component exists,\n * to assist with choosing appropriate foreground colours to use. For example,\n * this method will help you use the 'white' version of a button if it's within\n * a block colour element using white foreground text.\n *\n * This only works for components/elements passed via <slot> and not if they\n * are part of an IC component.\n *\n * \"\"\n * @returns IcThemeForeground depending on the context\n */\nexport const getThemeFromContext = (\n el: Element,\n themeFromEvent: IcThemeForeground = null\n): IcThemeForeground => {\n const parentElement =\n el.parentElement || (<ShadowRoot>el.getRootNode()).host.parentElement;\n const blockColorParent = parentElement.closest(\n IC_BLOCK_COLOR_COMPONENTS.join(\",\")\n );\n\n // If within a block color component\n if (blockColorParent !== null) {\n const parentTag = blockColorParent.tagName.toLowerCase();\n const currentTag = el.tagName.toLowerCase();\n\n if (IC_BLOCK_COLOR_EXCEPTIONS[parentTag]?.includes(currentTag)) {\n return IcThemeForegroundEnum.Default;\n } else if (\n themeFromEvent !== null &&\n !IC_FIXED_COLOR_COMPONENTS.includes(parentTag)\n ) {\n return themeFromEvent;\n } else if (\n blockColorParent.classList.contains(IcThemeForegroundEnum.Dark)\n ) {\n return IcThemeForegroundEnum.Dark;\n }\n\n return IcThemeForegroundEnum.Light;\n }\n\n return IcThemeForegroundEnum.Default;\n};\n\n/**\n * Checks if the current device is a mobile or tablet device.\n * @returns {boolean} Returns true if the device is a mobile or tablet device, otherwise returns false.\n */\nexport const isMobileOrTablet = (): boolean =>\n \"maxTouchPoints\" in navigator && \"userAgent\" in navigator\n ? navigator.maxTouchPoints > 0 &&\n /iPad|iPhone|iPod|Android|webOS|BlackBerry|IEMobile|Opera Mini/i.test(\n navigator.userAgent\n )\n : false;\n\n/**\n * Will create a button within the lightDOM which interacts with the parent form.\n * This is required as buttons within the shadowDOM will not invoke a submit or reset\n *\n * @param form - parent form element which contains shadowDom button\n * @param button - shadowDOM button\n */\nexport const handleHiddenFormButtonClick = (\n form: HTMLFormElement,\n button: HTMLIcButtonElement | HTMLButtonElement\n): void => {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", button.type);\n hiddenFormButton.style.display = \"none\";\n\n form.appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n};\n\nexport const isEmptyString = (value: string): boolean =>\n value ? value.trim().length === 0 : true;\n\n// A helper function that checks if a prop has been defined\nexport const isPropDefined = (prop: string): string | null =>\n prop !== undefined ? prop : null;\n\n/**\n * Extracts the label using the value from an object. Requires the object to have a label and value property.\n * @param value - value from object\n * @param options - list of menu items\n * @returns - label corresponding to value\n */\nexport const getLabelFromValue = (\n value: string,\n options: IcMenuOption[],\n valueField = \"value\",\n labelField = \"label\"\n): string | undefined => {\n const ungroupedOptions: IcMenuOption[] = [];\n if (options.length > 0 && options.map) {\n options.map((option) => {\n if (option.children) {\n option.children.map((option: IcMenuOption) =>\n ungroupedOptions.push(option)\n );\n } else {\n ungroupedOptions.push(option);\n }\n });\n const matchingValue = ungroupedOptions.find(\n (option) => option[valueField] === value\n );\n if (matchingValue !== undefined) return matchingValue[labelField];\n }\n\n return undefined;\n};\n\n/**\n * Filters the options based on the search string.\n * @param options - array of options\n * @param includeDescriptions - determines whether option descriptions are included when filtering options\n * @param searchString - string used to filter the options\n * @param position - whether the search string matches the start of or anywhere in the options\n * @returns filtered array of options\n */\nexport const getFilteredMenuOptions = (\n options: IcMenuOption[],\n includeDescriptions: boolean,\n searchString: string,\n position: IcSearchMatchPositions,\n labelField = \"label\"\n): IcMenuOption[] =>\n options.filter((option) => {\n const label: string = option[labelField].toLowerCase();\n const description = option.description?.toLowerCase();\n const lowerSearchString = searchString.toLowerCase();\n\n return position === \"anywhere\"\n ? includeDescriptions\n ? label.includes(lowerSearchString) ||\n description?.includes(lowerSearchString)\n : label.includes(lowerSearchString)\n : includeDescriptions\n ? label.startsWith(lowerSearchString) ||\n description?.startsWith(lowerSearchString)\n : label.startsWith(lowerSearchString);\n });\n\nexport const deviceSizeMatches = (size: number): boolean =>\n window.matchMedia(`(max-width: ${size}px)`).matches;\n\nexport const getCurrentDeviceSize = (): number => {\n if (deviceSizeMatches(DEVICE_SIZES.S)) {\n return DEVICE_SIZES.S;\n }\n if (deviceSizeMatches(DEVICE_SIZES.M)) {\n return DEVICE_SIZES.M;\n }\n if (deviceSizeMatches(DEVICE_SIZES.L)) {\n return DEVICE_SIZES.L;\n }\n if (deviceSizeMatches(DEVICE_SIZES.XL)) {\n return DEVICE_SIZES.XL;\n }\n //fallback needed as all of above get initialised to 0 in jest tests\n return DEVICE_SIZES.UNDEFINED;\n};\n\nexport const getCssProperty = (cssVar: string): string =>\n getComputedStyle(document.documentElement).getPropertyValue(cssVar);\n\n/**\n * Returns the brightness of the theme colour, calculated by using the theme RGB CSS values by:\n * - Multiplying each RGB value by a set number: https://www.w3.org/TR/AERT/#color-contrast\n * - Adding them together and dividing by 1000\n * This is a similar calculation to its CSS counterpart: \"--ic-theme-text\"\n * @returns number representing the brightness of the theme colour\n */\nexport const getThemeColorBrightness = (): number => {\n const themeRed = getCssProperty(\"--ic-theme-primary-r\");\n const themeGreen = getCssProperty(\"--ic-theme-primary-g\");\n const themeBlue = getCssProperty(\"--ic-theme-primary-b\");\n return (\n (parseInt(themeRed) * 299 +\n parseInt(themeGreen) * 587 +\n parseInt(themeBlue) * 114) /\n 1000\n );\n};\n\n/**\n * Returns if dark or light foreground colors should be used for color contrast reasons\n * @returns \"dark\" or \"light\"\n * @param brightness - Optional custom brightness value. Defaults to `getThemeColorBrightness`\n */\nexport const getThemeForegroundColor = (\n brightness = getThemeColorBrightness()\n): IcThemeForeground =>\n brightness > DARK_MODE_THRESHOLD\n ? IcThemeForegroundEnum.Dark\n : IcThemeForegroundEnum.Light;\n\nexport const getSlot = (element: HTMLElement, name: string): Element | null => {\n if (element && element.querySelector) {\n return element.querySelector(`[slot=\"${name}\"]`);\n }\n return null;\n};\n\nexport const slotHasContent = (element: HTMLElement, name: string): boolean =>\n getSlot(element, name) !== null;\n\nexport const getSlotContent = (\n element: HTMLElement,\n name: string\n): Element[] | NodeListOf<ChildNode> | null => {\n const slot = getSlot(element, name);\n if (slot) {\n return getSlotElements(slot);\n }\n\n return null;\n};\n\nexport const getSlotElements = (\n slot: Element\n): NodeListOf<ChildNode> | Element[] => {\n const slotContent = slot.firstElementChild as HTMLSlotElement;\n\n if (slotContent !== null) {\n const elements = slotContent.assignedElements\n ? slotContent.assignedElements()\n : slotContent.childNodes;\n return elements.length ? elements : slot.tagName ? [slot] : null;\n } else {\n //check for single element\n return slot === null ? null : [slot];\n }\n};\n\nexport const getNavItemParentDetails = ({\n parentElement,\n}: HTMLElement): IcNavParentDetails => {\n let navType: IcNavParentDetails = { navType: \"\", parent: null };\n switch (parentElement.tagName) {\n case \"IC-NAVIGATION-GROUP\":\n navType = getNavItemParentDetails(parentElement);\n break;\n case \"IC-TOP-NAVIGATION\":\n navType = { navType: \"top\", parent: parentElement };\n break;\n case \"IC-SIDE-NAVIGATION\":\n navType = { navType: \"side\", parent: parentElement };\n break;\n case \"IC-PAGE-HEADER\":\n navType = { navType: \"page-header\", parent: null };\n break;\n }\n return navType;\n};\n\nexport const DEVICE_SIZES = {\n XS: Number(\n getCssProperty(\"--ic-breakpoint-xs\").replace(\"px\", \"\")\n ) as IcDeviceSizes, // 0\n S: Number(\n getCssProperty(\"--ic-breakpoint-sm\").replace(\"px\", \"\")\n ) as IcDeviceSizes, // 576\n M: Number(\n getCssProperty(\"--ic-breakpoint-md\").replace(\"px\", \"\")\n ) as IcDeviceSizes, // 768\n L: Number(\n getCssProperty(\"--ic-breakpoint-lg\").replace(\"px\", \"\")\n ) as IcDeviceSizes, // 992\n XL: Number(\n getCssProperty(\"--ic-breakpoint-xl\").replace(\"px\", \"\")\n ) as IcDeviceSizes, // 1200\n UNDEFINED: 1200,\n};\n\nexport const hasValidationStatus = (\n status: IcInformationStatusOrEmpty,\n disabled: boolean\n): boolean => !!status && !disabled;\n\nexport const isSlotUsed = (\n { children }: HTMLElement,\n slotName: string\n): boolean =>\n Array.from(children).some((child) => child.getAttribute(\"slot\") === slotName);\n\n// added as a common method to allow detection of gatsby hydration issue, where (camelCase) props are initially undefined & then update\n// with a value. Allows a callback function to be executed when this is the case\nexport const onComponentPropUndefinedChange = (\n oldValue: string | undefined,\n newValue: string | undefined,\n callback: IcCallbackFunctionNoReturn\n): void => {\n if (oldValue === undefined && newValue !== oldValue) {\n callback();\n }\n};\n\nexport const onComponentRequiredPropUndefined = (\n props: IcPropObject[],\n component: string\n): void => {\n props.forEach(({ prop, propName }) => {\n if (prop === null || prop === undefined) {\n console.error(\n `No ${propName} specified for ${component} component - prop '${propName}' (web components) / '${kebabToCamelCase(\n propName\n )}' (react) required`\n );\n }\n });\n};\n\nexport const kebabToCamelCase = (kebabCase: string): string =>\n kebabCase\n .toLowerCase()\n .split(\"-\")\n .map((word, index) =>\n index === 0\n ? word\n : `${word.substring(0, 1).toUpperCase()}${word.substring(1)}`\n )\n .join(\"\");\n\nexport const checkResizeObserver = (\n callbackFn: IcCallbackFunctionNoReturn\n): void => {\n if (\n typeof window !== \"undefined\" &&\n typeof window.ResizeObserver !== \"undefined\"\n ) {\n callbackFn();\n }\n};\n\nconst hex2dec = (v: string) => parseInt(v, 16);\n\nexport const hexToRgba = (hex: string): IcColorRGBA => {\n const hexChars = hex\n .replace(\"#\", \"\")\n .split(\"\")\n .map((char) => char.repeat(2));\n return {\n r: hex2dec(hex.length === 4 ? hexChars[0] : hex.slice(1, 3)),\n g: hex2dec(hex.length === 4 ? hexChars[1] : hex.slice(3, 5)),\n b: hex2dec(hex.length === 4 ? hexChars[2] : hex.slice(5)),\n a: 1,\n };\n};\n\nexport const rgbaStrToObj = (rgbaStr: string): IcColorRGBA => {\n const isRGBA = rgbaStr.slice(3, 4).toLowerCase() === \"a\";\n const rgbValues = rgbaStr\n .substring(isRGBA ? 5 : 4, rgbaStr.length - 1)\n .replace(/ /g, \"\")\n .split(\",\")\n .map(Number);\n return {\n r: rgbValues[0],\n g: rgbValues[1],\n b: rgbValues[2],\n a: isRGBA ? rgbValues[3] : 1,\n };\n};\n\nexport const elementOverflowsX = ({\n scrollWidth,\n clientWidth,\n}: HTMLElement): boolean => scrollWidth > clientWidth;\n\nexport const hasClassificationBanner = (): boolean =>\n !!document.querySelector(\"ic-classification-banner:not([inline='true'])\");\n\nexport const addFormResetListener = (\n el: HTMLElement,\n callbackFn: IcCallbackFunctionNoReturn\n): void => {\n el.closest(\"FORM\")?.addEventListener(\"reset\", callbackFn);\n};\n\nexport const removeFormResetListener = (\n el: HTMLElement,\n callbackFn: IcCallbackFunctionNoReturn\n): void => {\n el.closest(\"FORM\")?.removeEventListener(\"reset\", callbackFn);\n};\n\nexport const pxToRem = (px: string, base = 16): string =>\n `${(1 / base) * parseInt(px)}rem`;\n\nexport const removeDisabledFalse = (\n disabled: boolean,\n element: HTMLElement\n): void => {\n if (!disabled) {\n element.removeAttribute(\"disabled\");\n }\n};\n\nexport const isMacDevice = (): boolean =>\n window.navigator.userAgent.toUpperCase().indexOf(\"MAC\") >= 0;\n\nexport const isNumeric = (value: string): boolean => /^-?\\d+$/.test(value);\n\nexport async function waitForHydration(): Promise<boolean> {\n const elements = document.getElementsByTagName(\"*\");\n\n for (let i = 0; i < elements.length; i++) {\n if (elements[i].tagName.startsWith(\"IC-\")) {\n if (elements[i].classList.contains(\"hydrated\")) {\n return true;\n }\n } else {\n return false;\n }\n }\n\n return false;\n}\n\nexport const convertToRGBA = (color: IcColor): IcColorRGBA | null => {\n const firstChar = color?.slice(0, 1).toLowerCase();\n return firstChar === \"#\"\n ? hexToRgba(color)\n : firstChar === \"r\"\n ? rgbaStrToObj(color)\n : null;\n};\n\nexport const capitalize = (text: string): string =>\n text.charAt(0).toUpperCase() + text.slice(1);\n\nexport const checkSlotInChildMutations = (\n addedNodes: NodeList,\n removedNodes: NodeList,\n slotName: string | string[]\n): boolean => {\n const hasSlot = (nodeList: NodeList) =>\n Array.from(nodeList).some((node) =>\n Array.isArray(slotName)\n ? slotName.some((name) => (node as Element).slot === name)\n : (node as Element).slot === slotName\n );\n return hasSlot(addedNodes) || hasSlot(removedNodes);\n};\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,c as i,h as e,H as s,g as o}from"./p-6b5e91e2.js";import{i as a,k as n,f as r,a as l,p as h,t as d}from"./p-36cd5d32.js";import"./p-26b7b18f.js";const c='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}:host .radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host(.small) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host .radio-buttons-container.horizontal{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.small) .radio-buttons-container.horizontal{gap:var(--ic-space-xl)}';const p=class{constructor(e){t(this,e);this.icChange=i(this,"icChange",7);this.resizeObserver=null;this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.checkOrientation()}));this.resizeObserver.observe(this.el)};this.handleKeyDown=t=>{switch(t.key){case"ArrowDown":case"ArrowRight":this.radioOptions[this.getNextItemToSelect(this.selectedChild,true)].click();t.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.radioOptions[this.getNextItemToSelect(this.selectedChild,false)].click();t.preventDefault()}};this.getNextItemToSelect=(t,i)=>{const e=this.radioOptions.length-1;if(t<1){t=0}let s=i?t+1:t-1;if(s<0){s=e}else if(s>e){s=0}if(this.radioOptions[s].disabled){s=this.getNextItemToSelect(s,i)}return s};this.addSlotChangeListener=()=>{this.radioContainer.addEventListener("slotchange",this.setRadioOptions)};this.setFirstRadioOptionTabIndex=t=>{this.radioOptions[0].setTabIndex(t)};this.setRadioOptions=()=>{this.selectedChild=-1;this.checkedValue="";this.radioOptions=Array.from(this.el.querySelectorAll("ic-radio-option"));if(this.radioOptions.length>0){this.radioOptions.forEach(((t,i)=>{if(!t.selected){t.selected=this.checkedValue===t.value}t.name=this.name;t.groupLabel=this.label;if(t.selected){this.selectedChild=i;this.checkedValue=t.value}}));this.setFirstRadioOptionTabIndex(this.selectedChild>0?-1:0)}if(this.initialOrientation==="horizontal"&&this.radioOptions!==undefined&&(this.radioOptions.length>2||this.radioOptions.length===2&&(a(this.radioOptions[0],"additional-field")||a(this.radioOptions[1],"additional-field")))){this.currentOrientation="vertical"}};this.checkedValue="";this.currentOrientation=undefined;this.initialOrientation=undefined;this.selectedChild=-1;this.disabled=false;this.helperText=undefined;this.hideLabel=false;this.label=undefined;this.name=undefined;this.orientation="vertical";this.required=false;this.size="default";this.small=false;this.validationStatus="";this.validationText=""}orientationChangeHandler(){this.initialOrientation=this.orientation}disconnectedCallback(){var t,i;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect();(i=this.radioContainer)===null||i===void 0?void 0:i.removeEventListener("slotchange",this.setRadioOptions)}componentWillLoad(){n(this.disabled,this.el);this.orientationChangeHandler();this.currentOrientation=this.initialOrientation}componentDidLoad(){this.setRadioOptions();r(this.runResizeObserver);this.addSlotChangeListener();l([{prop:this.label,propName:"label"},{prop:this.name,propName:"name"}],"Radio Group")}selectHandler({detail:t,target:i}){var e;this.checkedValue=t.value;const s=i;this.icChange.emit({value:this.checkedValue,selectedOption:{radio:s,textFieldValue:(e=s===null||s===void 0?void 0:s.querySelector("ic-text-field"))===null||e===void 0?void 0:e.value}});if(this.radioOptions!==undefined){this.radioOptions.forEach(((t,i)=>{t.selected=this.checkedValue===t.value;if(t.selected){this.selectedChild=i}}));this.setFirstRadioOptionTabIndex(this.selectedChild>0?-1:0)}}changeHandler(){const t=this.radioOptions.findIndex((t=>t.selected));if(t<0){this.setFirstRadioOptionTabIndex(0);this.selectedChild=t}}checkOrientation(){if(this.initialOrientation==="horizontal"){let t=0;this.radioOptions.forEach((({clientWidth:i},e,s)=>{t+=i;if(e<s.length-1)t+=40}));if(this.currentOrientation==="horizontal"&&t>this.radioContainer.clientWidth){this.currentOrientation="vertical"}else if(this.currentOrientation==="vertical"&&t<this.radioContainer.clientWidth){this.currentOrientation="horizontal"}}}render(){h(true,this.el,this.name,this.checkedValue,this.disabled);return e(s,{onKeyDown:this.handleKeyDown,class:{small:this.small||this.size==="small"}},e("div",{role:"radiogroup","aria-label":`${this.label}${this.required?", required":""}`},!this.hideLabel&&e("ic-input-label",{class:{[`${this.validationStatus}`]:true},label:this.label,helperText:this.helperText,required:this.required,disabled:this.disabled}),e("div",{class:{"radio-buttons-container":true,horizontal:this.currentOrientation==="horizontal"},ref:t=>this.radioContainer=t},e("slot",null))),d(this.validationStatus,this.disabled)&&e("ic-input-validation",{ariaLiveMode:"polite",status:this.validationStatus,message:this.validationText}))}get el(){return o(this)}static get watchers(){return{orientation:["orientationChangeHandler"]}}};p.style=c;export{p as ic_radio_group};
|
2
|
-
//# sourceMappingURL=p-e928928a.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icRadioGroupCss","RadioGroup","this","resizeObserver","runResizeObserver","ResizeObserver","checkOrientation","observe","el","handleKeyDown","event","key","radioOptions","getNextItemToSelect","selectedChild","click","preventDefault","currentItem","movingDown","numRadios","length","nextItem","disabled","addSlotChangeListener","radioContainer","addEventListener","setRadioOptions","setFirstRadioOptionTabIndex","value","setTabIndex","checkedValue","Array","from","querySelectorAll","forEach","radioOption","index","selected","name","groupLabel","label","initialOrientation","undefined","isSlotUsed","currentOrientation","orientationChangeHandler","orientation","disconnectedCallback","_a","disconnect","_b","removeEventListener","componentWillLoad","removeDisabledFalse","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","propName","selectHandler","detail","target","selectedOption","icChange","emit","radio","textFieldValue","querySelector","changeHandler","findIndex","totalWidth","clientWidth","i","arr","render","renderHiddenInput","h","Host","onKeyDown","class","small","size","role","required","hideLabel","validationStatus","helperText","horizontal","ref","hasValidationStatus","ariaLiveMode","status","message","validationText"],"sources":["src/components/ic-radio-group/ic-radio-group.css?tag=ic-radio-group&encapsulation=shadow","src/components/ic-radio-group/ic-radio-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n}\n\nic-input-label.error {\n color: var(--ic-status-error);\n}\n\nic-input-validation {\n margin-top: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-validation {\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-label ic-typography {\n margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n:host .radio-buttons-container {\n display: flex;\n flex-direction: column;\n gap: var(--ic-space-xxs);\n}\n\n:host(.small) .radio-buttons-container {\n gap: var(--ic-space-xxxs);\n}\n\n:host .radio-buttons-container.horizontal {\n display: flex;\n flex-direction: row;\n gap: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.small) .radio-buttons-container.horizontal {\n gap: var(--ic-space-xl);\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Listen,\n Element,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\nimport {\n hasValidationStatus,\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n renderHiddenInput,\n checkResizeObserver,\n} from \"../../utils/helpers\";\nimport {\n IcInformationStatusOrEmpty,\n IcOrientation,\n IcSizesNoLarge,\n IcValueEventDetail,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-radio-group.types\";\n\n@Component({\n tag: \"ic-radio-group\",\n styleUrl: \"ic-radio-group.css\",\n shadow: true,\n})\nexport class RadioGroup {\n private radioContainer: HTMLDivElement;\n private radioOptions: HTMLIcRadioOptionElement[];\n private resizeObserver: ResizeObserver = null;\n\n @Element() el: HTMLIcRadioGroupElement;\n\n @State() checkedValue: string = \"\";\n @State() currentOrientation: IcOrientation;\n @State() initialOrientation: IcOrientation;\n @State() selectedChild: number = -1;\n\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * The helper text that will be displayed for additional field guidance.\n */\n @Prop() helperText: string;\n\n /**\n * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n */\n @Prop() hideLabel: boolean = false;\n\n /**\n * The label for the radio group to be displayed.\n */\n @Prop() label!: string;\n\n /**\n * The name for the radio group to differentiate from other groups.\n */\n @Prop() name!: string;\n\n /**\n * The orientation of the radio buttons in the radio group. If there are more than two radio buttons in a radio group or either of the radio buttons use the `additional-field` slot, then the orientation will always be vertical.\n */\n @Prop() orientation: IcOrientation = \"vertical\";\n\n /**\n * If `true`, the radio group will require a value.\n */\n @Prop() required: boolean = false;\n\n /**\n * The size of the radio group component.\n */\n @Prop() size?: IcSizesNoLarge = \"default\";\n\n /**\n * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n */\n @Prop() small?: boolean = false;\n\n /**\n * The validation status - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /**\n * The validation text - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationText: string = \"\";\n\n @Watch(\"orientation\")\n orientationChangeHandler(): void {\n this.initialOrientation = this.orientation;\n }\n\n /**\n * Emitted when a user selects a radio.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n this.radioContainer?.removeEventListener(\n \"slotchange\",\n this.setRadioOptions\n );\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n this.orientationChangeHandler();\n this.currentOrientation = this.initialOrientation;\n }\n\n componentDidLoad(): void {\n this.setRadioOptions();\n checkResizeObserver(this.runResizeObserver);\n this.addSlotChangeListener();\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Radio Group\"\n );\n }\n\n @Listen(\"icCheck\")\n selectHandler({ detail, target }: CustomEvent<IcValueEventDetail>): void {\n this.checkedValue = detail.value;\n const selectedOption = target as HTMLIcRadioOptionElement;\n this.icChange.emit({\n value: this.checkedValue,\n selectedOption: {\n radio: selectedOption,\n textFieldValue: selectedOption?.querySelector(\"ic-text-field\")?.value,\n },\n });\n\n if (this.radioOptions !== undefined) {\n this.radioOptions.forEach((radioOption, index) => {\n radioOption.selected = this.checkedValue === radioOption.value;\n if (radioOption.selected) {\n this.selectedChild = index;\n }\n });\n this.setFirstRadioOptionTabIndex(this.selectedChild > 0 ? -1 : 0);\n }\n }\n\n @Listen(\"icSelectedChange\")\n changeHandler(): void {\n const selectedOption = this.radioOptions.findIndex(\n (radioOption) => radioOption.selected\n );\n if (selectedOption < 0) {\n this.setFirstRadioOptionTabIndex(0);\n this.selectedChild = selectedOption;\n }\n }\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n this.checkOrientation();\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n private checkOrientation() {\n if (this.initialOrientation === \"horizontal\") {\n let totalWidth = 0;\n this.radioOptions.forEach(({ clientWidth }, i, arr) => {\n totalWidth += clientWidth;\n if (i < arr.length - 1) totalWidth += 40;\n });\n\n if (\n this.currentOrientation === \"horizontal\" &&\n totalWidth > this.radioContainer.clientWidth\n ) {\n this.currentOrientation = \"vertical\";\n } else if (\n this.currentOrientation === \"vertical\" &&\n totalWidth < this.radioContainer.clientWidth\n ) {\n this.currentOrientation = \"horizontal\";\n }\n }\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, true)\n ].click();\n event.preventDefault();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n this.radioOptions[\n this.getNextItemToSelect(this.selectedChild, false)\n ].click();\n event.preventDefault();\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numRadios = this.radioOptions.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n //check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numRadios;\n } else if (nextItem > numRadios) {\n nextItem = 0;\n }\n\n //if next item is disabled then find next\n if (this.radioOptions[nextItem].disabled) {\n nextItem = this.getNextItemToSelect(nextItem, movingDown);\n }\n\n return nextItem;\n };\n\n private addSlotChangeListener = () => {\n this.radioContainer.addEventListener(\"slotchange\", this.setRadioOptions);\n };\n\n private setFirstRadioOptionTabIndex = (value: number) => {\n this.radioOptions[0].setTabIndex(value);\n };\n\n private setRadioOptions = () => {\n this.selectedChild = -1;\n this.checkedValue = \"\";\n this.radioOptions = Array.from(this.el.querySelectorAll(\"ic-radio-option\"));\n if (this.radioOptions.length > 0) {\n this.radioOptions.forEach((radioOption, index) => {\n if (!radioOption.selected) {\n radioOption.selected = this.checkedValue === radioOption.value;\n }\n radioOption.name = this.name;\n radioOption.groupLabel = this.label;\n if (radioOption.selected) {\n this.selectedChild = index;\n this.checkedValue = radioOption.value;\n }\n });\n this.setFirstRadioOptionTabIndex(this.selectedChild > 0 ? -1 : 0);\n }\n\n if (\n this.initialOrientation === \"horizontal\" &&\n this.radioOptions !== undefined &&\n (this.radioOptions.length > 2 ||\n (this.radioOptions.length === 2 &&\n (isSlotUsed(this.radioOptions[0], \"additional-field\") ||\n isSlotUsed(this.radioOptions[1], \"additional-field\"))))\n ) {\n this.currentOrientation = \"vertical\";\n }\n };\n\n render() {\n renderHiddenInput(\n true,\n this.el,\n this.name,\n this.checkedValue,\n this.disabled\n );\n\n return (\n <Host\n onKeyDown={this.handleKeyDown}\n class={{ small: this.small || this.size === \"small\" }}\n >\n <div\n role=\"radiogroup\"\n aria-label={`${this.label}${this.required ? \", required\" : \"\"}`}\n >\n {!this.hideLabel && (\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n ></ic-input-label>\n )}\n <div\n class={{\n \"radio-buttons-container\": true,\n horizontal: this.currentOrientation === \"horizontal\",\n }}\n ref={(el) => (this.radioContainer = el)}\n >\n <slot></slot>\n </div>\n </div>\n {hasValidationStatus(this.validationStatus, this.disabled) && (\n <ic-input-validation\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as i,c as e,h as t,g as a}from"./p-6b5e91e2.js";import{c as o,k as s,a as r,i as c}from"./p-36cd5d32.js";import"./p-26b7b18f.js";const n=`<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59L13.59 5L15 6.41L11.41 10L15 13.59Z" fill="currentColor"/>\n</svg>\n`;const l='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block}.chip{display:flex;padding:var(--ic-space-xxs);font-size:0.875rem;border-radius:var(--ic-space-md);text-align:left;text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative}.chip.small{padding:var(--ic-space-xxxs);border-radius:calc(var(--ic-space-md) - var(--ic-space-xxxs))}.chip.large{padding:var(--ic-space-xs);border-radius:calc(var(--ic-space-md) + var(--ic-space-xxs))}.label{padding:0 var(--ic-space-xs)}.chip.hovered:not(:focus-within){background-color:var(--ic-architectural-300)}.chip:focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);z-index:1}.chip.outline.hovered:not(:focus-within),.chip.outlined.hovered:not(:focus-within){background-color:var(--ic-action-dark-bg-hover)}ic-tooltip:focus-within{z-index:1}.filled{background-color:var(--chip-custom-color, var(--ic-architectural-200));color:var(--chip-custom-foreground-color, black);border:none}.filled.disabled{background-color:var(--ic-architectural-100)}.outline,.outlined{color:var(--ic-architectural-900);border:var(--ic-border-width) solid\n var(--chip-custom-color, var(--ic-architectural-900));padding:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.outline.small,.outlined.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.outline.large,.outlined.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.outline.disabled,.outlined.disabled{border:var(--ic-border-disabled);background:none}.chip.disabled ic-typography{color:var(--ic-architectural-500)}.filled.disabled ic-typography{color:var(--ic-architectural-600)}.dismiss-icon{border:none;border-radius:50%;padding:0;background:none;cursor:pointer;margin:var(--ic-space-xxxs);height:calc(var(--ic-space-lg) - var(--ic-space-xxs));width:calc(var(--ic-space-lg) - var(--ic-space-xxs))}.dismiss-icon:focus{outline:var(--ic-hc-focus-outline)}.dismiss-icon[disabled]{pointer-events:none;color:var(--ic-architectural-200)}.icon{padding:var(--ic-space-xxxs);box-sizing:border-box}.icon,ic-tooltip{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chip.disabled path,.chip.disabled ::slotted(svg){fill:var(--ic-architectural-200)}.chip.white-background{background-color:var(--ic-architectural-white)}.chip.white-background.hovered:not(:focus-within){background-color:var(--ic-action-dark-bg-hover-no-alpha) !important}@media (forced-colors: active){.chip{border:var(--ic-hc-border)}.filled.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.filled{padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}.filled.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.chip.disabled{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.chip.disabled ic-typography{color:GrayText}.chip.disabled path,.chip.disabled ::slotted(svg){fill:GrayText}.chip:focus-within{outline:none;border-color:Highlight}}';const d=class{constructor(t){i(this,t);this.dismiss=e(this,"dismiss",7);this.icDismiss=e(this,"icDismiss",7);this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.mouseEnterHandler=()=>{this.hovered=true};this.mouseLeaveHandler=()=>{this.hovered=false};this.setChipColour=()=>{const i=o(this.customColor);if(i){const{r:e,g:t,b:a,a:o}=i;const s=(e*299+t*587+a*114)/1e3>133.3505?"black":"white";this.el.setAttribute("style",`--chip-custom-color: rgba(${e}, ${t}, ${a}, ${o}); --chip-custom-foreground-color: var(--ic-architectural-${s})`)}};this.hovered=false;this.visible=true;this.appearance=undefined;this.customColor=null;this.disabled=false;this.dismissible=false;this.label=undefined;this.size="default";this.transparentBackground=true;this.variant="filled"}customColorHandler(){if(!this.dismissible){this.setChipColour()}}componentWillLoad(){s(this.disabled,this.el);if(!this.dismissible){this.setChipColour()}if(this.appearance==="outline"){this.variant="outlined"}}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Chip")}handleClick(){this.visible=!this.visible}async setFocus(){var i;(i=this.el.shadowRoot.querySelector("button"))===null||i===void 0?void 0:i.focus()}render(){const{label:i,appearance:e,variant:a,size:o,dismissible:s,visible:r,disabled:l,hovered:d}=this;return r&&t("div",{class:{chip:true,[`${e}`]:e!==undefined,[`${a}`]:true,[`${o}`]:true,disabled:l,dismissible:s,hovered:d,"white-background":this.variant==="outlined"&&!this.transparentBackground}},c(this.el,"icon")&&t("div",{class:"icon"},t("slot",{name:"icon"})),t("ic-typography",{variant:"label","apply-vertical-margins":false,class:"label"},t("span",null,i)),s&&t("ic-tooltip",{label:"Dismiss",target:"dismiss-icon",class:{"tooltip-disabled":l}},t("button",{id:"dismiss-icon",class:"dismiss-icon","aria-label":`Dismiss ${i} chip`,disabled:l,tabindex:l?-1:0,onClick:this.dismissAction,onMouseEnter:this.mouseEnterHandler,onMouseLeave:this.mouseLeaveHandler,innerHTML:n})),c(this.el,"badge")&&t("slot",{name:"badge"}))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{customColor:["customColorHandler"]}}};d.style=l;export{d as ic_chip};
|
2
|
-
//# sourceMappingURL=p-f861a72a.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icChipCss","Chip","this","dismissAction","dismiss","emit","icDismiss","mouseEnterHandler","hovered","mouseLeaveHandler","setChipColour","colorRGBA","convertToRGBA","customColor","r","g","b","a","foregroundColour","el","setAttribute","customColorHandler","dismissible","componentWillLoad","removeDisabledFalse","disabled","appearance","variant","componentDidLoad","onComponentRequiredPropUndefined","prop","label","propName","handleClick","visible","setFocus","_a","shadowRoot","querySelector","focus","render","size","h","class","chip","undefined","transparentBackground","isSlotUsed","name","target","id","tabindex","onClick","onMouseEnter","onMouseLeave","innerHTML","dismissIcon"],"sources":["src/components/ic-chip/ic-chip.css?tag=ic-chip&encapsulation=shadow","src/components/ic-chip/ic-chip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: inline-block;\n}\n\n.chip {\n display: flex;\n padding: var(--ic-space-xxs);\n font-size: 0.875rem;\n border-radius: var(--ic-space-md);\n text-align: left;\n text-decoration: none;\n transition: var(--ic-easing-transition-fast);\n position: relative;\n}\n\n.chip.small {\n padding: var(--ic-space-xxxs);\n border-radius: calc(var(--ic-space-md) - var(--ic-space-xxxs));\n}\n\n.chip.large {\n padding: var(--ic-space-xs);\n border-radius: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n.label {\n padding: 0 var(--ic-space-xs);\n}\n\n.chip.hovered:not(:focus-within) {\n background-color: var(--ic-architectural-300);\n}\n\n.chip:focus-within {\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n.chip.outline.hovered:not(:focus-within),\n.chip.outlined.hovered:not(:focus-within) {\n background-color: var(--ic-action-dark-bg-hover);\n}\n\nic-tooltip:focus-within {\n z-index: 1;\n}\n\n.filled {\n background-color: var(--chip-custom-color, var(--ic-architectural-200));\n color: var(--chip-custom-foreground-color, black);\n border: none;\n}\n\n.filled.disabled {\n background-color: var(--ic-architectural-100);\n}\n\n.outline,\n.outlined {\n color: var(--ic-architectural-900);\n border: var(--ic-border-width) solid\n var(--chip-custom-color, var(--ic-architectural-900));\n padding: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.outline.small,\n.outlined.small {\n padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n}\n\n.outline.large,\n.outlined.large {\n padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n.outline.disabled,\n.outlined.disabled {\n border: var(--ic-border-disabled);\n background: none;\n}\n\n.chip.disabled ic-typography {\n color: var(--ic-architectural-500);\n}\n\n.filled.disabled ic-typography {\n color: var(--ic-architectural-600);\n}\n\n.dismiss-icon {\n border: none;\n border-radius: 50%;\n padding: 0;\n background: none;\n cursor: pointer;\n margin: var(--ic-space-xxxs);\n height: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n width: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n}\n\n.dismiss-icon:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n.dismiss-icon[disabled] {\n pointer-events: none;\n color: var(--ic-architectural-200);\n}\n\n.icon {\n padding: var(--ic-space-xxxs);\n box-sizing: border-box;\n}\n\n.icon,\nic-tooltip {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.chip.disabled path,\n.chip.disabled ::slotted(svg) {\n fill: var(--ic-architectural-200);\n}\n\n.chip.white-background {\n background-color: var(--ic-architectural-white);\n}\n\n.chip.white-background.hovered:not(:focus-within) {\n background-color: var(--ic-action-dark-bg-hover-no-alpha) !important;\n}\n\n@media (forced-colors: active) {\n .chip {\n border: var(--ic-hc-border);\n }\n\n .filled.small {\n padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n }\n\n .filled {\n padding: calc(var(--ic-space-xxxs) + var(--ic-space-1px));\n }\n\n .filled.large {\n padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n }\n\n .chip.disabled {\n appearance: none;\n border-color: GrayText;\n }\n\n .chip.disabled ic-typography {\n color: GrayText;\n }\n\n .chip.disabled path,\n .chip.disabled ::slotted(svg) {\n fill: GrayText;\n }\n\n .chip:focus-within {\n outline: none;\n border-color: Highlight;\n }\n}\n","import {\n Component,\n h,\n Prop,\n State,\n Listen,\n Event,\n EventEmitter,\n Element,\n Method,\n Watch,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n removeDisabledFalse,\n convertToRGBA,\n} from \"../../utils/helpers\";\nimport { IcChipAppearance } from \"./ic-chip.types\";\nimport { IcColor, IcEmphasisType, IcSizes } from \"../../utils/types\";\nimport dismissIcon from \"../../assets/dismiss-icon.svg\";\n\n/**\n * @slot icon - Content will be rendered at the start of the chip.\n * @slot badge - Badge component overlaying the top right of the chip.\n */\n@Component({\n tag: \"ic-chip\",\n styleUrl: \"ic-chip.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Chip {\n @Element() el: HTMLIcChipElement;\n\n @State() hovered: boolean = false;\n @State() visible: boolean = true;\n\n /**\n * @deprecated This prop should not be used anymore. Use variant prop instead.\n */\n @Prop() appearance?: IcChipAppearance;\n\n /**\n * The custom chip colour. This prop will be applied to the chip component if `dismissible` is set to `false`.\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n */\n @Prop() customColor?: IcColor = null;\n\n @Watch(\"customColor\")\n customColorHandler(): void {\n if (!this.dismissible) {\n this.setChipColour();\n }\n }\n\n /**\n * If `true`, the chip will appear disabled.\n */\n @Prop() disabled?: boolean = false;\n\n /**\n * If `true`, the chip will have a close button at the end to dismiss it.\n */\n @Prop() dismissible?: boolean = false;\n\n /**\n * The text rendered within the chip.\n */\n @Prop() label!: string;\n\n /**\n * The size of the chip.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * If `true`, the outlined variant of chip will have a transparent background rather than white.\n */\n @Prop() transparentBackground?: boolean = true;\n\n /**\n * The emphasis of the chip.\n */\n @Prop() variant?: IcEmphasisType = \"filled\";\n\n /**\n * @deprecated This event should not be used anymore. Use icDismiss instead.\n */\n @Event() dismiss: EventEmitter<void>;\n\n /**\n * Is emitted when the user dismisses the chip.\n */\n @Event() icDismiss: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n if (!this.dismissible) {\n this.setChipColour();\n }\n\n if (this.appearance === \"outline\") {\n this.variant = \"outlined\";\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Chip\"\n );\n }\n\n @Listen(\"icDismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n\n /**\n * Sets focus on the chip.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.el.shadowRoot.querySelector(\"button\")?.focus();\n }\n\n private dismissAction = (): void => {\n this.dismiss.emit();\n this.icDismiss.emit();\n };\n\n private mouseEnterHandler = (): void => {\n this.hovered = true;\n };\n\n private mouseLeaveHandler = (): void => {\n this.hovered = false;\n };\n\n private setChipColour = () => {\n const colorRGBA = convertToRGBA(this.customColor);\n if (colorRGBA) {\n const { r, g, b, a } = colorRGBA;\n const foregroundColour =\n (r * 299 + g * 587 + b * 114) / 1000 > 133.3505 ? \"black\" : \"white\";\n this.el.setAttribute(\n \"style\",\n `--chip-custom-color: rgba(${r}, ${g}, ${b}, ${a}); --chip-custom-foreground-color: var(--ic-architectural-${foregroundColour})`\n );\n }\n };\n\n render() {\n const {\n label,\n appearance,\n variant,\n size,\n dismissible,\n visible,\n disabled,\n hovered,\n } = this;\n\n return (\n visible && (\n <div\n class={{\n chip: true,\n [`${appearance}`]: appearance !== undefined,\n [`${variant}`]: true,\n [`${size}`]: true,\n disabled,\n dismissible,\n hovered,\n \"white-background\":\n this.variant === \"outlined\" && !this.transparentBackground,\n }}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography\n variant=\"label\"\n apply-vertical-margins={false}\n class=\"label\"\n >\n <span>{label}</span>\n </ic-typography>\n {dismissible && (\n <ic-tooltip\n label=\"Dismiss\"\n target=\"dismiss-icon\"\n class={{ \"tooltip-disabled\": disabled }}\n >\n <button\n id=\"dismiss-icon\"\n class=\"dismiss-icon\"\n aria-label={`Dismiss ${label} chip`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n onClick={this.dismissAction}\n onMouseEnter={this.mouseEnterHandler}\n onMouseLeave={this.mouseLeaveHandler}\n innerHTML={dismissIcon}\n ></button>\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </div>\n )\n );\n }\n}\n"],"mappings":"idAAA,MAAMA,EAAY,mqK,MCiCLC,EAAI,M,+FAgGPC,KAAAC,cAAgB,KACtBD,KAAKE,QAAQC,OACbH,KAAKI,UAAUD,MAAM,EAGfH,KAAAK,kBAAoB,KAC1BL,KAAKM,QAAU,IAAI,EAGbN,KAAAO,kBAAoB,KAC1BP,KAAKM,QAAU,KAAK,EAGdN,KAAAQ,cAAgB,KACtB,MAAMC,EAAYC,EAAcV,KAAKW,aACrC,GAAIF,EAAW,CACb,MAAMG,EAAEA,EAACC,EAAEA,EAACC,EAAEA,EAACC,EAAEA,GAAMN,EACvB,MAAMO,GACHJ,EAAI,IAAMC,EAAI,IAAMC,EAAI,KAAO,IAAO,SAAW,QAAU,QAC9Dd,KAAKiB,GAAGC,aACN,QACA,6BAA6BN,MAAMC,MAAMC,MAAMC,8DAA8DC,K,gBAlHvF,M,aACA,K,2CAWI,K,cAYH,M,iBAKG,M,+BAUP,U,2BAKiB,K,aAKP,Q,CAlCnC,kBAAAG,GACE,IAAKnB,KAAKoB,YAAa,CACrBpB,KAAKQ,e,EA4CT,iBAAAa,GACEC,EAAoBtB,KAAKuB,SAAUvB,KAAKiB,IAExC,IAAKjB,KAAKoB,YAAa,CACrBpB,KAAKQ,e,CAGP,GAAIR,KAAKwB,aAAe,UAAW,CACjCxB,KAAKyB,QAAU,U,EAInB,gBAAAC,GACEC,EACE,CAAC,CAAEC,KAAM5B,KAAK6B,MAAOC,SAAU,UAC/B,O,CAKJ,WAAAC,GACE/B,KAAKgC,SAAWhC,KAAKgC,O,CAOvB,cAAMC,G,OACJC,EAAAlC,KAAKiB,GAAGkB,WAAWC,cAAc,aAAS,MAAAF,SAAA,SAAAA,EAAEG,O,CA6B9C,MAAAC,GACE,MAAMT,MACJA,EAAKL,WACLA,EAAUC,QACVA,EAAOc,KACPA,EAAInB,YACJA,EAAWY,QACXA,EAAOT,SACPA,EAAQjB,QACRA,GACEN,KAEJ,OACEgC,GACEQ,EAAA,OACEC,MAAO,CACLC,KAAM,KACN,CAAC,GAAGlB,KAAeA,IAAemB,UAClC,CAAC,GAAGlB,KAAY,KAChB,CAAC,GAAGc,KAAS,KACbhB,WACAH,cACAd,UACA,mBACEN,KAAKyB,UAAY,aAAezB,KAAK4C,wBAGxCC,EAAW7C,KAAKiB,GAAI,SACnBuB,EAAA,OAAKC,MAAM,QACTD,EAAA,QAAMM,KAAK,UAGfN,EAAA,iBACEf,QAAQ,QAAO,yBACS,MACxBgB,MAAM,SAEND,EAAA,YAAOX,IAERT,GACCoB,EAAA,cACEX,MAAM,UACNkB,OAAO,eACPN,MAAO,CAAE,mBAAoBlB,IAE7BiB,EAAA,UACEQ,GAAG,eACHP,MAAM,eAAc,aACR,WAAWZ,SACvBN,SAAUA,EACV0B,SAAU1B,GAAY,EAAI,EAC1B2B,QAASlD,KAAKC,cACdkD,aAAcnD,KAAKK,kBACnB+C,aAAcpD,KAAKO,kBACnB8C,UAAWC,KAIhBT,EAAW7C,KAAKiB,GAAI,UAAYuB,EAAA,QAAMM,KAAK,U"}
|