@ukic/web-components 2.15.0 → 2.17.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-3d0705ed.js.map +1 -1
- package/dist/cjs/ic-badge.cjs.entry.js +15 -7
- package/dist/cjs/ic-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js +2 -1
- package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +15 -12
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +27 -31
- package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +45 -59
- package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/types-dc22e301.js.map +1 -1
- package/dist/collection/components/ic-badge/ic-badge.js +15 -7
- package/dist/collection/components/ic-badge/ic-badge.js.map +1 -1
- package/dist/collection/components/ic-badge/test/basic/ic-badge.spec.js +2 -2
- package/dist/collection/components/ic-badge/test/basic/ic-badge.spec.js.map +1 -1
- package/dist/collection/components/ic-dialog/ic-dialog.js +2 -1
- package/dist/collection/components/ic-dialog/ic-dialog.js.map +1 -1
- package/dist/collection/components/ic-link/ic-link.js.map +1 -1
- package/dist/collection/components/ic-navigation-button/ic-navigation-button.js.map +1 -1
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.css +1 -0
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +14 -11
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.js.map +1 -1
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +28 -32
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
- package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.css +21 -24
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js +68 -59
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js.map +1 -1
- package/dist/collection/utils/helpers.js +14 -0
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/types.js.map +1 -1
- package/dist/components/helpers.js.map +1 -1
- package/dist/components/ic-badge.js +16 -8
- package/dist/components/ic-badge.js.map +1 -1
- package/dist/components/ic-dialog.js +2 -1
- package/dist/components/ic-dialog.js.map +1 -1
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-navigation-button.js.map +1 -1
- package/dist/components/ic-navigation-group.js +15 -12
- package/dist/components/ic-navigation-group.js.map +1 -1
- package/dist/components/ic-navigation-item.js +28 -32
- package/dist/components/ic-navigation-item.js.map +1 -1
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-text-field2.js.map +1 -1
- package/dist/components/ic-top-navigation.js +47 -61
- package/dist/components/ic-top-navigation.js.map +1 -1
- package/dist/components/types.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-aac0195e.entry.js → p-01da2341.entry.js} +2 -2
- package/dist/core/{p-c2173562.entry.js → p-034723b0.entry.js} +2 -2
- package/dist/core/p-034723b0.entry.js.map +1 -0
- package/dist/core/{p-04d2f198.entry.js → p-0c679975.entry.js} +2 -2
- package/dist/core/{p-8cbbe579.entry.js → p-14a0c9a9.entry.js} +2 -2
- package/dist/core/{p-f026466e.entry.js → p-19247a5a.entry.js} +2 -2
- package/dist/core/{p-563c2522.entry.js → p-196511f4.entry.js} +2 -2
- package/dist/core/{p-2edbdbaf.entry.js → p-1cca9f24.entry.js} +2 -2
- package/dist/core/p-227761a5.entry.js +2 -0
- package/dist/core/p-227761a5.entry.js.map +1 -0
- package/dist/core/{p-fc91292d.entry.js → p-2499416a.entry.js} +2 -2
- package/dist/core/p-2499416a.entry.js.map +1 -0
- package/dist/core/p-26b7b18f.js.map +1 -1
- package/dist/core/{p-cc0ab439.entry.js → p-2f973f6a.entry.js} +2 -2
- package/dist/core/{p-ab14339d.entry.js → p-389d8200.entry.js} +2 -2
- package/dist/core/{p-fc83d8d7.entry.js → p-3aa1b3c7.entry.js} +2 -2
- package/dist/core/p-40a59fd5.entry.js +2 -0
- package/dist/core/p-40a59fd5.entry.js.map +1 -0
- package/dist/core/p-47b1ec8a.entry.js +2 -0
- package/dist/core/p-47b1ec8a.entry.js.map +1 -0
- package/dist/core/{p-5479d3e5.entry.js → p-4c992683.entry.js} +2 -2
- package/dist/core/{p-268355c1.js → p-4cefa844.js} +2 -2
- package/dist/core/p-4cefa844.js.map +1 -0
- package/dist/core/{p-cd2d2141.entry.js → p-55f7eecc.entry.js} +2 -2
- package/dist/core/{p-880bcf91.entry.js → p-573186d7.entry.js} +2 -2
- package/dist/core/{p-ba31ee69.entry.js → p-625a06af.entry.js} +2 -2
- package/dist/core/{p-65d3c0f1.entry.js → p-63d6ce35.entry.js} +2 -2
- package/dist/core/p-67f670b2.entry.js +2 -0
- package/dist/core/{p-9b4fd843.entry.js.map → p-67f670b2.entry.js.map} +1 -1
- package/dist/core/{p-8841668b.entry.js → p-6d623125.entry.js} +2 -2
- package/dist/core/{p-4e3d46f2.entry.js → p-72621de7.entry.js} +2 -2
- package/dist/core/{p-dfef57d3.entry.js → p-76d82d3c.entry.js} +2 -2
- package/dist/core/{p-5421ceb4.entry.js → p-7e636a51.entry.js} +2 -2
- package/dist/core/{p-e7483ee5.entry.js → p-83d1a0e1.entry.js} +2 -2
- package/dist/core/p-87ec0cef.entry.js +2 -0
- package/dist/core/{p-ba8d968c.entry.js.map → p-87ec0cef.entry.js.map} +1 -1
- package/dist/core/{p-9c157974.entry.js → p-901eacb8.entry.js} +2 -2
- package/dist/core/{p-c43946b0.entry.js → p-91527032.entry.js} +2 -2
- package/dist/core/{p-04dd9fe8.entry.js → p-917abbfa.entry.js} +2 -2
- package/dist/core/{p-14ea9cc7.entry.js → p-91dd1555.entry.js} +2 -2
- package/dist/core/{p-e47f887a.entry.js → p-9870bc1a.entry.js} +2 -2
- package/dist/core/{p-2e3845be.entry.js → p-99db319c.entry.js} +2 -2
- package/dist/core/{p-a222554a.entry.js → p-a14b672a.entry.js} +2 -2
- package/dist/core/p-a14b672a.entry.js.map +1 -0
- package/dist/core/p-a98506a6.entry.js +2 -0
- package/dist/core/p-a98506a6.entry.js.map +1 -0
- package/dist/core/{p-934c2a94.entry.js → p-af5931f4.entry.js} +2 -2
- package/dist/core/{p-e7b676fc.entry.js → p-b0892084.entry.js} +2 -2
- package/dist/core/{p-1e84a765.entry.js → p-b8a82735.entry.js} +2 -2
- package/dist/core/{p-8352d752.entry.js → p-c37bf1c6.entry.js} +2 -2
- package/dist/core/{p-8a77a417.entry.js → p-c4ff9e66.entry.js} +2 -2
- package/dist/core/{p-c1bb5018.entry.js → p-c8538a01.entry.js} +2 -2
- package/dist/core/{p-b7bf772b.entry.js → p-d192a1e4.entry.js} +2 -2
- package/dist/core/p-d93267e0.entry.js +2 -0
- package/dist/core/p-d93267e0.entry.js.map +1 -0
- package/dist/core/{p-77503f4f.entry.js → p-dd8861c0.entry.js} +2 -2
- package/dist/core/{p-cdb51adf.entry.js → p-e21263d5.entry.js} +2 -2
- package/dist/core/{p-c0525936.entry.js → p-e6eafc88.entry.js} +2 -2
- package/dist/core/{p-917b15da.entry.js → p-eacc562b.entry.js} +2 -2
- package/dist/core/{p-f926174d.entry.js → p-ec1c7ecd.entry.js} +2 -2
- package/dist/core/{p-18137908.entry.js → p-edbb9e9d.entry.js} +2 -2
- package/dist/core/{p-d5cadfa1.entry.js → p-ef21f737.entry.js} +2 -2
- package/dist/core/{p-77a00075.entry.js → p-fc20178a.entry.js} +2 -2
- package/dist/core/{p-f24084fa.entry.js → p-fcf42a0a.entry.js} +2 -2
- package/dist/core/p-fcf42a0a.entry.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-4262def4.js → helpers-8cc07380.js} +2 -2
- package/dist/esm/helpers-8cc07380.js.map +1 -0
- 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 +16 -8
- package/dist/esm/ic-badge.entry.js.map +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 +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 +1 -1
- package/dist/esm/ic-data-row.entry.js +1 -1
- package/dist/esm/ic-dialog.entry.js +3 -2
- package/dist/esm/ic-dialog.entry.js.map +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-link.entry.js.map +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-button.entry.js.map +1 -1
- package/dist/esm/ic-navigation-group.entry.js +16 -13
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +28 -32
- package/dist/esm/ic-navigation-item.entry.js.map +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 +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-side-navigation.entry.js.map +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-text-field.entry.js.map +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 +46 -60
- package/dist/esm/ic-top-navigation.entry.js.map +1 -1
- package/dist/esm/ic-typography.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/types-6f6b41a5.js.map +1 -1
- package/dist/types/components/ic-badge/ic-badge.d.ts +1 -0
- package/dist/types/components/ic-navigation-item/ic-navigation-item.d.ts +2 -2
- package/dist/types/components/ic-top-navigation/ic-top-navigation.d.ts +10 -5
- package/dist/types/components.d.ts +10 -2
- package/dist/types/utils/helpers.d.ts +7 -6
- package/dist/types/utils/types.d.ts +1 -0
- package/hydrate/index.js +105 -111
- package/package.json +2 -2
- package/vscode-data.json +4 -0
- package/dist/collection/components/ic-page-header/test/a11y/ic-page-header.test.a11y.js +0 -13
- package/dist/collection/components/ic-page-header/test/a11y/ic-page-header.test.a11y.js.map +0 -1
- package/dist/collection/components/ic-page-header/test/basic/ic-page-header.e2e.js +0 -177
- package/dist/collection/components/ic-page-header/test/basic/ic-page-header.e2e.js.map +0 -1
- package/dist/collection/components/ic-pagination/test/a11y/ic-pagination.test.a11y.js +0 -18
- package/dist/collection/components/ic-pagination/test/a11y/ic-pagination.test.a11y.js.map +0 -1
- package/dist/collection/components/ic-pagination/test/basic/ic-pagination.e2e.js +0 -128
- package/dist/collection/components/ic-pagination/test/basic/ic-pagination.e2e.js.map +0 -1
- package/dist/core/p-22cbe39b.entry.js +0 -2
- package/dist/core/p-22cbe39b.entry.js.map +0 -1
- package/dist/core/p-268355c1.js.map +0 -1
- package/dist/core/p-7cdea5bf.entry.js +0 -2
- package/dist/core/p-7cdea5bf.entry.js.map +0 -1
- package/dist/core/p-9b4fd843.entry.js +0 -2
- package/dist/core/p-a222554a.entry.js.map +0 -1
- package/dist/core/p-b1e74a89.entry.js +0 -2
- package/dist/core/p-b1e74a89.entry.js.map +0 -1
- package/dist/core/p-ba8d968c.entry.js +0 -2
- package/dist/core/p-c2173562.entry.js.map +0 -1
- package/dist/core/p-f24084fa.entry.js.map +0 -1
- package/dist/core/p-f58da6ae.entry.js +0 -2
- package/dist/core/p-f58da6ae.entry.js.map +0 -1
- package/dist/core/p-f7019830.entry.js +0 -2
- package/dist/core/p-f7019830.entry.js.map +0 -1
- package/dist/core/p-fc91292d.entry.js.map +0 -1
- package/dist/esm/helpers-4262def4.js.map +0 -1
- package/dist/types/components/ic-page-header/test/a11y/ic-page-header.test.a11y.d.ts +0 -1
- package/dist/types/components/ic-pagination/test/a11y/ic-pagination.test.a11y.d.ts +0 -1
- /package/dist/core/{p-aac0195e.entry.js.map → p-01da2341.entry.js.map} +0 -0
- /package/dist/core/{p-04d2f198.entry.js.map → p-0c679975.entry.js.map} +0 -0
- /package/dist/core/{p-8cbbe579.entry.js.map → p-14a0c9a9.entry.js.map} +0 -0
- /package/dist/core/{p-f026466e.entry.js.map → p-19247a5a.entry.js.map} +0 -0
- /package/dist/core/{p-563c2522.entry.js.map → p-196511f4.entry.js.map} +0 -0
- /package/dist/core/{p-2edbdbaf.entry.js.map → p-1cca9f24.entry.js.map} +0 -0
- /package/dist/core/{p-cc0ab439.entry.js.map → p-2f973f6a.entry.js.map} +0 -0
- /package/dist/core/{p-ab14339d.entry.js.map → p-389d8200.entry.js.map} +0 -0
- /package/dist/core/{p-fc83d8d7.entry.js.map → p-3aa1b3c7.entry.js.map} +0 -0
- /package/dist/core/{p-5479d3e5.entry.js.map → p-4c992683.entry.js.map} +0 -0
- /package/dist/core/{p-cd2d2141.entry.js.map → p-55f7eecc.entry.js.map} +0 -0
- /package/dist/core/{p-880bcf91.entry.js.map → p-573186d7.entry.js.map} +0 -0
- /package/dist/core/{p-ba31ee69.entry.js.map → p-625a06af.entry.js.map} +0 -0
- /package/dist/core/{p-65d3c0f1.entry.js.map → p-63d6ce35.entry.js.map} +0 -0
- /package/dist/core/{p-8841668b.entry.js.map → p-6d623125.entry.js.map} +0 -0
- /package/dist/core/{p-4e3d46f2.entry.js.map → p-72621de7.entry.js.map} +0 -0
- /package/dist/core/{p-dfef57d3.entry.js.map → p-76d82d3c.entry.js.map} +0 -0
- /package/dist/core/{p-5421ceb4.entry.js.map → p-7e636a51.entry.js.map} +0 -0
- /package/dist/core/{p-e7483ee5.entry.js.map → p-83d1a0e1.entry.js.map} +0 -0
- /package/dist/core/{p-9c157974.entry.js.map → p-901eacb8.entry.js.map} +0 -0
- /package/dist/core/{p-c43946b0.entry.js.map → p-91527032.entry.js.map} +0 -0
- /package/dist/core/{p-04dd9fe8.entry.js.map → p-917abbfa.entry.js.map} +0 -0
- /package/dist/core/{p-14ea9cc7.entry.js.map → p-91dd1555.entry.js.map} +0 -0
- /package/dist/core/{p-e47f887a.entry.js.map → p-9870bc1a.entry.js.map} +0 -0
- /package/dist/core/{p-2e3845be.entry.js.map → p-99db319c.entry.js.map} +0 -0
- /package/dist/core/{p-934c2a94.entry.js.map → p-af5931f4.entry.js.map} +0 -0
- /package/dist/core/{p-e7b676fc.entry.js.map → p-b0892084.entry.js.map} +0 -0
- /package/dist/core/{p-1e84a765.entry.js.map → p-b8a82735.entry.js.map} +0 -0
- /package/dist/core/{p-8352d752.entry.js.map → p-c37bf1c6.entry.js.map} +0 -0
- /package/dist/core/{p-8a77a417.entry.js.map → p-c4ff9e66.entry.js.map} +0 -0
- /package/dist/core/{p-c1bb5018.entry.js.map → p-c8538a01.entry.js.map} +0 -0
- /package/dist/core/{p-b7bf772b.entry.js.map → p-d192a1e4.entry.js.map} +0 -0
- /package/dist/core/{p-77503f4f.entry.js.map → p-dd8861c0.entry.js.map} +0 -0
- /package/dist/core/{p-cdb51adf.entry.js.map → p-e21263d5.entry.js.map} +0 -0
- /package/dist/core/{p-c0525936.entry.js.map → p-e6eafc88.entry.js.map} +0 -0
- /package/dist/core/{p-917b15da.entry.js.map → p-eacc562b.entry.js.map} +0 -0
- /package/dist/core/{p-f926174d.entry.js.map → p-ec1c7ecd.entry.js.map} +0 -0
- /package/dist/core/{p-18137908.entry.js.map → p-edbb9e9d.entry.js.map} +0 -0
- /package/dist/core/{p-d5cadfa1.entry.js.map → p-ef21f737.entry.js.map} +0 -0
- /package/dist/core/{p-77a00075.entry.js.map → p-fc20178a.entry.js.map} +0 -0
@@ -1 +1 @@
|
|
1
|
-
{"file":"ic-dialog.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,WAAW,GAAG,u4JAAu4J;;MC+B94J,MAAM;;;;;;;QAGT,oBAAe,GAAW,iBAAiB,CAAC;QAC5C,6BAAwB,GAAW,mBAAmB,CAAC;QACvD,oBAAe,GAAW,iBAAiB,CAAC;QAE5C,iBAAY,GAAW,CAAC,CAAC;QACzB,wBAAmB,GAAG,CAAC,CAAC;QACxB,kBAAa,GAAW,eAAe,CAAC;QACxC,iBAAY,GAAW,cAAc,CAAC;QAEtC,mBAAc,GAAmB,IAAI,CAAC;QAqPtC,iBAAY,GAAG;YACrB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;YAE3B,IAAI,IAAI,CAAC,uBAAuB,EAAE;gBAChC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;aACtB;iBAAM;gBACL,IAAI,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC;aAC3B;YAED,UAAU,CAAC;gBACT,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;;;;;;;;gBASnB,IAAI,IAAI,CAAC,uBAAuB,IAAI,IAAI,CAAC,UAAU,CAAC,SAAS,KAAK,CAAC,EAAE;oBACnE,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,CAAC,CAAC;iBAC/B;aACF,EAAE,EAAE,CAAC,CAAC;YAEP,UAAU,CAAC;gBACT,IAAI,CAAC,eAAe,EAAE,CAAC;gBACvBA,2BAAmB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;aAC7C,EAAE,EAAE,CAAC,CAAC;YAEP,UAAU,CAAC;gBACT,IAAI,CAAC,sBAAsB,EAAE,CAAC;gBAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;aAC5B,EAAE,EAAE,CAAC,CAAC;SACR,CAAC;QAEM,sBAAiB,GAAG;YAC1B,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC;gBACvC,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;gBACjC,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAAE,CAAC,CAAC;aACzE,CAAC,CAAC;YACH,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SAC5C,CAAC;QAEM,2BAAsB,GAAG;YAC/B,IAAI,IAAI,CAAC,QAAQ,CAAC,YAAY,KAAK,IAAI,CAAC,YAAY,EAAE;gBACpD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC;aAChD;SACF,CAAC;QAEM,2CAAsC,GAAG;YAC/C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;YAE5E,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAC/B,YAAY,EACZ,IAAI,CAAC,sBAAsB,CAC5B,CAAC;SACH,CAAC;QAEM,6BAAwB,GAAG;YACjC,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpB,IAAI,CAAC,WAAW,CAAC,mBAAmB,CAClC,YAAY,EACZ,IAAI,CAAC,sBAAsB,CAC5B,CAAC;aACH;SACF,CAAC;QAEM,oBAAe,GAAG;YACxB,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC,aAA4B,CAAC;YAE3D,IAAI,cAAc,CAAC;YAEnB,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,IAAI,EAAE;gBACjE,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CACpC,IAAI,CAAC,wBAAwB,CACf,CAAC;aAClB;iBAAM;gBACL,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAC/C,IAAI,CAAC,wBAAwB,CACf,CAAC;aAClB;YACD,IAAI,cAAc,CAAC,OAAO,KAAK,IAAI,CAAC,aAAa,EAAE;gBAChD,cAAyC,CAAC,QAAQ,EAAE,CAAC;aACvD;iBAAM,IAAI,cAAc,CAAC,OAAO,KAAK,IAAI,CAAC,YAAY,EAAE;gBACtD,cAAyC,CAAC,QAAQ,EAAE,CAAC;aACvD;iBAAM;gBACL,cAAc,CAAC,KAAK,CAAC;oBACnB,aAAa,EAAE,IAAI,CAAC,uBAAuB,GAAG,IAAI,GAAG,KAAK;iBAC3D,CAAC,CAAC;aACJ;SACF,CAAC;QAEM,2BAAsB,GAAG;YAC/B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,sBAAsB,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC3D,IACG,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAiB;qBAC9C,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,IAAI,QAAQ,CAAC,aAAa,CAAC,EAC5D;oBACA,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC;iBAC9B;aACF;SACF,CAAC;QAEM,oBAAe,GAAG;YACxB,IAAIC,qBAAa,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,MAAM,KAAK,IAAI,EAAE;gBACtD,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;gBAC3D,KAAK,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;aAC5C;SACF,CAAC;QAEM,mBAAc,GAAG;YACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;SACnB,CAAC;QAEM,2BAAsB,GAAG;YAC/B,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC,IAAI,CACtC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,WAAW,CAAC,CACjD,CAAC;YACF,MAAM,0BAA0B,GAAG,KAAK,CAAC,IAAI,CAC3C,IAAI,CAAC,EAAE,CAAC,gBAAgB,CACtB;;;yFAGiF,CAClF,CACF,CAAC;YACF,IAAI,0BAA0B,CAAC,MAAM,GAAG,CAAC,EAAE;gBACzC,IAAI,0BAA0B,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,eAAe,EAAE;oBAC/D,0BAA0B,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;iBACtE;qBAAM,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;oBAC5B,0BAA0B,CACxB,0BAA0B,CAAC,MAAM,GAAG,CAAC,CACtC,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;iBAC1C;aACF;YACD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,0BAA0B,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1D,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAChC,CAAC,GAAG,CAAC,EACL,CAAC,EACD,0BAA0B,CAAC,CAAC,CAAgB,CAC7C,CAAC;aACH;SACF,CAAC;QAEM,mBAAc,GAAG,CAAC,mBAA2B,KACnD,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,CAAC;QAE3C,gCAA2B,GAAG,CAAC,QAAiB;YACtD,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAC9B,IAAI,CAAC,4BAA4B,CAAC,QAAQ,CAAC,CAAC;YAC5C,IAAI,CAAC,+BAA+B,EAAE,CAAC;YAEvC,IAAI,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;YAEhE,MAAM,QAAQ,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC,UAAU,KAAK,QAAQ,CAAC;YAEvE,IAAI,WAAW,CAAC,OAAO,KAAK,IAAI,CAAC,aAAa,EAAE;gBAC7C,WAAsC,CAAC,QAAQ,EAAE,CAAC;aACpD;iBAAM;gBACL,IAAI,QAAQ,EAAE;oBACZ,IAAI,CAAC,4BAA4B,CAAC,QAAQ,CAAC,CAAC;oBAC5C,IAAI,CAAC,+BAA+B,EAAE,CAAC;oBAEvC,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;iBAC7D;gBACD,IAAI,WAAW,CAAC,OAAO,KAAK,IAAI,CAAC,YAAY,EAAE;oBAC5C,WAAsC,CAAC,QAAQ,EAAE,CAAC;iBACpD;qBAAM;oBACJ,WAA2B,CAAC,KAAK,EAAE,CAAC;iBACtC;aACF;SACF,CAAC;QAEM,qBAAgB,GAAG;;YACzB,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB,IAAI,CAAC,cAAc,GAAG,IAAI,QAAQ,CAAC,MAAA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,0CAAE,OAAO,CAAC,CAAC;gBACjE,IAAI,CAAC,cAAc,GAAG,IAAI,QAAQ,CAAC,MAAA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,0CAAE,OAAO,CAAC,CAAC;gBACjE,IAAI,CAAC,cAAc,GAAG,IAAI,QAAQ,CAAC,MAAA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,0CAAE,OAAO,CAAC,CAAC;aAClE;SACF,CAAC;QAEM,qBAAgB,GAAG,CAAC,KAAa;YACvC,IAAI,KAAK,KAAK,CAAC,EAAE;gBACf,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC;aAC9B;iBAAM,IAAI,KAAK,KAAK,CAAC,EAAE;gBACtB,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC;aAC9B;iBAAM;gBACL,OAAO,IAAI,CAAC,cAAc,EAAE,CAAC;aAC9B;SACF,CAAC;QAEM,qBAAgB,GAAG,CAAC,KAAa;YACvC,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,aAAa,GAAG,SAAS,CAAC;YACjE,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;gBACjC,OAAO,WAAW,CAAC;aACpB;iBAAM,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;gBACxC,IAAI,KAAK,KAAK,CAAC,EAAE;oBACf,OAAO,UAAU,CAAC;iBACnB;qBAAM;oBACL,OAAO,WAAW,CAAC;iBACpB;aACF;iBAAM;gBACL,IAAI,KAAK,KAAK,CAAC,EAAE;oBACf,OAAO,WAAW,CAAC;iBACpB;qBAAM;oBACL,OAAO,WAAW,CAAC;iBACpB;aACF;SACF,CAAC;QAkBM,iBAAY,GAAG;YACrB,MAAM,EACJ,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,WAAW,EACX,IAAI,EACJ,OAAO,EACP,KAAK,EACL,MAAM,EACN,WAAW,EACX,YAAY,EACZ,eAAe,GAChB,GAAG,IAAI,CAAC;YAET,QACEC,oBACE,KAAK,EAAE;oBACL,CAAC,QAAQ,GAAG,IAAI;oBAChB,CAAC,GAAG,IAAI,EAAE,GAAG,IAAI;oBACjB,CAAC,2BAA2B,GAAG,IAAI,CAAC,uBAAuB;oBAC3D,CAAC,0BAA0B,GAAG,IAAI,CAAC,sBAAsB;iBAC1D,qBACe,6BAA6B,sBAC5B,6BAA6B,EAC9C,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,IAEjCA,iBAAK,KAAK,EAAC,cAAc,IACvBA,iBAAK,KAAK,EAAC,iBAAiB,IAC1BA,iBAAK,KAAK,EAAC,OAAO,IAChBA,kBAAM,IAAI,EAAC,OAAO,IAChBA,2BAAe,OAAO,EAAC,OAAO,EAAC,EAAE,EAAC,cAAc,IAC7C,KAAK,CACQ,CACX,CACH,EACNA,iBAAK,KAAK,EAAC,SAAS,IAClBA,kBAAM,IAAI,EAAC,SAAS,IAClBA,2BAAe,OAAO,EAAC,IAAI,EAAC,EAAE,EAAC,gBAAgB,IAC5C,OAAO,CACM,CACX,CACH,CACF,EACL,CAAC,eAAe,KACfA,uBACE,KAAK,EAAC,YAAY,EAClB,OAAO,EAAC,MAAM,EACd,SAAS,EAAEC,mBAAS,gBACR,YAAY,EACxB,OAAO,EAAE,IAAI,CAAC,cAAc,qBACX,WAAW,IAAI,CAAC,OAAO,GAAG,EAAE,GAAG,IAAI,GACzC,CACd,CACG,EACND,iBAAK,KAAK,EAAC,cAAc,IACtBE,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,IAC3BF,kBAAM,IAAI,EAAC,OAAO,GAAQ,KAE1B,MAAM,KACJA,sBACE,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,YAAY,EACrB,OAAO,EAAE,YAAY,uBAErB,KAAK,EAAC,cAAc,EACpB,EAAE,EAAC,cAAc,GACP,CACb,CACF,EACDA,iBAAK,EAAE,EAAC,gBAAgB,IACtBA,qBAAa,CACT,CACF,EACL,CAAC,OAAO,IAAIE,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,eAAe,CAAC,MACpDF,iBACE,KAAK,EAAE;oBACL,CAAC,IAAI,CAAC,eAAe,GAAG,IAAI;oBAC5B,CAAC,eAAe,GAAG,WAAW,CAAC,MAAM,KAAK,CAAC;iBAC5C,IAEDA,kBAAM,IAAI,EAAE,IAAI,CAAC,eAAe,IAC7B,CAACE,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,eAAe,CAAC;gBACzC,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,EAAEC,OAAK;oBAC3B,IAAIA,OAAK,GAAG,CAAC,EAAE;wBACb,OAAO;qBACR;yBAAM;wBACL,QACEH,uBACE,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAACG,OAAK,CAAC,EACrC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAACA,OAAK,CAAC,EAC3C,KAAK,EAAC,uBAAuB,gBACjB,WAAW,CAAC,MAAM,KAAK,CAAC,qBAElC,IAAI,CAAC,gBAAgB,CAACA,OAAK,CAAC,KAAK,SAAS,GAAG,EAAE,GAAG,IAAI,IAGvD,KAAK,CAAC,KAAK,CACF,EACZ;qBACH;iBACF,CAAC,CACC,CACH,CACP,CACM,EACT;SACH,CAAC;8BApjBiC,KAAK;sBACb,KAAK;;;uBAeJ,IAAI;oCAKS,IAAI;2BAKb,KAAK;4BAKL,SAAS;uCAMG,KAAK;sCAKN,KAAK;+BAKZ,KAAK;;;oBAee,SAAS;oBAwBnB,OAAO;;2BAUQ;YAC3D;gBACE,KAAK,EAAE,QAAQ;gBACf,OAAO,EAAE,sBAAsB;aAChC;YACD,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,uBAAuB,EAAE;SACvD;;IArCD,gBAAgB;QACd,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;aAAM;YACL,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YACpB,IAAI,IAAI,CAAC,cAAc,KAAK,IAAI,EAAE;gBAChC,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;aAClC;YACD,UAAU,CAAC;;gBACT,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;gBAC5B,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;gBACtB,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;gBAC5B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;gBACtB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;aAC5B,EAAE,EAAE,CAAC,CAAC;SACR;KACF;IAwBD,gBAAgB;QACd,IAAI,CAAC,gBAAgB,EAAE,CAAC;KACzB;IAsBD,oBAAoB;QAClB,IAAI,CAAC,wBAAwB,EAAE,CAAC;KACjC;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;YAC3B,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAC9B,IAAI,CAAC,eAAe,EAAE,CAAC;QAEvB,IAAI,CAAC,sCAAsC,EAAE,CAAC;QAE9C,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;KACF;IAED,kBAAkB;QAChB,IACE,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,OAAO,KAAK,MAAM;YAC5C,IAAI,CAAC,uBAAuB,EAC5B;YACA,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;SACzC;aAAM;YACL,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC;SACvC;KACF;IAGD,cAAc,CAAC,EAAiB;QAC9B,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,QAAQ,EAAE,CAAC,GAAG;gBACZ,KAAK,KAAK;oBACR,EAAE,CAAC,cAAc,EAAE,CAAC;oBACpB,IAAI,CAAC,2BAA2B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;oBAC9C,MAAM;gBACR,KAAK,QAAQ;oBACX,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE;wBACd,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;qBACnB;oBACD,EAAE,CAAC,wBAAwB,EAAE,CAAC;oBAC9B,MAAM;aACT;SACF;KACF;IAGD,WAAW,CAAC,EAAc;QACxB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACjE,IACE,IAAI,CAAC,oBAAoB;YACzB,EAAE,CAAC,YAAY,EAAE,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,EAC7C;YACA,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,qBAAqB,EAAE,CAAC;YACnD,MAAM,UAAU,GACd,IAAI,CAAC,GAAG,IAAI,EAAE,CAAC,OAAO;gBACtB,EAAE,CAAC,OAAO,IAAI,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM;gBACpC,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,OAAO;gBACvB,EAAE,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;YACvC,IAAI,CAAC,UAAU,EAAE;gBACf,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;aACnB;SACF;KACF;;;;IAMD,MAAM,UAAU;QACd,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;KAClB;;;;IAMD,MAAM,UAAU;QACd,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;KACnB;;;;IAMD,MAAM,YAAY;QAChB,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,CAAC;QAC9B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;KACnB;;;;IAMD,MAAM,aAAa;QACjB,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,CAAC;KAC/B;IAoNO,+BAA+B;QACrC,IAAI,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,sBAAsB,CAAC,MAAM,GAAG,CAAC;YACnE,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC;aAC1B,IAAI,IAAI,CAAC,mBAAmB,GAAG,CAAC,EAAE;YACrC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,sBAAsB,CAAC,MAAM,GAAG,CAAC,CAAC;SACnE;KACF;IAEO,4BAA4B,CAAC,QAAiB;QACpD,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,mBAAmB,IAAI,CAAC,CAAC;SAC/B;aAAM;YACL,IAAI,CAAC,mBAAmB,IAAI,CAAC,CAAC;SAC/B;KACF;IA+GD,MAAM;QACJ,QACEH,QAACI,UAAI,IACH,KAAK,EAAE;gBACL,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,cAAc;gBAChC,CAAC,SAAS,GAAG,IAAI,CAAC,MAAM;gBACxB,CAAC,2BAA2B,GAAG,IAAI,CAAC,uBAAuB;aAC5D,IAEA,IAAI,CAAC,uBAAuB,IAC3BJ,iBAAK,KAAK,EAAC,UAAU,EAAC,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,IACtD,IAAI,CAAC,YAAY,EAAE,CAChB,KAEN,IAAI,CAAC,YAAY,EAAE,CACpB,CACI,EACP;KACH;;;;;;;;;;;","names":["checkResizeObserver","isPropDefined","h","closeIcon","isSlotUsed","index","Host"],"sources":["src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-dialog: z-index of dialog \n */\n\n:host {\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.disable-height-constraint) {\n background: none;\n justify-content: unset;\n align-items: unset;\n}\n\n.dialog.disable-height-constraint {\n max-height: none;\n position: relative;\n}\n\n.dialog.disable-height-constraint .content-area {\n overflow-y: visible;\n}\n\n:host(.fade-in) {\n opacity: 1;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-architectural-white);\n border: var(--ic-border-default);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) 0 var(--ic-space-md);\n transform: translateY(-3rem);\n transition: transform 1000s;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-x: visible;\n}\n\n:host(.fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n padding: 0 var(--ic-space-md);\n}\n\n.heading {\n overflow-wrap: break-word;\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.content-area {\n -ms-overflow-style: none;\n scrollbar-width: none;\n padding: 0 var(--ic-space-md);\n margin: 0;\n overflow-y: auto;\n}\n\n.content-area::-webkit-scrollbar {\n display: none;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n#dialog-content ::slotted(ic-typography) {\n overflow-wrap: break-word;\n}\n\n#dialog-content ::slotted(*) {\n position: relative;\n}\n\n.status-alert {\n margin-bottom: var(--ic-space-xs);\n}\n\n.dialog-controls {\n margin-top: auto;\n padding: var(--ic-space-xs) var(--ic-space-md) 0;\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n.backdrop {\n overflow-y: auto;\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n padding-top: 16px;\n padding-bottom: 16px;\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .dialog:not(.disable-width-constraint) > .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n transform: translateY(-5rem);\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n\n .backdrop {\n padding: 0;\n }\n\n .dialog.disable-height-constraint {\n height: auto;\n min-height: 100vh;\n }\n}\n\n@media (max-width: 364px) {\n .triple-button {\n flex-direction: column;\n gap: var(--ic-space-xs);\n }\n\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport {\n isSlotUsed,\n checkResizeObserver,\n isPropDefined,\n} from \"../../utils/helpers\";\n\n/**\n * @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n * @slot alert - Content will be placed at the top of the content area of the dialog.\n */\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n private backdropEl: HTMLDivElement;\n private contentArea: HTMLSlotElement;\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DATA_GETS_FOCUS_SELECTOR: string = \"[data-gets-focus]\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private dialogEl: HTMLDialogElement;\n private dialogHeight: number = 0;\n private focusedElementIndex = 0;\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private IC_ACCORDION: string = \"IC-ACCORDION\";\n private interactiveElementList: HTMLElement[];\n private resizeObserver: ResizeObserver = null;\n private resizeTimeout: number;\n private sourceElement: HTMLElement;\n\n /* eslint-disable */\n\n private buttonOnclick0: Function;\n private buttonOnclick1: Function;\n private buttonOnclick2: Function;\n\n /* eslint-enable */\n\n @Element() el: HTMLIcDialogElement;\n\n @State() dialogRendered: boolean = false;\n @State() fadeIn: boolean = false;\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a heading instead.\n */\n @Prop() alertHeading?: string;\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a message instead.\n */\n @Prop() alertMessage?: string;\n\n /**\n * If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.\n */\n @Prop() buttons?: boolean = true;\n\n /**\n * If set to `true`, the dialog will not close when the backdrop is clicked.\n */\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /**\n * If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n */\n @Prop() destructive?: boolean = false;\n\n /**\n * Sets the dismiss label tooltip and aria label.\n */\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /**\n * If set to `true`, the content area max height and overflow properties are removed allowing the dialog to stretch below the fold.\n * This prop also prevents popover elements from being cut off within the content area.\n */\n @Prop() disableHeightConstraint?: boolean = false;\n\n /**\n * If set to `true`, the content area width property is removed, allowing content to take the full width of the dialog when using the large variant.\n */\n @Prop() disableWidthConstraint?: boolean = false;\n\n /**\n * If `true`, the close button will not be displayed.\n */\n @Prop() hideCloseButton?: boolean = false;\n\n /**\n * Sets the heading for the dialog.\n */\n @Prop() heading!: string;\n\n /**\n * Sets the optional label for the dialog which appears above the heading.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the dialog will be displayed.\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = undefined;\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n this.dialogOpened();\n } else {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl.close();\n this.sourceElement?.focus();\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n }\n\n /**\n * Sets the maximum and minimum height and width for the dialog.\n */\n @Prop() size?: \"small\" | \"medium\" | \"large\" = \"small\";\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a variant instead.\n */\n @Prop() status?: \"neutral\" | \"info\" | \"warning\" | \"error\" | \"success\";\n\n /**\n * Sets the label and onclick functions for default buttons.\n */\n @Prop() buttonProps?: { label: string; onclick: string }[] = [\n {\n label: \"Cancel\",\n onclick: \"this.cancelDialog();\",\n },\n { label: \"Confirm\", onclick: \"this.confirmDialog();\" },\n ];\n\n @Watch(\"buttonProps\")\n watchPropHandler(): void {\n this.setButtonOnClick();\n }\n\n /**\n * Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n */\n @Event() icDialogCancelled: EventEmitter<void>;\n\n /**\n * Emitted when dialog has closed.\n */\n @Event() icDialogClosed: EventEmitter<void>;\n\n /**\n * Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n */\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /**\n * Emitted when dialog has opened.\n */\n @Event() icDialogOpened: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.removeSlotChangeListener();\n }\n\n componentWillLoad(): void {\n if (this.buttonProps.length) {\n this.setButtonOnClick();\n }\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n this.setAlertVariant();\n\n this.refreshInteractiveElementsOnSlotChange();\n\n if (this.open) {\n this.dialogOpened();\n }\n }\n\n componentDidRender(): void {\n if (\n getComputedStyle(this.el).display !== \"none\" &&\n this.disableHeightConstraint\n ) {\n document.body.style.overflow = \"hidden\";\n } else {\n document.body.style.overflow = \"auto\";\n }\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n ev.preventDefault();\n this.focusNextInteractiveElement(ev.shiftKey);\n break;\n case \"Escape\":\n if (!ev.repeat) {\n this.open = false;\n }\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\", {})\n handleClick(ev: MouseEvent): void {\n const dialogElement = this.el.shadowRoot.querySelector(\"dialog\");\n if (\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(dialogElement) <= 0\n ) {\n const rect = this.dialogEl.getBoundingClientRect();\n const isInDialog =\n rect.top <= ev.clientY &&\n ev.clientY <= rect.top + rect.height &&\n rect.left <= ev.clientX &&\n ev.clientX <= rect.left + rect.width;\n if (!isInDialog) {\n this.open = false;\n }\n }\n }\n\n /**\n * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.\n */\n @Method()\n async showDialog(): Promise<void> {\n this.open = true;\n }\n\n /**\n * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.\n */\n @Method()\n async hideDialog(): Promise<void> {\n this.open = false;\n }\n\n /**\n * Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n */\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.open = false;\n }\n\n /**\n * Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n */\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n private dialogOpened = () => {\n this.dialogRendered = true;\n\n if (this.disableHeightConstraint) {\n this.dialogEl.show();\n } else {\n this.dialogEl.showModal();\n }\n\n setTimeout(() => {\n this.fadeIn = true;\n\n /**\n * This is required to set scroll back to top if:\n * - dialog content goes below the fold\n * - is closed using cancel or confirm and reopened.\n *\n * Without this, the scroll bar will start from the dialog's last scroll-x coordinate.\n */\n if (this.disableHeightConstraint && this.backdropEl.scrollTop !== 0) {\n this.backdropEl.scrollTop = 0;\n }\n }, 10);\n\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n\n setTimeout(() => {\n this.getFocusedElementIndex();\n this.icDialogOpened.emit();\n }, 80);\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl.clientHeight !== this.dialogHeight) {\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private refreshInteractiveElementsOnSlotChange = () => {\n this.contentArea = this.el.shadowRoot.querySelector(\"#dialog-content slot\");\n\n this.contentArea.addEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n };\n\n private removeSlotChangeListener = () => {\n if (this.contentArea) {\n this.contentArea.removeEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n\n let focusedElement;\n\n if (this.el.querySelector(this.DATA_GETS_FOCUS_SELECTOR) !== null) {\n focusedElement = this.el.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n } else {\n focusedElement = this.el.shadowRoot.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n }\n if (focusedElement.tagName === this.IC_TEXT_FIELD) {\n (focusedElement as HTMLIcTextFieldElement).setFocus();\n } else if (focusedElement.tagName === this.IC_ACCORDION) {\n (focusedElement as HTMLIcAccordionElement).setFocus();\n } else {\n focusedElement.focus({\n preventScroll: this.disableHeightConstraint ? true : false,\n });\n }\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot.activeElement || document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private setAlertVariant = () => {\n if (isPropDefined(this.status) && this.status !== null) {\n const alert = this.el.shadowRoot.querySelector(\"ic-alert\");\n alert.setAttribute(\"variant\", this.status);\n }\n };\n\n private closeIconClick = () => {\n this.open = false;\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot.querySelectorAll(\"ic-button\")\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), \n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button, \n ic-navigation-item, ic-switch, ic-text-field, ic-accordion-group, ic-accordion`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private getNextFocusEl = (focusedElementIndex: number) =>\n this.interactiveElementList[focusedElementIndex];\n\n private focusNextInteractiveElement = (shiftKey: boolean) => {\n this.getFocusedElementIndex();\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n let nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n\n const isHidden = getComputedStyle(nextFocusEl).visibility === \"hidden\";\n\n if (nextFocusEl.tagName === this.IC_TEXT_FIELD) {\n (nextFocusEl as HTMLIcTextFieldElement).setFocus();\n } else {\n if (isHidden) {\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n }\n if (nextFocusEl.tagName === this.IC_ACCORDION) {\n (nextFocusEl as HTMLIcAccordionElement).setFocus();\n } else {\n (nextFocusEl as HTMLElement).focus();\n }\n }\n };\n\n private setButtonOnClick = () => {\n if (this.buttons) {\n this.buttonOnclick0 = new Function(this.buttonProps[0]?.onclick);\n this.buttonOnclick1 = new Function(this.buttonProps[1]?.onclick);\n this.buttonOnclick2 = new Function(this.buttonProps[2]?.onclick);\n }\n };\n\n private getButtonOnclick = (index: number) => {\n if (index === 0) {\n return this.buttonOnclick0();\n } else if (index === 1) {\n return this.buttonOnclick1();\n } else {\n return this.buttonOnclick2();\n }\n };\n\n private getButtonVariant = (index: number) => {\n const mainVariant = this.destructive ? \"destructive\" : \"primary\";\n if (this.buttonProps.length === 1) {\n return mainVariant;\n } else if (this.buttonProps.length === 2) {\n if (index === 0) {\n return \"tertiary\";\n } else {\n return mainVariant;\n }\n } else {\n if (index === 2) {\n return mainVariant;\n } else {\n return \"secondary\";\n }\n }\n };\n\n private loopNextFocusIndexIfLastElement() {\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n }\n\n private setFocusIndexBasedOnShiftKey(shiftKey: boolean) {\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n }\n\n private renderDialog = () => {\n const {\n alertHeading,\n alertMessage,\n buttons,\n buttonProps,\n size,\n heading,\n label,\n status,\n destructive,\n dismissLabel,\n hideCloseButton,\n } = this;\n\n return (\n <dialog\n class={{\n [\"dialog\"]: true,\n [`${size}`]: true,\n [\"disable-height-constraint\"]: this.disableHeightConstraint,\n [\"disable-width-constraint\"]: this.disableWidthConstraint,\n }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n {!hideCloseButton && (\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n innerHTML={closeIcon}\n aria-label={dismissLabel}\n onClick={this.closeIconClick}\n data-gets-focus={destructive || !buttons ? \"\" : null}\n ></ic-button>\n )}\n </div>\n <div class=\"content-area\">\n {isSlotUsed(this.el, \"alert\") ? (\n <slot name=\"alert\"></slot>\n ) : (\n status && (\n <ic-alert\n variant={status}\n heading={alertHeading}\n message={alertMessage}\n title-above\n class=\"status-alert\"\n id=\"dialog-alert\"\n ></ic-alert>\n )\n )}\n <div id=\"dialog-content\">\n <slot></slot>\n </div>\n </div>\n {(buttons || isSlotUsed(this.el, this.DIALOG_CONTROLS)) && (\n <div\n class={{\n [this.DIALOG_CONTROLS]: true,\n [\"triple-button\"]: buttonProps.length === 3,\n }}\n >\n <slot name={this.DIALOG_CONTROLS}>\n {!isSlotUsed(this.el, this.DIALOG_CONTROLS) &&\n buttonProps.map((props, index) => {\n if (index > 2) {\n return;\n } else {\n return (\n <ic-button\n variant={this.getButtonVariant(index)}\n onClick={() => this.getButtonOnclick(index)}\n class=\"dialog-control-button\"\n full-width={buttonProps.length === 3}\n data-gets-focus={\n this.getButtonVariant(index) === \"primary\" ? \"\" : null\n }\n >\n {props.label}\n </ic-button>\n );\n }\n })}\n </slot>\n </div>\n )}\n </dialog>\n );\n };\n\n render() {\n return (\n <Host\n class={{\n [\"hidden\"]: !this.dialogRendered,\n [\"fade-in\"]: this.fadeIn,\n [\"disable-height-constraint\"]: this.disableHeightConstraint,\n }}\n >\n {this.disableHeightConstraint ? (\n <div class=\"backdrop\" ref={(el) => (this.backdropEl = el)}>\n {this.renderDialog()}\n </div>\n ) : (\n this.renderDialog()\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|
1
|
+
{"file":"ic-dialog.entry.cjs.js","mappings":"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","names":["checkResizeObserver","isPropDefined","h","closeIcon","isSlotUsed","index","Host"],"sources":["src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-dialog: z-index of dialog \n */\n\n:host {\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.disable-height-constraint) {\n background: none;\n justify-content: unset;\n align-items: unset;\n}\n\n.dialog.disable-height-constraint {\n max-height: none;\n position: relative;\n}\n\n.dialog.disable-height-constraint .content-area {\n overflow-y: visible;\n}\n\n:host(.fade-in) {\n opacity: 1;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-architectural-white);\n border: var(--ic-border-default);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) 0 var(--ic-space-md);\n transform: translateY(-3rem);\n transition: transform 1000s;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-x: visible;\n}\n\n:host(.fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n padding: 0 var(--ic-space-md);\n}\n\n.heading {\n overflow-wrap: break-word;\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.content-area {\n -ms-overflow-style: none;\n scrollbar-width: none;\n padding: 0 var(--ic-space-md);\n margin: 0;\n overflow-y: auto;\n}\n\n.content-area::-webkit-scrollbar {\n display: none;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n#dialog-content ::slotted(ic-typography) {\n overflow-wrap: break-word;\n}\n\n#dialog-content ::slotted(*) {\n position: relative;\n}\n\n.status-alert {\n margin-bottom: var(--ic-space-xs);\n}\n\n.dialog-controls {\n margin-top: auto;\n padding: var(--ic-space-xs) var(--ic-space-md) 0;\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n.backdrop {\n overflow-y: auto;\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n padding-top: 16px;\n padding-bottom: 16px;\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .dialog:not(.disable-width-constraint) > .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n transform: translateY(-5rem);\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n\n .backdrop {\n padding: 0;\n }\n\n .dialog.disable-height-constraint {\n height: auto;\n min-height: 100vh;\n }\n}\n\n@media (max-width: 364px) {\n .triple-button {\n flex-direction: column;\n gap: var(--ic-space-xs);\n }\n\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport {\n isSlotUsed,\n checkResizeObserver,\n isPropDefined,\n} from \"../../utils/helpers\";\n\n/**\n * @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n * @slot alert - Content will be placed at the top of the content area of the dialog.\n */\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n private backdropEl: HTMLDivElement;\n private contentArea: HTMLSlotElement;\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DATA_GETS_FOCUS_SELECTOR: string = \"[data-gets-focus]\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private dialogEl: HTMLDialogElement;\n private dialogHeight: number = 0;\n private focusedElementIndex = 0;\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private IC_ACCORDION: string = \"IC-ACCORDION\";\n private interactiveElementList: HTMLElement[];\n private resizeObserver: ResizeObserver = null;\n private resizeTimeout: number;\n private sourceElement: HTMLElement;\n\n /* eslint-disable */\n\n private buttonOnclick0: Function;\n private buttonOnclick1: Function;\n private buttonOnclick2: Function;\n\n /* eslint-enable */\n\n @Element() el: HTMLIcDialogElement;\n\n @State() dialogRendered: boolean = false;\n @State() fadeIn: boolean = false;\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a heading instead.\n */\n @Prop() alertHeading?: string;\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a message instead.\n */\n @Prop() alertMessage?: string;\n\n /**\n * If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.\n */\n @Prop() buttons?: boolean = true;\n\n /**\n * If set to `true`, the dialog will not close when the backdrop is clicked.\n */\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /**\n * If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n */\n @Prop() destructive?: boolean = false;\n\n /**\n * Sets the dismiss label tooltip and aria label.\n */\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /**\n * If set to `true`, the content area max height and overflow properties are removed allowing the dialog to stretch below the fold.\n * This prop also prevents popover elements from being cut off within the content area.\n */\n @Prop() disableHeightConstraint?: boolean = false;\n\n /**\n * If set to `true`, the content area width property is removed, allowing content to take the full width of the dialog when using the large variant.\n */\n @Prop() disableWidthConstraint?: boolean = false;\n\n /**\n * If `true`, the close button will not be displayed.\n */\n @Prop() hideCloseButton?: boolean = false;\n\n /**\n * Sets the heading for the dialog.\n */\n @Prop() heading!: string;\n\n /**\n * Sets the optional label for the dialog which appears above the heading.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the dialog will be displayed.\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = undefined;\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n this.dialogOpened();\n } else {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl.close();\n this.sourceElement?.focus();\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n }\n\n /**\n * Sets the maximum and minimum height and width for the dialog.\n */\n @Prop() size?: \"small\" | \"medium\" | \"large\" = \"small\";\n\n /**\n * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a variant instead.\n */\n @Prop() status?: \"neutral\" | \"info\" | \"warning\" | \"error\" | \"success\";\n\n /**\n * Sets the label and onclick functions for default buttons.\n */\n @Prop() buttonProps?: { label: string; onclick: string }[] = [\n {\n label: \"Cancel\",\n onclick: \"this.cancelDialog();\",\n },\n { label: \"Confirm\", onclick: \"this.confirmDialog();\" },\n ];\n\n @Watch(\"buttonProps\")\n watchPropHandler(): void {\n this.setButtonOnClick();\n }\n\n /**\n * Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n */\n @Event() icDialogCancelled: EventEmitter<void>;\n\n /**\n * Emitted when dialog has closed.\n */\n @Event() icDialogClosed: EventEmitter<void>;\n\n /**\n * Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n */\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /**\n * Emitted when dialog has opened.\n */\n @Event() icDialogOpened: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.removeSlotChangeListener();\n }\n\n componentWillLoad(): void {\n if (this.buttonProps.length) {\n this.setButtonOnClick();\n }\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n this.setAlertVariant();\n\n this.refreshInteractiveElementsOnSlotChange();\n\n if (this.open) {\n this.dialogOpened();\n }\n }\n\n componentDidRender(): void {\n if (\n getComputedStyle(this.el).display !== \"none\" &&\n this.disableHeightConstraint\n ) {\n document.body.style.overflow = \"hidden\";\n } else {\n document.body.style.overflow = \"auto\";\n }\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n ev.preventDefault();\n this.focusNextInteractiveElement(ev.shiftKey);\n break;\n case \"Escape\":\n if (!ev.repeat) {\n this.open = false;\n }\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\", {})\n handleClick(ev: MouseEvent): void {\n const dialogElement = this.el.shadowRoot.querySelector(\"dialog\");\n if (\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(dialogElement) <= 0\n ) {\n const rect = this.dialogEl.getBoundingClientRect();\n const isInDialog =\n rect.top <= ev.clientY &&\n ev.clientY <= rect.top + rect.height &&\n rect.left <= ev.clientX &&\n ev.clientX <= rect.left + rect.width;\n if (!isInDialog) {\n this.open = false;\n }\n }\n }\n\n /**\n * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.\n */\n @Method()\n async showDialog(): Promise<void> {\n this.open = true;\n }\n\n /**\n * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.\n */\n @Method()\n async hideDialog(): Promise<void> {\n this.open = false;\n }\n\n /**\n * Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n */\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.open = false;\n }\n\n /**\n * Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n */\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n private dialogOpened = () => {\n this.dialogRendered = true;\n\n if (this.disableHeightConstraint) {\n this.dialogEl.show();\n } else {\n this.dialogEl?.showModal();\n }\n\n setTimeout(() => {\n this.fadeIn = true;\n\n /**\n * This is required to set scroll back to top if:\n * - dialog content goes below the fold\n * - is closed using cancel or confirm and reopened.\n *\n * Without this, the scroll bar will start from the dialog's last scroll-x coordinate.\n */\n if (this.disableHeightConstraint && this.backdropEl.scrollTop !== 0) {\n this.backdropEl.scrollTop = 0;\n }\n }, 10);\n\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n\n setTimeout(() => {\n this.getFocusedElementIndex();\n this.icDialogOpened.emit();\n }, 80);\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl.clientHeight !== this.dialogHeight) {\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private refreshInteractiveElementsOnSlotChange = () => {\n this.contentArea = this.el.shadowRoot.querySelector(\"#dialog-content slot\");\n\n this.contentArea.addEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n };\n\n private removeSlotChangeListener = () => {\n if (this.contentArea) {\n this.contentArea.removeEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n\n let focusedElement;\n\n if (this.el.querySelector(this.DATA_GETS_FOCUS_SELECTOR) !== null) {\n focusedElement = this.el.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n } else {\n focusedElement = this.el.shadowRoot.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n }\n if (focusedElement.tagName === this.IC_TEXT_FIELD) {\n (focusedElement as HTMLIcTextFieldElement).setFocus();\n } else if (focusedElement.tagName === this.IC_ACCORDION) {\n (focusedElement as HTMLIcAccordionElement).setFocus();\n } else {\n focusedElement.focus({\n preventScroll: this.disableHeightConstraint ? true : false,\n });\n }\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot.activeElement || document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private setAlertVariant = () => {\n if (isPropDefined(this.status) && this.status !== null) {\n const alert = this.el.shadowRoot.querySelector(\"ic-alert\");\n alert.setAttribute(\"variant\", this.status);\n }\n };\n\n private closeIconClick = () => {\n this.open = false;\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot.querySelectorAll(\"ic-button\")\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), \n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button, \n ic-navigation-item, ic-switch, ic-text-field, ic-accordion-group, ic-accordion`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private getNextFocusEl = (focusedElementIndex: number) =>\n this.interactiveElementList[focusedElementIndex];\n\n private focusNextInteractiveElement = (shiftKey: boolean) => {\n this.getFocusedElementIndex();\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n let nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n\n const isHidden = getComputedStyle(nextFocusEl).visibility === \"hidden\";\n\n if (nextFocusEl.tagName === this.IC_TEXT_FIELD) {\n (nextFocusEl as HTMLIcTextFieldElement).setFocus();\n } else {\n if (isHidden) {\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n }\n if (nextFocusEl.tagName === this.IC_ACCORDION) {\n (nextFocusEl as HTMLIcAccordionElement).setFocus();\n } else {\n (nextFocusEl as HTMLElement).focus();\n }\n }\n };\n\n private setButtonOnClick = () => {\n if (this.buttons) {\n this.buttonOnclick0 = new Function(this.buttonProps[0]?.onclick);\n this.buttonOnclick1 = new Function(this.buttonProps[1]?.onclick);\n this.buttonOnclick2 = new Function(this.buttonProps[2]?.onclick);\n }\n };\n\n private getButtonOnclick = (index: number) => {\n if (index === 0) {\n return this.buttonOnclick0();\n } else if (index === 1) {\n return this.buttonOnclick1();\n } else {\n return this.buttonOnclick2();\n }\n };\n\n private getButtonVariant = (index: number) => {\n const mainVariant = this.destructive ? \"destructive\" : \"primary\";\n if (this.buttonProps.length === 1) {\n return mainVariant;\n } else if (this.buttonProps.length === 2) {\n if (index === 0) {\n return \"tertiary\";\n } else {\n return mainVariant;\n }\n } else {\n if (index === 2) {\n return mainVariant;\n } else {\n return \"secondary\";\n }\n }\n };\n\n private loopNextFocusIndexIfLastElement() {\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n }\n\n private setFocusIndexBasedOnShiftKey(shiftKey: boolean) {\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n }\n\n private renderDialog = () => {\n const {\n alertHeading,\n alertMessage,\n buttons,\n buttonProps,\n size,\n heading,\n label,\n status,\n destructive,\n dismissLabel,\n hideCloseButton,\n } = this;\n\n return (\n <dialog\n class={{\n [\"dialog\"]: true,\n [`${size}`]: true,\n [\"disable-height-constraint\"]: this.disableHeightConstraint,\n [\"disable-width-constraint\"]: this.disableWidthConstraint,\n }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n {!hideCloseButton && (\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n innerHTML={closeIcon}\n aria-label={dismissLabel}\n onClick={this.closeIconClick}\n data-gets-focus={destructive || !buttons ? \"\" : null}\n ></ic-button>\n )}\n </div>\n <div class=\"content-area\">\n {isSlotUsed(this.el, \"alert\") ? (\n <slot name=\"alert\"></slot>\n ) : (\n status && (\n <ic-alert\n variant={status}\n heading={alertHeading}\n message={alertMessage}\n title-above\n class=\"status-alert\"\n id=\"dialog-alert\"\n ></ic-alert>\n )\n )}\n <div id=\"dialog-content\">\n <slot></slot>\n </div>\n </div>\n {(buttons || isSlotUsed(this.el, this.DIALOG_CONTROLS)) && (\n <div\n class={{\n [this.DIALOG_CONTROLS]: true,\n [\"triple-button\"]: buttonProps.length === 3,\n }}\n >\n <slot name={this.DIALOG_CONTROLS}>\n {!isSlotUsed(this.el, this.DIALOG_CONTROLS) &&\n buttonProps.map((props, index) => {\n if (index > 2) {\n return;\n } else {\n return (\n <ic-button\n variant={this.getButtonVariant(index)}\n onClick={() => this.getButtonOnclick(index)}\n class=\"dialog-control-button\"\n full-width={buttonProps.length === 3}\n data-gets-focus={\n this.getButtonVariant(index) === \"primary\" ? \"\" : null\n }\n >\n {props.label}\n </ic-button>\n );\n }\n })}\n </slot>\n </div>\n )}\n </dialog>\n );\n };\n\n render() {\n return (\n <Host\n class={{\n [\"hidden\"]: !this.dialogRendered,\n [\"fade-in\"]: this.fadeIn,\n [\"disable-height-constraint\"]: this.disableHeightConstraint,\n }}\n >\n {this.disableHeightConstraint ? (\n <div class=\"backdrop\" ref={(el) => (this.backdropEl = el)}>\n {this.renderDialog()}\n </div>\n ) : (\n this.renderDialog()\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|
@@ -1 +1 @@
|
|
1
|
-
{"file":"ic-link.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,SAAS,GAAG,6yJAA6yJ;;MC8BlzJ,IAAI;;;QACP,wBAAmB,
|
1
|
+
{"file":"ic-link.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,SAAS,GAAG,6yJAA6yJ;;MC8BlzJ,IAAI;;;QACP,wBAAmB,GAA4B,EAAE,CAAC;0BAQA,SAAS;wBAK7B,KAAK;oBAKnB,IAAI;;;;;;;IA2B5B,iBAAiB;QACf,IAAI,CAAC,mBAAmB,GAAGA,yBAAiB,CAAC,IAAI,CAAC,EAAE,EAAEC,yBAAiB,CAAC,CAAC;QACzE,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;IAGD,kBAAkB,CAAC,EAAe;QAChC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;KAC9B;;;;IAMD,MAAM,QAAQ;QACZ,IAAI,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE;YACzC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC;SAC/C;KACF;IAEO,WAAW,CAAC,WAA8B,IAAI;QACpD,MAAM,KAAK,GAAGC,2BAAmB,CAAC,IAAI,CAAC,EAAE,EAAE,QAAQ,IAAI,IAAI,CAAC,CAAC;QAE7D,QAAQ,KAAK;YACX,KAAKC,2BAAqB,CAAC,KAAK;gBAC9B,IAAI,CAAC,UAAU,GAAGA,2BAAqB,CAAC,KAAK,CAAC;gBAC9C,MAAM;YACR,KAAKA,2BAAqB,CAAC,IAAI;gBAC7B,IAAI,CAAC,UAAU,GAAGA,2BAAqB,CAAC,IAAI,CAAC;gBAC7C,MAAM;SACT;KACF;IAEO,aAAa;QACnB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;QAChE,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;SACzD;QACD,OAAO,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;KAC1B;IAED,MAAM;QACJ,MAAM,EACJ,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,EACR,UAAU,GACX,GAAG,IAAI,CAAC;QAET,QACEC,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,CAAC,MAAM,GAAG,IAAI,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,IAAI,EAAE,IACrD,IAAI,CAAC,aAAa,EAAE,IACnBD,kBAAM,IAAI,EAAC,aAAa,GAAQ,KAEhCA,6BACE,KAAK,EAAE;gBACL,CAAC,SAAS,GAAG,IAAI,KAAK,IAAI;gBAC1B,CAAC,GAAG,UAAU,EAAE,GAAG,IAAI,KAAK,IAAI;aACjC,EACD,QAAQ,EAAE,QAAQ,KAAK,KAAK,GAAG,QAAQ,GAAG,IAAI,EAC9C,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,KAAK,IAAI,GAAG,GAAG,GAAG,IAAI,IAChC,IAAI,CAAC,mBAAmB,GAE5BA,qBAAQ,EACP,CAAC,QAAQ,IAAI,MAAM,KAAK,QAAQ,MAC/BA,kBAAM,KAAK,EAAC,0BAA0B,EAAC,SAAS,EAAEE,mBAAS,GAAI,CAChE,CACC,CACL,CACI,EACP;KACH;;;;;;;;","names":["inheritAttributes","IC_INHERITED_ARIA","getThemeFromContext","IcThemeForegroundEnum","h","Host","OpenInNew"],"sources":["src/components/ic-link/ic-link.css?tag=ic-link&encapsulation=shadow","src/components/ic-link/ic-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.link) .ic-link,\n:host(.link) ::slotted(a) {\n color: var(--ic-hyperlink);\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n transition: var(--ic-easing-transition-fast);\n}\n\n:host(.link.dark) .ic-link.dark,\n:host(.link.dark) ::slotted(a) {\n color: var(--ic-color-primary-text);\n}\n\n:host(.link.light) .ic-link.light,\n:host(.link.light) ::slotted(a) {\n color: var(--ic-color-white-text);\n}\n\n:host(.link) .ic-link:visited,\n:host(.link) ::slotted(a:visited) {\n color: var(--ic-hyperlink-visited);\n}\n\n:host(.link) .ic-link:hover,\n:host(.link) .ic-link:focus,\n:host(.link) ::slotted(a:hover),\n:host(.link) ::slotted(a:focus) {\n outline: none;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-decoration-thickness: 25%) {\n :host(.link) .ic-link:hover,\n :host(.link) .ic-link:focus,\n :host(.link) ::slotted(a:hover),\n :host(.link) ::slotted(a: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:host(.link) .ic-link:active,\n:host(.link) .ic-link:focus:active,\n:host(.link) .ic-link:visited:active,\n:host(.link) ::slotted(a:active),\n:host(.link) ::slotted(a:focus:active),\n:host(.link) ::slotted(a:visited:active) {\n text-decoration: none;\n}\n\n.ic-link-open-in-new-icon {\n vertical-align: middle;\n margin-left: var(--ic-space-xxs);\n}\n\n.ic-link > .ic-link-open-in-new-icon {\n fill: var(--ic-hyperlink);\n}\n\n.ic-link.dark > .ic-link-open-in-new-icon {\n fill: var(--ic-color-primary-text);\n}\n\n.ic-link.light > .ic-link-open-in-new-icon {\n fill: var(--ic-color-white-text);\n}\n\n.ic-link-open-in-new-icon > svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n fill: currentcolor;\n}\n\n.ic-link:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-hyperlink-visited);\n}\n\n.ic-link.light:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-hyperlink-contrast-visited);\n}\n\n:host(.breadcrumb-link) .ic-link {\n display: var(--breadcrumb-link-display);\n align-items: var(--breadcrumb-link-align-items);\n gap: var(--breadcrumb-link-gap);\n}\n\n:host(.breadcrumb-link) .ic-link ::slotted(.back-icon) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host(.breadcrumb-link.current-page) a,\n:host(.breadcrumb-link.current-page) ::slotted(a) {\n font-weight: normal;\n color: inherit;\n text-decoration: none;\n display: flex;\n align-items: center;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link,\n:host(.breadcrumb-link.current-page) ::slotted(a:focus) {\n outline: var(--ic-hc-focus-outline);\n text-decoration: none;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link:visited {\n color: var(--ic-color-primary-text);\n}\n","import {\n Component,\n Element,\n Prop,\n h,\n Host,\n Listen,\n Method,\n} from \"@stencil/core\";\n\nimport OpenInNew from \"../../assets/OpenInNew.svg\";\nimport { getThemeFromContext, inheritAttributes } from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\n/**\n * @slot router-item - Handle routing by nesting your routes in this slot.\n */\n\n@Component({\n tag: \"ic-link\",\n styleUrl: \"ic-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Link {\n private inheritedAttributes: { [k: string]: string } = {};\n private routerSlot: HTMLElement;\n\n @Element() el: HTMLIcLinkElement;\n\n /**\n * The appearance of the link, e.g. dark, light, or default.\n */\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\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 * The URL that the link points to.\n */\n @Prop() href?: string = null;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\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 * @deprecated This prop should not be used anymore. The 'open in new tab/window' icon will display automatically if target=\"_blank\".\n */\n @Prop() showIcon?: boolean;\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 componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, IC_INHERITED_ARIA);\n this.updateTheme();\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.updateTheme(theme.mode);\n }\n\n /**\n * Sets focus on the link.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.el.shadowRoot.querySelector(\"a\")) {\n this.el.shadowRoot.querySelector(\"a\").focus();\n }\n }\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const theme = getThemeFromContext(this.el, newTheme || null);\n\n switch (theme) {\n case IcThemeForegroundEnum.Light:\n this.appearance = IcThemeForegroundEnum.Light;\n break;\n case IcThemeForegroundEnum.Dark:\n this.appearance = IcThemeForegroundEnum.Dark;\n break;\n }\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 render() {\n const {\n download,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n showIcon,\n appearance,\n } = this;\n\n return (\n <Host class={{ [\"link\"]: true, [`${appearance}`]: true }}>\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <a\n class={{\n [\"ic-link\"]: href !== null,\n [`${appearance}`]: href !== null,\n }}\n download={download !== false ? download : null}\n href={href}\n hrefLang={hreflang}\n referrerPolicy={referrerpolicy}\n rel={rel}\n target={target}\n tabindex={href !== null ? \"0\" : \"-1\"}\n {...this.inheritedAttributes}\n >\n <slot />\n {(showIcon || target === \"_blank\") && (\n <span class=\"ic-link-open-in-new-icon\" innerHTML={OpenInNew} />\n )}\n </a>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|
@@ -1 +1 @@
|
|
1
|
-
{"file":"ic-navigation-button.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,qBAAqB,GAAG,2hFAA2hF;;MCqC5iF,gBAAgB;;;QAEnB,wBAAmB,
|
1
|
+
{"file":"ic-navigation-button.entry.cjs.js","mappings":"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","names":["getThemeForegroundColor","inheritAttributes","IC_INHERITED_ARIA","onComponentRequiredPropUndefined","IcThemeForegroundEnum","h","Host","isSlotUsed"],"sources":["src/components/ic-navigation-button/ic-navigation-button.css?tag=ic-navigation-button&encapsulation=shadow","src/components/ic-navigation-button/ic-navigation-button.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n margin-right: var(--ic-space-xs);\n list-style: none;\n}\n\n:host(.in-side-menu) {\n margin-right: 0;\n}\n\n:host::part(button) {\n height: 100%;\n min-height: 2.5rem;\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n State,\n h,\n Listen,\n Method,\n} from \"@stencil/core\";\n\nimport {\n getThemeForegroundColor,\n inheritAttributes,\n onComponentRequiredPropUndefined,\n isSlotUsed,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcNavButtonModes } from \"./ic-navigation-button.types\";\n\n/**\n * @slot icon - Content will be placed to the left of the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n */\n\n@Component({\n tag: \"ic-navigation-button\",\n styleUrl: \"ic-navigation-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class NavigationButton {\n private buttonEl: HTMLIcButtonElement;\n private inheritedAttributes: { [k: string]: string } = {};\n\n @Element() el: HTMLIcNavigationButtonElement;\n\n @State() initialAppearance = getThemeForegroundColor();\n /**\n * The display mode.\n */\n @State() mode: IcNavButtonModes = \"navbar\";\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 * 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 * The label info to display.\n */\n @Prop() label!: string;\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 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 componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, [\n ...IC_INHERITED_ARIA,\n \"title\",\n ]);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Navigation Button\"\n );\n }\n\n componentWillRender(): void {\n const iconEl = this.el.querySelector(`[slot=\"icon\"]`);\n iconEl !== null && iconEl.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"icNavigationMenuOpened\", { target: \"document\" })\n navBarMenuOpenHandler(): void {\n this.mode = \"menu\";\n }\n\n @Listen(\"icNavigationMenuClosed\", { target: \"document\" })\n navBarMenuCloseHandler(): void {\n this.mode = \"navbar\";\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.initialAppearance = theme.mode;\n }\n\n /**\n * Sets focus on the native `button`.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.buttonEl) {\n this.buttonEl.focus();\n }\n }\n\n render() {\n const { href, target, rel, download, referrerpolicy } = this;\n\n let label = \"\";\n let className = \"\";\n let variant: \"icon\" | \"tertiary\" = \"icon\";\n let appearance: IcThemeForeground | IcThemeForegroundEnum.Default =\n this.initialAppearance;\n let size: \"default\" | \"large\" = \"large\";\n let fullWidth = false;\n let disableTooltip = false;\n\n if (this.mode === \"menu\") {\n label = this.label;\n variant = \"tertiary\";\n appearance = IcThemeForegroundEnum.Default;\n size = \"default\";\n fullWidth = true;\n className = \"popout-menu-button\";\n disableTooltip = true;\n }\n\n const buttonProps = {\n variant,\n appearance,\n size,\n href,\n target,\n rel,\n download,\n referrerpolicy,\n fullWidth,\n disableTooltip,\n };\n\n return (\n <Host class={{ [\"in-side-menu\"]: this.mode === \"menu\" }}>\n <ic-button\n class={className}\n aria-label={variant == \"icon\" ? this.label : null}\n ref={(el) => (this.buttonEl = el)}\n {...buttonProps}\n {...this.inheritedAttributes}\n >\n {label}\n <slot slot=\"left-icon\" name=\"icon\"></slot>\n {isSlotUsed(this.el, \"badge\") && variant === \"icon\" && (\n <slot name=\"badge\"></slot>\n )}\n </ic-button>\n </Host>\n );\n }\n}\n"],"version":3}
|
@@ -7,7 +7,7 @@ const helpers = require('./helpers-3d0705ed.js');
|
|
7
7
|
const chevronIcon = require('./chevron-icon-3bf07531.js');
|
8
8
|
require('./types-dc22e301.js');
|
9
9
|
|
10
|
-
const icNavigationGroupCss = "/*! 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}:host(.in-side-menu){border-bottom:var(--ic-border-width) solid var(--ic-architectural-200);padding:var(--ic-space-md) 0}:host .navigation-group{height:100%;width:-moz-fit-content;width:fit-content;color:var(--ic-theme-text);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md);transition:var(--ic-easing-transition-slow);position:relative;background:none;border:none}:host(.in-side-menu) .navigation-group{height:2.5rem;width:100%;text-align:left}:host(.in-side-menu) .navigation-group .ic-typography-label{width:11.875rem}:host(.in-side-menu) .navigation-group-side-menu{color:var(--ic-action-default);justify-content:flex-start;padding:0 var(--ic-space-md) 0 var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-collapsed,:host(.in-side-menu) .navigation-group-side-menu-expanded{color:var(--ic-action-default);justify-content:flex-start;padding-left:var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-expanded{margin-bottom:var(--ic-space-xs)}:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,:host(.in-side-menu) .navigation-group-side-menu-expanded::after{border-style:solid;border-width:0.125em 0.125em 0 0;content:\"\";display:inline-block;height:0.45em;left:0.75em;position:relative;top:-0.1em;transform:rotate(135deg);vertical-align:top;width:0.45em}:host(.in-side-menu) .navigation-group-side-menu-expanded::after{top:0.15em;transform:rotate(-45deg)}:host .navigation-group:hover,:host .navigation-group:active,:host .selected{background-color:var(--ic-architectural-20);color:var(--ic-color-primary-text);outline:none;cursor:pointer}:host(:not(.in-side-menu)) .navigation-group:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);z-index:var(--ic-z-index-navigation-item);transition:box-shadow var(--ic-easing-transition-fast)}:host(.in-side-menu) .navigation-group-side-menu:hover,:host(.in-side-menu) .navigation-group-side-menu:active,:host(.in-side-menu) .navigation-group-side-menu:focus{background-color:var(--ic-architectural-20);color:var(--ic-action-default);cursor:auto;box-shadow:none;outline:none}:host(.in-side-menu) .navigation-group-side-menu:focus{outline:var(--ic-hc-focus-outline)}:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus){background-color:var(--ic-action-dark-bg-hover);color:var(--ic-action-default);cursor:pointer}:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus){background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-default)}:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus{color:var(--ic-action-default);box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline)}:host .navigation-group-dropdown{background-color:var(--ic-architectural-20);border-bottom:var(--ic-border-default);position:absolute;left:0;right:0;padding:var(--ic-space-xs) var(--ic-space-md);box-shadow:0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);z-index:calc(var(--ic-z-index-navigation-item) - 1)}:host .navigation-group-dropdown-items-list{list-style:none;display:flex;flex-flow:column wrap;align-content:flex-start;padding-left:var(--ic-space-md);max-height:16.5rem}:host .chevron-toggle-icon-wrapper{display:flex;align-items:center}:host .chevron-toggle-icon-wrapper svg{transform:rotate(90deg);height:var(--ic-space-lg);width:var(--ic-space-lg)}:host .chevron-toggle-icon-closed svg{transform:rotate(-90deg)}:host(.expanded) .grouped-links-wrapper{height:var(--navigation-child-items-height, auto) !important;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .link,:host(.navigation-group-side-nav) ::slotted(a){height:var(--navigation-child-items-height, auto)}:host(.collapsed) .grouped-links-wrapper{height:0;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .navigation-group{height:var(--navigation-group-height);width:var(--navigation-group-width);justify-content:var(--navigation-group-justify-content);padding-right:var(--navigation-group-expand-toggle-padding)}:host(.navigation-group-side-nav) .navigation-group:hover,:host(.navigation-group-side-nav) .navigation-group:active,:host(.navigation-group-side-nav) .selected{background-color:var(--navigation-group-hover);color:var(--navigation-group-text-hover)}:host(.navigation-group-side-nav) .navigation-group:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background:none}:host(.navigation-group-side-nav) .ic-typography-caption{position:var(--navigation-group-title-position);left:var(--navigation-group-title-position-left);white-space:nowrap}";
|
10
|
+
const icNavigationGroupCss = "/*! 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}:host(.in-side-menu){border-bottom:var(--ic-border-width) solid var(--ic-architectural-200);padding:var(--ic-space-md) 0}:host .navigation-group{height:100%;width:-moz-fit-content;width:fit-content;color:var(--ic-theme-text);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md);transition:var(--ic-easing-transition-slow);position:relative;background:none;border:none;white-space:nowrap}:host(.in-side-menu) .navigation-group{height:2.5rem;width:100%;text-align:left}:host(.in-side-menu) .navigation-group .ic-typography-label{width:11.875rem}:host(.in-side-menu) .navigation-group-side-menu{color:var(--ic-action-default);justify-content:flex-start;padding:0 var(--ic-space-md) 0 var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-collapsed,:host(.in-side-menu) .navigation-group-side-menu-expanded{color:var(--ic-action-default);justify-content:flex-start;padding-left:var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-expanded{margin-bottom:var(--ic-space-xs)}:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,:host(.in-side-menu) .navigation-group-side-menu-expanded::after{border-style:solid;border-width:0.125em 0.125em 0 0;content:\"\";display:inline-block;height:0.45em;left:0.75em;position:relative;top:-0.1em;transform:rotate(135deg);vertical-align:top;width:0.45em}:host(.in-side-menu) .navigation-group-side-menu-expanded::after{top:0.15em;transform:rotate(-45deg)}:host .navigation-group:hover,:host .navigation-group:active,:host .selected{background-color:var(--ic-architectural-20);color:var(--ic-color-primary-text);outline:none;cursor:pointer}:host(:not(.in-side-menu)) .navigation-group:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);z-index:var(--ic-z-index-navigation-item);transition:box-shadow var(--ic-easing-transition-fast)}:host(.in-side-menu) .navigation-group-side-menu:hover,:host(.in-side-menu) .navigation-group-side-menu:active,:host(.in-side-menu) .navigation-group-side-menu:focus{background-color:var(--ic-architectural-20);color:var(--ic-action-default);cursor:auto;box-shadow:none;outline:none}:host(.in-side-menu) .navigation-group-side-menu:focus{outline:var(--ic-hc-focus-outline)}:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus){background-color:var(--ic-action-dark-bg-hover);color:var(--ic-action-default);cursor:pointer}:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus){background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-default)}:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus{color:var(--ic-action-default);box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline)}:host .navigation-group-dropdown{background-color:var(--ic-architectural-20);border-bottom:var(--ic-border-default);position:absolute;left:0;right:0;padding:var(--ic-space-xs) var(--ic-space-md);box-shadow:0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);z-index:calc(var(--ic-z-index-navigation-item) - 1)}:host .navigation-group-dropdown-items-list{list-style:none;display:flex;flex-flow:column wrap;align-content:flex-start;padding-left:var(--ic-space-md);max-height:16.5rem}:host .chevron-toggle-icon-wrapper{display:flex;align-items:center}:host .chevron-toggle-icon-wrapper svg{transform:rotate(90deg);height:var(--ic-space-lg);width:var(--ic-space-lg)}:host .chevron-toggle-icon-closed svg{transform:rotate(-90deg)}:host(.expanded) .grouped-links-wrapper{height:var(--navigation-child-items-height, auto) !important;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .link,:host(.navigation-group-side-nav) ::slotted(a){height:var(--navigation-child-items-height, auto)}:host(.collapsed) .grouped-links-wrapper{height:0;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .navigation-group{height:var(--navigation-group-height);width:var(--navigation-group-width);justify-content:var(--navigation-group-justify-content);padding-right:var(--navigation-group-expand-toggle-padding)}:host(.navigation-group-side-nav) .navigation-group:hover,:host(.navigation-group-side-nav) .navigation-group:active,:host(.navigation-group-side-nav) .selected{background-color:var(--navigation-group-hover);color:var(--navigation-group-text-hover)}:host(.navigation-group-side-nav) .navigation-group:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background:none}:host(.navigation-group-side-nav) .ic-typography-caption{position:var(--navigation-group-title-position);left:var(--navigation-group-title-position-left);white-space:nowrap}";
|
11
11
|
|
12
12
|
const NavigationGroup = class {
|
13
13
|
constructor(hostRef) {
|
@@ -46,11 +46,14 @@ const NavigationGroup = class {
|
|
46
46
|
}
|
47
47
|
}
|
48
48
|
};
|
49
|
-
this.topNavResizedHandler = (
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
this.
|
49
|
+
this.topNavResizedHandler = ({ detail, }) => {
|
50
|
+
var _a;
|
51
|
+
const { size } = detail;
|
52
|
+
if (size !== this.deviceSize) {
|
53
|
+
this.deviceSize = size;
|
54
|
+
this.inTopNavSideMenu =
|
55
|
+
size <=
|
56
|
+
(((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.customMobileBreakpoint) || helpers.DEVICE_SIZES.L);
|
54
57
|
}
|
55
58
|
};
|
56
59
|
this.setGroupedNavItemTabIndex = (tabIndexValue) => {
|
@@ -223,17 +226,17 @@ const NavigationGroup = class {
|
|
223
226
|
}
|
224
227
|
componentWillLoad() {
|
225
228
|
this.deviceSize = helpers.getCurrentDeviceSize();
|
226
|
-
const
|
227
|
-
this.navigationType =
|
228
|
-
this.parentEl =
|
229
|
-
if (this.deviceSize <= helpers.DEVICE_SIZES.L && this.navigationType === "top") {
|
230
|
-
this.inTopNavSideMenu = true;
|
231
|
-
}
|
229
|
+
const { navType, parent } = helpers.getNavItemParentDetails(this.el);
|
230
|
+
this.navigationType = navType;
|
231
|
+
this.parentEl = parent;
|
232
232
|
if (this.navigationType === "side") {
|
233
233
|
this.parentEl.addEventListener("sideNavExpanded", this.sideNavExpandHandler);
|
234
234
|
}
|
235
235
|
else if (this.navigationType === "top") {
|
236
236
|
this.parentEl.addEventListener("topNavResized", this.topNavResizedHandler);
|
237
|
+
if (this.deviceSize <=
|
238
|
+
this.parentEl.customMobileBreakpoint)
|
239
|
+
this.inTopNavSideMenu = true;
|
237
240
|
}
|
238
241
|
}
|
239
242
|
componentDidLoad() {
|
@@ -1 +1 @@
|
|
1
|
-
{"file":"ic-navigation-group.entry.cjs.js","mappings":"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","names":["DEVICE_SIZES","h","getThemeForegroundColor","getCurrentDeviceSize","getNavItemParentDetails","Host","chevronIcon"],"sources":["src/components/ic-navigation-group/ic-navigation-group.css?tag=ic-navigation-group&encapsulation=shadow","src/components/ic-navigation-group/ic-navigation-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-navigation-item: z-index of navigation group item\n */\n\n:host {\n display: block;\n}\n\n:host(.in-side-menu) {\n border-bottom: var(--ic-border-width) solid var(--ic-architectural-200);\n padding: var(--ic-space-md) 0;\n}\n\n:host .navigation-group {\n height: 100%;\n width: fit-content;\n color: var(--ic-theme-text);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 var(--ic-space-md);\n transition: var(--ic-easing-transition-slow);\n position: relative;\n background: none;\n border: none;\n}\n\n:host(.in-side-menu) .navigation-group {\n height: 2.5rem;\n width: 100%;\n text-align: left;\n}\n\n:host(.in-side-menu) .navigation-group .ic-typography-label {\n width: 11.875rem;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu {\n color: var(--ic-action-default);\n justify-content: flex-start;\n padding: 0 var(--ic-space-md) 0 var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed,\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n color: var(--ic-action-default);\n justify-content: flex-start;\n padding-left: var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n margin-bottom: var(--ic-space-xs);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n border-style: solid;\n border-width: 0.125em 0.125em 0 0;\n content: \"\";\n display: inline-block;\n height: 0.45em;\n left: 0.75em;\n position: relative;\n top: -0.1em;\n transform: rotate(135deg);\n vertical-align: top;\n width: 0.45em;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n top: 0.15em;\n transform: rotate(-45deg);\n}\n\n:host .navigation-group:hover,\n:host .navigation-group:active,\n:host .selected {\n background-color: var(--ic-architectural-20);\n color: var(--ic-color-primary-text);\n outline: none;\n cursor: pointer;\n}\n\n:host(:not(.in-side-menu)) .navigation-group:focus {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n z-index: var(--ic-z-index-navigation-item);\n transition: box-shadow var(--ic-easing-transition-fast);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:hover,\n:host(.in-side-menu) .navigation-group-side-menu:active,\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n background-color: var(--ic-architectural-20);\n color: var(--ic-action-default);\n cursor: auto;\n box-shadow: none;\n outline: none;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus) {\n background-color: var(--ic-action-dark-bg-hover);\n color: var(--ic-action-default);\n cursor: pointer;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus) {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-action-default);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus {\n color: var(--ic-action-default);\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n}\n\n:host .navigation-group-dropdown {\n background-color: var(--ic-architectural-20);\n border-bottom: var(--ic-border-default);\n position: absolute;\n left: 0;\n right: 0;\n padding: var(--ic-space-xs) var(--ic-space-md);\n box-shadow: 0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);\n z-index: calc(var(--ic-z-index-navigation-item) - 1);\n}\n\n:host .navigation-group-dropdown-items-list {\n list-style: none;\n display: flex;\n flex-flow: column wrap;\n align-content: flex-start;\n padding-left: var(--ic-space-md);\n max-height: 16.5rem;\n}\n\n:host .chevron-toggle-icon-wrapper {\n display: flex;\n align-items: center;\n}\n\n:host .chevron-toggle-icon-wrapper svg {\n transform: rotate(90deg);\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host .chevron-toggle-icon-closed svg {\n transform: rotate(-90deg);\n}\n\n:host(.expanded) .grouped-links-wrapper {\n height: var(--navigation-child-items-height, auto) !important;\n transition: var(--ic-easing-transition-slow);\n overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .link,\n:host(.navigation-group-side-nav) ::slotted(a) {\n height: var(--navigation-child-items-height, auto);\n}\n\n:host(.collapsed) .grouped-links-wrapper {\n height: 0;\n transition: var(--ic-easing-transition-slow);\n overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .navigation-group {\n height: var(--navigation-group-height);\n width: var(--navigation-group-width);\n justify-content: var(--navigation-group-justify-content);\n padding-right: var(--navigation-group-expand-toggle-padding);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:hover,\n:host(.navigation-group-side-nav) .navigation-group:active,\n:host(.navigation-group-side-nav) .selected {\n background-color: var(--navigation-group-hover);\n color: var(--navigation-group-text-hover);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n background: none;\n}\n\n:host(.navigation-group-side-nav) .ic-typography-caption {\n position: var(--navigation-group-title-position);\n left: var(--navigation-group-title-position-left);\n white-space: nowrap;\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n State,\n Listen,\n h,\n Method,\n} from \"@stencil/core\";\n\nimport {\n DEVICE_SIZES,\n getCurrentDeviceSize,\n getThemeForegroundColor,\n getNavItemParentDetails,\n} from \"../../utils/helpers\";\nimport { IcNavType, IcTheme } from \"../../utils/types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n@Component({\n tag: \"ic-navigation-group\",\n styleUrl: \"ic-navigation-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class NavigationGroup {\n private allGroupedNavigationItems: HTMLIcNavigationItemElement[] = [];\n private collapsedNavItemsHeight: string;\n private dropdown: HTMLElement;\n private DYNAMIC_GROUPED_LINKS_HEIGHT_MS = 100;\n private expandedNavItemsHeight: string;\n private groupEl: HTMLElement;\n private IC_NAVIGATION_ITEM = \"ic-navigation-item\";\n private isSideNavExpanded: boolean;\n private mouseGate: boolean = false;\n private nodeName = \"IC-NAVIGATION-GROUP\";\n private GROUPED_LINKS_WRAPPER_CLASS = \".grouped-links-wrapper\";\n\n @Element() el: HTMLIcNavigationGroupElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() dropdownOpen: boolean = false;\n @State() expanded: boolean = true;\n @State() focusStyle = getThemeForegroundColor();\n @State() inTopNavSideMenu: boolean = false;\n @State() navigationType: IcNavType | \"\";\n @State() parentEl: HTMLElement;\n\n /**\n * If `true`, the group will be expandable in the side menu.\n */\n @Prop() expandable: boolean = false;\n\n /**\n * The label to display on the group.\n */\n @Prop() label: string;\n\n disconnectedCallback(): void {\n if (this.navigationType === \"side\") {\n this.parentEl.removeEventListener(\n \"sideNavExpanded\",\n this.sideNavExpandHandler\n );\n } else if (this.navigationType === \"top\") {\n this.parentEl.removeEventListener(\n \"topNavResized\",\n this.topNavResizedHandler\n );\n }\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n const navParentDetails = getNavItemParentDetails(this.el);\n this.navigationType = navParentDetails.navType;\n this.parentEl = navParentDetails.parent;\n if (this.deviceSize <= DEVICE_SIZES.L && this.navigationType === \"top\") {\n this.inTopNavSideMenu = true;\n }\n\n if (this.navigationType === \"side\") {\n this.parentEl.addEventListener(\n \"sideNavExpanded\",\n this.sideNavExpandHandler\n );\n } else if (this.navigationType === \"top\") {\n this.parentEl.addEventListener(\n \"topNavResized\",\n this.topNavResizedHandler\n );\n }\n }\n\n componentDidLoad(): void {\n this.allGroupedNavigationItems = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n\n /**\n * debounce is required as the incorrect height was retrieved instantly after\n * componentDidLoad is invoked.\n */\n setTimeout(\n () => this.setInitialGroupedLinksWrapperHeight(),\n this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n );\n }\n\n @Listen(\"childBlur\")\n childBlurHandler(): void {\n this.hideDropdown();\n }\n\n @Listen(\"navItemClicked\")\n navItemClickHandler(): void {\n this.hideDropdown();\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.focusStyle = theme.mode;\n }\n\n /**\n * Sets focus on the nav item.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.groupEl) {\n this.groupEl.focus();\n }\n }\n\n private sideNavExpandHandler = (event?: CustomEvent): void => {\n this.isSideNavExpanded = event.detail.sideNavExpanded;\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n\n if (!linkWrapper) return;\n\n if (this.isSideNavExpanded) {\n if (this.expanded && this.expandedNavItemsHeight) {\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n } else if (this.expanded) {\n setTimeout(() => {\n this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();\n\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n }, this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS);\n }\n } else {\n if (this.expanded && this.collapsedNavItemsHeight) {\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n } else if (this.expanded) {\n setTimeout(() => {\n this.collapsedNavItemsHeight = this.getNavigationChildItemsHeight();\n\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n }, this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS);\n }\n }\n };\n\n private topNavResizedHandler = (ev: CustomEvent): void => {\n const newSize = ev.detail.size;\n if (newSize !== this.deviceSize) {\n this.deviceSize = newSize;\n this.inTopNavSideMenu = newSize <= DEVICE_SIZES.L;\n }\n };\n\n private toggleDropdown() {\n this.dropdownOpen = !this.dropdownOpen;\n }\n\n private setGroupedNavItemTabIndex = (tabIndexValue: string) => {\n this.el\n .querySelectorAll(this.IC_NAVIGATION_ITEM)\n .forEach((navigationItem) => {\n const navItem =\n navigationItem.shadowRoot.querySelector(\"a\") ||\n navigationItem.querySelector(\"a\");\n if (navItem) {\n navItem.setAttribute(\"tabindex\", tabIndexValue);\n }\n });\n };\n\n private toggleGroupedLinkWrapperHeight = (\n wrapper: HTMLElement,\n expanded: boolean\n ) => {\n if (!wrapper) return;\n\n if (expanded) {\n if (this.isSideNavExpanded) {\n this.setGroupedLinksElementHeight(wrapper, this.expandedNavItemsHeight);\n } else {\n this.setGroupedLinksElementHeight(\n wrapper,\n this.collapsedNavItemsHeight\n );\n }\n this.setGroupedNavItemTabIndex(\"0\");\n } else {\n wrapper.style.setProperty(\"--navigation-child-items-height\", \"0\");\n this.setGroupedNavItemTabIndex(\"-1\");\n }\n };\n\n private toggleExpanded = () => {\n this.expanded = !this.expanded;\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n this.toggleGroupedLinkWrapperHeight(linkWrapper, this.expanded);\n };\n\n private showDropdown() {\n if (!this.dropdownOpen) {\n this.toggleDropdown();\n }\n }\n\n private hideDropdown() {\n document.removeEventListener(\"keydown\", this.handleKeydown);\n if (this.dropdownOpen) {\n this.toggleDropdown();\n }\n }\n\n private handleClick = (ev: MouseEvent) => {\n if (this.navigationType === \"top\" && ev.detail) {\n this.toggleDropdown();\n } else {\n this.toggleExpanded();\n }\n };\n\n private handleBlur = (ev: FocusEvent) => {\n const target = ev.relatedTarget as HTMLElement;\n if (!this.el.contains(target)) {\n this.hideDropdown();\n }\n };\n\n private handleTopNavKeydown = (ev: KeyboardEvent) => {\n if (ev.key === \" \" || ev.key === \"Enter\") {\n this.toggleDropdown();\n } else if (!this.inTopNavSideMenu && ev.key === \"Escape\") {\n this.hideDropdown();\n }\n };\n\n private handleKeydown = (ev: KeyboardEvent) => {\n if (ev.key === \"Enter\" || ev.key === \" \" || ev.key === \"Escape\") {\n switch (this.navigationType) {\n case \"top\":\n this.handleTopNavKeydown(ev as KeyboardEvent);\n break;\n case \"side\":\n this.toggleExpanded();\n ev.preventDefault();\n break;\n default:\n this.toggleExpanded();\n break;\n }\n }\n };\n\n private handleMouseLeave = (ev: MouseEvent) => {\n const relTarget = ev.relatedTarget as HTMLElement;\n\n this.mouseGate = false;\n\n if (\n !this.el.contains(relTarget) &&\n relTarget !== this.dropdown &&\n document.activeElement !== this.el &&\n !this.el.contains(document.activeElement) &&\n relTarget?.nodeName === this.nodeName &&\n this.dropdownOpen === true\n ) {\n this.mouseGate = true;\n this.hideDropdown();\n } else if (\n !this.el.contains(relTarget) &&\n relTarget !== this.dropdown &&\n !this.el.contains(document.activeElement)\n ) {\n this.mouseGate = false;\n setTimeout(() => {\n this.dropdownOpen ? this.hideDropdown() : null;\n }, 500);\n }\n };\n\n private handleMouseEnter = (ev: MouseEvent) => {\n const relTarget = ev.relatedTarget as HTMLElement;\n document.addEventListener(\"keydown\", this.handleKeydown);\n\n if (relTarget?.nodeName === this.nodeName && this.mouseGate === true) {\n this.showDropdown();\n } else if (\n this.dropdownOpen === false &&\n relTarget !== null &&\n this.mouseGate === false\n ) {\n this.mouseGate = true;\n setTimeout(() => {\n this.mouseGate && this.showDropdown();\n }, 500);\n }\n };\n\n private renderDropdownGroupedLinks = (): HTMLDivElement => (\n <div\n class={{\n [\"navigation-group-dropdown\"]: !this.inTopNavSideMenu,\n [\"navigation-group-dropdown-side-menu\"]: this.inTopNavSideMenu,\n [\"selected\"]: this.dropdownOpen && !this.inTopNavSideMenu,\n }}\n onMouseLeave={!this.inTopNavSideMenu ? this.handleMouseLeave : null}\n ref={(el) => (this.dropdown = el)}\n >\n <nav\n class={{\n [\"navigation-group-dropdown-items\"]: !this.inTopNavSideMenu,\n }}\n >\n <ul>\n <slot></slot>\n </ul>\n </nav>\n </div>\n );\n\n private renderGroupedLinks = (): HTMLDivElement => (\n <ul class=\"grouped-links-wrapper\">\n <slot></slot>\n </ul>\n );\n\n /**\n * Gets the total height of navigation links to improve\n * smoothness of expand/collapse animations\n */\n private getNavigationChildItemsHeight = (): string => {\n let navigationChildItemsHeight = 0;\n this.allGroupedNavigationItems.forEach((navItem) => {\n navigationChildItemsHeight += navItem.offsetHeight;\n });\n\n return `${navigationChildItemsHeight}px`;\n };\n\n private setInitialGroupedLinksWrapperHeight = () => {\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n\n if (!linkWrapper) return;\n\n if (\n !this.isSideNavExpanded &&\n !this.collapsedNavItemsHeight &&\n this.expanded\n ) {\n this.collapsedNavItemsHeight = this.getNavigationChildItemsHeight();\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n }\n\n if (this.isSideNavExpanded && this.expanded) {\n this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n }\n };\n\n private renderNavigationItems = (): HTMLDivElement | null => {\n if (this.dropdownOpen || (this.inTopNavSideMenu && !this.expandable)) {\n return this.renderDropdownGroupedLinks();\n }\n\n if (this.navigationType !== \"top\") {\n return this.renderGroupedLinks();\n }\n\n return null;\n };\n\n private setGroupedLinksElementHeight(\n groupedNavItemWrapper: HTMLElement,\n height: string\n ) {\n groupedNavItemWrapper.style.setProperty(\n \"--navigation-child-items-height\",\n height\n );\n }\n\n render() {\n const { label, dropdownOpen, inTopNavSideMenu, expandable } = this;\n\n return (\n <Host\n class={{\n [\"in-side-menu\"]: inTopNavSideMenu,\n expanded: this.expanded,\n collapsed: !this.expanded,\n [\"navigation-group-side-nav\"]: this.navigationType === \"side\",\n }}\n role=\"listitem\"\n >\n <button\n onMouseEnter={\n !inTopNavSideMenu &&\n this.navigationType === \"top\" &&\n this.handleMouseEnter\n }\n onMouseLeave={this.navigationType === \"top\" && this.handleMouseLeave}\n tabindex={inTopNavSideMenu && !expandable ? \"-1\" : \"0\"}\n onBlur={this.handleBlur}\n onClick={expandable ? this.handleClick : null}\n onKeyDown={this.handleKeydown}\n class={{\n [\"navigation-group\"]: true,\n [this.focusStyle]: !inTopNavSideMenu,\n [\"navigation-group-side-menu\"]: inTopNavSideMenu && !expandable,\n [\"navigation-group-side-menu-collapsed\"]:\n inTopNavSideMenu && expandable && !dropdownOpen,\n [\"navigation-group-side-menu-expanded\"]:\n inTopNavSideMenu && expandable && dropdownOpen,\n [\"selected\"]: dropdownOpen && !inTopNavSideMenu,\n }}\n ref={(el) => (this.groupEl = el)}\n aria-expanded={`${dropdownOpen || this.expanded}`}\n aria-haspopup={`${\n !inTopNavSideMenu && this.navigationType === \"top\"\n }`}\n >\n <ic-typography\n variant={this.navigationType === \"side\" ? \"caption\" : \"label\"}\n >\n {label}\n </ic-typography>\n {this.navigationType === \"side\" && expandable && (\n <div\n class={{\n \"chevron-toggle-icon-wrapper\": true,\n \"chevron-toggle-icon-closed\": this.expanded,\n }}\n innerHTML={chevronIcon}\n ></div>\n )}\n </button>\n {this.renderNavigationItems()}\n </Host>\n );\n }\n}\n"],"version":3}
|
1
|
+
{"file":"ic-navigation-group.entry.cjs.js","mappings":"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","names":["DEVICE_SIZES","h","getThemeForegroundColor","getCurrentDeviceSize","getNavItemParentDetails","Host","chevronIcon"],"sources":["src/components/ic-navigation-group/ic-navigation-group.css?tag=ic-navigation-group&encapsulation=shadow","src/components/ic-navigation-group/ic-navigation-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-navigation-item: z-index of navigation group item\n */\n\n:host {\n display: block;\n}\n\n:host(.in-side-menu) {\n border-bottom: var(--ic-border-width) solid var(--ic-architectural-200);\n padding: var(--ic-space-md) 0;\n}\n\n:host .navigation-group {\n height: 100%;\n width: fit-content;\n color: var(--ic-theme-text);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 var(--ic-space-md);\n transition: var(--ic-easing-transition-slow);\n position: relative;\n background: none;\n border: none;\n white-space: nowrap;\n}\n\n:host(.in-side-menu) .navigation-group {\n height: 2.5rem;\n width: 100%;\n text-align: left;\n}\n\n:host(.in-side-menu) .navigation-group .ic-typography-label {\n width: 11.875rem;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu {\n color: var(--ic-action-default);\n justify-content: flex-start;\n padding: 0 var(--ic-space-md) 0 var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed,\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n color: var(--ic-action-default);\n justify-content: flex-start;\n padding-left: var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n margin-bottom: var(--ic-space-xs);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n border-style: solid;\n border-width: 0.125em 0.125em 0 0;\n content: \"\";\n display: inline-block;\n height: 0.45em;\n left: 0.75em;\n position: relative;\n top: -0.1em;\n transform: rotate(135deg);\n vertical-align: top;\n width: 0.45em;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n top: 0.15em;\n transform: rotate(-45deg);\n}\n\n:host .navigation-group:hover,\n:host .navigation-group:active,\n:host .selected {\n background-color: var(--ic-architectural-20);\n color: var(--ic-color-primary-text);\n outline: none;\n cursor: pointer;\n}\n\n:host(:not(.in-side-menu)) .navigation-group:focus {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n z-index: var(--ic-z-index-navigation-item);\n transition: box-shadow var(--ic-easing-transition-fast);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:hover,\n:host(.in-side-menu) .navigation-group-side-menu:active,\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n background-color: var(--ic-architectural-20);\n color: var(--ic-action-default);\n cursor: auto;\n box-shadow: none;\n outline: none;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus) {\n background-color: var(--ic-action-dark-bg-hover);\n color: var(--ic-action-default);\n cursor: pointer;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus) {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-action-default);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus {\n color: var(--ic-action-default);\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n}\n\n:host .navigation-group-dropdown {\n background-color: var(--ic-architectural-20);\n border-bottom: var(--ic-border-default);\n position: absolute;\n left: 0;\n right: 0;\n padding: var(--ic-space-xs) var(--ic-space-md);\n box-shadow: 0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);\n z-index: calc(var(--ic-z-index-navigation-item) - 1);\n}\n\n:host .navigation-group-dropdown-items-list {\n list-style: none;\n display: flex;\n flex-flow: column wrap;\n align-content: flex-start;\n padding-left: var(--ic-space-md);\n max-height: 16.5rem;\n}\n\n:host .chevron-toggle-icon-wrapper {\n display: flex;\n align-items: center;\n}\n\n:host .chevron-toggle-icon-wrapper svg {\n transform: rotate(90deg);\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host .chevron-toggle-icon-closed svg {\n transform: rotate(-90deg);\n}\n\n:host(.expanded) .grouped-links-wrapper {\n height: var(--navigation-child-items-height, auto) !important;\n transition: var(--ic-easing-transition-slow);\n overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .link,\n:host(.navigation-group-side-nav) ::slotted(a) {\n height: var(--navigation-child-items-height, auto);\n}\n\n:host(.collapsed) .grouped-links-wrapper {\n height: 0;\n transition: var(--ic-easing-transition-slow);\n overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .navigation-group {\n height: var(--navigation-group-height);\n width: var(--navigation-group-width);\n justify-content: var(--navigation-group-justify-content);\n padding-right: var(--navigation-group-expand-toggle-padding);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:hover,\n:host(.navigation-group-side-nav) .navigation-group:active,\n:host(.navigation-group-side-nav) .selected {\n background-color: var(--navigation-group-hover);\n color: var(--navigation-group-text-hover);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n background: none;\n}\n\n:host(.navigation-group-side-nav) .ic-typography-caption {\n position: var(--navigation-group-title-position);\n left: var(--navigation-group-title-position-left);\n white-space: nowrap;\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n State,\n Listen,\n h,\n Method,\n} from \"@stencil/core\";\n\nimport {\n DEVICE_SIZES,\n getCurrentDeviceSize,\n getThemeForegroundColor,\n getNavItemParentDetails,\n} from \"../../utils/helpers\";\nimport { IcNavType, IcTheme } from \"../../utils/types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n@Component({\n tag: \"ic-navigation-group\",\n styleUrl: \"ic-navigation-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class NavigationGroup {\n private allGroupedNavigationItems: HTMLIcNavigationItemElement[] = [];\n private collapsedNavItemsHeight: string;\n private dropdown: HTMLElement;\n private DYNAMIC_GROUPED_LINKS_HEIGHT_MS = 100;\n private expandedNavItemsHeight: string;\n private groupEl: HTMLElement;\n private IC_NAVIGATION_ITEM = \"ic-navigation-item\";\n private isSideNavExpanded: boolean;\n private mouseGate: boolean = false;\n private nodeName = \"IC-NAVIGATION-GROUP\";\n private GROUPED_LINKS_WRAPPER_CLASS = \".grouped-links-wrapper\";\n\n @Element() el: HTMLIcNavigationGroupElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() dropdownOpen: boolean = false;\n @State() expanded: boolean = true;\n @State() focusStyle = getThemeForegroundColor();\n @State() inTopNavSideMenu: boolean = false;\n @State() navigationType: IcNavType | \"\";\n @State() parentEl: HTMLElement;\n\n /**\n * If `true`, the group will be expandable in the side menu.\n */\n @Prop() expandable: boolean = false;\n\n /**\n * The label to display on the group.\n */\n @Prop() label: string;\n\n disconnectedCallback(): void {\n if (this.navigationType === \"side\") {\n this.parentEl.removeEventListener(\n \"sideNavExpanded\",\n this.sideNavExpandHandler\n );\n } else if (this.navigationType === \"top\") {\n this.parentEl.removeEventListener(\n \"topNavResized\",\n this.topNavResizedHandler\n );\n }\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n const { navType, parent } = getNavItemParentDetails(this.el);\n this.navigationType = navType;\n this.parentEl = parent;\n\n if (this.navigationType === \"side\") {\n this.parentEl.addEventListener(\n \"sideNavExpanded\",\n this.sideNavExpandHandler\n );\n } else if (this.navigationType === \"top\") {\n this.parentEl.addEventListener(\n \"topNavResized\",\n this.topNavResizedHandler\n );\n if (\n this.deviceSize <=\n (this.parentEl as HTMLIcTopNavigationElement).customMobileBreakpoint\n )\n this.inTopNavSideMenu = true;\n }\n }\n\n componentDidLoad(): void {\n this.allGroupedNavigationItems = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n\n /**\n * debounce is required as the incorrect height was retrieved instantly after\n * componentDidLoad is invoked.\n */\n setTimeout(\n () => this.setInitialGroupedLinksWrapperHeight(),\n this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n );\n }\n\n @Listen(\"childBlur\")\n childBlurHandler(): void {\n this.hideDropdown();\n }\n\n @Listen(\"navItemClicked\")\n navItemClickHandler(): void {\n this.hideDropdown();\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.focusStyle = theme.mode;\n }\n\n /**\n * Sets focus on the nav item.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.groupEl) {\n this.groupEl.focus();\n }\n }\n\n private sideNavExpandHandler = (event?: CustomEvent): void => {\n this.isSideNavExpanded = event.detail.sideNavExpanded;\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n\n if (!linkWrapper) return;\n\n if (this.isSideNavExpanded) {\n if (this.expanded && this.expandedNavItemsHeight) {\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n } else if (this.expanded) {\n setTimeout(() => {\n this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();\n\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n }, this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS);\n }\n } else {\n if (this.expanded && this.collapsedNavItemsHeight) {\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n } else if (this.expanded) {\n setTimeout(() => {\n this.collapsedNavItemsHeight = this.getNavigationChildItemsHeight();\n\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n }, this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS);\n }\n }\n };\n\n private topNavResizedHandler = ({\n detail,\n }: CustomEvent<{ size: number }>): void => {\n const { size } = detail;\n if (size !== this.deviceSize) {\n this.deviceSize = size;\n this.inTopNavSideMenu =\n size <=\n ((this.parentEl as HTMLIcTopNavigationElement)\n ?.customMobileBreakpoint || DEVICE_SIZES.L);\n }\n };\n\n private toggleDropdown() {\n this.dropdownOpen = !this.dropdownOpen;\n }\n\n private setGroupedNavItemTabIndex = (tabIndexValue: string) => {\n this.el\n .querySelectorAll(this.IC_NAVIGATION_ITEM)\n .forEach((navigationItem) => {\n const navItem =\n navigationItem.shadowRoot.querySelector(\"a\") ||\n navigationItem.querySelector(\"a\");\n if (navItem) {\n navItem.setAttribute(\"tabindex\", tabIndexValue);\n }\n });\n };\n\n private toggleGroupedLinkWrapperHeight = (\n wrapper: HTMLElement,\n expanded: boolean\n ) => {\n if (!wrapper) return;\n\n if (expanded) {\n if (this.isSideNavExpanded) {\n this.setGroupedLinksElementHeight(wrapper, this.expandedNavItemsHeight);\n } else {\n this.setGroupedLinksElementHeight(\n wrapper,\n this.collapsedNavItemsHeight\n );\n }\n this.setGroupedNavItemTabIndex(\"0\");\n } else {\n wrapper.style.setProperty(\"--navigation-child-items-height\", \"0\");\n this.setGroupedNavItemTabIndex(\"-1\");\n }\n };\n\n private toggleExpanded = () => {\n this.expanded = !this.expanded;\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n this.toggleGroupedLinkWrapperHeight(linkWrapper, this.expanded);\n };\n\n private showDropdown() {\n if (!this.dropdownOpen) {\n this.toggleDropdown();\n }\n }\n\n private hideDropdown() {\n document.removeEventListener(\"keydown\", this.handleKeydown);\n if (this.dropdownOpen) {\n this.toggleDropdown();\n }\n }\n\n private handleClick = (ev: MouseEvent) => {\n if (this.navigationType === \"top\" && ev.detail) {\n this.toggleDropdown();\n } else {\n this.toggleExpanded();\n }\n };\n\n private handleBlur = (ev: FocusEvent) => {\n const target = ev.relatedTarget as HTMLElement;\n if (!this.el.contains(target)) {\n this.hideDropdown();\n }\n };\n\n private handleTopNavKeydown = (ev: KeyboardEvent) => {\n if (ev.key === \" \" || ev.key === \"Enter\") {\n this.toggleDropdown();\n } else if (!this.inTopNavSideMenu && ev.key === \"Escape\") {\n this.hideDropdown();\n }\n };\n\n private handleKeydown = (ev: KeyboardEvent) => {\n if (ev.key === \"Enter\" || ev.key === \" \" || ev.key === \"Escape\") {\n switch (this.navigationType) {\n case \"top\":\n this.handleTopNavKeydown(ev as KeyboardEvent);\n break;\n case \"side\":\n this.toggleExpanded();\n ev.preventDefault();\n break;\n default:\n this.toggleExpanded();\n break;\n }\n }\n };\n\n private handleMouseLeave = (ev: MouseEvent) => {\n const relTarget = ev.relatedTarget as HTMLElement;\n\n this.mouseGate = false;\n\n if (\n !this.el.contains(relTarget) &&\n relTarget !== this.dropdown &&\n document.activeElement !== this.el &&\n !this.el.contains(document.activeElement) &&\n relTarget?.nodeName === this.nodeName &&\n this.dropdownOpen === true\n ) {\n this.mouseGate = true;\n this.hideDropdown();\n } else if (\n !this.el.contains(relTarget) &&\n relTarget !== this.dropdown &&\n !this.el.contains(document.activeElement)\n ) {\n this.mouseGate = false;\n setTimeout(() => {\n this.dropdownOpen ? this.hideDropdown() : null;\n }, 500);\n }\n };\n\n private handleMouseEnter = (ev: MouseEvent) => {\n const relTarget = ev.relatedTarget as HTMLElement;\n document.addEventListener(\"keydown\", this.handleKeydown);\n\n if (relTarget?.nodeName === this.nodeName && this.mouseGate === true) {\n this.showDropdown();\n } else if (\n this.dropdownOpen === false &&\n relTarget !== null &&\n this.mouseGate === false\n ) {\n this.mouseGate = true;\n setTimeout(() => {\n this.mouseGate && this.showDropdown();\n }, 500);\n }\n };\n\n private renderDropdownGroupedLinks = (): HTMLDivElement => (\n <div\n class={{\n [\"navigation-group-dropdown\"]: !this.inTopNavSideMenu,\n [\"navigation-group-dropdown-side-menu\"]: this.inTopNavSideMenu,\n [\"selected\"]: this.dropdownOpen && !this.inTopNavSideMenu,\n }}\n onMouseLeave={!this.inTopNavSideMenu ? this.handleMouseLeave : null}\n ref={(el) => (this.dropdown = el)}\n >\n <nav\n class={{\n [\"navigation-group-dropdown-items\"]: !this.inTopNavSideMenu,\n }}\n >\n <ul>\n <slot></slot>\n </ul>\n </nav>\n </div>\n );\n\n private renderGroupedLinks = (): HTMLDivElement => (\n <ul class=\"grouped-links-wrapper\">\n <slot></slot>\n </ul>\n );\n\n /**\n * Gets the total height of navigation links to improve\n * smoothness of expand/collapse animations\n */\n private getNavigationChildItemsHeight = (): string => {\n let navigationChildItemsHeight = 0;\n this.allGroupedNavigationItems.forEach((navItem) => {\n navigationChildItemsHeight += navItem.offsetHeight;\n });\n\n return `${navigationChildItemsHeight}px`;\n };\n\n private setInitialGroupedLinksWrapperHeight = () => {\n const linkWrapper = this.el.shadowRoot.querySelector(\n this.GROUPED_LINKS_WRAPPER_CLASS\n ) as HTMLElement;\n\n if (!linkWrapper) return;\n\n if (\n !this.isSideNavExpanded &&\n !this.collapsedNavItemsHeight &&\n this.expanded\n ) {\n this.collapsedNavItemsHeight = this.getNavigationChildItemsHeight();\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.collapsedNavItemsHeight\n );\n }\n\n if (this.isSideNavExpanded && this.expanded) {\n this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();\n this.setGroupedLinksElementHeight(\n linkWrapper,\n this.expandedNavItemsHeight\n );\n }\n };\n\n private renderNavigationItems = (): HTMLDivElement | null => {\n if (this.dropdownOpen || (this.inTopNavSideMenu && !this.expandable)) {\n return this.renderDropdownGroupedLinks();\n }\n\n if (this.navigationType !== \"top\") {\n return this.renderGroupedLinks();\n }\n\n return null;\n };\n\n private setGroupedLinksElementHeight(\n groupedNavItemWrapper: HTMLElement,\n height: string\n ) {\n groupedNavItemWrapper.style.setProperty(\n \"--navigation-child-items-height\",\n height\n );\n }\n\n render() {\n const { label, dropdownOpen, inTopNavSideMenu, expandable } = this;\n\n return (\n <Host\n class={{\n [\"in-side-menu\"]: inTopNavSideMenu,\n expanded: this.expanded,\n collapsed: !this.expanded,\n [\"navigation-group-side-nav\"]: this.navigationType === \"side\",\n }}\n role=\"listitem\"\n >\n <button\n onMouseEnter={\n !inTopNavSideMenu &&\n this.navigationType === \"top\" &&\n this.handleMouseEnter\n }\n onMouseLeave={this.navigationType === \"top\" && this.handleMouseLeave}\n tabindex={inTopNavSideMenu && !expandable ? \"-1\" : \"0\"}\n onBlur={this.handleBlur}\n onClick={expandable ? this.handleClick : null}\n onKeyDown={this.handleKeydown}\n class={{\n [\"navigation-group\"]: true,\n [this.focusStyle]: !inTopNavSideMenu,\n [\"navigation-group-side-menu\"]: inTopNavSideMenu && !expandable,\n [\"navigation-group-side-menu-collapsed\"]:\n inTopNavSideMenu && expandable && !dropdownOpen,\n [\"navigation-group-side-menu-expanded\"]:\n inTopNavSideMenu && expandable && dropdownOpen,\n [\"selected\"]: dropdownOpen && !inTopNavSideMenu,\n }}\n ref={(el) => (this.groupEl = el)}\n aria-expanded={`${dropdownOpen || this.expanded}`}\n aria-haspopup={`${\n !inTopNavSideMenu && this.navigationType === \"top\"\n }`}\n >\n <ic-typography\n variant={this.navigationType === \"side\" ? \"caption\" : \"label\"}\n >\n {label}\n </ic-typography>\n {this.navigationType === \"side\" && expandable && (\n <div\n class={{\n \"chevron-toggle-icon-wrapper\": true,\n \"chevron-toggle-icon-closed\": this.expanded,\n }}\n innerHTML={chevronIcon}\n ></div>\n )}\n </button>\n {this.renderNavigationItems()}\n </Host>\n );\n }\n}\n"],"version":3}
|
@@ -25,26 +25,26 @@ const NavigationItem = class {
|
|
25
25
|
}
|
26
26
|
return (index.h("div", { tabindex: "0", class: "link", ref: (el) => (this.itemEl = el) }, IconComponent, index.h("ic-typography", { variant: variant }, label), ChevronIconComponent));
|
27
27
|
};
|
28
|
-
this.topNavResizedHandler = (
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
this.
|
28
|
+
this.topNavResizedHandler = ({ detail, }) => {
|
29
|
+
var _a;
|
30
|
+
const { size } = detail;
|
31
|
+
if (size !== this.deviceSize) {
|
32
|
+
this.deviceSize = size;
|
33
|
+
this.inTopNavSideMenu =
|
34
|
+
size <=
|
35
|
+
(((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.customMobileBreakpoint) || helpers.DEVICE_SIZES.L);
|
33
36
|
}
|
34
37
|
};
|
35
|
-
this.sideNavExpandHandler = (
|
36
|
-
const { sideNavExpanded, sideNavMobile } =
|
38
|
+
this.sideNavExpandHandler = ({ detail, }) => {
|
39
|
+
const { sideNavExpanded, sideNavMobile } = detail;
|
37
40
|
this.sideNavExpanded = sideNavExpanded;
|
38
41
|
this.isSideNavMobile = sideNavMobile;
|
39
42
|
};
|
40
|
-
this.handleBlur = (
|
41
|
-
if (
|
42
|
-
|
43
|
-
|
44
|
-
return;
|
45
|
-
}
|
43
|
+
this.handleBlur = ({ relatedTarget }) => {
|
44
|
+
if (relatedTarget === null ||
|
45
|
+
relatedTarget.tagName !== "IC-NAVIGATION-ITEM") {
|
46
|
+
this.childBlur.emit();
|
46
47
|
}
|
47
|
-
this.childBlur.emit();
|
48
48
|
};
|
49
49
|
this.handleClick = () => {
|
50
50
|
this.navItemClicked.emit();
|
@@ -99,22 +99,20 @@ const NavigationItem = class {
|
|
99
99
|
}
|
100
100
|
}
|
101
101
|
componentWillLoad() {
|
102
|
-
const
|
103
|
-
this.navigationType =
|
104
|
-
this.parentEl =
|
102
|
+
const { navType, parent } = helpers.getNavItemParentDetails(this.el);
|
103
|
+
this.navigationType = navType;
|
104
|
+
this.parentEl = parent;
|
105
|
+
this.deviceSize = helpers.getCurrentDeviceSize();
|
105
106
|
if (this.navigationType === "side") {
|
106
107
|
this.parentEl.addEventListener("sideNavExpanded", this.sideNavExpandHandler);
|
107
108
|
}
|
108
109
|
else if (this.navigationType === "top") {
|
109
110
|
this.parentEl.addEventListener("topNavResized", this.topNavResizedHandler);
|
110
|
-
|
111
|
-
|
112
|
-
this.
|
113
|
-
|
114
|
-
|
115
|
-
this.deviceSize = helpers.getCurrentDeviceSize();
|
116
|
-
if (this.deviceSize <= helpers.DEVICE_SIZES.L && this.navigationType === "top") {
|
117
|
-
this.inTopNavSideMenu = true;
|
111
|
+
if (this.el.parentElement.tagName === "IC-NAVIGATION-GROUP")
|
112
|
+
this.isTopNavChild = true;
|
113
|
+
if (this.deviceSize <=
|
114
|
+
this.parentEl.customMobileBreakpoint)
|
115
|
+
this.inTopNavSideMenu = true;
|
118
116
|
}
|
119
117
|
this.navigationSlot = this.el.querySelector('[slot="navigation-item"]');
|
120
118
|
if (this.navigationSlot) {
|
@@ -124,17 +122,15 @@ const NavigationItem = class {
|
|
124
122
|
componentDidUpdate() {
|
125
123
|
this.isInitialRender = false;
|
126
124
|
}
|
127
|
-
themeChangeHandler(
|
128
|
-
|
129
|
-
this.focusStyle = theme.mode;
|
125
|
+
themeChangeHandler({ detail }) {
|
126
|
+
this.focusStyle = detail.mode;
|
130
127
|
}
|
131
128
|
/**
|
132
129
|
* Sets focus on the nav item.
|
133
130
|
*/
|
134
131
|
async setFocus() {
|
135
|
-
|
136
|
-
|
137
|
-
}
|
132
|
+
var _a;
|
133
|
+
(_a = this.itemEl) === null || _a === void 0 ? void 0 : _a.focus();
|
138
134
|
}
|
139
135
|
render() {
|
140
136
|
const { inTopNavSideMenu, isTopNavChild, selected } = this;
|