@ukic/web-components 2.1.0-beta.10 → 2.1.0-beta.11
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/chevron-icon-2bb3a907.js +10 -0
- package/dist/cjs/chevron-icon-2bb3a907.js.map +1 -0
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/{helpers-6eb26e7a.js → helpers-2021e212.js} +3 -2
- package/dist/cjs/helpers-2021e212.js.map +1 -0
- package/dist/cjs/ic-alert.cjs.entry.js +1 -1
- package/dist/cjs/ic-back-to-top.cjs.entry.js +1 -1
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-breadcrumb.cjs.entry.js +4 -4
- package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-button_3.cjs.entry.js +9 -4
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card.cjs.entry.js +4 -4
- package/dist/cjs/ic-card.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/ic-chip.cjs.entry.js +1 -1
- package/dist/cjs/ic-data-row.cjs.entry.js +1 -1
- package/dist/cjs/ic-divider.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer-link-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer-link.cjs.entry.js +2 -2
- package/dist/cjs/ic-footer-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer.cjs.entry.js +1 -1
- package/dist/cjs/ic-hero.cjs.entry.js +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +9 -3
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +11 -7
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-label_2.cjs.entry.js +1 -1
- package/dist/cjs/ic-link.cjs.entry.js +3 -3
- package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js +24 -0
- package/dist/cjs/ic-menu-group.cjs.entry.js.map +1 -0
- package/dist/cjs/ic-menu-item.cjs.entry.js +120 -0
- package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -0
- package/dist/cjs/ic-navigation-button.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +3 -3
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +3 -3
- package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-menu.cjs.entry.js +1 -1
- package/dist/cjs/ic-page-header.cjs.entry.js +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +236 -0
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -0
- package/dist/cjs/ic-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-radio-option.cjs.entry.js +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +4 -2
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-select.cjs.entry.js +15 -13
- package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +4 -4
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-status-tag.cjs.entry.js +1 -1
- package/dist/cjs/ic-stepper.cjs.entry.js +1 -1
- package/dist/cjs/ic-switch.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js +1 -1
- package/dist/cjs/ic-theme.cjs.entry.js +1 -1
- package/dist/cjs/ic-toast.cjs.entry.js +2 -2
- package/dist/cjs/ic-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +1 -1
- package/dist/cjs/index-f79a4e53.js +12 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +3 -0
- package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.css +19 -4
- package/dist/collection/components/ic-button/ic-button.js +2 -1
- package/dist/collection/components/ic-button/ic-button.js.map +1 -1
- package/dist/collection/components/ic-card/ic-card.css +16 -2
- package/dist/collection/components/ic-footer-link/ic-footer-link.css +16 -3
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js +8 -2
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js.map +1 -1
- package/dist/collection/components/ic-link/ic-link.css +16 -3
- package/dist/collection/components/ic-link/ic-link.js +6 -3
- package/dist/collection/components/ic-link/ic-link.js.map +1 -1
- package/dist/collection/components/ic-menu/ic-menu.js +10 -6
- package/dist/collection/components/ic-menu/ic-menu.js.map +1 -1
- package/dist/collection/components/ic-menu-group/ic-menu-group.css +465 -0
- package/dist/collection/components/ic-menu-group/ic-menu-group.js +45 -0
- package/dist/collection/components/ic-menu-group/ic-menu-group.js.map +1 -0
- package/dist/collection/components/ic-menu-item/ic-menu-item.css +633 -0
- package/dist/collection/components/ic-menu-item/ic-menu-item.js +392 -0
- package/dist/collection/components/ic-menu-item/ic-menu-item.js.map +1 -0
- package/dist/collection/components/ic-menu-item/ic-menu-item.types.js +2 -0
- package/dist/collection/components/ic-menu-item/ic-menu-item.types.js.map +1 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.css +535 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +432 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.test.a11y.js +13 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.test.a11y.js.map +1 -0
- package/dist/collection/components/ic-search-bar/ic-search-bar.js +3 -1
- package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
- package/dist/collection/components/ic-select/ic-select.css +13 -13
- package/dist/collection/components/ic-select/ic-select.js +18 -13
- package/dist/collection/components/ic-select/ic-select.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation-test-examples.js +90 -0
- package/dist/collection/components/ic-side-navigation/ic-side-navigation-test-examples.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
- package/dist/collection/components/ic-toast/ic-toast.css +5 -0
- package/dist/collection/components/ic-tooltip/ic-tooltip.js +6 -2
- package/dist/collection/components/ic-tooltip/ic-tooltip.js.map +1 -1
- package/dist/collection/utils/helpers.js +1 -1
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/components/helpers.js +2 -2
- package/dist/components/helpers.js.map +1 -1
- package/dist/components/ic-breadcrumb2.js +1 -1
- package/dist/components/ic-breadcrumb2.js.map +1 -1
- package/dist/components/ic-button2.js +2 -1
- package/dist/components/ic-button2.js.map +1 -1
- package/dist/components/ic-card.js +1 -1
- package/dist/components/ic-card.js.map +1 -1
- package/dist/components/ic-footer-link.js +1 -1
- package/dist/components/ic-footer-link.js.map +1 -1
- package/dist/components/ic-horizontal-scroll2.js +9 -3
- package/dist/components/ic-horizontal-scroll2.js.map +1 -1
- package/dist/components/ic-link2.js +2 -2
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-menu-group.d.ts +11 -0
- package/dist/components/ic-menu-group.js +46 -0
- package/dist/components/ic-menu-group.js.map +1 -0
- package/dist/components/ic-menu-item.d.ts +11 -0
- package/dist/components/ic-menu-item.js +8 -0
- package/dist/components/ic-menu-item.js.map +1 -0
- package/dist/components/ic-menu-item2.js +167 -0
- package/dist/components/ic-menu-item2.js.map +1 -0
- package/dist/components/ic-menu2.js +11 -8
- package/dist/components/ic-menu2.js.map +1 -1
- package/dist/components/ic-navigation-menu2.js +1 -1
- package/dist/components/ic-popover-menu.d.ts +11 -0
- package/dist/components/ic-popover-menu.js +290 -0
- package/dist/components/ic-popover-menu.js.map +1 -0
- package/dist/components/ic-radio-option.js +1 -1
- package/dist/components/ic-search-bar.js +4 -2
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-select.js +15 -13
- package/dist/components/ic-select.js.map +1 -1
- package/dist/components/ic-side-navigation.js +2 -2
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-stepper.js +1 -1
- package/dist/components/ic-text-field2.js +1 -1
- package/dist/components/ic-theme.js +1 -1
- package/dist/components/ic-toast.js +2 -2
- package/dist/components/ic-toast.js.map +1 -1
- package/dist/components/ic-tooltip2.js +6 -2
- package/dist/components/ic-tooltip2.js.map +1 -1
- package/dist/components/ic-top-navigation.js +1 -1
- package/dist/components/index.d.ts +3 -0
- package/dist/components/index.js +3 -0
- package/dist/components/index.js.map +1 -1
- package/dist/core/core.css +2 -2
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-18bf3cb0.entry.js → p-037dfe9d.entry.js} +2 -2
- package/dist/core/{p-d86b0d0e.entry.js → p-05c5c6c4.entry.js} +2 -2
- package/dist/core/{p-24240e11.js → p-06321d19.js} +2 -2
- package/dist/core/{p-284970bc.entry.js → p-0a463a65.entry.js} +2 -2
- package/dist/core/{p-7a0bf893.entry.js → p-0faf328a.entry.js} +2 -2
- package/dist/core/{p-5b083ce5.entry.js → p-102281fd.entry.js} +2 -2
- package/dist/core/{p-18ae4b6d.entry.js → p-1549adc1.entry.js} +2 -2
- package/dist/core/{p-3dda76db.entry.js → p-25b208ae.entry.js} +2 -2
- package/dist/core/{p-ba8d6c23.entry.js → p-26c9e522.entry.js} +2 -2
- package/dist/core/{p-41e239cb.entry.js → p-33a0aabe.entry.js} +2 -2
- package/dist/core/p-3d84a743.entry.js +2 -0
- package/dist/core/p-3d84a743.entry.js.map +1 -0
- package/dist/core/{p-1724000c.js → p-3dea2867.js} +2 -2
- package/dist/core/p-3dea2867.js.map +1 -0
- package/dist/core/{p-a667e329.entry.js → p-3fd4f8eb.entry.js} +2 -2
- package/dist/core/{p-a10da430.entry.js → p-48a5c2a7.entry.js} +2 -2
- package/dist/core/p-48a5c2a7.entry.js.map +1 -0
- package/dist/core/p-4d8392fe.entry.js +2 -0
- package/dist/core/p-4d8392fe.entry.js.map +1 -0
- package/dist/core/p-4ee03271.entry.js +2 -0
- package/dist/core/p-4ee03271.entry.js.map +1 -0
- package/dist/core/p-58ff516f.entry.js +2 -0
- package/dist/core/p-58ff516f.entry.js.map +1 -0
- package/dist/core/{p-7818d958.entry.js → p-73fddc63.entry.js} +2 -2
- package/dist/core/p-73fddc63.entry.js.map +1 -0
- package/dist/core/{p-7a9bc7f2.entry.js → p-741b4ea3.entry.js} +2 -2
- package/dist/core/{p-cccbf2bf.entry.js → p-7dcb9104.entry.js} +2 -2
- package/dist/core/p-81652a98.entry.js +2 -0
- package/dist/core/p-81652a98.entry.js.map +1 -0
- package/dist/core/p-87c7ba3b.entry.js +2 -0
- package/dist/core/p-87c7ba3b.entry.js.map +1 -0
- package/dist/core/{p-c4a7c734.entry.js → p-8c9cc4d5.entry.js} +2 -2
- package/dist/core/{p-c7b86643.entry.js → p-a2c7dc6c.entry.js} +2 -2
- package/dist/core/p-a3742d40.entry.js +2 -0
- package/dist/core/p-a3742d40.entry.js.map +1 -0
- package/dist/core/p-a44a0500.entry.js +2 -0
- package/dist/core/p-a44a0500.entry.js.map +1 -0
- package/dist/core/p-a8e969ea.entry.js +2 -0
- package/dist/core/p-a8e969ea.entry.js.map +1 -0
- package/dist/core/{p-c72e4b75.entry.js → p-ac6ecdb6.entry.js} +2 -2
- package/dist/core/{p-eba373bf.entry.js → p-acb08809.entry.js} +2 -2
- package/dist/core/p-affb42c7.entry.js +2 -0
- package/dist/core/p-affb42c7.entry.js.map +1 -0
- package/dist/core/{p-b35ae170.entry.js → p-b7fc1f35.entry.js} +2 -2
- package/dist/core/{p-bd819f68.entry.js → p-b8b960a5.entry.js} +2 -2
- package/dist/core/{p-91a8db51.entry.js → p-b921bb19.entry.js} +2 -2
- package/dist/core/{p-c7c5d2c5.entry.js → p-c996810e.entry.js} +2 -2
- package/dist/core/{p-6a397882.entry.js → p-cc62d065.entry.js} +2 -2
- package/dist/core/p-cc62d065.entry.js.map +1 -0
- package/dist/core/{p-b40bd77c.entry.js → p-d28d7f24.entry.js} +2 -2
- package/dist/core/{p-35a03442.entry.js → p-dbfdfa8a.entry.js} +2 -2
- package/dist/core/{p-691ea0f2.entry.js → p-dd71a986.entry.js} +2 -2
- package/dist/core/{p-e0d88c31.entry.js → p-e4547265.entry.js} +2 -2
- package/dist/core/{p-c8f07be6.entry.js → p-ea0c4aca.entry.js} +2 -2
- package/dist/core/{p-521be4e2.entry.js → p-f6ddd32f.entry.js} +2 -2
- package/dist/core/p-f6ddd32f.entry.js.map +1 -0
- package/dist/core/{p-b4234318.entry.js → p-f777679c.entry.js} +2 -2
- package/dist/esm/chevron-icon-7927f709.js +8 -0
- package/dist/esm/chevron-icon-7927f709.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-c332acf8.js → helpers-b2b47a7d.js} +3 -3
- package/dist/esm/helpers-b2b47a7d.js.map +1 -0
- package/dist/esm/ic-alert.entry.js +1 -1
- package/dist/esm/ic-back-to-top.entry.js +1 -1
- package/dist/esm/ic-breadcrumb-group.entry.js +1 -1
- package/dist/esm/ic-breadcrumb.entry.js +4 -4
- package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
- package/dist/esm/ic-button_3.entry.js +9 -4
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card.entry.js +4 -4
- package/dist/esm/ic-card.entry.js.map +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-divider.entry.js +1 -1
- package/dist/esm/ic-footer-link-group.entry.js +1 -1
- package/dist/esm/ic-footer-link.entry.js +2 -2
- package/dist/esm/ic-footer-link.entry.js.map +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 +9 -3
- package/dist/esm/ic-horizontal-scroll.entry.js.map +1 -1
- package/dist/esm/ic-input-component-container_3.entry.js +11 -7
- package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
- package/dist/esm/ic-input-label_2.entry.js +1 -1
- package/dist/esm/ic-link.entry.js +3 -3
- package/dist/esm/ic-link.entry.js.map +1 -1
- package/dist/esm/ic-menu-group.entry.js +20 -0
- package/dist/esm/ic-menu-group.entry.js.map +1 -0
- package/dist/esm/ic-menu-item.entry.js +116 -0
- package/dist/esm/ic-menu-item.entry.js.map +1 -0
- package/dist/esm/ic-navigation-button.entry.js +1 -1
- package/dist/esm/ic-navigation-group.entry.js +3 -3
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +3 -3
- 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-popover-menu.entry.js +232 -0
- package/dist/esm/ic-popover-menu.entry.js.map +1 -0
- 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 +4 -2
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-select.entry.js +15 -13
- package/dist/esm/ic-select.entry.js.map +1 -1
- package/dist/esm/ic-side-navigation.entry.js +4 -4
- 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-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-text-field.entry.js +1 -1
- package/dist/esm/ic-theme.entry.js +1 -1
- package/dist/esm/ic-toast.entry.js +2 -2
- package/dist/esm/ic-toast.entry.js.map +1 -1
- package/dist/esm/ic-top-navigation.entry.js +1 -1
- package/dist/esm/index-90721b3c.js +12 -0
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-link/ic-link.d.ts +1 -1
- package/dist/types/components/ic-menu-group/ic-menu-group.d.ts +8 -0
- package/dist/types/components/ic-menu-item/ic-menu-item.d.ts +74 -0
- package/dist/types/components/ic-menu-item/ic-menu-item.types.d.ts +1 -0
- package/dist/types/components/ic-popover-menu/ic-popover-menu.d.ts +58 -0
- package/dist/types/components/ic-popover-menu/ic-popover-menu.test.a11y.d.ts +1 -0
- package/dist/types/components/ic-select/ic-select.d.ts +1 -1
- package/dist/types/components/ic-side-navigation/ic-side-navigation-test-examples.d.ts +1 -0
- package/dist/types/components.d.ts +173 -4
- package/hydrate/index.js +454 -33
- package/package.json +3 -3
- package/dist/cjs/chevron-icon-2645d6b0.js +0 -10
- package/dist/cjs/chevron-icon-2645d6b0.js.map +0 -1
- package/dist/cjs/helpers-6eb26e7a.js.map +0 -1
- package/dist/core/p-1724000c.js.map +0 -1
- package/dist/core/p-44c9612c.entry.js +0 -2
- package/dist/core/p-44c9612c.entry.js.map +0 -1
- package/dist/core/p-4a73728b.entry.js +0 -2
- package/dist/core/p-4a73728b.entry.js.map +0 -1
- package/dist/core/p-521be4e2.entry.js.map +0 -1
- package/dist/core/p-6a397882.entry.js.map +0 -1
- package/dist/core/p-7818d958.entry.js.map +0 -1
- package/dist/core/p-8f1176c6.entry.js +0 -2
- package/dist/core/p-8f1176c6.entry.js.map +0 -1
- package/dist/core/p-a09d853e.entry.js +0 -2
- package/dist/core/p-a09d853e.entry.js.map +0 -1
- package/dist/core/p-a10da430.entry.js.map +0 -1
- package/dist/core/p-d37b9695.entry.js +0 -2
- package/dist/core/p-d37b9695.entry.js.map +0 -1
- package/dist/core/p-dea3d5f0.entry.js +0 -2
- package/dist/core/p-dea3d5f0.entry.js.map +0 -1
- package/dist/core/p-e9202767.entry.js +0 -2
- package/dist/core/p-e9202767.entry.js.map +0 -1
- package/dist/esm/chevron-icon-98c98242.js +0 -8
- package/dist/esm/chevron-icon-98c98242.js.map +0 -1
- package/dist/esm/helpers-c332acf8.js.map +0 -1
- /package/dist/core/{p-18bf3cb0.entry.js.map → p-037dfe9d.entry.js.map} +0 -0
- /package/dist/core/{p-d86b0d0e.entry.js.map → p-05c5c6c4.entry.js.map} +0 -0
- /package/dist/core/{p-24240e11.js.map → p-06321d19.js.map} +0 -0
- /package/dist/core/{p-284970bc.entry.js.map → p-0a463a65.entry.js.map} +0 -0
- /package/dist/core/{p-7a0bf893.entry.js.map → p-0faf328a.entry.js.map} +0 -0
- /package/dist/core/{p-5b083ce5.entry.js.map → p-102281fd.entry.js.map} +0 -0
- /package/dist/core/{p-18ae4b6d.entry.js.map → p-1549adc1.entry.js.map} +0 -0
- /package/dist/core/{p-3dda76db.entry.js.map → p-25b208ae.entry.js.map} +0 -0
- /package/dist/core/{p-ba8d6c23.entry.js.map → p-26c9e522.entry.js.map} +0 -0
- /package/dist/core/{p-41e239cb.entry.js.map → p-33a0aabe.entry.js.map} +0 -0
- /package/dist/core/{p-a667e329.entry.js.map → p-3fd4f8eb.entry.js.map} +0 -0
- /package/dist/core/{p-7a9bc7f2.entry.js.map → p-741b4ea3.entry.js.map} +0 -0
- /package/dist/core/{p-cccbf2bf.entry.js.map → p-7dcb9104.entry.js.map} +0 -0
- /package/dist/core/{p-c4a7c734.entry.js.map → p-8c9cc4d5.entry.js.map} +0 -0
- /package/dist/core/{p-c7b86643.entry.js.map → p-a2c7dc6c.entry.js.map} +0 -0
- /package/dist/core/{p-c72e4b75.entry.js.map → p-ac6ecdb6.entry.js.map} +0 -0
- /package/dist/core/{p-eba373bf.entry.js.map → p-acb08809.entry.js.map} +0 -0
- /package/dist/core/{p-b35ae170.entry.js.map → p-b7fc1f35.entry.js.map} +0 -0
- /package/dist/core/{p-bd819f68.entry.js.map → p-b8b960a5.entry.js.map} +0 -0
- /package/dist/core/{p-91a8db51.entry.js.map → p-b921bb19.entry.js.map} +0 -0
- /package/dist/core/{p-c7c5d2c5.entry.js.map → p-c996810e.entry.js.map} +0 -0
- /package/dist/core/{p-b40bd77c.entry.js.map → p-d28d7f24.entry.js.map} +0 -0
- /package/dist/core/{p-35a03442.entry.js.map → p-dbfdfa8a.entry.js.map} +0 -0
- /package/dist/core/{p-691ea0f2.entry.js.map → p-dd71a986.entry.js.map} +0 -0
- /package/dist/core/{p-e0d88c31.entry.js.map → p-e4547265.entry.js.map} +0 -0
- /package/dist/core/{p-c8f07be6.entry.js.map → p-ea0c4aca.entry.js.map} +0 -0
- /package/dist/core/{p-b4234318.entry.js.map → p-f777679c.entry.js.map} +0 -0
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","src/components/ic-button/ic-button.tsx","src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","src/components/ic-loading-indicator/ic-loading-indicator.tsx","src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","src/components/ic-tooltip/ic-tooltip.tsx"],"names":["icButtonCss","buttonIds","Button","this","inheritedAttributes","hasTooltip","buttonIdNum","handleClick","el","type","closest","handleHiddenFormButtonClick","onFocus","icFocus","emit","onBlur","icBlur","[object Object]","event","disabled","loading","stopImmediatePropagation","ev","theme","detail","updateTheme","mode","buttonEl","focus","newValue","tooltipEl","label","setAttribute","iconEl","querySelector","form","hiddenFormButton","document","createElement","style","display","appendChild","click","remove","newTheme","foregroundColor","getThemeFromContext","IcThemeForegroundEnum","Default","appearance","inheritAttributes","IC_INHERITED_ARIA","id","undefined","variant","TagType","href","_a","title","aria-label","ariaLabel","restInheritedAttributes","__rest","buttonAttrs","download","rel","target","referrerpolicy","hreflang","newTitle","titleAttr","tooltipText","describedBy","buttonId","ButtonContent","h","Object","assign","class","aria-disabled","ref","aria-describedby","part","hasIconSlot","name","Dark","Light","Host","size","fullWidth","onClick","disableTooltip","placement","tooltipPlacement","icLoadingIndicatorCss","LoadingIndicator","updateCircularProgressMeter","indeterminate","circularMeter","setProperty","String","progress","getLabel","labelIndex","setLabel","Promise","setInterval","labelList","length","labelDuration","getLabelVariant","width","outerElement","offsetWidth","setCircleLineWidth","compactStepCircularLineWidth","host","classList","contains","toastDismissTimerCircularLineWidth","circularLineWidth","circularDiameter","setLinearDeterminateWidth","innerElement","Math","min","max","proportion","showSecond","add","calcOuterClass","cls","updateLabel","split","indicatorLabel","setCircleXY","r","x","y","nextRadius","setDashSteps","radius","dashArray","PI","shadowRoot","Number","description","role","aria-labelledby","aria-valuenow","aria-valuemin","aria-valuemax","innerLabel","viewBox","cx","cy","icTooltipCss","Tooltip","mouseOverTool","showEvents","disableHover","instantHideEvents","delayedHideEvents","show","popper","toolTip","setOptions","options","modifiers","enabled","update","hide","removeAttribute","checkCloseTooltip","setTimeout","mouseEnterTooltip","mouseLeaveTooltip","handleKeyDown","key","popperInstance","manageEventListeners","action","method","forEach","screenReaderOnlyStyles","position","left","top","height","overflow","describedBySpan","previousElementSibling","innerText","createPopper","offset","element","arrow","onComponentRequiredPropUndefined","prop","propName","ariaDescribedBy","insertAdjacentElement","ic-tooltip","data-popper-arrow"],"mappings":"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","sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: inline-block;\n\n --button-default: var(--ic-action-default);\n --button-default-hover: var(--ic-action-default-hover);\n --button-default-active: var(--ic-action-default-active);\n --button-default-background-hover: var(--ic-action-default-bg-hover);\n --button-default-background-active: var(--ic-action-default-bg-active);\n --icon-width: 100%;\n --icon-height: 100%;\n}\n\n.button {\n font-family: var(--ic-font-body-family);\n text-decoration: none;\n font-weight: 600;\n font-size: 0.875rem;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n min-width: 6.25rem;\n display: inline-flex;\n gap: var(--ic-space-xs);\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n}\n\n.button:hover {\n cursor: pointer;\n}\n\n.button:focus,\n:host .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n:host(.light) .button:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button {\n --button-default: var(--ic-action-dark);\n --button-default-hover: var(--ic-action-dark);\n --button-default-active: var(--ic-action-dark);\n --button-default-background-hover: var(--ic-action-dark-bg-hover);\n --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button {\n --button-default: var(--ic-action-light);\n --button-default-hover: var(--ic-action-light);\n --button-default-active: var(--ic-action-light);\n --button-default-background-hover: var(--ic-action-light-bg-hover);\n --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.button-variant-primary.light) .button {\n color: var(--ic-color-primary-text);\n\n --button-default-hover: var(--ic-action-light-hover);\n --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button {\n --button-default-hover: var(--ic-action-dark-hover);\n --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.loading),\n:host(.loading) .button {\n pointer-events: none;\n}\n\n/* Variants */\n\n/* Primary */\n\n:host(.button-variant-primary) .button {\n color: var(--ic-architectural-white);\n background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover:not(:focus) {\n background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary) .button:active:not(:focus),\n:host(.button-variant-primary.loading) .button {\n background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button {\n background: var(--ic-architectural-600);\n color: var(--ic-architectural-500);\n}\n\n/* Secondary */\n\n:host(.button-variant-secondary) .button {\n border: 0.063rem solid var(--button-default);\n color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n border-color: var(--button-default-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active:not(:focus) {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.loading) .button {\n border-color: var(--button-default-active);\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) .button:hover,\n:host(.button-variant-secondary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) .button:hover,\n:host(.button-variant-secondary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/* Tertiary */\n\n:host(.button-variant-tertiary) .button {\n color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active:not(:focus),\n:host(.button-variant-tertiary.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) .button:hover,\n:host(.button-variant-tertiary.disabled) .button:active {\n border-color: var(--ic-architectural-300);\n color: var(--ic-architectural-300);\n background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) .button:hover,\n:host(.button-variant-tertiary.light.disabled) .button:active {\n border-color: var(--ic-architectural-500);\n color: var(--ic-architectural-500);\n background: none;\n}\n\n/* Icon */\n\n:host(.button-variant-icon) .button {\n color: var(--button-default);\n min-width: 0;\n}\n\n:host(.button-variant-icon) .button:hover:not(:focus) {\n background-color: var(--button-default-background-hover);\n color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon.loading) .button {\n background-color: var(--button-default-background-active);\n color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) .button:hover,\n:host(.button-variant-icon.disabled) .button:active {\n color: var(--ic-architectural-300);\n background: none;\n}\n\n/* Destructive */\n\n:host(.button-variant-destructive) .button {\n color: var(--ic-architectural-white);\n background-color: var(--ic-action-destructive);\n text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover:not(:focus) {\n background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active:not(:focus),\n:host(.button-variant-destructive.loading) .button {\n background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button {\n background: var(--ic-architectural-200);\n color: var(--ic-architectural-300);\n}\n\n/* Sizing */\n\n:host(.button-size-default) .button {\n height: 2.5rem;\n padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n height: var(--ic-space-xl);\n padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n height: var(--ic-space-xxl);\n padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button {\n height: var(--ic-space-xl);\n width: var(--ic-space-xl);\n padding: 0.375rem;\n}\n\n:host(.button-size-small.button-variant-icon) .button {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button {\n height: 2.5rem;\n width: 2.5rem;\n padding: var(--ic-space-xs);\n}\n\n/* Width */\n:host(.full-width),\n:host(.full-width) .button {\n width: 100%;\n}\n\n/* Loading */\n\ndiv.loading-container {\n position: relative;\n align-items: center;\n width: 100%;\n}\n\nic-loading-indicator {\n --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n 0% {\n width: 0%;\n left: 0%;\n }\n\n 25% {\n width: 0%;\n left: 0%;\n opacity: 0;\n }\n\n 50% {\n width: 100%;\n left: 0%;\n opacity: 1;\n }\n\n 75% {\n width: 0%;\n left: 100%;\n }\n\n 100% {\n width: 0%;\n left: 100%;\n opacity: 0;\n }\n}\n\n/* Icons */\n\ndiv.icon-container {\n box-sizing: border-box;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n::slotted(*) {\n width: var(--icon-width) !important;\n height: var(--icon-height) !important;\n fill: currentcolor !important;\n pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n margin: 0;\n pointer-events: none;\n}\n\n/** SEARCH **/\n\n:host(.search-submit-button) ::slotted(svg) {\n --icon-height: 1.25rem;\n --icon-width: 1.25rem;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n --icon-height: 1rem;\n --icon-width: 1rem;\n}\n\n:host(.clear-button) {\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n box-shadow: none;\n background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n display: flex;\n align-items: center;\n margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n --icon-height: 0.875rem;\n --icon-width: 0.875rem;\n}\n\n:host(.popout-menu-button) .button {\n justify-content: left;\n border-radius: 0;\n white-space: pre-line;\n text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n display: none;\n}\n\n:host .ic-tooltip {\n display: block;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .button {\n border: 0.125rem solid transparent;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n h,\n} from \"@stencil/core\";\n\nimport { getThemeFromContext, inheritAttributes } from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonSizes,\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Content will be placed to the left of the button label.\n */\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n @Element() el: HTMLIcButtonElement;\n /**\n * If `true`, the button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n /**\n * If `true`, the button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n /**\n * The type of the button.\n */\n @Prop() type?: IcButtonTypes = \"button\";\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 * 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 * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\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 * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n /**\n * The variant of the button to be displayed.\n */\n @Prop() variant?: IcButtonVariants = \"primary\";\n /**\n * The size of the button to be displayed.\n */\n @Prop() size?: IcButtonSizes = \"default\";\n /**\n * If `true`, the button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n /**\n * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n */\n @Prop() disableTooltip?: boolean = false;\n /**\n * The position of the tooltip in relation to the button.\n */\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n /**\n * The appearance of the button, e.g. dark, light, or the default.\n */\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n /**\n * Emitted when button has focus\n */\n @Event() icFocus!: EventEmitter<void>;\n /**\n * Emitted when button has blur\n */\n @Event() icBlur!: EventEmitter<void>;\n\n private inheritedAttributes: { [k: string]: unknown } = {};\n private buttonEl: HTMLElement;\n private hasTooltip: boolean = false;\n private buttonIdNum = buttonIds++;\n private tooltipEl: HTMLIcTooltipElement;\n private id: string;\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled || this.loading) {\n event.stopImmediatePropagation();\n }\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 native `button`.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.buttonEl) {\n this.buttonEl.focus();\n }\n }\n\n /**\n * @internal Updates tooltip/aria-label text - needed as can't watch an ARIA attribute change.\n */\n @Method()\n async updateAriaLabel(newValue: string): Promise<void> {\n if (this.hasTooltip) {\n this.tooltipEl.label = newValue;\n this.buttonEl.setAttribute(\"aria-label\", newValue);\n }\n }\n\n private hasIconSlot(): boolean {\n const iconEl = this.el.querySelector(`[slot=\"icon\"]`);\n if (iconEl != null) {\n return true;\n }\n return false;\n }\n\n private handleHiddenFormButtonClick(form: HTMLFormElement): void {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n form.appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" || this.el.type === \"reset\") &&\n !!this.el.closest(\"FORM\")\n ) {\n this.handleHiddenFormButtonClick(this.el.closest(\"FORM\"));\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme || null);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, [\n ...IC_INHERITED_ARIA,\n \"aria-expanded\",\n \"title\",\n ]);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n const id = this.el.id;\n this.id = id !== undefined ? id : null;\n this.hasTooltip = this.variant === \"icon\";\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n }\n\n render() {\n const TagType = (this.href && \"a\") || \"button\";\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = this.inheritedAttributes;\n const buttonAttrs =\n TagType === \"button\"\n ? { type: this.type, disabled: this.disabled }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n const newTitle = title && (title as string);\n const titleAttr = this.hasTooltip ? {} : { title: newTitle };\n let tooltipText = \"\";\n if (this.hasTooltip) {\n if (newTitle !== undefined) {\n tooltipText = newTitle;\n } else if (ariaLabel !== null) {\n tooltipText = ariaLabel as string;\n }\n }\n\n let describedBy: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedBy = `ic-tooltip-${buttonId}`;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading || this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n {...buttonAttrs}\n {...restInheritedAttributes}\n {...titleAttr}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n id={buttonId}\n aria-describedby={describedBy}\n part=\"button\"\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" ||\n this.variant === \"destructive\" ||\n this.appearance === IcThemeForegroundEnum.Dark ||\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n }}\n onClick={this.handleClick}\n >\n {this.hasTooltip && (\n <ic-tooltip\n class={{ [\"tooltip-disabled\"]: this.disableTooltip }}\n ref={(el) => (this.tooltipEl = el)}\n label={tooltipText}\n target={buttonId}\n placement={this.tooltipPlacement}\n >\n <ButtonContent />\n </ic-tooltip>\n )}\n\n {!this.hasTooltip && <ButtonContent />}\n </Host>\n );\n }\n}\n","@import \"../../global/normalize.css\";\n\n:host {\n /**\n * @prop --circular-diameter: Diameter of the circular-indicator\n */\n\n display: block;\n\n --linear-border-radius: 0.25rem;\n --inner-color: var(--ic-action-default);\n --outer-color: var(--ic-architectural-100);\n --label-color: var(--ic-color-primary-text);\n --margin: none;\n --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n --inner-color: var(--ic-architectural-white);\n --outer-color: var(--ic-architectural-800);\n --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n:host([size=\"small\"]) {\n --circular-diameter: 2.5rem;\n --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n --circular-diameter: 5rem;\n}\n\n:host([size=\"large\"]) {\n --circular-diameter: 7.5rem;\n}\n\n:host([size=\"icon\"]) {\n display: inline-block;\n\n --margin: var(--ic-space-xxxs);\n --circular-diameter: 1.25rem;\n}\n\n:host([label]) {\n --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n white-space: nowrap;\n color: var(--label-color);\n margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n height: var(--circular-diameter);\n width: var(--circular-diameter);\n}\n\n.ic-loading-circular-outer.indeterminate {\n animation: circular-animation 1s linear;\n animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n background-color: var(--outer-color);\n height: var(--linear-line-height);\n width: 100%;\n border-radius: var(--linear-border-radius);\n overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n position: relative;\n height: 100%;\n background-color: var(--inner-color);\n border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n transition: width 0.5s;\n width: var(--linear-width);\n}\n\n:host([full-width]) {\n --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n 0% {\n width: 0%;\n left: -1%;\n }\n\n 25% {\n width: 0%;\n left: -1%;\n }\n\n 50% {\n width: 101%;\n left: -1%;\n }\n\n 75% {\n width: 0%;\n left: 101%;\n }\n\n 100% {\n width: 0%;\n left: 101%;\n }\n}\n\n.ic-loading-circular-svg {\n position: relative;\n width: 100%;\n height: 100%;\n transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: var(--outer-color);\n stroke-width: var(--circular-line-width);\n stroke-linecap: round;\n}\n\n/* --stroke-dash-array calculated via dashArray method */\n.ic-loading-circular-svg circle:nth-child(2) {\n --circular-indeterminate: calc(\n (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n );\n\n stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n stroke: var(--compact-step-inner-color, var(--inner-color));\n}\n\n:host([inner-label]) .ic-loading-circular-inner {\n display: grid;\n}\n\n:host([inner-label]) .ic-loading-circular-svg,\n.inner-text {\n grid-column: 1;\n grid-row: 1;\n}\n\n:host(.not-required.compact-step-progress-indicator)\n .ic-loading-circular-svg\n circle:nth-child(2) {\n stroke: var(--ic-architectural-300);\n}\n\n.inner-text {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--ic-space-lg);\n height: inherit;\n overflow: hidden;\n margin: auto;\n color: var(--ic-theme-primary);\n}\n\n:host(.not-required.compact-step-progress-indicator) .inner-text {\n color: var(--ic-color-tertiary-text);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .indeterminate > .ic-loading-circular-inner {\n forced-color-adjust: none;\n }\n\n .ic-loading-linear-outer {\n border: var(--ic-hc-border);\n }\n\n .ic-loading-linear-inner {\n background-color: canvastext;\n }\n\n .ic-loading-circular-svg circle {\n stroke: Background;\n }\n\n .ic-loading-circular-svg circle:nth-child(2) {\n stroke: canvastext;\n }\n\n :host(.not-required.compact-step-progress-indicator)\n .ic-loading-circular-svg\n circle:nth-child(2) {\n stroke: GrayText;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n IcLoadingCircleXYR,\n IcLoadingSizes,\n IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n IcThemeForegroundEnum,\n IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\n\n@Component({\n tag: \"ic-loading-indicator\",\n styleUrl: \"ic-loading-indicator.css\",\n shadow: true,\n})\nexport class LoadingIndicator {\n @Element() host: HTMLIcLoadingIndicatorElement;\n\n /**\n * The current amount of progress made.\n * If not provided, component acts as an indeterminate loading indicator.\n */\n @Prop() progress?: number;\n\n /**\n * The minimum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n */\n @Prop() min?: number = 0;\n\n /**\n * The maximum value that the progress value can take.\n * Used to calculate the proportional width of the progress bar.\n */\n @Prop() max?: number = 100;\n\n /**\n * The label to be displayed beneath the loading indicator.\n * Display a changing label by separating multiple messages with forward slashes.\n */\n @Prop() label?: string;\n\n /**\n * The description that will be set as the aria-label of the loading indicator when not using a visible label.\n */\n @Prop() description?: string = \"Loading\";\n\n /**\n * @internal The step number of a compact step, managed by ic-step.\n */\n @Prop() innerLabel?: number;\n\n /**\n * The time in milliseconds before the label changes.\n */\n @Prop() labelDuration?: number = 8000;\n\n /**\n * The size of the loading indicator.\n */\n @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n /**\n * The type of indicator, either linear or circular.\n */\n @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n /**\n * If `true`, when linear, the full-width variant (i.e. without a border radius) will be displayed.\n */\n @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n /**\n * The appearance of the loading indicator, e.g. dark or light.\n */\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n @State() indicatorLabel: string;\n @State() indeterminate: boolean;\n @State() showSecond: boolean = false;\n @State() circularLineWidth: number;\n @State() circularDiameter: number;\n\n @Watch(\"label\")\n watchPropHandler(): void {\n this.updateLabel();\n }\n\n @Watch(\"progress\")\n watchProgressHandler(): void {\n if (this.type === \"circular\") {\n this.updateCircularProgressMeter();\n }\n }\n\n private outerElement?: HTMLDivElement;\n private innerElement?: HTMLDivElement;\n private labelList: string[];\n private circularMeter: SVGCircleElement;\n\n private updateCircularProgressMeter = () => {\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--progress-value\",\n String(this.progress)\n );\n }\n };\n\n private getLabel = (\n labelIndex: number,\n setLabel: (label: string) => void\n ) => {\n return new Promise(() => {\n setInterval(() => {\n if (labelIndex < this.labelList.length - 1) {\n labelIndex++;\n } else {\n labelIndex = 0;\n }\n setLabel(this.labelList[labelIndex]);\n }, this.labelDuration);\n });\n };\n\n private getLabelVariant = () => {\n let variant: \"label\" | \"h4\" | \"h2\" = \"h4\";\n const width = this.outerElement?.offsetWidth;\n if (this.size === \"small\" || (this.type === \"circular\" && width < 60)) {\n variant = \"label\";\n } else if (\n this.size === \"large\" ||\n (this.type === \"circular\" && width >= 120)\n ) {\n variant = \"h2\";\n }\n return variant;\n };\n\n // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n private setCircleLineWidth = () => {\n const { offsetWidth: width } = this.outerElement;\n\n const compactStepCircularLineWidth = this.host.classList.contains(\n \"compact-step-progress-indicator\"\n )\n ? 40\n : 0;\n const toastDismissTimerCircularLineWidth = this.host.classList.contains(\n \"toast-dismiss-timer\"\n )\n ? 20\n : 0;\n\n if (\n width ||\n compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth\n ) {\n this.circularLineWidth =\n (compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth ||\n width) * 0.1;\n this.circularDiameter =\n compactStepCircularLineWidth ||\n toastDismissTimerCircularLineWidth ||\n width;\n this.outerElement.style.setProperty(\n \"--circular-line-width\",\n `${this.circularLineWidth}px`\n );\n }\n };\n\n private setLinearDeterminateWidth = () => {\n if (!this.innerElement) return;\n // Ensure progress cannot be out of bounds\n\n const progress = Math.min(this.max, Math.max(this.min, this.progress));\n const proportion = (progress - this.min) / (this.max - this.min);\n this.showSecond = proportion > 0.5;\n if (this.showSecond) {\n this.innerElement.classList.remove(\"clip\");\n } else {\n this.innerElement.classList.add(\"clip\");\n }\n this.innerElement.style.setProperty(\n \"--linear-width\",\n `${proportion * 100}%`\n );\n };\n\n private calcOuterClass = (): string => {\n let cls = `ic-loading-${this.type}-outer`;\n cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n return cls;\n };\n\n private updateLabel = (): void => {\n if (this.label !== undefined) {\n this.labelList = this.label.split(\"/\");\n const labelIndex = 0;\n this.indicatorLabel = this.labelList[labelIndex];\n if (this.labelList.length > 1) {\n this.getLabel(labelIndex, (label) => {\n this.indicatorLabel = label;\n });\n }\n }\n };\n\n private setCircleXY = (): IcLoadingCircleXYR => {\n if (this.circularDiameter > 0) {\n const r = this.circularDiameter / 2;\n const x = r;\n const y = r;\n const nextRadius = r - this.circularLineWidth / 2;\n this.setDashSteps(nextRadius);\n\n return { x, y, r: nextRadius };\n }\n return { x: 0, y: 0, r: 0 };\n };\n\n private setDashSteps = (radius: number) => {\n const dashArray = 2 * Math.PI * radius;\n const progress = Math.min(Math.max(this.progress, this.min), this.max);\n const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n this.circularMeter.style.setProperty(\n \"--stroke-dasharray\",\n `${dashArray}px`\n );\n\n if (!this.indeterminate) {\n this.circularMeter.style.setProperty(\n \"--circular-steps-max\",\n String(this.max)\n );\n this.circularMeter.style.setProperty(\n \"--stroke-dashoffset\",\n `${proportion * dashArray}px`\n );\n }\n };\n\n componentWillLoad(): void {\n this.indeterminate = this.progress === undefined;\n this.updateLabel();\n }\n\n componentDidLoad(): void {\n if (this.type === \"circular\") {\n this.setCircleLineWidth();\n this.circularMeter = this.host.shadowRoot.querySelector(\n \".ic-loading-circular-svg circle:nth-child(2)\"\n );\n this.updateCircularProgressMeter();\n }\n\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n componentWillUpdate(): void {\n this.indeterminate = this.progress === undefined;\n }\n\n componentDidUpdate(): void {\n if (Number(this.progress) >= 0 && this.type === \"linear\") {\n this.setLinearDeterminateWidth();\n }\n }\n\n render() {\n const { appearance, label, description, size } = this;\n const { x, y, r } = this.setCircleXY();\n\n return (\n <Host class={{ [\"light\"]: appearance === IcThemeForegroundEnum.Light }}>\n <div class=\"ic-loading-container\">\n <div\n ref={(el) => (this.outerElement = el as HTMLDivElement)}\n class={this.calcOuterClass()}\n role=\"progressbar\"\n aria-labelledby={\n this.label && this.size !== \"icon\" && \"ic-loading-label\"\n }\n aria-label={description}\n aria-valuenow={this.progress}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n >\n <div\n ref={(el) => (this.innerElement = el as HTMLDivElement)}\n class={`ic-loading-${this.type}-inner`}\n >\n {this.innerLabel &&\n this.innerLabel !== undefined &&\n this.size === \"small\" && (\n <ic-typography variant=\"subtitle-small\" class=\"inner-text\">\n {this.innerLabel}\n </ic-typography>\n )}\n {this.type === \"circular\" && (\n <svg\n class=\"ic-loading-circular-svg\"\n viewBox={`0 0 ${this.circularDiameter || 0} ${\n this.circularDiameter || 0\n }`}\n >\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n </svg>\n )}\n </div>\n </div>\n {label && size !== \"icon\" && (\n <ic-typography\n id=\"ic-loading-label\"\n class=\"ic-loading-label\"\n role=\"status\"\n variant={this.getLabelVariant()}\n >\n <p>{this.indicatorLabel}</p>\n </ic-typography>\n )}\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-tooltip: z-index of tooltip\n */\n\n:host(.ic-tooltip) .ic-tooltip-container {\n background-color: var(--ic-architectural-800);\n color: #ffff;\n text-align: center;\n padding: var(--ic-space-xxxs) 0.625rem;\n border-radius: var(--ic-border-radius);\n position: absolute;\n max-width: 20rem;\n display: none;\n z-index: var(--ic-z-index-tooltip);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n .ic-tooltip-container,\n:host(.tooltip-disabled) .ic-tooltip-container {\n display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n .ic-tooltip-container[data-show] {\n display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n position: absolute;\n background: inherit;\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n visibility: hidden;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n visibility: visible;\n content: \"\";\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n display: block;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow {\n bottom: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"top\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow {\n top: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n left: 0;\n height: var(--ic-space-xxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow {\n right: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"left\"]\n > .ic-tooltip-arrow::before {\n border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow {\n left: -0.875rem;\n}\n\n:host(.ic-tooltip)\n .ic-tooltip-container[data-popper-placement^=\"right\"]\n > .ic-tooltip-arrow::before {\n border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n}\n\n@media (forced-colors: active) {\n :host(.ic-tooltip) .ic-tooltip-container {\n border: var(--ic-hc-border);\n }\n}\n","import { Component, Element, Host, Prop, h, Watch } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-tooltip\",\n styleUrl: \"ic-tooltip.css\",\n shadow: true,\n})\nexport class Tooltip {\n @Element() el: HTMLIcTooltipElement;\n\n /**\n * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n */\n @Prop({ reflect: true }) target?: string;\n\n /**\n * The position of the tool-tip in relation to the parent element.\n */\n @Prop() placement?: IcTooltipPlacements = \"bottom\";\n\n /**\n * The text to display on the tooltip.\n */\n @Prop() label!: string;\n\n /**\n * If `true`, the tooltip will not be displayed on hover, it will require a click.\n */\n @Prop() disableHover?: boolean = false;\n\n @Watch(\"label\")\n updateLabel(newValue: string): void {\n const describedBySpan = this.el.previousElementSibling as HTMLElement;\n if (describedBySpan !== null) {\n describedBySpan.innerText = newValue;\n }\n }\n\n private toolTip: HTMLDivElement;\n private arrow: HTMLDivElement;\n private mouseOverTool: boolean = false;\n private showEvents = this.disableHover\n ? [\"click\"]\n : [\"mouseenter\", \"focusin\"];\n private instantHideEvents = [\"focusout\"];\n private delayedHideEvents = [\"mouseleave\"];\n private popperInstance: Instance;\n\n private show = (popper: Instance) => {\n this.toolTip.setAttribute(\"data-show\", \"\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: true },\n ],\n }));\n popper.update();\n };\n\n private hide = (popper: Instance) => {\n this.toolTip.removeAttribute(\"data-show\");\n popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: \"eventListeners\", enabled: false },\n ],\n }));\n };\n\n private checkCloseTooltip = (popper: Instance) => {\n setTimeout(() => {\n if (!this.mouseOverTool) {\n this.hide(popper);\n }\n }, 100);\n };\n\n private mouseEnterTooltip = () => {\n this.mouseOverTool = true;\n };\n\n private mouseLeaveTooltip = (popper: Instance) => {\n this.mouseOverTool = false;\n this.checkCloseTooltip(popper);\n };\n\n private handleKeyDown = (key: string) => {\n if (key === \"Escape\") {\n this.hide(this.popperInstance);\n }\n };\n\n private manageEventListeners = (action: \"add\" | \"remove\") => {\n const method =\n action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n this.showEvents.forEach((event) => {\n this.el[method](event, () => this.show(this.popperInstance));\n if (this.toolTip !== undefined) {\n this.toolTip[method](event, () => this.mouseEnterTooltip());\n }\n });\n\n this.instantHideEvents.forEach((event) => {\n this.el[method](event, () => this.hide(this.popperInstance));\n });\n\n this.delayedHideEvents.forEach((event) => {\n this.el[method](event, () => this.checkCloseTooltip(this.popperInstance));\n if (this.toolTip !== undefined) {\n this.toolTip[method](event, () =>\n this.mouseLeaveTooltip(this.popperInstance)\n );\n }\n });\n\n document[method](\"keydown\", (event: KeyboardEvent) =>\n this.handleKeyDown(event.key)\n );\n };\n\n private screenReaderOnlyStyles = {\n position: \"absolute\",\n left: \"-10000px\",\n top: \"auto\",\n width: \"1px\",\n height: \"1px\",\n overflow: \"hidden\",\n };\n\n componentDidLoad(): void {\n this.popperInstance = createPopper(this.el, this.toolTip, {\n placement: this.placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 10],\n },\n },\n {\n name: \"arrow\",\n options: {\n element: this.arrow,\n },\n },\n ],\n });\n\n this.manageEventListeners(\"add\");\n\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tooltip\"\n );\n\n if (this.target !== undefined) {\n const ariaDescribedBy = document.createElement(\"span\");\n ariaDescribedBy.id = `ic-tooltip-${this.target}`;\n ariaDescribedBy.innerText = this.label;\n ariaDescribedBy.classList.add(\"ic-tooltip-label\");\n Object.assign(ariaDescribedBy.style, this.screenReaderOnlyStyles);\n\n this.el.insertAdjacentElement(\"beforebegin\", ariaDescribedBy);\n }\n }\n\n disconnectedCallback(): void {\n this.manageEventListeners(\"remove\");\n }\n\n render() {\n const { label } = this;\n return (\n <Host class={{ \"ic-tooltip\": true }}>\n <div\n ref={(el) => (this.toolTip = el as HTMLDivElement)}\n role=\"tooltip\"\n class=\"ic-tooltip-container\"\n >\n <ic-typography variant=\"caption\">{label}</ic-typography>\n <div\n ref={(el) => (this.arrow = el as HTMLDivElement)}\n class=\"ic-tooltip-arrow\"\n data-popper-arrow\n ></div>\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as t,c as e,h as i,H as o,g as s}from"./p-5450cebf.js";import{a as n,i as a,H as r}from"./p-3dea2867.js";import{C as c}from"./p-8c7f4343.js";import{C as l}from"./p-06321d19.js";import"./p-6f57b13c.js";const d='/*! 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}li{list-style:none;padding:0}:host::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled)::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"])::part(button){color:var(--ic-action-destructive)}:host::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host::part(button):focus-visible,:host::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"])::part(button):focus-visible,:host([variant="destructive"])::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant="destructive"])::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant="destructive"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant="destructive"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host::part(button){border:Canvas}:host::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:Canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{outline-color:GrayText !important}}';const u=class{constructor(i){t(this,i);this.childBlur=e(this,"childBlur",7);this.triggerPopoverMenuInstance=e(this,"triggerPopoverMenuInstance",7);this.handleMenuItemClick=e(this,"handleMenuItemClick",7);this.handleClick=t=>{t.preventDefault();if(this.submenuTriggerFor!==undefined){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){this.toggleChecked?this.toggleChecked=false:this.toggleChecked=true}this.handleMenuItemClick.emit({label:this.label,hasSubMenu:!!this.el.submenuTriggerFor})};this.getMenuItemAriaLabel=()=>{let t=this.label;if(this.description!==undefined){t=`${t}, ${this.description}`}if(this.keyboardShortcut!==undefined){t=`${t}, ${this.keyboardShortcut}`}if(this.variant==="destructive"){t=`${t}, destructive`}if(this.submenuTriggerFor!==undefined){t=`${t}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){t="Go back to parent menu"}const e=r(this.el);if(e.tagName==="IC-MENU-GROUP"){return`${t}, ${e.label} menu group`}else{return t}};this.variant="default";this.label=undefined;this.description=undefined;this.disabled=false;this.href=undefined;this.target=undefined;this.rel=undefined;this.hreflang=undefined;this.referrerpolicy=undefined;this.keyboardShortcut=undefined;this.submenuTriggerFor=undefined;this.toggleChecked=false}handleHostClick(t){if(this.disabled){t.stopImmediatePropagation()}}componentWillLoad(){if(this.submenuTriggerFor!==undefined&&this.variant!=="default"){this.variant="default"}}componentDidLoad(){n([{prop:this.label,propName:"label"}],"Menu Item")}render(){const t=t=>t!==undefined?t:null;const e=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcut&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcut)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["disabled"]:this.disabled}},i("li",{role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"&&this.toggleChecked===true?true:this.variant==="toggle"&&this.toggleChecked===false?false:undefined},i("ic-button",{disableTooltip:true,fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:t(this.href),hreflang:t(this.hreflang),target:t(this.target),rel:t(this.rel),referrerpolicy:this.referrerpolicy!==undefined?this.referrerpolicy:null,"aria-disabled":`${this.disabled}`,"aria-label":this.getMenuItemAriaLabel(),"aria-controls":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false,"aria-haspopup":this.submenuTriggerFor!==undefined||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false,"aria-owns":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false},i("div",{class:"focus-border"},a(this.el,"icon")&&i("span",{class:"icon"},i("slot",{name:"icon"})),i(e,null),this.variant==="toggle"&&i("span",{class:{["check-icon"]:true,["hide"]:!this.toggleChecked},"aria-hidden":"true",innerHTML:c}),this.submenuTriggerFor!==undefined&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:l})))))}static get delegatesFocus(){return true}get el(){return s(this)}};u.style=d;export{u as ic_menu_item};
|
2
|
+
//# sourceMappingURL=p-a8e969ea.entry.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","src/components/ic-menu-item/ic-menu-item.tsx"],"names":["icMenuItemCss","MenuItem","this","handleClick","e","preventDefault","submenuTriggerFor","undefined","triggerPopoverMenuInstance","emit","variant","toggleChecked","handleMenuItemClick","label","hasSubMenu","el","getMenuItemAriaLabel","ariaLabel","description","keyboardShortcut","classList","contains","parentEl","getParentElement","tagName","[object Object]","disabled","stopImmediatePropagation","onComponentRequiredPropUndefined","prop","propName","isPropDefined","MenuItemInformation","h","class","Host","role","aria-disabled","aria-checked","disableTooltip","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","aria-label","aria-controls","aria-haspopup","aria-owns","isSlotUsed","name","aria-hidden","innerHTML","Check","Chevron"],"mappings":"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","sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n list-style: none;\n padding: 0;\n}\n\n:host::part(button) {\n color: var(--ic-color-primary-text);\n padding: calc(var(--ic-space-xxxs) / 2);\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: 0;\n min-height: 2.5rem;\n height: auto;\n}\n\n.focus-border {\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: var(--ic-border-radius);\n margin: calc(var(--ic-space-xxxs) / 2);\n padding: var(--ic-space-xxs);\n border: var(--ic-space-xxxs) dashed transparent;\n --icon-height: auto;\n}\n\n:host(.disabled)::part(button) {\n color: var(--ic-architectural-200) !important;\n pointer-events: none;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button) {\n color: var(--ic-action-destructive);\n}\n\n:host::part(button):hover {\n background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host::part(button):focus-visible,\n:host::part(button):focus {\n color: var(--ic-color-white-text);\n background-color: var(--ic-focus-blue);\n box-shadow: none;\n}\n\n:host(.disabled)::part(button):focus-visible,\n:host(.disabled)::part(button):focus {\n color: var(--ic-theme-lighten-40) !important;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):focus-visible,\n:host([variant=\"destructive\"])::part(button):focus {\n background-color: var(--ic-action-destructive);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n color: var(--ic-color-white-text);\n}\n\n:host(.disabled) ic-button:focus-within .focus-border {\n border-color: var(--ic-architectural-white);\n}\n\n:host(.disabled) ic-button:focus-within .menu-item-label,\n:host(.disabled) ic-button:focus-within .shortcut,\n:host(.disabled) ic-button:focus-within .menu-item-description {\n color: var(--ic-theme-lighten-40) !important;\n}\n\n:host::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-color-primary-text) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-action-destructive) !important;\n}\n\n.menu-item-info {\n display: flex;\n flex-direction: column;\n flex: 1;\n align-items: baseline;\n white-space: pre-line;\n text-align: left;\n}\n\n.menu-labels {\n display: flex;\n align-items: baseline;\n gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n color: var(--ic-color-secondary-text);\n}\n\n.shortcut {\n color: var(--ic-color-tertiary-text);\n display: flex;\n flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n text-transform: uppercase;\n font-weight: 600;\n letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n color: var(--ic-color-primary-text);\n}\n\nic-button:active .menu-item-description {\n color: var(--ic-color-secondary-text);\n}\n\nic-button:active .shortcut {\n color: var(--ic-color-tertiary-text);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n color: var(--ic-action-destructive) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n :host::part(button) {\n border: Canvas;\n }\n\n :host::part(button):focus-visible {\n outline: var(--ic-space-xxxs) solid transparent;\n }\n\n .focus-border {\n border-color: Canvas;\n }\n\n :host(.disabled) ic-button:focus-within .focus-border {\n border-color: GrayText;\n }\n\n :host(.disabled) .menu-item-info,\n :host(.disabled) .menu-item-label,\n :host(.disabled) .shortcut,\n :host(.disabled) .menu-item-description,\n :host(.disabled) ic-button:focus-within .menu-item-info,\n :host(.disabled) ic-button:focus-within .menu-item-label,\n :host(.disabled) ic-button:focus-within .shortcut,\n :host(.disabled) ic-button:focus-within .menu-item-description {\n color: GrayText !important;\n }\n\n :host(.disabled)::part(button):focus-visible,\n :host(.disabled)::part(button):focus {\n outline-color: GrayText !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n State,\n Event,\n EventEmitter,\n Listen,\n} from \"@stencil/core\";\nimport {\n getParentElement,\n isSlotUsed,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n tag: \"ic-menu-item\",\n styleUrl: \"ic-menu-item.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class MenuItem {\n @Element() el: HTMLIcMenuItemElement;\n\n /**\n * The variant of the menu item.\n */\n @Prop({ mutable: true, reflect: true }) variant: IcMenuItemVariants =\n \"default\";\n /**\n * The label to display in the menu item.\n */\n @Prop() label!: string;\n /**\n * The description displayed in the menu item, below the label.\n */\n @Prop() description?: string;\n /**\n * If `true`, the menu item will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n /**\n * The URL that the link points to. This will render the menu item as an \"a\" tag.\n */\n @Prop() href?: string;\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 * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n /**\n * The label describing the keyboard shortcut for a menu item's action.\n */\n @Prop() keyboardShortcut?: string;\n /**\n * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n */\n @Prop() submenuTriggerFor?: string;\n /**\n * @internal Emitted when item loses focus.\n */\n @Event() childBlur: EventEmitter<void>;\n /**\n * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n */\n @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n /**\n * @internal Emitted when the user clicks a menu item.\n */\n @Event() handleMenuItemClick: EventEmitter<{\n label: string;\n hasSubMenu: boolean;\n }>;\n\n @State() toggleChecked: boolean = false;\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n }\n }\n\n private handleClick = (e: Event): void => {\n e.preventDefault();\n if (this.submenuTriggerFor !== undefined) {\n this.triggerPopoverMenuInstance.emit();\n } else if (this.variant === \"toggle\") {\n this.toggleChecked\n ? (this.toggleChecked = false)\n : (this.toggleChecked = true);\n }\n this.handleMenuItemClick.emit({\n label: this.label,\n hasSubMenu: !!this.el.submenuTriggerFor,\n });\n };\n\n componentWillLoad(): void {\n // This ensures that trigger menu items are always set to the default variant\n if (this.submenuTriggerFor !== undefined && this.variant !== \"default\") {\n this.variant = \"default\";\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Menu Item\"\n );\n }\n\n private getMenuItemAriaLabel = (): string => {\n let ariaLabel = this.label;\n\n if (this.description !== undefined) {\n ariaLabel = `${ariaLabel}, ${this.description}`;\n }\n\n if (this.keyboardShortcut !== undefined) {\n ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;\n }\n\n if (this.variant === \"destructive\") {\n ariaLabel = `${ariaLabel}, destructive`;\n }\n\n if (this.submenuTriggerFor !== undefined) {\n ariaLabel = `${ariaLabel}, triggers submenu`;\n }\n\n if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n ariaLabel = \"Go back to parent menu\";\n }\n const parentEl = getParentElement(this.el);\n\n if (parentEl.tagName === \"IC-MENU-GROUP\") {\n return `${ariaLabel}, ${\n (parentEl as HTMLIcMenuGroupElement).label\n } menu group`;\n } else {\n return ariaLabel;\n }\n };\n\n render() {\n // A helper function that checks if a prop has been defined\n const isPropDefined = (prop: string) => {\n return prop !== undefined ? prop : null;\n };\n\n // A sub-component to layout the menu information correctly in ic-button\n const MenuItemInformation = () => {\n return (\n <div class=\"menu-item-info\">\n <div class=\"menu-labels\">\n <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n {this.keyboardShortcut && (\n <ic-typography variant=\"caption\" class=\"shortcut\">\n {this.keyboardShortcut}\n </ic-typography>\n )}\n </div>\n {this.description && (\n <ic-typography class=\"menu-item-description\" variant=\"caption\">\n {this.description}\n </ic-typography>\n )}\n </div>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n }}\n >\n <li\n role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n aria-disabled={`${this.disabled}`}\n aria-checked={\n this.variant === \"toggle\" && this.toggleChecked === true\n ? true\n : this.variant === \"toggle\" && this.toggleChecked === false\n ? false\n : undefined\n }\n >\n <ic-button\n disableTooltip\n fullWidth\n variant=\"tertiary\"\n onClick={this.handleClick}\n href={isPropDefined(this.href)}\n hreflang={isPropDefined(this.hreflang)}\n target={isPropDefined(this.target)}\n rel={isPropDefined(this.rel)}\n referrerpolicy={\n this.referrerpolicy !== undefined ? this.referrerpolicy : null\n }\n aria-disabled={`${this.disabled}`}\n aria-label={this.getMenuItemAriaLabel()}\n aria-controls={\n this.submenuTriggerFor !== undefined\n ? `ic-popover-submenu-${this.submenuTriggerFor}`\n : false\n }\n aria-haspopup={\n this.submenuTriggerFor !== undefined ||\n this.el.classList.contains(\"ic-popover-submenu-back-button\")\n ? \"menu\"\n : false\n }\n aria-owns={\n this.submenuTriggerFor !== undefined\n ? `ic-popover-submenu-${this.submenuTriggerFor}`\n : false\n }\n >\n <div class=\"focus-border\">\n {isSlotUsed(this.el, \"icon\") && (\n <span class=\"icon\">\n <slot name=\"icon\"></slot>\n </span>\n )}\n <MenuItemInformation />\n {this.variant === \"toggle\" && (\n <span\n class={{\n [\"check-icon\"]: true,\n [\"hide\"]: !this.toggleChecked,\n }}\n aria-hidden=\"true\"\n innerHTML={Check}\n />\n )}\n {this.submenuTriggerFor !== undefined && (\n <span\n class={{ [\"submenu-icon\"]: true }}\n aria-hidden=\"true\"\n innerHTML={Chevron}\n />\n )}\n </div>\n </ic-button>\n </li>\n </Host>\n );\n }\n}\n"]}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import{r as t,c as i,h as e,H as s,g as o}from"./p-5450cebf.js";import{i as a,a as n,e as r,j as l}from"./p-
|
2
|
-
//# sourceMappingURL=p-
|
1
|
+
import{r as t,c as i,h as e,H as s,g as o}from"./p-5450cebf.js";import{i as a,a as n,e as r,j as l}from"./p-3dea2867.js";import"./p-6f57b13c.js";const h='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-validation{margin-top:var(--ic-space-sm)}:host([small]) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host([small]) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}.radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host([small]) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host([orientation="horizontal"]) .radio-buttons-container{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host([small][orientation="horizontal"]) .radio-buttons-container{gap:var(--ic-space-xl)}';const p=class{constructor(e){t(this,e);this.icChange=i(this,"icChange",7);this.handleKeyDown=t=>{switch(t.key){case"ArrowDown":case"ArrowRight":this.radioOptions[this.getNextItemToSelect(this.selectedChild,true)].selected=true;t.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.radioOptions[this.getNextItemToSelect(this.selectedChild,false)].selected=true;t.preventDefault()}};this.getNextItemToSelect=(t,i)=>{const e=this.radioOptions.length-1;if(t<1){t=0}let s=i?t+1:t-1;if(s<0){s=e}else if(s>e){s=0}if(this.radioOptions[s].disabled){s=this.getNextItemToSelect(s,i)}return s};this.label=undefined;this.name=undefined;this.required=false;this.orientation="vertical";this.hideLabel=false;this.disabled=false;this.helperText=undefined;this.small=false;this.validationStatus="";this.validationText="";this.checkedValue="";this.selectedChild=-1}selectHandler(t){this.checkedValue=t.detail.value;this.icChange.emit({value:this.checkedValue});if(this.radioOptions!==undefined){this.radioOptions.forEach(((t,i)=>{t.selected=this.checkedValue===t.value;if(t.selected){this.selectedChild=i}}));this.radioOptions[0].shadowRoot.querySelector("input").tabIndex=this.selectedChild>0?-1:0}}componentDidLoad(){this.radioOptions=Array.from(this.host.querySelectorAll("ic-radio-option"));this.radioOptions.forEach(((t,i)=>{if(!t.selected){t.selected=this.checkedValue===t.value}t.name=this.name;t.groupLabel=this.label;if(t.selected){this.selectedChild=i;this.checkedValue=t.value}}));this.radioOptions[0].shadowRoot.querySelector("input").tabIndex=this.selectedChild>0?-1:0;if(this.orientation==="horizontal"&&this.radioOptions!==undefined&&(this.radioOptions.length>2||this.radioOptions.length===2&&(a(this.radioOptions[0],"additional-field")||a(this.radioOptions[1],"additional-field")))){this.orientation="vertical"}n([{prop:this.label,propName:"label"},{prop:this.name,propName:"name"}],"Radio Group")}render(){r(true,this.host,this.name,this.checkedValue,this.disabled);return e(s,{onKeyDown:this.handleKeyDown},e("div",{role:"radiogroup","aria-label":`${this.label}${this.required?", required":""}`},!this.hideLabel&&e("ic-input-label",{class:{[`${this.validationStatus}`]:true},label:this.label,helperText:this.helperText,required:this.required,disabled:this.disabled}),e("div",{class:"radio-buttons-container"},e("slot",null))),l(this.validationStatus,this.disabled)&&e("ic-input-validation",{ariaLiveMode:"polite",status:this.validationStatus,message:this.validationText}))}get host(){return o(this)}};p.style=h;export{p as ic_radio_group};
|
2
|
+
//# sourceMappingURL=p-ac6ecdb6.entry.js.map
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import{r as e,c as i,h as t,H as a,g as r}from"./p-5450cebf.js";import{
|
2
|
-
//# sourceMappingURL=p-
|
1
|
+
import{r as e,c as i,h as t,H as a,g as r}from"./p-5450cebf.js";import{u as o,d as n,a as c,r as s}from"./p-3dea2867.js";import"./p-6f57b13c.js";const d='/*! 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:flex;flex-direction:column;width:-moz-fit-content;width:fit-content}:host([additional-field-display="static"]) ::slotted(ic-text-field){margin-top:calc(var(--ic-space-sm) / 2);margin-left:var(--ic-space-xl)}:host([disabled]){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus)}.container{display:grid;grid-template-columns:min-content auto;position:relative;cursor:pointer;align-items:center;margin:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs)}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:0.063rem solid #a7acb3;border-radius:50%;transition:var(--ic-easing-transition-fast);box-sizing:border-box}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:0.063rem solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.063rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:0.125rem solid var(--ic-action-default)}.container input:checked:disabled~.checkmark{background-color:transparent;border:0.125rem solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:0.063rem dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:0.125rem solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:"";position:absolute;display:none;top:calc(50% - var(--ic-space-xs));left:calc(50% - var(--ic-space-xs));width:var(--ic-space-md);height:var(--ic-space-md);border-radius:50%;background:var(--ic-action-default)}.radio-label{margin-left:var(--ic-space-md)}.additional-field-wrapper{margin-left:var(--ic-space-xs)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default);margin-left:-0.063rem}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.container input:checked~.checkmark,.container:active input:checked~.checkmark{border-color:Highlight}.container input:checked~.checkmark::after,.container:active input:checked~.checkmark::after{background-color:Highlight}.container input:disabled~.checkmark,.container input:checked:disabled~.checkmark{border-color:GrayText}.container input:disabled~.checkmark::after,.container:active input:disabled~.checkmark::after{background-color:GrayText}}';const l=class{constructor(t){e(this,t);this.radioOptionSelect=i(this,"radioOptionSelect",7);this.icCheck=i(this,"icCheck",7);this.defaultRadioValue="";this.skipFocus=false;this.handleClick=()=>{if(!this.disabled){if(this.skipFocus===false){this.radioElement.focus()}this.skipFocus=false;if(this.hasAdditionalField){const e=this.host.querySelector("ic-text-field");this.value=e.value!==""?e.value:this.defaultRadioValue}this.icCheck.emit({value:this.value});this.radioOptionSelect.emit({value:this.value})}};this.swallowClick=e=>{e.stopPropagation()};this.hasAdditionalField=false;this.handleFormReset=()=>{this.skipFocus=true;this.selected=this.initiallySelected};this.selected=false;this.disabled=false;this.label=undefined;this.value=undefined;this.name=undefined;this.groupLabel=undefined;this.dynamicText="This selection requires additional answers";this.additionalFieldDisplay="static";this.initiallySelected=this.selected}selectedChangeHandler(e){if(e){this.handleClick()}}async setFocus(){if(this.host.shadowRoot.querySelector("input")){this.host.shadowRoot.querySelector("input").focus()}}componentWillLoad(){const e=o(this.host,"additional-field");if(e!==null){this.hasAdditionalField=true;const i=e[0];if(i.tagName==="IC-TEXT-FIELD"){const e=i;e.hiddenInput=false}}this.defaultRadioValue=this.value;n(this.host,this.handleFormReset)}textfieldValueHandler(e){const i=e.detail.value;if(this.selected){if(i!==""){this.value=e.detail.value;this.icCheck.emit({value:this.value});this.radioOptionSelect.emit({value:this.value})}else{this.value=this.defaultRadioValue;this.icCheck.emit({value:this.defaultRadioValue});this.radioOptionSelect.emit({value:this.defaultRadioValue})}}}componentDidLoad(){c([{prop:this.value,propName:"value"}],"Radio Option")}componentDidRender(){if(this.additionalFieldDisplay==="static"){const e=this.host.querySelector("ic-text-field");if(!this.selected){e&&e.setAttribute("disabled","")}else{e&&e.removeAttribute("disabled")}}}disconnectedCallback(){s(this.host,this.handleFormReset)}render(){const e=`ic-radio-option-${this.label!==undefined?this.label:this.value}-${this.groupLabel}`;return t(a,{onClick:this.handleClick},t("div",{class:{["container"]:true,["disabled"]:this.disabled}},t("div",null,t("input",{role:"radio",tabindex:this.selected?"0":"-1",type:"radio",name:this.name,id:e,value:this.value,disabled:this.disabled?true:null,checked:this.selected,ref:e=>this.radioElement=e}),t("span",{class:"checkmark"})),t("ic-typography",{class:"radio-label",variant:"body"},t("label",{htmlFor:e},this.label))),this.hasAdditionalField&&t("div",{onClick:this.swallowClick,class:{"dynamic-container":true,hidden:this.additionalFieldDisplay==="dynamic"&&!this.selected}},this.additionalFieldDisplay==="dynamic"&&t("div",{class:"branch-corner"}),t("div",null,this.additionalFieldDisplay==="dynamic"&&t("ic-typography",{variant:"caption"},t("p",{class:"dynamic-text"},this.dynamicText)),t("div",{class:{"additional-field-wrapper":this.additionalFieldDisplay==="static"}},t("slot",{name:"additional-field"})))))}static get delegatesFocus(){return true}get host(){return r(this)}static get watchers(){return{selected:["selectedChangeHandler"]}}};l.style=d;export{l as ic_radio_option};
|
2
|
+
//# sourceMappingURL=p-acb08809.entry.js.map
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as i,h as e,H as t,g as s,c as n}from"./p-5450cebf.js";import{a as c}from"./p-6f57b13c.js";import{i as o,L as r,a}from"./p-3dea2867.js";import{C as u}from"./p-8c7f4343.js";import{c as h}from"./p-ec26fc38.js";const l="ic-input-component-container{display:flex;border:0.063rem solid var(--border-color, var(--ic-architectural-400));border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-slow);height:2.5rem;width:var(--input-width, 20rem);padding:0.063rem;background-color:var(--ic-architectural-white);box-sizing:border-box;fill:var(--ic-architectural-400);outline:none}ic-input-component-container.fullwidth{width:100%}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:0.063rem dashed var(--ic-architectural-200)}ic-input-component-container.readonly,ic-input-component-container.readonly:hover{border:none;padding:0}ic-input-component-container.error{border:var(--ic-space-xxxs) solid var(--ic-status-error);padding:0}ic-input-component-container.warning{border:var(--ic-space-xxxs) solid var(--ic-status-warning-mid);padding:0}ic-input-component-container.success{border:var(--ic-space-xxxs) solid var(--ic-status-success);padding:0}ic-input-component-container.small{height:var(--ic-space-xl)}ic-input-component-container.multiline{height:auto}ic-input-component-container .icon-container{margin-top:var(--ic-space-xxs);margin-left:0.438rem;display:flex;align-items:center}ic-input-component-container.multiline .icon-container,ic-input-component-container.multiline.small .icon-container{margin-top:0.375rem;display:block}ic-input-component-container.readonly .icon-container{margin-left:-0.313rem}ic-input-component-container.disabled ::-moz-placeholder{display:none}ic-input-component-container.disabled ::placeholder{display:none}ic-input-component-container .inline-success{margin:var(--ic-space-xs) 0.375rem;display:flex;align-items:center}ic-input-component-container.dark:hover{--border-color:var(--ic-architectural-400)}ic-input-component-container .inline-success>svg{fill:var(--ic-status-success);height:1.25rem;width:1.25rem}ic-input-component-container:hover{border-color:var(--ic-action-dark-hover);color:var(--ic-action-dark-hover)}.focus-indicator{display:flex;width:100%;margin:-0.125rem;padding:0.125rem;border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast)}.focus-indicator:focus-within,.focus-indicator-enabled{box-shadow:var(--ic-border-focus)}.focus-indicator.dark:focus-within{box-shadow:var(--ic-border-focus)}@media (forced-colors: active){ic-input-component-container,.focus-indicator{transition:none}ic-input-component-container:focus-within{border:0.063rem solid Highlight;outline:0.125rem solid Highlight}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:0.063rem dashed GrayText}}";const m=class{constructor(e){i(this,e);this.disabled=false;this.readonly=false;this.validationStatus="";this.small=false;this.multiLine=false;this.validationInline=false;this.dark=false;this.fullWidth=false}render(){const{small:i,validationStatus:s,disabled:n,readonly:a,multiLine:u,fullWidth:h,dark:l,validationInline:m}=this;const d=this.validationStatus!==""&&!this.disabled&&!this.readonly?true:false;return e(t,{class:{["small"]:i,[s]:d,["disabled"]:n,["readonly"]:a,["multiline"]:u,["fullwidth"]:h,["dark"]:l}},e("div",{class:{"focus-indicator":true,dark:l}},o(this.host,"left-icon")&&e("div",{class:{["icon-container"]:true}},e("slot",{name:"left-icon"})),e("slot",null),m&&s===c.Success&&e("span",{class:{["inline-success"]:true},innerHTML:r})))}get host(){return s(this)}};m.style=l;const d="ic-input-container .component-container{display:flex;flex-direction:column}";const p=class{constructor(e){i(this,e);this.disabled=false;this.readonly=false}render(){return e(t,null,e("div",{class:{["component-container"]:true,["disabled"]:this.disabled,["readonly"]:this.readonly}},e("slot",null)))}};p.style=d;const f='html.sc-ic-menu{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu{margin:0}main.sc-ic-menu{display:block}h1.sc-ic-menu{font-size:2em;margin:0.67em 0}hr.sc-ic-menu{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu{background-color:transparent}abbr[title].sc-ic-menu{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu,strong.sc-ic-menu{font-weight:bolder}code.sc-ic-menu,kbd.sc-ic-menu,samp.sc-ic-menu{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu{font-size:80%}sub.sc-ic-menu,sup.sc-ic-menu{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu{bottom:-0.25em}sup.sc-ic-menu{top:-0.5em}img.sc-ic-menu{border-style:none}button.sc-ic-menu,input.sc-ic-menu,optgroup.sc-ic-menu,select.sc-ic-menu,textarea.sc-ic-menu{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu,input.sc-ic-menu{overflow:visible}button.sc-ic-menu,select.sc-ic-menu{text-transform:none}button.sc-ic-menu,[type="button"].sc-ic-menu,[type="reset"].sc-ic-menu,[type="submit"].sc-ic-menu{-webkit-appearance:button}button.sc-ic-menu::-moz-focus-inner,[type="button"].sc-ic-menu::-moz-focus-inner,[type="reset"].sc-ic-menu::-moz-focus-inner,[type="submit"].sc-ic-menu::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu:-moz-focusring,[type="button"].sc-ic-menu:-moz-focusring,[type="reset"].sc-ic-menu:-moz-focusring,[type="submit"].sc-ic-menu:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu{vertical-align:baseline}textarea.sc-ic-menu{overflow:auto}[type="checkbox"].sc-ic-menu,[type="radio"].sc-ic-menu{box-sizing:border-box;padding:0}[type="number"].sc-ic-menu::-webkit-inner-spin-button,[type="number"].sc-ic-menu::-webkit-outer-spin-button{height:auto}[type="search"].sc-ic-menu{-webkit-appearance:textfield;outline-offset:-2px}[type="search"].sc-ic-menu::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu{display:block}summary.sc-ic-menu{display:list-item}template.sc-ic-menu{display:none}[hidden].sc-ic-menu{display:none}html.sc-ic-menu,body.sc-ic-menu,div.sc-ic-menu,span.sc-ic-menu,applet.sc-ic-menu,object.sc-ic-menu,iframe.sc-ic-menu,h1.sc-ic-menu,h2.sc-ic-menu,h3.sc-ic-menu,h4.sc-ic-menu,h5.sc-ic-menu,h6.sc-ic-menu,p.sc-ic-menu,blockquote.sc-ic-menu,pre.sc-ic-menu,a.sc-ic-menu,abbr.sc-ic-menu,acronym.sc-ic-menu,address.sc-ic-menu,big.sc-ic-menu,cite.sc-ic-menu,code.sc-ic-menu,del.sc-ic-menu,dfn.sc-ic-menu,em.sc-ic-menu,img.sc-ic-menu,ins.sc-ic-menu,kbd.sc-ic-menu,q.sc-ic-menu,s.sc-ic-menu,samp.sc-ic-menu,small.sc-ic-menu,strike.sc-ic-menu,strong.sc-ic-menu,sub.sc-ic-menu,sup.sc-ic-menu,tt.sc-ic-menu,var.sc-ic-menu,b.sc-ic-menu,u.sc-ic-menu,i.sc-ic-menu,center.sc-ic-menu,dl.sc-ic-menu,dt.sc-ic-menu,dd.sc-ic-menu,ol.sc-ic-menu,ul.sc-ic-menu,li.sc-ic-menu,fieldset.sc-ic-menu,form.sc-ic-menu,label.sc-ic-menu,legend.sc-ic-menu,table.sc-ic-menu,caption.sc-ic-menu,tbody.sc-ic-menu,tfoot.sc-ic-menu,thead.sc-ic-menu,tr.sc-ic-menu,th.sc-ic-menu,td.sc-ic-menu,article.sc-ic-menu,aside.sc-ic-menu,canvas.sc-ic-menu,details.sc-ic-menu,embed.sc-ic-menu,figure.sc-ic-menu,figcaption.sc-ic-menu,footer.sc-ic-menu,header.sc-ic-menu,hgroup.sc-ic-menu,menu.sc-ic-menu,nav.sc-ic-menu,output.sc-ic-menu,ruby.sc-ic-menu,section.sc-ic-menu,summary.sc-ic-menu,time.sc-ic-menu,mark.sc-ic-menu,audio.sc-ic-menu,video.sc-ic-menu{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){[open].sc-ic-menu-h .menu.sc-ic-menu{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-h{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 20rem);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}.sc-ic-menu-h:not(.no-focus):focus-within{box-shadow:var(--ic-border-focus)}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border:0.063rem solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll.sc-ic-menu{overflow-y:auto}.menu.sc-ic-menu:focus-visible{outline:none}[open].sc-ic-menu-h{max-height:none;display:block}[open].sc-ic-menu-h .menu.sc-ic-menu{visibility:visible;max-height:20.125rem}.full-width.sc-ic-menu-h{width:100%}.option.sc-ic-menu{padding:0.5rem 0.438rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center}[small].sc-ic-menu-h .option.sc-ic-menu{padding:0.25rem 0.438rem}.option.sc-ic-menu:last-child{border-radius:0 0 0.063rem 0.063rem}.option.sc-ic-menu:first-child{border-radius:0.063rem 0.063rem 0 0}.option.sc-ic-menu:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option.sc-ic-menu:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu:not(.disabled-option) .option-description.sc-ic-menu{color:var(--ic-color-secondary-text)}.option-text-container.sc-ic-menu{pointer-events:none}.check-icon.sc-ic-menu{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:0.5rem;pointer-events:none}.focused-option.sc-ic-menu .check-icon.sc-ic-menu *.sc-ic-menu{fill:currentcolor}.option-group-title.sc-ic-menu{padding:1.5rem 0.438rem 0.5rem;color:var(--ic-color-tertiary-text)}[small].sc-ic-menu-h .option-group-title.sc-ic-menu{padding:0.75rem 0.438rem 0.25rem}.last-recommended-option.sc-ic-menu{border-bottom:0.063rem solid var(--ic-architectural-400)}.disabled-option.sc-ic-menu{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu,.focused-option.sc-ic-menu .option-description.sc-ic-menu{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}.no-results.sc-ic-menu-h li.sc-ic-menu{cursor:no-drop}.no-results.sc-ic-menu-h li.sc-ic-menu:hover{background-color:transparent}@media (forced-colors: active){.focused-option.sc-ic-menu:focus{outline:none;border:0.125rem solid transparent}}';const b=class{constructor(t){i(this,t);this.menuOptionSelect=n(this,"menuOptionSelect",7);this.menuStateChange=n(this,"menuStateChange",7);this.menuOptionId=n(this,"menuOptionId",7);this.menuKeyPress=n(this,"menuKeyPress",7);this.ungroupedOptionsSet=n(this,"ungroupedOptionsSet",7);this.handleClearListener=()=>{this.optionHighlighted=""};this.handleSubmitSearch=()=>{const i=this.options.findIndex((i=>i.value===this.optionHighlighted));this.setInputValue(i)};this.ungroupedOptions=[];this.preventClickOpen=false;this.isSearchBar=false;this.handleMenuChange=(i,e)=>{if(!i)this.popperInstance.destroy();this.menuStateChange.emit({open:i,focusInput:e});if(!i&&e!==false){this.inputEl.focus();this.preventClickOpen=false}};this.setNextOptionValue=i=>{if(this.ungroupedOptions[i+1]){this.menuOptionSelect.emit({value:this.ungroupedOptions[i+1].value,optionId:this.getOptionId(this.ungroupedOptions[i+1].value)})}else{this.menuOptionSelect.emit({value:this.ungroupedOptions[0].value,optionId:this.getOptionId(this.ungroupedOptions[0].value)})}};this.setPreviousOptionValue=i=>{if(this.ungroupedOptions[i-1]){this.menuOptionSelect.emit({value:this.ungroupedOptions[i-1].value,optionId:this.getOptionId(this.ungroupedOptions[i-1].value)})}else{this.menuOptionSelect.emit({value:this.ungroupedOptions[this.ungroupedOptions.length-1].value,optionId:this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length-1].value)})}};this.arrowBehaviour=i=>{i.preventDefault();this.handleMenuChange(true)};this.setHighlightedOption=i=>{this.optionHighlighted=this.options[i].value||undefined};this.autoSetInputValueKeyboardOpen=i=>{var e;const t=this.ungroupedOptions.findIndex((i=>i.value===this.value));this.keyboardNav=false;const s=((e=this.inputEl)===null||e===void 0?void 0:e.tagName)==="INPUT";switch(i.key){case"ArrowDown":this.keyboardNav=true;this.arrowBehaviour(i);this.setNextOptionValue(t);break;case"ArrowUp":this.keyboardNav=true;this.arrowBehaviour(i);this.setPreviousOptionValue(t);break;case" ":case"Enter":if(i.target.id!=="clear-button"){this.handleMenuChange(true)}break;case"Backspace":if(s){this.inputEl.focus()}break;default:if(s&&i.key!=="Tab"){this.inputEl.focus()}break}};this.manSetInputValueKeyboardOpen=i=>{const e=this.options.findIndex((i=>i.value===this.optionHighlighted));const t=i=>Array.from(this.host.querySelectorAll("li"))[i].id;switch(i.key){case"ArrowDown":this.arrowBehaviour(i);if(e<this.options.length-1){this.setHighlightedOption(e+1);this.menuOptionId.emit({optionId:t(e+1)})}else{this.setHighlightedOption(0);this.menuOptionId.emit({optionId:t(0)})}this.preventIncorrectTabOrder=false;this.focusFromSearchKeypress=false;break;case"ArrowUp":this.arrowBehaviour(i);if(e<=0||e>this.options.length+1){this.setHighlightedOption(this.options.length-1);this.menuOptionId.emit({optionId:t(this.options.length-1)})}else{this.setHighlightedOption(e-1);this.menuOptionId.emit({optionId:t(e-1)})}this.preventIncorrectTabOrder=false;this.focusFromSearchKeypress=false;break;case"Enter":i.preventDefault();this.setInputValue(e);break;case"Escape":this.handleMenuChange(false);this.menuOptionId.emit({optionId:undefined});break;case"Shift":case"Tab":this.preventIncorrectTabOrder=true;break;case"Backspace":if(this.isSearchBar){this.parentEl.setFocus();this.focusFromSearchKeypress=true;this.setHighlightedOption(0)}break;default:if(this.isSearchBar&&i.key!=="Tab"){this.parentEl.setFocus();this.focusFromSearchKeypress=true;this.setHighlightedOption(0)}break}};this.setInputValue=i=>{var e;if(this.options[i]){this.menuOptionSelect.emit({value:(e=this.options[i])===null||e===void 0?void 0:e.value});this.optionHighlighted=undefined;this.menuOptionId.emit({optionId:undefined})}this.handleMenuChange(false)};this.handleOptionClick=i=>{const{value:e,label:t}=i.target.dataset;this.menuOptionSelect.emit({value:e,label:t});this.handleMenuChange(false)};this.handleBlur=i=>{if(i.relatedTarget!==this.inputEl){if(!this.menu.contains(i.relatedTarget)){this.handleMenuChange(false,false)}}else{this.handleMenuChange(false);this.preventClickOpen=true}};this.handleMouseDown=i=>{i.preventDefault()};this.handleMenuKeyDown=i=>{if(this.activationType==="automatic"){this.autoSetValueOnMenuKeyDown(i)}};this.emitMenuKeyPress=(i,e)=>{this.menuKeyPress.emit({isNavKey:i,key:e})};this.autoSetValueOnMenuKeyDown=i=>{i.cancelBubble=true;const e=this.ungroupedOptions.findIndex((i=>i.value===this.value));const t=this.inputEl.tagName==="INPUT";this.keyboardNav=false;switch(i.key){case"ArrowUp":i.preventDefault();this.setPreviousOptionValue(e);this.keyboardNav=true;break;case"ArrowDown":i.preventDefault();this.setNextOptionValue(e);this.keyboardNav=true;break;case"Home":this.menuOptionSelect.emit({value:this.ungroupedOptions[0].value});this.keyboardNav=true;break;case"End":this.menuOptionSelect.emit({value:this.ungroupedOptions[this.ungroupedOptions.length-1].value});this.keyboardNav=true;break;case"Enter":case"Escape":this.handleMenuChange(false);break;case"Backspace":if(t){this.inputEl.focus()}break;case"Shift":break;default:if(t&&i.key!=="Tab"){this.inputEl.focus()}if(i.key.length===1){this.keyboardNav=true}break}this.emitMenuKeyPress(this.keyboardNav,i.key)};this.handleMenuKeyUp=i=>{if(i.key==="Tab"&&i.shiftKey){this.preventClickOpen=false}};this.getOptionId=i=>`${this.menuId}-${i}`;this.getOptionAriaLabel=(i,e)=>{let t=i.label;if(i.description){t=`${t}, ${i.description}`}if(e){return`${t}, ${e.label} group`}else{return t}};this.getSortedOptions=i=>{let e=[];if(i.sort){e=i.sort(((i,e)=>i.recommended&&!e.recommended?-1:0))}return e};this.isManualMode=this.activationType==="manual";this.scrollToSelected=i=>{const e=i.querySelector(".option[aria-selected]");if(e){const t=e.offsetTop+e.offsetHeight;if(t>i.scrollTop+i.offsetHeight||t<i.scrollTop+i.offsetHeight){i.scrollTop=e.offsetTop}e.focus()}};this.loadUngroupedOptions=()=>{if(this.options.length>0&&this.options.map){this.options.map((i=>{if(i.children){i.children.map((i=>!i.disabled&&this.ungroupedOptions.push(i)))}else if(!i.disabled){this.ungroupedOptions.push(i)}}))}this.ungroupedOptions=this.getSortedOptions(this.ungroupedOptions);this.ungroupedOptionsSet.emit({options:this.ungroupedOptions})};this.setMenuScrollbar=()=>{let i=0;this.host.querySelectorAll(".option").forEach((e=>i+=e.clientHeight));if(i>=320){this.menu.classList.add("menu-scroll")}};this.displayOption=(i,t,s)=>{const{open:n,value:c}=this;return e("li",{id:this.getOptionId(i.value),class:{option:true,"focused-option":this.isManualMode?(this.keyboardNav||this.initialOptionsListRender)&&i.value===this.optionHighlighted:this.keyboardNav&&i.value===c,"last-recommended-option":i.recommended&&this.options[t+1]&&!this.options[t+1].recommended,"disabled-option":i.disabled},role:"option",tabindex:n&&(i.value===c||i.value===this.optionHighlighted)&&this.keyboardNav?"0":"-1","aria-label":this.getOptionAriaLabel(i,s),"aria-selected":i.value===c,"aria-disabled":i.disabled?"true":"false",onClick:this.handleOptionClick,onBlur:this.handleBlur,onMouseDown:this.handleMouseDown,"data-value":i.value,"data-label":i.label},e("div",{class:"option-text-container"},e("ic-typography",{variant:"body","aria-hidden":"true"},e("p",null,i.label)),i.description&&e("ic-typography",{id:`${this.getOptionId(i.value)}-description`,class:"option-description",variant:"caption","aria-hidden":"true"},e("p",null,i.description))),(i===null||i===void 0?void 0:i.value.toLowerCase())===(c===null||c===void 0?void 0:c.toLowerCase())&&this.parentEl.tagName!=="IC-SEARCH-BAR"&&e("span",{class:"check-icon",innerHTML:u}))};this.open=undefined;this.options=undefined;this.small=false;this.menuId=undefined;this.value=undefined;this.activationType="automatic";this.inputEl=undefined;this.parentEl=undefined;this.inputLabel=undefined;this.anchorEl=undefined;this.fullWidth=false;this.autoFocusOnSelected=true;this.keyboardNav=false;this.optionHighlighted=undefined;this.focusFromSearchKeypress=false;this.initialOptionsListRender=false;this.preventIncorrectTabOrder=false}watchOptionsHandler(){this.ungroupedOptions=[];this.loadUngroupedOptions()}async handleClickOpen(){if(!this.preventClickOpen){this.menuStateChange.emit({open:!this.open});this.keyboardNav=false}this.preventClickOpen=false}async handleKeyboardOpen(i){this.keyboardNav=false;if(this.activationType==="automatic"){this.autoSetInputValueKeyboardOpen(i)}else{this.keyboardNav=true;this.manSetInputValueKeyboardOpen(i)}}async handleSetFirstOption(){this.setHighlightedOption(0)}connectedCallback(){var i;if(((i=this.parentEl)===null||i===void 0?void 0:i.tagName)==="IC-SEARCH-BAR"){this.setHighlightedOption(0);this.initialOptionsListRender=true}}componentWillLoad(){this.loadUngroupedOptions();this.isSearchBar=this.parentEl.tagName==="IC-SEARCH-BAR";this.parentEl.addEventListener("icClear",this.handleClearListener);this.parentEl.addEventListener("icSubmitSearch",this.handleSubmitSearch)}componentDidLoad(){if(this.isSearchBar&&this.parentEl.disableFilter){this.focusFromSearchKeypress=true}a([{prop:this.open,propName:"open"},{prop:this.options,propName:"options"},{prop:this.menuId,propName:"menu-id"},{prop:this.inputLabel,propName:"input-label"}],"Menu")}componentDidRender(){if(this.open){this.popperInstance=h(this.anchorEl,this.host,{placement:"bottom",modifiers:[{name:"offset",options:{offset:[0,7]}},{name:"flip",options:{fallbackPlacements:["top"],rootBoundary:"viewport"}}]})}if(this.open&&!!this.options.length){this.setMenuScrollbar()}}componentDidUpdate(){const i=this.options.some((i=>i.value===this.value));const e=this.optionHighlighted!==null&&this.optionHighlighted!==undefined&&this.optionHighlighted!=="";if(this.open&&this.options.length!==0){if(this.value&&this.keyboardNav&&i&&this.autoFocusOnSelected){this.scrollToSelected(this.menu)}else if(this.inputEl.tagName!=="IC-TEXT-FIELD"&&this.inputEl.tagName!=="INPUT"){this.menu.focus()}else if(e&&!this.focusFromSearchKeypress&&!this.preventIncorrectTabOrder){const i=this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`);if(i){i.focus()}}}}disconnectedCallback(){this.parentEl.removeEventListener("icClear",this.handleClearListener);this.parentEl.removeEventListener("icSubmitSearch",this.handleSubmitSearch)}render(){var i,s;const{inputLabel:n,options:c,menuId:o,value:r,fullWidth:a}=this;return e(t,{class:{"full-width":a,"no-focus":((i=this.inputEl)===null||i===void 0?void 0:i.tagName)==="INPUT"}},c.length!==0&&e("ul",{id:o,class:"menu",role:"listbox","aria-label":n,"aria-activedescendant":r!=null&&r!==""?this.getOptionId(r):"",tabindex:open&&!this.keyboardNav&&((s=this.inputEl)===null||s===void 0?void 0:s.tagName)!=="INPUT"?"0":"-1",ref:i=>this.menu=i,onKeyDown:this.handleMenuKeyDown,onKeyUp:this.handleMenuKeyUp,onBlur:this.handleBlur},this.getSortedOptions(c).map(((i,t)=>{if(i.children){if(i.children.length>0){return e("div",null,e("ic-typography",{class:"option-group-title",role:"presentation",variant:"subtitle-small"},e("p",null,i.label)),i.children.map((e=>this.displayOption(e,t,i))))}else{return null}}else{return this.displayOption(i,t)}}))))}get host(){return s(this)}static get watchers(){return{options:["watchOptionsHandler"]}}};b.style=f;export{m as ic_input_component_container,p as ic_input_container,b as ic_menu};
|
2
|
+
//# sourceMappingURL=p-affb42c7.entry.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["src/components/ic-input-component-container/ic-input-component-container.css?tag=ic-input-component-container","src/components/ic-input-component-container/ic-input-component-container.tsx","src/components/ic-input-container/ic-input-container.css?tag=ic-input-container","src/components/ic-input-container/ic-input-container.tsx","src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=scoped","src/components/ic-menu/ic-menu.tsx"],"names":["icInputComponentContainerCss","InputComponentContainer","[object Object]","small","validationStatus","disabled","readonly","multiLine","fullWidth","dark","validationInline","this","hasValidationStatus","h","Host","class","focus-indicator","isSlotUsed","host","name","IcInformationStatus","Success","innerHTML","successIcon","icInputContainerCss","InputContainer","icMenuCss","Menu","handleClearListener","optionHighlighted","handleSubmitSearch","highlightedOptionIndex","options","findIndex","option","value","setInputValue","ungroupedOptions","preventClickOpen","isSearchBar","handleMenuChange","open","focusInput","popperInstance","destroy","menuStateChange","emit","inputEl","focus","setNextOptionValue","selectedOptionIndex","menuOptionSelect","optionId","getOptionId","setPreviousOptionValue","length","arrowBehaviour","event","preventDefault","setHighlightedOption","highlightedIndex","undefined","autoSetInputValueKeyboardOpen","keyboardNav","isSearchableSelect","_a","tagName","key","target","id","manSetInputValueKeyboardOpen","index","Array","from","querySelectorAll","menuOptionId","preventIncorrectTabOrder","focusFromSearchKeypress","parentEl","setFocus","handleOptionClick","label","dataset","handleBlur","relatedTarget","menu","contains","handleMouseDown","handleMenuKeyDown","activationType","autoSetValueOnMenuKeyDown","emitMenuKeyPress","isNavKey","menuKeyPress","cancelBubble","handleMenuKeyUp","shiftKey","menuId","getOptionAriaLabel","parentOption","ariaLabel","description","getSortedOptions","sorted","sort","optionA","optionB","recommended","isManualMode","scrollToSelected","selectedOption","querySelector","elTop","offsetTop","offsetHeight","scrollTop","loadUngroupedOptions","map","children","push","ungroupedOptionsSet","setMenuScrollbar","optionsHeight","forEach","clientHeight","classList","add","displayOption","focused-option","initialOptionsListRender","last-recommended-option","disabled-option","role","tabindex","aria-label","aria-selected","aria-disabled","onClick","onBlur","onMouseDown","data-value","data-label","variant","aria-hidden","toLowerCase","Check","addEventListener","disableFilter","onComponentRequiredPropUndefined","prop","propName","inputLabel","createPopper","anchorEl","placement","modifiers","offset","fallbackPlacements","rootBoundary","inputValueInOptions","some","optionHighlightedIsSet","autoFocusOnSelected","highlightedEl","removeEventListener","full-width","no-focus","aria-activedescendant","_b","ref","el","onKeyDown","onKeyUp","childOption"],"mappings":"yNAAA,MAAMA,EAA+B,wkFCgBxBC,EAAuB,6CAIN,oBAIA,4BAI2B,cAI9B,qBAII,4BAIO,gBAKX,qBAKI,MAI7BC,SACE,MAAMC,MACJA,EAAKC,iBACLA,EAAgBC,SAChBA,EAAQC,SACRA,EAAQC,UACRA,EAASC,UACTA,EAASC,KACTA,EAAIC,iBACJA,GACEC,KACJ,MAAMC,EACJD,KAAKP,mBAAqB,KAAOO,KAAKN,WAAaM,KAAKL,SACpD,KACA,MACN,OACEO,EAACC,EAAI,CACHC,MAAO,CACLb,CAAC,SAAUC,EACXD,CAACE,GAAmBQ,EACpBV,CAAC,YAAaG,EACdH,CAAC,YAAaI,EACdJ,CAAC,aAAcK,EACfL,CAAC,aAAcM,EACfN,CAAC,QAASO,IAGZI,EAAA,MAAA,CACEE,MAAO,CACLC,kBAAmB,KACnBP,KAAMA,IAGPQ,EAAWN,KAAKO,KAAM,cACrBL,EAAA,MAAA,CACEE,MAAO,CACLb,CAAC,kBAAmB,OAGtBW,EAAA,OAAA,CAAMM,KAAK,eAGfN,EAAA,OAAA,MAECH,GACCN,IAAqBgB,EAAoBC,SACvCR,EAAA,OAAA,CACEE,MAAO,CACLb,CAAC,kBAAmB,MAEtBoB,UAAWC,4CCxG3B,MAAMC,EAAsB,oFCMfC,EAAc,6CAII,oBAKA,MAE7BvB,SACE,OACEW,EAACC,EAAI,KACHD,EAAA,MAAA,CACEE,MAAO,CACLb,CAAC,uBAAwB,KACzBA,CAAC,YAAaS,KAAKN,SACnBH,CAAC,YAAaS,KAAKL,WAGrBO,EAAA,OAAA,oBC3BV,MAAMa,EAAY,+4MC4BLC,EAAI,kRAoGPhB,KAAAiB,oBAAsB,KAC5BjB,KAAKkB,kBAAoB,IAGnBlB,KAAAmB,mBAAqB,KAC3B,MAAMC,EAAyBpB,KAAKqB,QAAQC,WACzCC,GAAWA,EAAOC,QAAUxB,KAAKkB,oBAGpClB,KAAKyB,cAAcL,IAIbpB,KAAA0B,iBAAmC,GAInC1B,KAAA2B,iBAA4B,MAC5B3B,KAAA4B,YAAuB,MAEvB5B,KAAA6B,iBAAmB,CAACC,EAAeC,KACzC,IAAKD,EAAM9B,KAAKgC,eAAeC,UAC/BjC,KAAKkC,gBAAgBC,KAAK,CAAEL,KAAAA,EAAMC,WAAAA,IAElC,IAAKD,GAAQC,IAAe,MAAO,CACjC/B,KAAKoC,QAAQC,QACbrC,KAAK2B,iBAAmB,QAIpB3B,KAAAsC,mBAAsBC,IAC5B,GAAIvC,KAAK0B,iBAAiBa,EAAsB,GAAI,CAClDvC,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiBa,EAAsB,GAAGf,MACtDiB,SAAUzC,KAAK0C,YACb1C,KAAK0B,iBAAiBa,EAAsB,GAAGf,aAG9C,CACLxB,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiB,GAAGF,MAChCiB,SAAUzC,KAAK0C,YAAY1C,KAAK0B,iBAAiB,GAAGF,WAKlDxB,KAAA2C,uBAA0BJ,IAChC,GAAIvC,KAAK0B,iBAAiBa,EAAsB,GAAI,CAClDvC,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiBa,EAAsB,GAAGf,MACtDiB,SAAUzC,KAAK0C,YACb1C,KAAK0B,iBAAiBa,EAAsB,GAAGf,aAG9C,CACLxB,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiB1B,KAAK0B,iBAAiBkB,OAAS,GAAGpB,MAC/DiB,SAAUzC,KAAK0C,YACb1C,KAAK0B,iBAAiB1B,KAAK0B,iBAAiBkB,OAAS,GAAGpB,WA2CxDxB,KAAA6C,eAAkBC,IACxBA,EAAMC,iBACN/C,KAAK6B,iBAAiB,OAGhB7B,KAAAgD,qBAAwBC,IAC9BjD,KAAKkB,kBAAoBlB,KAAKqB,QAAQ4B,GAAkBzB,OAAS0B,WAG3DlD,KAAAmD,8BAAiCL,UACvC,MAAMP,EAAsBvC,KAAK0B,iBAAiBJ,WAC/CC,GAAWA,EAAOC,QAAUxB,KAAKwB,QAGpCxB,KAAKoD,YAAc,MAEnB,MAAMC,IAAqBC,EAAAtD,KAAKoC,WAAO,MAAAkB,SAAA,OAAA,EAAAA,EAAEC,WAAY,QAErD,OAAQT,EAAMU,KACZ,IAAK,YACHxD,KAAKoD,YAAc,KACnBpD,KAAK6C,eAAeC,GACpB9C,KAAKsC,mBAAmBC,GACxB,MACF,IAAK,UACHvC,KAAKoD,YAAc,KACnBpD,KAAK6C,eAAeC,GACpB9C,KAAK2C,uBAAuBJ,GAC5B,MACF,IAAK,IACL,IAAK,QACH,GAAKO,EAAMW,OAAuBC,KAAO,eAAgB,CACvD1D,KAAK6B,iBAAiB,MAExB,MACF,IAAK,YACH,GAAIwB,EAAoB,CACtBrD,KAAKoC,QAAQC,QAEf,MACF,QACE,GAAIgB,GAAsBP,EAAMU,MAAQ,MAAO,CAC7CxD,KAAKoC,QAAQC,QAEf,QAIErC,KAAA2D,6BAAgCb,IACtC,MAAM1B,EAAyBpB,KAAKqB,QAAQC,WACzCC,GAAWA,EAAOC,QAAUxB,KAAKkB,oBAGpC,MAAMwB,EAAekB,GACnBC,MAAMC,KAAK9D,KAAKO,KAAKwD,iBAAiB,OAAOH,GAAOF,GAEtD,OAAQZ,EAAMU,KACZ,IAAK,YACHxD,KAAK6C,eAAeC,GACpB,GAAI1B,EAAyBpB,KAAKqB,QAAQuB,OAAS,EAAG,CACpD5C,KAAKgD,qBAAqB5B,EAAyB,GACnDpB,KAAKgE,aAAa7B,KAAK,CACrBM,SAAUC,EAAYtB,EAAyB,SAE5C,CACLpB,KAAKgD,qBAAqB,GAC1BhD,KAAKgE,aAAa7B,KAAK,CACrBM,SAAUC,EAAY,KAG1B1C,KAAKiE,yBAA2B,MAChCjE,KAAKkE,wBAA0B,MAC/B,MACF,IAAK,UACHlE,KAAK6C,eAAeC,GACpB,GACE1B,GAA0B,GAC1BA,EAAyBpB,KAAKqB,QAAQuB,OAAS,EAC/C,CACA5C,KAAKgD,qBAAqBhD,KAAKqB,QAAQuB,OAAS,GAChD5C,KAAKgE,aAAa7B,KAAK,CACrBM,SAAUC,EAAY1C,KAAKqB,QAAQuB,OAAS,SAEzC,CACL5C,KAAKgD,qBAAqB5B,EAAyB,GACnDpB,KAAKgE,aAAa7B,KAAK,CACrBM,SAAUC,EAAYtB,EAAyB,KAGnDpB,KAAKiE,yBAA2B,MAChCjE,KAAKkE,wBAA0B,MAC/B,MACF,IAAK,QACHpB,EAAMC,iBACN/C,KAAKyB,cAAcL,GACnB,MACF,IAAK,SACHpB,KAAK6B,iBAAiB,OACtB7B,KAAKgE,aAAa7B,KAAK,CAAEM,SAAUS,YACnC,MACF,IAAK,QACL,IAAK,MACHlD,KAAKiE,yBAA2B,KAChC,MACF,IAAK,YACH,GAAIjE,KAAK4B,YAAa,CACnB5B,KAAKmE,SAAoCC,WAC1CpE,KAAKkE,wBAA0B,KAC/BlE,KAAKgD,qBAAqB,GAE5B,MACF,QACE,GAAIhD,KAAK4B,aAAekB,EAAMU,MAAQ,MAAO,CAC1CxD,KAAKmE,SAAoCC,WAC1CpE,KAAKkE,wBAA0B,KAC/BlE,KAAKgD,qBAAqB,GAE5B,QAIEhD,KAAAyB,cAAiBL,UACvB,GAAIpB,KAAKqB,QAAQD,GAAyB,CACxCpB,KAAKwC,iBAAiBL,KAAK,CACzBX,OAAO8B,EAAAtD,KAAKqB,QAAQD,MAAuB,MAAAkC,SAAA,OAAA,EAAAA,EAAE9B,QAE/CxB,KAAKkB,kBAAoBgC,UACzBlD,KAAKgE,aAAa7B,KAAK,CAAEM,SAAUS,YAErClD,KAAK6B,iBAAiB,QAGhB7B,KAAAqE,kBAAqBvB,IAC3B,MAAMtB,MAAEA,EAAK8C,MAAEA,GAAWxB,EAAMW,OAAyBc,QACzDvE,KAAKwC,iBAAiBL,KAAK,CAAEX,MAAAA,EAAO8C,MAAAA,IACpCtE,KAAK6B,iBAAiB,QAGhB7B,KAAAwE,WAAc1B,IACpB,GAAIA,EAAM2B,gBAAkBzE,KAAKoC,QAAS,CACxC,IAAKpC,KAAK0E,KAAKC,SAAS7B,EAAM2B,eAA+B,CAC3DzE,KAAK6B,iBAAiB,MAAO,YAE1B,CACL7B,KAAK6B,iBAAiB,OACtB7B,KAAK2B,iBAAmB,OAIpB3B,KAAA4E,gBAAmB9B,IACzBA,EAAMC,kBAGA/C,KAAA6E,kBAAqB/B,IAC3B,GAAI9C,KAAK8E,iBAAmB,YAAa,CACvC9E,KAAK+E,0BAA0BjC,KAI3B9C,KAAAgF,iBAAmB,CAACC,EAAmBzB,KAC7CxD,KAAKkF,aAAa/C,KAAK,CAAE8C,SAAUA,EAAUzB,IAAKA,KAG5CxD,KAAA+E,0BAA6BjC,IACnCA,EAAMqC,aAAe,KACrB,MAAM5C,EAAsBvC,KAAK0B,iBAAiBJ,WAC/CC,GAAWA,EAAOC,QAAUxB,KAAKwB,QAGpC,MAAM6B,EAAqBrD,KAAKoC,QAAQmB,UAAY,QAEpDvD,KAAKoD,YAAc,MAEnB,OAAQN,EAAMU,KACZ,IAAK,UACHV,EAAMC,iBACN/C,KAAK2C,uBAAuBJ,GAC5BvC,KAAKoD,YAAc,KACnB,MACF,IAAK,YACHN,EAAMC,iBACN/C,KAAKsC,mBAAmBC,GACxBvC,KAAKoD,YAAc,KACnB,MACF,IAAK,OACHpD,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiB,GAAGF,QAElCxB,KAAKoD,YAAc,KACnB,MACF,IAAK,MACHpD,KAAKwC,iBAAiBL,KAAK,CACzBX,MAAOxB,KAAK0B,iBAAiB1B,KAAK0B,iBAAiBkB,OAAS,GAAGpB,QAEjExB,KAAKoD,YAAc,KACnB,MACF,IAAK,QACL,IAAK,SACHpD,KAAK6B,iBAAiB,OACtB,MACF,IAAK,YACH,GAAIwB,EAAoB,CACtBrD,KAAKoC,QAAQC,QAEf,MACF,IAAK,QACH,MACF,QACE,GAAIgB,GAAsBP,EAAMU,MAAQ,MAAO,CAC7CxD,KAAKoC,QAAQC,QAEf,GAAIS,EAAMU,IAAIZ,SAAW,EAAG,CAC1B5C,KAAKoD,YAAc,KAErB,MAEJpD,KAAKgF,iBAAiBhF,KAAKoD,YAAaN,EAAMU,MAGxCxD,KAAAoF,gBAAmBtC,IACzB,GAAIA,EAAMU,MAAQ,OAASV,EAAMuC,SAAU,CACzCrF,KAAK2B,iBAAmB,QAIpB3B,KAAA0C,YAAelB,GACd,GAAGxB,KAAKsF,UAAU9D,IAGnBxB,KAAAuF,mBAAqB,CAC3BhE,EACAiE,KAEA,IAAIC,EAAYlE,EAAO+C,MAEvB,GAAI/C,EAAOmE,YAAa,CACtBD,EAAY,GAAGA,MAAclE,EAAOmE,cAGtC,GAAIF,EAAc,CAChB,MAAO,GAAGC,MAAcD,EAAalB,kBAChC,CACL,OAAOmB,IAIHzF,KAAA2F,iBAAoBtE,IAC1B,IAAIuE,EAAyB,GAC7B,GAAIvE,EAAQwE,KAAM,CAChBD,EAASvE,EAAQwE,MAAK,CAACC,EAASC,IAC9BD,EAAQE,cAAgBD,EAAQC,aAAe,EAAI,IAGvD,OAAOJ,GAGD5F,KAAAiG,aAAejG,KAAK8E,iBAAmB,SAEvC9E,KAAAkG,iBAAoBxB,IAC1B,MAAMyB,EAAiBzB,EAAK0B,cAC1B,0BAGF,GAAID,EAAgB,CAClB,MAAME,EAAQF,EAAeG,UAAYH,EAAeI,aACxD,GACEF,EAAQ3B,EAAK8B,UAAY9B,EAAK6B,cAC9BF,EAAQ3B,EAAK8B,UAAY9B,EAAK6B,aAC9B,CACA7B,EAAK8B,UAAYL,EAAeG,UAElCH,EAAe9D,UAIXrC,KAAAyG,qBAAuB,KAC7B,GAAIzG,KAAKqB,QAAQuB,OAAS,GAAK5C,KAAKqB,QAAQqF,IAAK,CAC/C1G,KAAKqB,QAAQqF,KAAKnF,IAChB,GAAIA,EAAOoF,SAAU,CACnBpF,EAAOoF,SAASD,KACbnF,IAAYA,EAAO7B,UAAYM,KAAK0B,iBAAiBkF,KAAKrF,UAExD,IAAKA,EAAO7B,SAAU,CAC3BM,KAAK0B,iBAAiBkF,KAAKrF,OAIjCvB,KAAK0B,iBAAmB1B,KAAK2F,iBAAiB3F,KAAK0B,kBACnD1B,KAAK6G,oBAAoB1E,KAAK,CAAEd,QAASrB,KAAK0B,oBAGxC1B,KAAA8G,iBAAmB,KACzB,IAAIC,EAAgB,EACpB/G,KAAKO,KACFwD,iBAAiB,WACjBiD,SAASzF,GAAYwF,GAAiBxF,EAAO0F,eAEhD,GAAIF,GAAiB,IAAK,CACxB/G,KAAK0E,KAAKwC,UAAUC,IAAI,iBAgHpBnH,KAAAoH,cAAgB,CACtB7F,EACAqC,EACA4B,KAEA,MAAM1D,KAAEA,EAAIN,MAAEA,GAAUxB,KAExB,OACEE,EAAA,KAAA,CACEwD,GAAI1D,KAAK0C,YAAYnB,EAAOC,OAC5BpB,MAAO,CACLmB,OAAQ,KACR8F,iBAAkBrH,KAAKiG,cAClBjG,KAAKoD,aAAepD,KAAKsH,2BAC1B/F,EAAOC,QAAUxB,KAAKkB,kBACtBlB,KAAKoD,aAAe7B,EAAOC,QAAUA,EACzC+F,0BACEhG,EAAOyE,aACPhG,KAAKqB,QAAQuC,EAAQ,KACpB5D,KAAKqB,QAAQuC,EAAQ,GAAGoC,YAC3BwB,kBAAmBjG,EAAO7B,UAE5B+H,KAAK,SACLC,SACE5F,IACCP,EAAOC,QAAUA,GAASD,EAAOC,QAAUxB,KAAKkB,oBACjDlB,KAAKoD,YACD,IACA,KAAIuE,aAEE3H,KAAKuF,mBAAmBhE,EAAQiE,GAAaoC,gBAC1CrG,EAAOC,QAAUA,EAAKqG,gBACtBtG,EAAO7B,SAAW,OAAS,QAC1CoI,QAAS9H,KAAKqE,kBACd0D,OAAQ/H,KAAKwE,WACbwD,YAAahI,KAAK4E,gBAAeqD,aACrB1G,EAAOC,MAAK0G,aACZ3G,EAAO+C,OAEnBpE,EAAA,MAAA,CAAKE,MAAM,yBACTF,EAAA,gBAAA,CAAeiI,QAAQ,OAAMC,cAAa,QACxClI,EAAA,IAAA,KAAIqB,EAAO+C,QAEZ/C,EAAOmE,aACNxF,EAAA,gBAAA,CACEwD,GAAI,GAAG1D,KAAK0C,YAAYnB,EAAOC,qBAC/BpB,MAAM,qBACN+H,QAAQ,UAASC,cACL,QAEZlI,EAAA,IAAA,KAAIqB,EAAOmE,gBAIhBnE,IAAM,MAANA,SAAM,OAAA,EAANA,EAAQC,MAAM6G,kBAAkB7G,IAAK,MAALA,SAAK,OAAA,EAALA,EAAO6G,gBACtCrI,KAAKmE,SAASZ,UAAY,iBACxBrD,EAAA,OAAA,CAAME,MAAM,aAAaO,UAAW2H,4DA3oBH,qEAeE,4HAyBhB,+BAKU,sBAEP,oEAEY,oCACC,oCACA,MAG7C/I,sBACES,KAAK0B,iBAAmB,GACxB1B,KAAKyG,uBAgGPlH,wBACE,IAAKS,KAAK2B,iBAAkB,CAC1B3B,KAAKkC,gBAAgBC,KAAK,CAAEL,MAAO9B,KAAK8B,OACxC9B,KAAKoD,YAAc,MAErBpD,KAAK2B,iBAAmB,MAS1BpC,yBAAyBuD,GACvB9C,KAAKoD,YAAc,MAEnB,GAAIpD,KAAK8E,iBAAmB,YAAa,CACvC9E,KAAKmD,8BAA8BL,OAC9B,CACL9C,KAAKoD,YAAc,KACnBpD,KAAK2D,6BAA6Bb,IAQtCvD,6BACES,KAAKgD,qBAAqB,GAiT5BzD,0BACE,KAAI+D,EAAAtD,KAAKmE,YAAQ,MAAAb,SAAA,OAAA,EAAAA,EAAEC,WAAY,gBAAiB,CAC9CvD,KAAKgD,qBAAqB,GAC1BhD,KAAKsH,yBAA2B,MAIpC/H,oBACES,KAAKyG,uBACLzG,KAAK4B,YAAc5B,KAAKmE,SAASZ,UAAY,gBAC7CvD,KAAKmE,SAASoE,iBAAiB,UAAWvI,KAAKiB,qBAC/CjB,KAAKmE,SAASoE,iBAAiB,iBAAkBvI,KAAKmB,oBAGxD5B,mBACE,GACES,KAAK4B,aACJ5B,KAAKmE,SAAoCqE,cAC1C,CACAxI,KAAKkE,wBAA0B,KAGjCuE,EACE,CACE,CAAEC,KAAM1I,KAAK8B,KAAM6G,SAAU,QAC7B,CAAED,KAAM1I,KAAKqB,QAASsH,SAAU,WAChC,CAAED,KAAM1I,KAAKsF,OAAQqD,SAAU,WAC/B,CAAED,KAAM1I,KAAK4I,WAAYD,SAAU,gBAGrC,QAIJpJ,qBACE,GAAIS,KAAK8B,KAAM,CACb9B,KAAKgC,eAAiB6G,EAAa7I,KAAK8I,SAAU9I,KAAKO,KAAM,CAC3DwI,UAAW,SACXC,UAAW,CACT,CACExI,KAAM,SACNa,QAAS,CACP4H,OAAQ,CAAC,EAAG,KAGhB,CACEzI,KAAM,OACNa,QAAS,CACP6H,mBAAoB,CAAC,OACrBC,aAAc,gBAOxB,GAAInJ,KAAK8B,QAAU9B,KAAKqB,QAAQuB,OAAQ,CACtC5C,KAAK8G,oBAITvH,qBACE,MAAM6J,EAA+BpJ,KAAKqB,QAAQgI,MAC/C9H,GAAWA,EAAOC,QAAUxB,KAAKwB,QAGpC,MAAM8H,EACJtJ,KAAKkB,oBAAsB,MAC3BlB,KAAKkB,oBAAsBgC,WAC3BlD,KAAKkB,oBAAsB,GAE7B,GAAIlB,KAAK8B,MAAQ9B,KAAKqB,QAAQuB,SAAW,EAAG,CAC1C,GACE5C,KAAKwB,OACLxB,KAAKoD,aACLgG,GACApJ,KAAKuJ,oBACL,CACAvJ,KAAKkG,iBAAiBlG,KAAK0E,WACtB,GACL1E,KAAKoC,QAAQmB,UAAY,iBACzBvD,KAAKoC,QAAQmB,UAAY,QACzB,CACAvD,KAAK0E,KAAKrC,aACL,GACLiH,IACCtJ,KAAKkE,0BACLlE,KAAKiE,yBACN,CACA,MAAMuF,EAAgBxJ,KAAKO,KAAK6F,cAC9B,kBAAkBpG,KAAKkB,uBAGzB,GAAIsI,EAAe,CACjBA,EAAcnH,WAMtB9C,uBACES,KAAKmE,SAASsF,oBAAoB,UAAWzJ,KAAKiB,qBAClDjB,KAAKmE,SAASsF,oBACZ,iBACAzJ,KAAKmB,oBAkET5B,iBACE,MAAMqJ,WAAEA,EAAUvH,QAAEA,EAAOiE,OAAEA,EAAM9D,MAAEA,EAAK3B,UAAEA,GAAcG,KAE1D,OACEE,EAACC,EAAI,CACHC,MAAO,CACLsJ,aAAc7J,EACd8J,aAAYrG,EAAAtD,KAAKoC,WAAO,MAAAkB,SAAA,OAAA,EAAAA,EAAEC,WAAY,UAGvClC,EAAQuB,SAAW,GAClB1C,EAAA,KAAA,CACEwD,GAAI4B,EACJlF,MAAM,OACNqH,KAAK,UAASE,aACFiB,EAAUgB,wBAEpBpI,GAAS,MAAQA,IAAU,GAAKxB,KAAK0C,YAAYlB,GAAS,GAE5DkG,SACE5F,OAAS9B,KAAKoD,eAAeyG,EAAA7J,KAAKoC,WAAO,MAAAyH,SAAA,OAAA,EAAAA,EAAEtG,WAAY,QACnD,IACA,KAENuG,IAAMC,GAAQ/J,KAAK0E,KAAOqF,EAC1BC,UAAWhK,KAAK6E,kBAChBoF,QAASjK,KAAKoF,gBACd2C,OAAQ/H,KAAKwE,YAEZxE,KAAK2F,iBAAiBtE,GAASqF,KAAI,CAACnF,EAAQqC,KAC3C,GAAIrC,EAAOoF,SAAU,CACnB,GAAIpF,EAAOoF,SAAS/D,OAAS,EAAG,CAC9B,OACE1C,EAAA,MAAA,KACEA,EAAA,gBAAA,CACEE,MAAM,qBACNqH,KAAK,eACLU,QAAQ,kBAERjI,EAAA,IAAA,KAAIqB,EAAO+C,QAEZ/C,EAAOoF,SAASD,KAAKwD,GACpBlK,KAAKoH,cAAc8C,EAAatG,EAAOrC,UAIxC,CACL,OAAO,UAEJ,CACL,OAAOvB,KAAKoH,cAAc7F,EAAQqC","sourcesContent":["ic-input-component-container {\n /**\n * @prop --border-color: Border colour of the input component container\n */\n\n display: flex;\n border: 0.063rem solid var(--border-color, var(--ic-architectural-400));\n border-radius: var(--ic-border-radius);\n transition: var(--ic-easing-transition-slow);\n height: 2.5rem;\n width: var(--input-width, 20rem);\n padding: 0.063rem;\n background-color: var(--ic-architectural-white);\n box-sizing: border-box;\n fill: var(--ic-architectural-400);\n outline: none;\n}\n\nic-input-component-container.fullwidth {\n width: 100%;\n}\n\nic-input-component-container.disabled,\nic-input-component-container.disabled:hover {\n border: 0.063rem dashed var(--ic-architectural-200);\n}\n\nic-input-component-container.readonly,\nic-input-component-container.readonly:hover {\n border: none;\n padding: 0;\n}\n\nic-input-component-container.error {\n border: var(--ic-space-xxxs) solid var(--ic-status-error);\n padding: 0;\n}\n\nic-input-component-container.warning {\n border: var(--ic-space-xxxs) solid var(--ic-status-warning-mid);\n padding: 0;\n}\n\nic-input-component-container.success {\n border: var(--ic-space-xxxs) solid var(--ic-status-success);\n padding: 0;\n}\n\nic-input-component-container.small {\n height: var(--ic-space-xl);\n}\n\nic-input-component-container.multiline {\n height: auto;\n}\n\nic-input-component-container .icon-container {\n margin-top: var(--ic-space-xxs);\n margin-left: 0.438rem;\n display: flex;\n align-items: center;\n}\n\nic-input-component-container.multiline .icon-container,\nic-input-component-container.multiline.small .icon-container {\n margin-top: 0.375rem;\n display: block;\n}\n\nic-input-component-container.readonly .icon-container {\n margin-left: -0.313rem;\n}\n\nic-input-component-container.disabled ::placeholder {\n display: none;\n}\n\nic-input-component-container .inline-success {\n margin: var(--ic-space-xs) 0.375rem;\n display: flex;\n align-items: center;\n}\n\nic-input-component-container.dark:hover {\n --border-color: var(--ic-architectural-400);\n}\n\nic-input-component-container .inline-success > svg {\n fill: var(--ic-status-success);\n height: 1.25rem;\n width: 1.25rem;\n}\n\nic-input-component-container:hover {\n border-color: var(--ic-action-dark-hover);\n color: var(--ic-action-dark-hover);\n}\n\n.focus-indicator {\n display: flex;\n width: 100%;\n margin: -0.125rem;\n padding: 0.125rem;\n border-radius: var(--ic-border-radius);\n transition: var(--ic-easing-transition-fast);\n}\n\n.focus-indicator:focus-within,\n.focus-indicator-enabled {\n box-shadow: var(--ic-border-focus);\n}\n\n.focus-indicator.dark:focus-within {\n box-shadow: var(--ic-border-focus);\n}\n\n@media (forced-colors: active) {\n /* Styles here only apply to Forced Colors Mode */\n ic-input-component-container,\n .focus-indicator {\n transition: none;\n }\n\n ic-input-component-container:focus-within {\n border: 0.063rem solid Highlight;\n outline: 0.125rem solid Highlight;\n }\n\n ic-input-component-container.disabled,\n ic-input-component-container.disabled:hover {\n border: 0.063rem dashed GrayText;\n }\n}\n","import { Component, Element, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n IcInformationStatus,\n IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot left-icon - Content will be placed to the left of the input.\n */\n@Component({\n tag: \"ic-input-component-container\",\n styleUrl: \"ic-input-component-container.css\",\n})\nexport class InputComponentContainer {\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop() disabled: boolean = false;\n /**\n * If `true`, the readonly state will be set.\n */\n @Prop() readonly: boolean = false;\n /**\n * The validation status of the input component container - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n /**\n * If `true`, the small styling will be applied to the input component container.\n */\n @Prop() small: boolean = false;\n /**\n * If `true`, the input component container will allow for multiple lines.\n */\n @Prop() multiLine: boolean = false;\n /**\n * If `true`, the validation will display inline.\n */\n @Prop() validationInline: boolean = false;\n\n /**\n * If `true`, the dark variant of the input component container will be displayed.\n */\n @Prop() dark?: boolean = false;\n\n /**\n * If `true`, the input component container will fill the width of the container it is in.\n */\n @Prop() fullWidth: boolean = false;\n\n @Element() host: HTMLIcInputComponentContainerElement;\n\n render() {\n const {\n small,\n validationStatus,\n disabled,\n readonly,\n multiLine,\n fullWidth,\n dark,\n validationInline,\n } = this;\n const hasValidationStatus =\n this.validationStatus !== \"\" && !this.disabled && !this.readonly\n ? true\n : false;\n return (\n <Host\n class={{\n [\"small\"]: small,\n [validationStatus]: hasValidationStatus,\n [\"disabled\"]: disabled,\n [\"readonly\"]: readonly,\n [\"multiline\"]: multiLine,\n [\"fullwidth\"]: fullWidth,\n [\"dark\"]: dark,\n }}\n >\n <div\n class={{\n \"focus-indicator\": true,\n dark: dark,\n }}\n >\n {isSlotUsed(this.host, \"left-icon\") && (\n <div\n class={{\n [\"icon-container\"]: true,\n }}\n >\n <slot name=\"left-icon\" />\n </div>\n )}\n <slot></slot>\n\n {validationInline &&\n validationStatus === IcInformationStatus.Success && (\n <span\n class={{\n [\"inline-success\"]: true,\n }}\n innerHTML={successIcon}\n />\n )}\n </div>\n </Host>\n );\n }\n}\n","ic-input-container .component-container {\n display: flex;\n flex-direction: column;\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\n@Component({\n tag: \"ic-input-container\",\n styleUrl: \"ic-input-container.css\",\n})\nexport class InputContainer {\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop() disabled?: boolean = false;\n\n /**\n * If `true`, the readonly state will be set.\n */\n @Prop() readonly?: boolean = false;\n\n render() {\n return (\n <Host>\n <div\n class={{\n [\"component-container\"]: true,\n [\"disabled\"]: this.disabled,\n [\"readonly\"]: this.readonly,\n }}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-menu: z-index of menu\n */\n\n@media (prefers-reduced-motion: no-preference) {\n :host([open]) .menu {\n transition: max-height var(--ic-transition-duration-slow);\n }\n}\n\n:host {\n border-radius: var(--ic-border-radius);\n max-height: 0;\n width: var(--input-width, 20rem);\n color: var(--ic-color-primary-text);\n background-color: var(--ic-architectural-white);\n position: relative;\n z-index: var(--ic-z-index-menu);\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n box-shadow: var(--ic-border-focus);\n}\n\n.menu {\n text-decoration: none;\n list-style-type: none;\n border: 0.063rem solid var(--ic-architectural-400);\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-architectural-white);\n visibility: hidden;\n max-height: 0;\n overflow-y: hidden;\n}\n\n.menu-scroll {\n overflow-y: auto;\n}\n\n.menu:focus-visible {\n outline: none;\n}\n\n:host([open]) {\n max-height: none;\n display: block;\n}\n\n:host([open]) .menu {\n visibility: visible;\n max-height: 20.125rem;\n}\n\n:host(.full-width) {\n width: 100%;\n}\n\n.option {\n padding: 0.5rem 0.438rem;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n:host([small]) .option {\n padding: 0.25rem 0.438rem;\n}\n\n.option:last-child {\n border-radius: 0 0 0.063rem 0.063rem;\n}\n\n.option:first-child {\n border-radius: 0.063rem 0.063rem 0 0;\n}\n\n.option:not(.disabled-option):hover {\n background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n color: var(--ic-color-secondary-text);\n}\n\n.option-text-container {\n pointer-events: none;\n}\n\n.check-icon {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n margin-left: 0.5rem;\n pointer-events: none;\n}\n\n.focused-option .check-icon * {\n fill: currentcolor;\n}\n\n.option-group-title {\n padding: 1.5rem 0.438rem 0.5rem;\n color: var(--ic-color-tertiary-text);\n}\n\n:host([small]) .option-group-title {\n padding: 0.75rem 0.438rem 0.25rem;\n}\n\n.last-recommended-option {\n border-bottom: 0.063rem solid var(--ic-architectural-400);\n}\n\n.disabled-option {\n color: var(--ic-architectural-200);\n cursor: default;\n pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n background-color: var(--ic-focus-blue) !important;\n color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n background-color: transparent;\n}\n\n@media (forced-colors: active) {\n .focused-option:focus {\n outline: none;\n border: 0.125rem solid transparent;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Method,\n State,\n Watch,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport { IcActivationTypes, IcMenuOption } from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n IcOptionSelectEventDetail,\n IcMenuChangeEventDetail,\n IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\n\n@Component({\n tag: \"ic-menu\",\n styleUrl: \"ic-menu.css\",\n scoped: true,\n})\nexport class Menu {\n @Element() host: HTMLIcMenuElement;\n\n /**\n * If `true`, the menu will be displayed open.\n */\n @Prop({ reflect: true }) open!: boolean;\n\n /**\n * The possible menu selection options.\n */\n @Prop() options!: IcMenuOption[];\n\n /**\n * If `true`, the small styling will be applied to the menu.\n */\n @Prop({ reflect: true }) small?: boolean = false;\n\n /**\n * The ID of the menu.\n */\n @Prop() menuId!: string;\n\n /**\n * The value of the currently selected option.\n */\n @Prop() value!: string;\n\n /**\n * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n */\n @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n /**\n * The reference to the input element.\n */\n @Prop() inputEl!: HTMLElement;\n\n /**\n * @internal - The parent element if ic-menu is nested inside another component.\n */\n @Prop() parentEl?: HTMLElement;\n\n /**\n * The label for the input element.\n */\n @Prop() inputLabel!: string;\n\n /**\n * The reference to an anchor element the menu will position itself from when rendered.\n */\n @Prop() anchorEl!: HTMLElement;\n\n /**\n * If `true`, the menu will fill the width of the container.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * @internal If `true`, autofocus will be applied on selected item when menu is open.\n */\n @Prop() autoFocusOnSelected: boolean = true;\n\n @State() keyboardNav: boolean = false;\n @State() optionHighlighted: string;\n @State() focusFromSearchKeypress: boolean = false;\n @State() initialOptionsListRender: boolean = false;\n @State() preventIncorrectTabOrder: boolean = false;\n\n @Watch(\"options\")\n watchOptionsHandler(): void {\n this.ungroupedOptions = [];\n this.loadUngroupedOptions();\n }\n\n /**\n * @internal Emitted when an option is selected.\n */\n @Event() menuOptionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n /**\n * @internal Emitted when state of menu changes (i.e. open or close).\n */\n @Event() menuStateChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n /**\n * @internal Emitted when an option has been highlighted\n */\n @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n /**\n * @internal Emitted when key is pressed while menu is open\n */\n @Event() menuKeyPress: EventEmitter<{ isNavKey: boolean; key: string }>;\n\n /**\n * @internal Emitted when the ungrouped options have been set.\n */\n @Event() ungroupedOptionsSet: EventEmitter<{ options: IcMenuOption[] }>;\n\n private handleClearListener = (): void => {\n this.optionHighlighted = \"\";\n };\n\n private handleSubmitSearch = (): void => {\n const highlightedOptionIndex = this.options.findIndex(\n (option) => option.value === this.optionHighlighted\n );\n\n this.setInputValue(highlightedOptionIndex);\n };\n\n private menu: HTMLUListElement;\n private ungroupedOptions: IcMenuOption[] = [];\n private popperInstance: PopperInstance;\n\n // Prevents menu re-opening immediately after it is closed on blur when clicking input\n private preventClickOpen: boolean = false;\n private isSearchBar: boolean = false;\n\n private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n if (!open) this.popperInstance.destroy();\n this.menuStateChange.emit({ open, focusInput });\n\n if (!open && focusInput !== false) {\n this.inputEl.focus();\n this.preventClickOpen = false;\n }\n };\n\n private setNextOptionValue = (selectedOptionIndex: number): void => {\n if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[selectedOptionIndex + 1].value,\n optionId: this.getOptionId(\n this.ungroupedOptions[selectedOptionIndex + 1].value\n ),\n });\n } else {\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[0].value,\n optionId: this.getOptionId(this.ungroupedOptions[0].value),\n });\n }\n };\n\n private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[selectedOptionIndex - 1].value,\n optionId: this.getOptionId(\n this.ungroupedOptions[selectedOptionIndex - 1].value\n ),\n });\n } else {\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n optionId: this.getOptionId(\n this.ungroupedOptions[this.ungroupedOptions.length - 1].value\n ),\n });\n }\n };\n\n /**\n * @internal If menu is opened with the mouse, emit menuStateChange custom event.\n */\n @Method()\n async handleClickOpen(): Promise<void> {\n if (!this.preventClickOpen) {\n this.menuStateChange.emit({ open: !this.open });\n this.keyboardNav = false;\n }\n this.preventClickOpen = false;\n }\n\n /**\n * Used alongside activationType\n * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n * @param {KeyboardEvent} event - keyboard event\n */\n @Method()\n async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n this.keyboardNav = false;\n\n if (this.activationType === \"automatic\") {\n this.autoSetInputValueKeyboardOpen(event);\n } else {\n this.keyboardNav = true;\n this.manSetInputValueKeyboardOpen(event);\n }\n }\n\n /**\n * @internal Used to highlight the first option in the menu.\n */\n @Method()\n async handleSetFirstOption(): Promise<void> {\n this.setHighlightedOption(0);\n }\n\n private arrowBehaviour = (event: KeyboardEvent): void => {\n event.preventDefault();\n this.handleMenuChange(true);\n };\n\n private setHighlightedOption = (highlightedIndex: number): void => {\n this.optionHighlighted = this.options[highlightedIndex].value || undefined;\n };\n\n private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n const selectedOptionIndex = this.ungroupedOptions.findIndex(\n (option) => option.value === this.value\n );\n\n this.keyboardNav = false;\n\n const isSearchableSelect = this.inputEl?.tagName === \"INPUT\";\n\n switch (event.key) {\n case \"ArrowDown\":\n this.keyboardNav = true;\n this.arrowBehaviour(event);\n this.setNextOptionValue(selectedOptionIndex);\n break;\n case \"ArrowUp\":\n this.keyboardNav = true;\n this.arrowBehaviour(event);\n this.setPreviousOptionValue(selectedOptionIndex);\n break;\n case \" \":\n case \"Enter\":\n if ((event.target as HTMLElement).id !== \"clear-button\") {\n this.handleMenuChange(true);\n }\n break;\n case \"Backspace\":\n if (isSearchableSelect) {\n this.inputEl.focus();\n }\n break;\n default:\n if (isSearchableSelect && event.key !== \"Tab\") {\n this.inputEl.focus();\n }\n break;\n }\n };\n\n private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n const highlightedOptionIndex = this.options.findIndex(\n (option) => option.value === this.optionHighlighted\n );\n\n const getOptionId = (index: number): string =>\n Array.from(this.host.querySelectorAll(\"li\"))[index].id;\n\n switch (event.key) {\n case \"ArrowDown\":\n this.arrowBehaviour(event);\n if (highlightedOptionIndex < this.options.length - 1) {\n this.setHighlightedOption(highlightedOptionIndex + 1);\n this.menuOptionId.emit({\n optionId: getOptionId(highlightedOptionIndex + 1),\n });\n } else {\n this.setHighlightedOption(0);\n this.menuOptionId.emit({\n optionId: getOptionId(0),\n });\n }\n this.preventIncorrectTabOrder = false;\n this.focusFromSearchKeypress = false;\n break;\n case \"ArrowUp\":\n this.arrowBehaviour(event);\n if (\n highlightedOptionIndex <= 0 ||\n highlightedOptionIndex > this.options.length + 1\n ) {\n this.setHighlightedOption(this.options.length - 1);\n this.menuOptionId.emit({\n optionId: getOptionId(this.options.length - 1),\n });\n } else {\n this.setHighlightedOption(highlightedOptionIndex - 1);\n this.menuOptionId.emit({\n optionId: getOptionId(highlightedOptionIndex - 1),\n });\n }\n this.preventIncorrectTabOrder = false;\n this.focusFromSearchKeypress = false;\n break;\n case \"Enter\":\n event.preventDefault();\n this.setInputValue(highlightedOptionIndex);\n break;\n case \"Escape\":\n this.handleMenuChange(false);\n this.menuOptionId.emit({ optionId: undefined });\n break;\n case \"Shift\":\n case \"Tab\":\n this.preventIncorrectTabOrder = true;\n break;\n case \"Backspace\":\n if (this.isSearchBar) {\n (this.parentEl as HTMLIcSearchBarElement).setFocus();\n this.focusFromSearchKeypress = true;\n this.setHighlightedOption(0);\n }\n break;\n default:\n if (this.isSearchBar && event.key !== \"Tab\") {\n (this.parentEl as HTMLIcSearchBarElement).setFocus();\n this.focusFromSearchKeypress = true;\n this.setHighlightedOption(0);\n }\n break;\n }\n };\n\n private setInputValue = (highlightedOptionIndex: number) => {\n if (this.options[highlightedOptionIndex]) {\n this.menuOptionSelect.emit({\n value: this.options[highlightedOptionIndex]?.value,\n });\n this.optionHighlighted = undefined;\n this.menuOptionId.emit({ optionId: undefined });\n }\n this.handleMenuChange(false);\n };\n\n private handleOptionClick = (event: Event): void => {\n const { value, label } = (event.target as HTMLLIElement).dataset;\n this.menuOptionSelect.emit({ value, label });\n this.handleMenuChange(false);\n };\n\n private handleBlur = (event: FocusEvent): void => {\n if (event.relatedTarget !== this.inputEl) {\n if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n this.handleMenuChange(false, false);\n }\n } else {\n this.handleMenuChange(false);\n this.preventClickOpen = true;\n }\n };\n\n private handleMouseDown = (event: Event): void => {\n event.preventDefault();\n };\n\n private handleMenuKeyDown = (event: KeyboardEvent) => {\n if (this.activationType === \"automatic\") {\n this.autoSetValueOnMenuKeyDown(event);\n }\n };\n\n private emitMenuKeyPress = (isNavKey: boolean, key: string) => {\n this.menuKeyPress.emit({ isNavKey: isNavKey, key: key });\n };\n\n private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n event.cancelBubble = true;\n const selectedOptionIndex = this.ungroupedOptions.findIndex(\n (option) => option.value === this.value\n );\n\n const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n this.keyboardNav = false;\n\n switch (event.key) {\n case \"ArrowUp\":\n event.preventDefault();\n this.setPreviousOptionValue(selectedOptionIndex);\n this.keyboardNav = true;\n break;\n case \"ArrowDown\":\n event.preventDefault();\n this.setNextOptionValue(selectedOptionIndex);\n this.keyboardNav = true;\n break;\n case \"Home\":\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[0].value,\n });\n this.keyboardNav = true;\n break;\n case \"End\":\n this.menuOptionSelect.emit({\n value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n });\n this.keyboardNav = true;\n break;\n case \"Enter\":\n case \"Escape\":\n this.handleMenuChange(false);\n break;\n case \"Backspace\":\n if (isSearchableSelect) {\n this.inputEl.focus();\n }\n break;\n case \"Shift\":\n break;\n default:\n if (isSearchableSelect && event.key !== \"Tab\") {\n this.inputEl.focus();\n }\n if (event.key.length === 1) {\n this.keyboardNav = true;\n }\n break;\n }\n this.emitMenuKeyPress(this.keyboardNav, event.key);\n };\n\n private handleMenuKeyUp = (event: KeyboardEvent): void => {\n if (event.key === \"Tab\" && event.shiftKey) {\n this.preventClickOpen = false;\n }\n };\n\n private getOptionId = (value: string): string => {\n return `${this.menuId}-${value}`;\n };\n\n private getOptionAriaLabel = (\n option: IcMenuOption,\n parentOption: IcMenuOption\n ): string => {\n let ariaLabel = option.label;\n\n if (option.description) {\n ariaLabel = `${ariaLabel}, ${option.description}`;\n }\n\n if (parentOption) {\n return `${ariaLabel}, ${parentOption.label} group`;\n } else {\n return ariaLabel;\n }\n };\n\n private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n let sorted: IcMenuOption[] = [];\n if (options.sort) {\n sorted = options.sort((optionA, optionB) =>\n optionA.recommended && !optionB.recommended ? -1 : 0\n );\n }\n return sorted;\n };\n\n private isManualMode = this.activationType === \"manual\";\n\n private scrollToSelected = (menu: HTMLUListElement) => {\n const selectedOption = menu.querySelector(\n \".option[aria-selected]\"\n ) as HTMLElement;\n\n if (selectedOption) {\n const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n if (\n elTop > menu.scrollTop + menu.offsetHeight ||\n elTop < menu.scrollTop + menu.offsetHeight\n ) {\n menu.scrollTop = selectedOption.offsetTop;\n }\n selectedOption.focus();\n }\n };\n\n private loadUngroupedOptions = () => {\n if (this.options.length > 0 && this.options.map) {\n this.options.map((option) => {\n if (option.children) {\n option.children.map(\n (option) => !option.disabled && this.ungroupedOptions.push(option)\n );\n } else if (!option.disabled) {\n this.ungroupedOptions.push(option);\n }\n });\n }\n this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n this.ungroupedOptionsSet.emit({ options: this.ungroupedOptions });\n };\n\n private setMenuScrollbar = () => {\n let optionsHeight = 0;\n this.host\n .querySelectorAll(\".option\")\n .forEach((option) => (optionsHeight += option.clientHeight));\n\n if (optionsHeight >= 320) {\n this.menu.classList.add(\"menu-scroll\");\n }\n };\n\n connectedCallback(): void {\n if (this.parentEl?.tagName === \"IC-SEARCH-BAR\") {\n this.setHighlightedOption(0);\n this.initialOptionsListRender = true;\n }\n }\n\n componentWillLoad(): void {\n this.loadUngroupedOptions();\n this.isSearchBar = this.parentEl.tagName === \"IC-SEARCH-BAR\";\n this.parentEl.addEventListener(\"icClear\", this.handleClearListener);\n this.parentEl.addEventListener(\"icSubmitSearch\", this.handleSubmitSearch);\n }\n\n componentDidLoad(): void {\n if (\n this.isSearchBar &&\n (this.parentEl as HTMLIcSearchBarElement).disableFilter\n ) {\n this.focusFromSearchKeypress = true;\n }\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.open, propName: \"open\" },\n { prop: this.options, propName: \"options\" },\n { prop: this.menuId, propName: \"menu-id\" },\n { prop: this.inputLabel, propName: \"input-label\" },\n //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n ],\n \"Menu\"\n );\n }\n\n componentDidRender(): void {\n if (this.open) {\n this.popperInstance = createPopper(this.anchorEl, this.host, {\n placement: \"bottom\",\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 7],\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\"],\n rootBoundary: \"viewport\",\n },\n },\n ],\n });\n }\n\n if (this.open && !!this.options.length) {\n this.setMenuScrollbar();\n }\n }\n\n componentDidUpdate(): void {\n const inputValueInOptions: boolean = this.options.some(\n (option) => option.value === this.value\n );\n\n const optionHighlightedIsSet =\n this.optionHighlighted !== null &&\n this.optionHighlighted !== undefined &&\n this.optionHighlighted !== \"\";\n\n if (this.open && this.options.length !== 0) {\n if (\n this.value &&\n this.keyboardNav &&\n inputValueInOptions &&\n this.autoFocusOnSelected\n ) {\n this.scrollToSelected(this.menu);\n } else if (\n this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n this.inputEl.tagName !== \"INPUT\"\n ) {\n this.menu.focus();\n } else if (\n optionHighlightedIsSet &&\n !this.focusFromSearchKeypress &&\n !this.preventIncorrectTabOrder\n ) {\n const highlightedEl = this.host.querySelector(\n `li[data-value=\"${this.optionHighlighted}\"]`\n ) as HTMLElement;\n\n if (highlightedEl) {\n highlightedEl.focus();\n }\n }\n }\n }\n\n disconnectedCallback(): void {\n this.parentEl.removeEventListener(\"icClear\", this.handleClearListener);\n this.parentEl.removeEventListener(\n \"icSubmitSearch\",\n this.handleSubmitSearch\n );\n }\n\n private displayOption = (\n option: IcMenuOption,\n index?: number,\n parentOption?: IcMenuOption\n ): HTMLLIElement => {\n const { open, value } = this;\n\n return (\n <li\n id={this.getOptionId(option.value)}\n class={{\n option: true,\n \"focused-option\": this.isManualMode\n ? (this.keyboardNav || this.initialOptionsListRender) &&\n option.value === this.optionHighlighted\n : this.keyboardNav && option.value === value,\n \"last-recommended-option\":\n option.recommended &&\n this.options[index + 1] &&\n !this.options[index + 1].recommended,\n \"disabled-option\": option.disabled,\n }}\n role=\"option\"\n tabindex={\n open &&\n (option.value === value || option.value === this.optionHighlighted) &&\n this.keyboardNav\n ? \"0\"\n : \"-1\"\n }\n aria-label={this.getOptionAriaLabel(option, parentOption)}\n aria-selected={option.value === value}\n aria-disabled={option.disabled ? \"true\" : \"false\"}\n onClick={this.handleOptionClick}\n onBlur={this.handleBlur}\n onMouseDown={this.handleMouseDown}\n data-value={option.value}\n data-label={option.label}\n >\n <div class=\"option-text-container\">\n <ic-typography variant=\"body\" aria-hidden=\"true\">\n <p>{option.label}</p>\n </ic-typography>\n {option.description && (\n <ic-typography\n id={`${this.getOptionId(option.value)}-description`}\n class=\"option-description\"\n variant=\"caption\"\n aria-hidden=\"true\"\n >\n <p>{option.description}</p>\n </ic-typography>\n )}\n </div>\n {option?.value.toLowerCase() === value?.toLowerCase() &&\n this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n <span class=\"check-icon\" innerHTML={Check} />\n )}\n </li>\n );\n };\n\n render() {\n const { inputLabel, options, menuId, value, fullWidth } = this;\n\n return (\n <Host\n class={{\n \"full-width\": fullWidth,\n \"no-focus\": this.inputEl?.tagName === \"INPUT\",\n }}\n >\n {options.length !== 0 && (\n <ul\n id={menuId}\n class=\"menu\"\n role=\"listbox\"\n aria-label={inputLabel}\n aria-activedescendant={\n value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n }\n tabindex={\n open && !this.keyboardNav && this.inputEl?.tagName !== \"INPUT\"\n ? \"0\"\n : \"-1\"\n }\n ref={(el) => (this.menu = el)}\n onKeyDown={this.handleMenuKeyDown}\n onKeyUp={this.handleMenuKeyUp}\n onBlur={this.handleBlur}\n >\n {this.getSortedOptions(options).map((option, index) => {\n if (option.children) {\n if (option.children.length > 0) {\n return (\n <div>\n <ic-typography\n class=\"option-group-title\"\n role=\"presentation\"\n variant=\"subtitle-small\"\n >\n <p>{option.label}</p>\n </ic-typography>\n {option.children.map((childOption) =>\n this.displayOption(childOption, index, option)\n )}\n </div>\n );\n } else {\n return null;\n }\n } else {\n return this.displayOption(option, index);\n }\n })}\n </ul>\n )}\n </Host>\n );\n }\n}\n"]}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import{r as t,h as i,H as a,g as s}from"./p-5450cebf.js";import{a as r,
|
2
|
-
//# sourceMappingURL=p-
|
1
|
+
import{r as t,h as i,H as a,g as s}from"./p-5450cebf.js";import{a as r,N as e,O as l,P as o,Q as n,L as c}from"./p-3dea2867.js";import{a as p}from"./p-6f57b13c.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs)}ic-input-label.with-helper{margin-bottom:var(--ic-space-xxxs)}ic-input-label.disabled{color:var(--ic-color-tertiary-text)}ic-input-label.readonly{color:var(--ic-color-tertiary-text)}ic-input-label .helpertext{margin-top:var(--ic-space-xxxs)}ic-input-label .helpertext-normal{color:var(--ic-color-secondary-text)}ic-input-label .helpertext-readonly{color:var(--ic-color-tertiary-text)}ic-input-label .readonly-label{color:var(--ic-color-secondary-text)}ic-input-label .error-label{color:var(--ic-status-error)}ic-input-label .dark{color:var(--ic-architectural-white)}";const h=class{constructor(i){t(this,i);this.for=undefined;this.required=false;this.helperText="";this.label=undefined;this.disabled=false;this.readonly=false;this.error=false;this.dark=false}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:s,label:r,required:l,helperText:o,error:n,dark:c}=this;const p=l?r+" *":r;const d=s?`${p}`:i("label",{htmlFor:this.for},p);const h=e(this.for);return i(a,{class:{["disabled"]:t,["readonly"]:s,["with-helper"]:o!==""}},i("ic-typography",{variant:"label",class:{["readonly-label"]:s,["error-label"]:n&&!(s||t),["dark"]:c}},d),o!==""&&i("ic-typography",{variant:"caption",class:{["helpertext"]:true,["helpertext-normal"]:!t&&!s,["helpertext-readonly"]:s}},i("span",{id:h},o)))}};h.style=d;const u="ic-input-validation{width:var(--input-width, 20rem);margin-top:var(--ic-space-xs);display:flex}ic-input-validation.fullwidth{width:100%}ic-input-validation.error{color:var(--ic-status-error)}ic-input-validation.success{color:var(--ic-status-success)}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-status-success)}ic-input-validation span.icon-error>svg{fill:var(--ic-status-error)}ic-input-validation span.icon-warning>svg{fill:var(--ic-status-warning-mid)}ic-input-validation .statustext{flex-grow:1}";const v={[p.Warning]:o,[p.Error]:n,[p.Success]:c};const b=class{constructor(i){t(this,i);this.message=undefined;this.for=undefined;this.status="";this.fullWidth=false;this.ariaLiveMode="polite"}componentDidLoad(){r([{prop:this.message,propName:"message"}],"Input Validation")}render(){const t=this.status!==""?v[this.status]:"";const s=l(this.for);return i(a,{class:{[this.status]:this.status!=="",["fullwidth"]:this.fullWidth}},t!==""&&i("span",{class:{["status-icon"]:true,[`icon-${this.status}`]:true},innerHTML:t}),i("ic-typography",{variant:"caption",class:"statustext"},i("span",{"aria-live":this.ariaLiveMode,id:s},this.message)),i("slot",{name:"validation-message-adornment"}))}get el(){return s(this)}};b.style=u;export{h as ic_input_label,b as ic_input_validation};
|
2
|
+
//# sourceMappingURL=p-b7fc1f35.entry.js.map
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import{r as i,h as t,H as e,g as o}from"./p-5450cebf.js";import{D as n,k as s,g as a,p as r}from"./p-1724000c.js";import{c as d}from"./p-24240e11.js";import"./p-6f57b13c.js";const h='/*! 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:0.063rem 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:0.063rem solid var(--ic-architectural-300);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);transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.collapsed) .grouped-links-wrapper{height:var(--navigation-child-items-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}.menu-visibility-visible{visibility:visible}.menu-visibility-hidden{visibility:hidden}';const c=class{constructor(e){i(this,e);this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS=50;this.sideNavExpandHandler=()=>{setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)};this.topNavResizedHandler=i=>{const t=i.detail.size;if(t!==this.deviceSize){this.deviceSize=t;this.inTopNavSideMenu=t<=n.L}};this.setGroupedNavItemTabIndex=i=>{this.el.querySelectorAll("ic-navigation-item").forEach((t=>{const e=t.shadowRoot.querySelector("a")||t.querySelector("a");if(e){e.setAttribute("tabindex",i)}}))};this.toggleGroupedLinkWrapperHeight=(i,t)=>{if(i){if(t){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`);this.setGroupedNavItemTabIndex("0")}else{i.setAttribute("style",`--navigation-child-items-height: 0`);this.setGroupedNavItemTabIndex("-1")}}};this.toggleExpanded=()=>{this.expanded=!this.expanded;const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");this.toggleGroupedLinkWrapperHeight(i,this.expanded)};this.handleClick=i=>{if(this.navigationType==="top"&&i.detail){this.toggleDropdown()}else{this.toggleExpanded()}};this.handleBlur=i=>{const t=i.relatedTarget;if(!this.el.contains(t)){this.hideDropdown()}};this.handleTopNavKeydown=i=>{if(!this.inTopNavSideMenu&&i.key==="Escape"){this.hideDropdown();this.el.blur()}else if(i.key===" "||i.key==="Enter"){this.toggleDropdown()}};this.handleKeydown=i=>{if(i.key==="Enter"||i.key==="Space"){switch(this.navigationType){case"top":this.handleTopNavKeydown(i);break;case"side":this.toggleExpanded();i.preventDefault();break;default:this.toggleExpanded();break}}};this.handleMouseLeave=i=>{const t=i.relatedTarget;if(!this.el.contains(t)&&t!==this.dropdown&&document.activeElement!==this.el&&!this.el.contains(document.activeElement)){this.hideDropdown()}};this.triggerShowDropdown=()=>{this.showDropdown()};this.renderDropdownGroupedLinks=()=>t("div",{class:{["navigation-group-dropdown"]:!this.inTopNavSideMenu,["navigation-group-dropdown-side-menu"]:this.inTopNavSideMenu,["selected"]:this.dropdownOpen&&!this.inTopNavSideMenu},onMouseLeave:!this.inTopNavSideMenu?this.handleMouseLeave:null,ref:i=>this.dropdown=i},t("nav",{class:{["navigation-group-dropdown-items"]:!this.inTopNavSideMenu}},t("ul",null,t("slot",null))));this.renderGroupedLinks=()=>t("ul",{class:"grouped-links-wrapper"},t("slot",null));this.getNavigationChildItemsHeight=()=>{const i=this.el.querySelectorAll("ic-navigation-item").length||0;const t=this.el.querySelector("ic-navigation-item")||null;if(this.navigationType==="side"&&!!i&&t){return`${parseInt(getComputedStyle(t).height)*i}px`}return"auto"};this.setInitialGroupedLinksWrapperHeight=()=>{const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");if(i&&this.expanded){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`)}};this.renderNavigationItems=()=>{if(this.dropdownOpen||this.inTopNavSideMenu&&!this.expandable){return this.renderDropdownGroupedLinks()}if(this.navigationType!=="top"){return this.renderGroupedLinks()}return null};this.label=undefined;this.expandable=false;this.dropdownOpen=false;this.inTopNavSideMenu=false;this.deviceSize=n.XL;this.focusStyle=s();this.navigationType=undefined;this.parentEl=undefined;this.expanded=true}childBlurHandler(){this.hideDropdown()}navItemClickHandler(){this.hideDropdown()}themeChangeHandler(i){const t=i.detail;this.focusStyle=t.mode}async setFocus(){if(this.groupEl){this.groupEl.focus()}}toggleDropdown(){this.dropdownOpen=!this.dropdownOpen}showDropdown(){if(!this.dropdownOpen){this.toggleDropdown()}}hideDropdown(){if(this.dropdownOpen){this.toggleDropdown()}}componentWillLoad(){this.deviceSize=a();const i=r(this.el);this.navigationType=i.navType;this.parentEl=i.parent;if(this.deviceSize<=n.L&&this.navigationType==="top"){this.inTopNavSideMenu=true}if(this.navigationType==="side"){this.parentEl.addEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.addEventListener("topNavResized",this.topNavResizedHandler)}}componentDidLoad(){setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)}disconnectedCallback(){if(this.navigationType==="side"){this.parentEl.removeEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.removeEventListener("topNavResized",this.topNavResizedHandler)}}render(){const{label:i,dropdownOpen:o,inTopNavSideMenu:n,expandable:s}=this;const a=!n||s?"button":"div";return t(e,{class:{["in-side-menu"]:n,expanded:this.expanded,collapsed:!this.expanded,["navigation-group-side-nav"]:this.navigationType==="side"},role:"listitem"},t(a,{tabindex:n&&!s?"-1":"0",onMouseOver:!n&&this.navigationType==="top"?this.triggerShowDropdown:null,onMouseLeave:this.navigationType==="top"&&this.handleMouseLeave,onBlur:this.handleBlur,onClick:s?this.handleClick:null,onKeyDown:this.handleKeydown,class:{["navigation-group"]:true,[this.focusStyle]:!n,["navigation-group-side-menu"]:n&&!s,["navigation-group-side-menu-collapsed"]:n&&s&&!o,["navigation-group-side-menu-expanded"]:n&&s&&o,["selected"]:o&&!n},ref:i=>this.groupEl=i,"aria-expanded":o||this.expanded?"true":"false","aria-haspopup":!n&&this.navigationType==="top"?"true":"false"},t("ic-typography",{variant:this.navigationType==="side"?"caption":"label"},i),this.navigationType==="side"&&s&&t("div",{class:{"chevron-toggle-icon-wrapper":true,"chevron-toggle-icon-closed":this.expanded},innerHTML:d})),this.renderNavigationItems())}static get delegatesFocus(){return true}get el(){return o(this)}};c.style=h;export{c as ic_navigation_group};
|
2
|
-
//# sourceMappingURL=p-
|
1
|
+
import{r as i,h as t,H as e,g as o}from"./p-5450cebf.js";import{D as n,k as s,g as a,p as r}from"./p-3dea2867.js";import{C as d}from"./p-06321d19.js";import"./p-6f57b13c.js";const h='/*! 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:0.063rem 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:0.063rem solid var(--ic-architectural-300);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);transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.collapsed) .grouped-links-wrapper{height:var(--navigation-child-items-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}.menu-visibility-visible{visibility:visible}.menu-visibility-hidden{visibility:hidden}';const c=class{constructor(e){i(this,e);this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS=50;this.sideNavExpandHandler=()=>{setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)};this.topNavResizedHandler=i=>{const t=i.detail.size;if(t!==this.deviceSize){this.deviceSize=t;this.inTopNavSideMenu=t<=n.L}};this.setGroupedNavItemTabIndex=i=>{this.el.querySelectorAll("ic-navigation-item").forEach((t=>{const e=t.shadowRoot.querySelector("a")||t.querySelector("a");if(e){e.setAttribute("tabindex",i)}}))};this.toggleGroupedLinkWrapperHeight=(i,t)=>{if(i){if(t){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`);this.setGroupedNavItemTabIndex("0")}else{i.setAttribute("style",`--navigation-child-items-height: 0`);this.setGroupedNavItemTabIndex("-1")}}};this.toggleExpanded=()=>{this.expanded=!this.expanded;const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");this.toggleGroupedLinkWrapperHeight(i,this.expanded)};this.handleClick=i=>{if(this.navigationType==="top"&&i.detail){this.toggleDropdown()}else{this.toggleExpanded()}};this.handleBlur=i=>{const t=i.relatedTarget;if(!this.el.contains(t)){this.hideDropdown()}};this.handleTopNavKeydown=i=>{if(!this.inTopNavSideMenu&&i.key==="Escape"){this.hideDropdown();this.el.blur()}else if(i.key===" "||i.key==="Enter"){this.toggleDropdown()}};this.handleKeydown=i=>{if(i.key==="Enter"||i.key==="Space"){switch(this.navigationType){case"top":this.handleTopNavKeydown(i);break;case"side":this.toggleExpanded();i.preventDefault();break;default:this.toggleExpanded();break}}};this.handleMouseLeave=i=>{const t=i.relatedTarget;if(!this.el.contains(t)&&t!==this.dropdown&&document.activeElement!==this.el&&!this.el.contains(document.activeElement)){this.hideDropdown()}};this.triggerShowDropdown=()=>{this.showDropdown()};this.renderDropdownGroupedLinks=()=>t("div",{class:{["navigation-group-dropdown"]:!this.inTopNavSideMenu,["navigation-group-dropdown-side-menu"]:this.inTopNavSideMenu,["selected"]:this.dropdownOpen&&!this.inTopNavSideMenu},onMouseLeave:!this.inTopNavSideMenu?this.handleMouseLeave:null,ref:i=>this.dropdown=i},t("nav",{class:{["navigation-group-dropdown-items"]:!this.inTopNavSideMenu}},t("ul",null,t("slot",null))));this.renderGroupedLinks=()=>t("ul",{class:"grouped-links-wrapper"},t("slot",null));this.getNavigationChildItemsHeight=()=>{const i=this.el.querySelectorAll("ic-navigation-item").length||0;const t=this.el.querySelector("ic-navigation-item")||null;if(this.navigationType==="side"&&!!i&&t){return`${parseInt(getComputedStyle(t).height)*i}px`}return"auto"};this.setInitialGroupedLinksWrapperHeight=()=>{const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");if(i&&this.expanded){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`)}};this.renderNavigationItems=()=>{if(this.dropdownOpen||this.inTopNavSideMenu&&!this.expandable){return this.renderDropdownGroupedLinks()}if(this.navigationType!=="top"){return this.renderGroupedLinks()}return null};this.label=undefined;this.expandable=false;this.dropdownOpen=false;this.inTopNavSideMenu=false;this.deviceSize=n.XL;this.focusStyle=s();this.navigationType=undefined;this.parentEl=undefined;this.expanded=true}childBlurHandler(){this.hideDropdown()}navItemClickHandler(){this.hideDropdown()}themeChangeHandler(i){const t=i.detail;this.focusStyle=t.mode}async setFocus(){if(this.groupEl){this.groupEl.focus()}}toggleDropdown(){this.dropdownOpen=!this.dropdownOpen}showDropdown(){if(!this.dropdownOpen){this.toggleDropdown()}}hideDropdown(){if(this.dropdownOpen){this.toggleDropdown()}}componentWillLoad(){this.deviceSize=a();const i=r(this.el);this.navigationType=i.navType;this.parentEl=i.parent;if(this.deviceSize<=n.L&&this.navigationType==="top"){this.inTopNavSideMenu=true}if(this.navigationType==="side"){this.parentEl.addEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.addEventListener("topNavResized",this.topNavResizedHandler)}}componentDidLoad(){setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)}disconnectedCallback(){if(this.navigationType==="side"){this.parentEl.removeEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.removeEventListener("topNavResized",this.topNavResizedHandler)}}render(){const{label:i,dropdownOpen:o,inTopNavSideMenu:n,expandable:s}=this;const a=!n||s?"button":"div";return t(e,{class:{["in-side-menu"]:n,expanded:this.expanded,collapsed:!this.expanded,["navigation-group-side-nav"]:this.navigationType==="side"},role:"listitem"},t(a,{tabindex:n&&!s?"-1":"0",onMouseOver:!n&&this.navigationType==="top"?this.triggerShowDropdown:null,onMouseLeave:this.navigationType==="top"&&this.handleMouseLeave,onBlur:this.handleBlur,onClick:s?this.handleClick:null,onKeyDown:this.handleKeydown,class:{["navigation-group"]:true,[this.focusStyle]:!n,["navigation-group-side-menu"]:n&&!s,["navigation-group-side-menu-collapsed"]:n&&s&&!o,["navigation-group-side-menu-expanded"]:n&&s&&o,["selected"]:o&&!n},ref:i=>this.groupEl=i,"aria-expanded":o||this.expanded?"true":"false","aria-haspopup":!n&&this.navigationType==="top"?"true":"false"},t("ic-typography",{variant:this.navigationType==="side"?"caption":"label"},i),this.navigationType==="side"&&s&&t("div",{class:{"chevron-toggle-icon-wrapper":true,"chevron-toggle-icon-closed":this.expanded},innerHTML:d})),this.renderNavigationItems())}static get delegatesFocus(){return true}get el(){return o(this)}};c.style=h;export{c as ic_navigation_group};
|
2
|
+
//# sourceMappingURL=p-b8b960a5.entry.js.map
|