@ukic/web-components 2.31.0 → 2.32.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (89) hide show
  1. package/dist/cjs/ic-button_3.cjs.entry.js +5 -1
  2. package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
  3. package/dist/cjs/ic-footer-link-group.cjs.entry.js +2 -2
  4. package/dist/cjs/ic-footer-link-group.cjs.entry.js.map +1 -1
  5. package/dist/cjs/ic-menu-item.cjs.entry.js +1 -4
  6. package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -1
  7. package/dist/cjs/ic-navigation-item.cjs.entry.js +25 -2
  8. package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
  9. package/dist/cjs/ic-popover-menu.cjs.entry.js +5 -5
  10. package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
  11. package/dist/cjs/ic-side-navigation.cjs.entry.js +6 -4
  12. package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
  13. package/dist/cjs/ic-toggle-button.cjs.entry.js +16 -0
  14. package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
  15. package/dist/collection/components/ic-button/ic-button.js +5 -1
  16. package/dist/collection/components/ic-button/ic-button.js.map +1 -1
  17. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.css +4 -0
  18. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js +1 -1
  19. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js.map +1 -1
  20. package/dist/collection/components/ic-menu-item/ic-menu-item.js +9 -7
  21. package/dist/collection/components/ic-menu-item/ic-menu-item.js.map +1 -1
  22. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +26 -3
  23. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
  24. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +22 -9
  25. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -1
  26. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +6 -4
  27. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
  28. package/dist/collection/components/ic-side-navigation/test/basic/ic-side-navigation.spec.js +3 -3
  29. package/dist/collection/components/ic-side-navigation/test/basic/ic-side-navigation.spec.js.map +1 -1
  30. package/dist/collection/components/ic-toggle-button/ic-toggle-button.js +17 -1
  31. package/dist/collection/components/ic-toggle-button/ic-toggle-button.js.map +1 -1
  32. package/dist/components/ic-button2.js +5 -1
  33. package/dist/components/ic-button2.js.map +1 -1
  34. package/dist/components/ic-footer-link-group.js +2 -2
  35. package/dist/components/ic-footer-link-group.js.map +1 -1
  36. package/dist/components/ic-menu-item2.js +1 -4
  37. package/dist/components/ic-menu-item2.js.map +1 -1
  38. package/dist/components/ic-navigation-item.js +26 -3
  39. package/dist/components/ic-navigation-item.js.map +1 -1
  40. package/dist/components/ic-popover-menu.js +5 -5
  41. package/dist/components/ic-popover-menu.js.map +1 -1
  42. package/dist/components/ic-side-navigation.js +7 -5
  43. package/dist/components/ic-side-navigation.js.map +1 -1
  44. package/dist/components/ic-toggle-button.js +17 -1
  45. package/dist/components/ic-toggle-button.js.map +1 -1
  46. package/dist/core/core.esm.js +1 -1
  47. package/dist/core/{p-f1b210ed.entry.js → p-0677ee1e.entry.js} +2 -2
  48. package/dist/core/p-0677ee1e.entry.js.map +1 -0
  49. package/dist/core/p-0a20131b.entry.js +2 -0
  50. package/dist/core/p-0a20131b.entry.js.map +1 -0
  51. package/dist/core/p-5fad22f1.entry.js +2 -0
  52. package/dist/core/p-5fad22f1.entry.js.map +1 -0
  53. package/dist/core/{p-7e739287.entry.js → p-74a7b421.entry.js} +2 -2
  54. package/dist/core/{p-7e739287.entry.js.map → p-74a7b421.entry.js.map} +1 -1
  55. package/dist/core/{p-32fa7c28.entry.js → p-9feec47e.entry.js} +2 -2
  56. package/dist/core/p-9feec47e.entry.js.map +1 -0
  57. package/dist/core/{p-1d648b98.entry.js → p-c1a74ee4.entry.js} +2 -2
  58. package/dist/core/p-c1a74ee4.entry.js.map +1 -0
  59. package/dist/core/{p-e7fa6804.entry.js → p-e1def80b.entry.js} +2 -2
  60. package/dist/core/p-e1def80b.entry.js.map +1 -0
  61. package/dist/esm/ic-button_3.entry.js +5 -1
  62. package/dist/esm/ic-button_3.entry.js.map +1 -1
  63. package/dist/esm/ic-footer-link-group.entry.js +2 -2
  64. package/dist/esm/ic-footer-link-group.entry.js.map +1 -1
  65. package/dist/esm/ic-menu-item.entry.js +1 -4
  66. package/dist/esm/ic-menu-item.entry.js.map +1 -1
  67. package/dist/esm/ic-navigation-item.entry.js +26 -3
  68. package/dist/esm/ic-navigation-item.entry.js.map +1 -1
  69. package/dist/esm/ic-popover-menu.entry.js +5 -5
  70. package/dist/esm/ic-popover-menu.entry.js.map +1 -1
  71. package/dist/esm/ic-side-navigation.entry.js +7 -5
  72. package/dist/esm/ic-side-navigation.entry.js.map +1 -1
  73. package/dist/esm/ic-toggle-button.entry.js +17 -1
  74. package/dist/esm/ic-toggle-button.entry.js.map +1 -1
  75. package/dist/types/components/ic-menu-item/ic-menu-item.d.ts +1 -4
  76. package/dist/types/components/ic-navigation-item/ic-navigation-item.d.ts +2 -0
  77. package/dist/types/components/ic-popover-menu/ic-popover-menu.d.ts +3 -6
  78. package/dist/types/components/ic-toggle-button/ic-toggle-button.d.ts +3 -0
  79. package/dist/types/components.d.ts +4 -7
  80. package/hydrate/index.js +56 -18
  81. package/package.json +2 -2
  82. package/dist/core/p-1d648b98.entry.js.map +0 -1
  83. package/dist/core/p-32fa7c28.entry.js.map +0 -1
  84. package/dist/core/p-9930557b.entry.js +0 -2
  85. package/dist/core/p-9930557b.entry.js.map +0 -1
  86. package/dist/core/p-e6bad80b.entry.js +0 -2
  87. package/dist/core/p-e6bad80b.entry.js.map +0 -1
  88. package/dist/core/p-e7fa6804.entry.js.map +0 -1
  89. package/dist/core/p-f1b210ed.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"ic-side-navigation.entry.cjs.js","mappings":"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","names":["getCssProperty","isSlotUsed","DEVICE_SIZES","isEmptyString","h","getCurrentDeviceSize","isPropDefined","closeIcon","getThemeForegroundColor","checkResizeObserver","onComponentRequiredPropUndefined","Host","IcThemeForegroundEnum","hasClassificationBanner","chevronIcon"],"sources":["src/components/ic-side-navigation/ic-side-navigation.css?tag=ic-side-navigation&encapsulation=shadow","src/components/ic-side-navigation/ic-side-navigation.tsx"],"sourcesContent":["/**\n * @prop --ic-z-index-side-navigation: z-index of side navigation panel\n */\n\n:host {\n display: block;\n\n --side-navigation-position: fixed;\n --side-navigation-position-left: 0;\n --side-navigation-position-top: var(--ic-space-xxl);\n --side-navigation-height: var(--ic-space-xxl);\n --sm-side-navigation-top-bar-height: 3.5rem;\n --sm-side-navigation-collapsed-labels-width: 6rem;\n --sm-side-navigation-expand-transition-duration: var(\n --ic-transition-duration-slow\n );\n --side-navigation-width: 20rem;\n --sm-side-navigation-bottom-bar-height: 3.5rem;\n\n z-index: var(--ic-z-index-side-navigation);\n}\n\n:host > * {\n box-sizing: border-box;\n}\n\n.side-navigation {\n display: flex;\n flex-direction: column;\n width: var(--side-navigation-width);\n color: var(--ic-theme-text);\n position: var(--side-navigation-position);\n top: var(--side-navigation-position-top);\n left: calc(var(--side-navigation-width) * -1);\n bottom: 0;\n background-color: var(--ic-theme-primary);\n z-index: var(--ic-z-index-side-navigation);\n}\n\n:host(.inline) .side-navigation {\n position: absolute;\n height: 100%;\n}\n\n:host(.anchor-right) .side-navigation {\n right: calc(var(--side-navigation-width) * -1);\n}\n\n.classification-spacing {\n margin-bottom: var(--ic-space-lg);\n}\n\n.navigation-list {\n padding: 0;\n margin: 0;\n list-style: none;\n}\n\n.side-navigation-inner {\n background-color: var(--ic-theme-primary);\n display: flex;\n flex-direction: column;\n flex: 1 1 0;\n overflow: auto;\n}\n\n:host(.inline) .side-navigation-inner {\n flex: 1;\n}\n\n:host(.xs-menu-open) .side-navigation {\n transition: left var(--ic-easing-transition-slow);\n left: 0;\n}\n\n:host(:has(.xs-menu-open, .xs-menu-close)) ::slotted(ic-navigation-item) {\n --navigation-item-side-nav-right: var(--ic-space-xl);\n}\n\n:host(.xs-menu-close) .side-navigation {\n left: calc(var(--side-navigation-width) * -1);\n transition: left var(--ic-easing-transition-slow);\n}\n\n:host(.xs-menu-close) .side-navigation > * {\n visibility: hidden;\n}\n\n:host(.anchor-right.xs-menu-open) .side-navigation {\n right: 0;\n left: auto;\n}\n\n:host(.anchor-right.xs-menu-close) .side-navigation {\n right: calc(var(--side-navigation-width) * -1);\n left: auto;\n transition: right var(--ic-easing-transition-slow);\n}\n\n.bottom-wrapper {\n border-top: var(--ic-keyline-lighten);\n bottom: 0;\n left: 0;\n z-index: 2;\n box-shadow: -0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n background-color: var(--ic-theme-primary);\n display: flex;\n flex-direction: column;\n}\n\n:host(.inline) .bottom-wrapper {\n position: sticky;\n}\n\n:host(.dark) .bottom-wrapper {\n border-top: var(--ic-keyline-darken);\n}\n\n/* Mobile Top Bar */\n\n.top-bar {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: var(--side-navigation-height);\n padding: var(--ic-space-xs);\n box-sizing: border-box;\n background-color: var(--ic-theme-primary);\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n border-bottom: var(--ic-keyline-darken);\n box-shadow: var(--ic-elevation-overlay);\n z-index: 2;\n overflow: hidden;\n visibility: visible;\n}\n\n:host(.inline) .top-bar {\n position: absolute;\n}\n\n.top-bar.dark a:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.top-bar.light {\n border-bottom: var(--ic-keyline-lighten);\n}\n\n.app-title-wrapper {\n display: flex;\n margin-left: var(--ic-space-xs);\n border-left: var(--ic-keyline-darken);\n padding-left: var(--ic-space-xxs);\n color: var(--ic-theme-text);\n align-items: center;\n}\n\n.app-title-wrapper ic-typography h1 {\n margin: 0;\n}\n\n@media screen and (min-width: 340px) {\n .app-title-wrapper ic-typography {\n margin-left: var(--ic-space-xs);\n }\n}\n\n:host .title-link {\n display: flex;\n align-items: center;\n transition: box-shadow var(--ic-easing-transition-fast),\n background-color var(--ic-easing-transition-fast);\n text-decoration: none;\n padding: var(--ic-space-xxs);\n color: var(--ic-theme-text);\n}\n\n:host .title-link:visited,\n:host .title-link:active {\n color: var(--ic-theme-text);\n}\n\nslot[name=\"app-title\"]::slotted(a),\nslot[name=\"app-icon\"]::slotted(a) {\n color: var(--ic-theme-text);\n outline: none;\n text-decoration: none;\n display: flex;\n}\n\nslot[name=\"app-title\"]::slotted(ic-typography),\nslot[name=\"app-title\"]::slotted(a) {\n margin-left: var(--ic-space-xs) !important;\n}\n\nslot[name=\"app-title\"]::slotted(a) {\n font: var(--ic-font-subtitle-small);\n}\n\n@media screen and (min-width: 577px) {\n :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(ic-typography),\n :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(a) {\n position: absolute;\n left: -9999px;\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n }\n\n :host(.sm-expanded) slot[name=\"app-title\"]::slotted(a) {\n font: var(--ic-font-h3) !important;\n font-weight: var(--ic-font-weight-semibold) !important;\n margin-left: var(--ic-space-xs) !important;\n }\n}\n\n:host .title-link:hover {\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-theme-hover);\n}\n\n:host .title-link:active {\n background-color: var(--ic-theme-active);\n}\n\n:host .title-link:focus,\n:host .title-link:focus-within {\n border-radius: var(--ic-border-radius);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n background-color: transparent;\n}\n\n:host .title-link ic-typography {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.app-title-wrapper ::slotted(svg) {\n fill: var(--ic-theme-text);\n}\n\n.app-icon-container {\n display: none;\n}\n\n.button-label {\n display: flex;\n align-items: center;\n}\n\n.mobile-top-bar-menu-icon {\n display: flex;\n}\n\n.menu-button {\n width: 6.5rem;\n}\n\n.app-status-wrapper {\n inset: 0 var(--ic-space-sm) 0 3.5rem;\n width: auto;\n display: flex;\n gap: var(--ic-space-xs);\n padding: var(--ic-space-sm) 0;\n justify-content: flex-end;\n align-items: flex-end;\n pointer-events: none;\n height: fit-content;\n margin: 0 var(--ic-space-xs);\n}\n\n.app-status-wrapper .app-version {\n display: flex;\n overflow-wrap: break-word;\n padding-bottom: var(--ic-space-xxs);\n}\n\n.app-status-wrapper .app-status {\n display: flex;\n border-radius: 1rem;\n background-color: var(--ic-theme-text);\n color: var(--ic-color-primary-text);\n padding: var(--ic-space-xxs) var(--ic-space-lg);\n min-width: 1rem;\n}\n\n.app-status-wrapper .app-status-text {\n overflow-wrap: break-word;\n}\n\n:host(.dark) .app-status-wrapper .app-status {\n color: var(--ic-color-white-text);\n}\n\n.navigation-landmark-title {\n position: absolute;\n width: var(--ic-space-1px);\n height: var(--ic-space-1px);\n padding: 0;\n margin: calc(-1 * var(--ic-space-1px));\n overflow: hidden;\n}\n\n/* Navigation Group */\n\n::slotted(ic-navigation-group) {\n --navigation-group-height: 2.75rem;\n --navigation-group-width: 100%;\n --navigation-group-justify-content: space-between;\n --navigation-group-hover: var(--ic-theme-hover);\n --navigation-group-text-hover: var(--ic-theme-text);\n --navigation-item-child-height: 3.5rem;\n --navigation-item-child-active: var(--ic-action-dark-bg-active);\n --navigation-item-child-color: var(--ic-theme-text);\n --navigation-group-expand-toggle-padding: 0.25rem;\n}\n\n/* Navigation Items */\n\n::slotted(ic-navigation-item),\n::slotted(ic-navigation-group) {\n --navigation-item-justify-content: flex-start;\n --navigation-item-min-height: 56px;\n --navigation-item-height: auto;\n}\n\n/* Toggle Chevron */\n\n.bottom-side-nav {\n position: relative;\n align-content: flex-end;\n min-height: var(--sm-side-navigation-top-bar-height);\n}\n\n.bottom-side-nav ic-divider {\n position: absolute;\n top: 0;\n width: 100%;\n}\n\n.primary-navigation {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n /* Hide scrollbar when required but keep functionality */\n scrollbar-width: none;\n}\n\n.primary-navigation::-webkit-scrollbar {\n display: none;\n}\n\n.primary-navigation,\n.secondary-navigation {\n overflow-x: hidden;\n}\n\n.bottom-side-nav .menu-expand-button {\n position: absolute;\n display: none;\n}\n\n.menu-visibility-visible {\n visibility: visible;\n width: 100%;\n}\n\n.app-title-show {\n min-width: 15.5rem;\n}\n\n:host(.side-display) {\n display: flex;\n flex-direction: column;\n height: 100vh;\n position: var(--side-navigation-position);\n left: 0;\n top: 0;\n bottom: 0;\n}\n\n:host(.side-display) .app-icon-container {\n height: 40px;\n display: flex;\n align-items: center;\n}\n\n:host(.side-display) .top-bar {\n --side-navigation-height: var(--sm-side-navigation-top-bar-height);\n\n position: relative;\n padding: 0;\n box-shadow: -0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.inline.side-display) .top-bar {\n position: sticky;\n}\n\n:host(.anchor-right.side-display) .top-bar {\n box-shadow: 0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.anchor-right.side-display) .bottom-wrapper {\n box-shadow: 0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.side-display) .side-navigation,\n:host(.side-display) .top-bar {\n width: var(--sm-side-navigation-top-bar-height);\n}\n\n:host(.sm-collapsed.side-display) {\n width: var(--sm-side-navigation-top-bar-height);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) {\n width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-expanded.side-display) {\n width: var(--side-navigation-width);\n transition: width var(--ic-easing-transition-slow);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.side-display) .side-navigation {\n --side-navigation-position-top: 0;\n\n flex: 1;\n position: relative;\n top: auto;\n left: auto;\n bottom: auto;\n}\n\n:host(.inline.side-display) .side-navigation {\n position: relative;\n}\n\n:host(.anchor-right.side-display) .side-navigation {\n left: auto;\n right: 0;\n}\n\n:host(.side-display) .app-title-wrapper {\n margin-left: 0;\n border-left: none;\n padding: var(--ic-space-xs) var(--ic-space-sm);\n}\n\n:host(.side-display) .app-title-wrapper ::slotted(svg) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host(.side-display) .app-title-wrapper ic-typography {\n font-weight: var(--ic-font-weight-semibold);\n}\n\n:host(.sm-collapsed.side-display) .app-title-wrapper ic-typography {\n position: absolute;\n left: -9999px;\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.sm-expanded.side-display) ic-typography {\n position: relative;\n left: 0;\n}\n\n:host(.sm-expanded.side-display) :is(.side-navigation, .top-bar) {\n width: var(--side-navigation-width);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.sm-collapsed.side-display) :is(.side-navigation, .top-bar) {\n width: var(--sm-side-navigation-top-bar-height);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.anchor-right.sm-expanded.side-display) :is(.side-navigation, .top-bar) {\n left: auto;\n right: 0;\n}\n\n:host(.side-display) .app-status-wrapper,\n:host(.sm-collapsed.side-display) .app-status-wrapper {\n display: none;\n margin-left: 0;\n}\n\n:host(.sm-expanded.side-display) .app-status-wrapper {\n display: flex;\n max-width: 16rem;\n margin-right: calc(var(--ic-space-xxxs) + var(--ic-space-xs));\n}\n\n:host(.side-display) .bottom-side-nav {\n justify-items: flex-end;\n align-items: flex-end;\n justify-content: flex-end;\n display: flex;\n outline: none;\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button {\n padding-left: var(--ic-space-md);\n height: var(--sm-side-navigation-top-bar-height);\n width: 100%;\n color: var(--ic-theme-text);\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n border: none;\n cursor: pointer;\n display: flex;\n transition: var(--ic-easing-transition-fast);\n}\n\n:host(.sm-expanded.side-display) .bottom-side-nav .menu-expand-button {\n height: 100%;\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button svg {\n justify-items: flex-start;\n align-self: center;\n display: inline-block;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button:hover {\n background-color: var(--ic-theme-hover);\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n background-color: transparent;\n}\n\n:host(.sm-collapsed.side-display) .bottom-side-nav .menu-expand-button svg {\n transform: scaleX(1);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n:host(.sm-expanded.side-display) .bottom-side-nav .menu-expand-button svg {\n transform: scaleX(-1);\n transition: transform var(--ic-easing-transition-slow);\n align-self: flex-end;\n margin-bottom: 0.875rem;\n}\n\n:host(.anchor-right.sm-collapsed.side-display)\n .bottom-side-nav\n .menu-expand-button\n svg {\n transform: scaleX(-1);\n}\n\n:host(.anchor-right.sm-expanded.side-display)\n .bottom-side-nav\n .menu-expand-button\n svg {\n transform: scaleX(1);\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item) {\n --navigation-item-label-opacity: 1;\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item),\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-group) {\n --navigation-item-label-opacity: 0;\n --navigation-item-min-height: 56px;\n --navigation-item-height: 56px;\n}\n\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-item),\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-group) {\n --navigation-item-label-opacity: 1;\n --navigation-item-height: auto;\n --navigation-item-min-height: 56px;\n --navigation-item-width: 320px;\n --navigation-item-side-nav-right: var(--ic-space-xl);\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-group) {\n --navigation-group-title-position: absolute;\n --navigation-group-title-position-left: -9999px;\n --navigation-group-title-opacity: none;\n}\n\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-group) {\n --navigation-group-title-position: relative;\n --navigation-group-title-position-left: 0;\n --navigation-group-expand-toggle-padding: 0.25rem;\n --navigation-group-title-opacity: flex;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .side-navigation,\n:host(.sm-collapsed.collapsed-labels.side-display) .top-bar {\n width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .menu-expand-button {\n padding: 0;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .app-title-wrapper {\n width: 100%;\n justify-content: center;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display)\n ::slotted(ic-navigation-group) {\n --navigation-group-justify-content: center;\n --navigation-item-label-opacity: 1;\n --navigation-group-item-min-width: 100%;\n --navigation-group-expand-toggle-padding: 1rem;\n}\n\n:host(.collapsed-labels.side-display) .bottom-side-nav .menu-expand-button {\n justify-content: center;\n}\n\n:host(.side-display) .collapsed-icon-labels-start {\n visibility: hidden;\n opacity: 0;\n}\n\n:host(.side-display) .collapsed-icon-labels-end {\n visibility: visible;\n opacity: 1;\n transition: visibility 0s, opacity var(--ic-easing-transition-slow);\n}\n\n/* Media Queries */\n\n@media screen and (min-width: 340px) {\n .app-icon-container {\n display: flex;\n }\n}\n\n@media screen and (min-width: 993px) {\n :host(.side-display) {\n position: sticky;\n left: auto;\n top: 0;\n bottom: 0;\n }\n\n :host(.sm-expanded.side-display) {\n box-shadow: none;\n }\n}\n\n@media (forced-colors: active) {\n .side-navigation,\n .top-bar {\n border-right: var(--ic-hc-border);\n }\n\n .menu-expand-button {\n color: Highlight !important;\n }\n\n slot[name=\"app-icon\"]::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Element,\n Listen,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\n\nimport menuIcon from \"../../assets/hamburger-menu-icon.svg\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport {\n getCurrentDeviceSize,\n DEVICE_SIZES,\n checkResizeObserver,\n isSlotUsed,\n getThemeForegroundColor,\n getCssProperty,\n hasClassificationBanner,\n onComponentRequiredPropUndefined,\n isEmptyString,\n isPropDefined,\n} from \"../../utils/helpers\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcTopBar, IcExpandedDetail } from \"./ic-side-navigation.types\";\n\n/**\n * @slot app-icon - Content will be rendered adjacent to the app title at the very top of the side navigation.\n * @slot app-title - Handle routing by nesting a route in the app title.\n * @slot primary-navigation - Content will be rendered at the top of the side navigation.\n * @slot secondary-navigation - Content will be rendered at the bottom of the side navigation.\n */\n\n@Component({\n tag: \"ic-side-navigation\",\n styleUrl: \"ic-side-navigation.css\",\n shadow: true,\n})\nexport class SideNavigation {\n private ANIMATION_DURATION =\n parseInt(getCssProperty(\"--ic-transition-duration-slow\")) || 0;\n private IC_NAVIGATION_ITEM: string = \"ic-navigation-item\";\n private resizeObserver: ResizeObserver = null;\n private COLLAPSED_ICON_LABELS_END = \"collapsed-icon-labels-end\";\n private COLLAPSED_ICON_LABELS_START = \"collapsed-icon-labels-start\";\n private menuButton: HTMLIcButtonElement = null;\n\n @Element() el: HTMLIcSideNavigationElement;\n\n @State() deviceSize: number = getCurrentDeviceSize();\n @State() deviceSizeAppTitle: number = DEVICE_SIZES.S;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n @State() hasSecondaryNavigation: boolean = false;\n @State() menuExpanded: boolean = false;\n @State() menuOpen: boolean = false;\n\n /**\n * The app title to be displayed. This is required, unless a slotted app title link is used.\n */\n @Prop() appTitle: string;\n\n /**\n * If `true`, the icon and label will appear when side navigation is collapsed.\n */\n @Prop() collapsedIconLabels: boolean = false;\n\n /**\n * If `true`, automatic parent wrapper styling will be disabled.\n */\n @Prop() disableAutoParentStyling: boolean = false;\n\n /**\n * If `true`, the side navigation will not display as a top bar on small devices.\n */\n @Prop() disableTopBarBehaviour: boolean = false;\n\n /**\n * If `true`, the side navigation will display in an expanded state.\n */\n @Prop() expanded: boolean = false;\n\n @Watch(\"expanded\")\n watchExpandedHandler(): void {\n this.setMenuExpanded(this.expanded);\n }\n\n /**\n * The URL that the app title link points to.\n */\n @Prop() href: string = \"/\";\n\n /**\n * @internal If `true`, side navigation will be contained by its parent element.\n */\n @Prop() inline: boolean = false;\n\n /**\n * The short title of the app to be displayed at small screen sizes in place of the app title.\n */\n @Prop() shortAppTitle: string = \"\";\n\n /**\n * If `true`, the menu expand button will be removed (PLEASE NOTE: This takes effect on screen sizes 992px and above).\n */\n @Prop() static: boolean = false;\n\n /**\n * The status of the app to be displayed.\n */\n @Prop() status: string;\n\n /**\n * The version of the app to be displayed.\n */\n @Prop() version: string;\n\n /**\n * Emitted when the side navigation is collapsed and expanded.\n */\n @Event() sideNavExpanded: EventEmitter<IcExpandedDetail>;\n\n componentWillLoad(): void {\n this.setMenuExpanded(this.expanded);\n\n if (this.collapsedIconLabels) {\n this.setCollapsedIconLabels();\n }\n\n this.hasSecondaryNavigation = isSlotUsed(this.el, \"secondary-navigation\");\n }\n\n componentDidLoad(): void {\n this.emitSideNavigationExpanded({\n sideNavExpanded: this.menuExpanded,\n sideNavMobile:\n this.deviceSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour,\n });\n\n checkResizeObserver(this.runResizeObserver);\n this.styleSlottedCollapsedIconLabel();\n this.arrangeSlottedNavigationItem(this.menuExpanded);\n this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n this.setExpandedButtonHeight();\n\n !isSlotUsed(this.el, \"app-title\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.appTitle, propName: \"app-title\" }],\n \"Side Navigation\"\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n\n this.el?.removeEventListener(\"transitionend\", this.transitionEndHandler);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler({ detail }: CustomEvent): void {\n this.foregroundColor = (detail as IcTheme).mode;\n }\n\n private emitSideNavigationExpanded = (objDetails: {\n sideNavExpanded: boolean;\n sideNavMobile?: boolean;\n }): void => {\n this.sideNavExpanded.emit({\n sideNavExpanded: objDetails.sideNavExpanded,\n sideNavMobile: objDetails.sideNavMobile,\n });\n };\n\n private toggleMenu = (): void => {\n this.menuOpen = !this.menuOpen;\n this.setMobileMenuAriaAttributes(this.menuOpen);\n\n this.arrangeSlottedNavigationItem(this.menuOpen);\n\n this.setToggleMenuFlyoutMenuVisibility(this.menuOpen);\n\n this.emitSideNavigationExpanded({\n sideNavExpanded: this.menuOpen,\n sideNavMobile: true,\n });\n };\n\n private setToggleMenuFlyoutMenuVisibility = (menuOpen: boolean) => {\n const sideNav = this.el.shadowRoot.querySelector(\n \"#side-navigation\"\n ) as HTMLDivElement;\n const sideNavInner = sideNav.querySelector(\n \".side-navigation-inner\"\n ) as HTMLElement;\n const bottomWrapper = sideNav.querySelector(\n \".bottom-wrapper\"\n ) as HTMLElement;\n\n const menuVisibilityVisible = \"menu-visibility-visible\";\n\n if (menuOpen) {\n bottomWrapper.classList.add(menuVisibilityVisible);\n sideNavInner.classList.add(menuVisibilityVisible);\n } else {\n setTimeout(() => {\n sideNavInner.classList.remove(menuVisibilityVisible);\n bottomWrapper.classList.remove(menuVisibilityVisible);\n }, this.ANIMATION_DURATION);\n }\n };\n\n private setMobileMenuAriaAttributes = (menuOpen: boolean) => {\n if (this.menuButton !== null) {\n this.menuButton.setAttribute(\"aria-expanded\", `${menuOpen}`);\n this.menuButton.setAttribute(\n \"aria-label\",\n `${menuOpen ? \"Close\" : \"Open\"} navigation menu`\n );\n }\n };\n\n private setAndRemoveNoWrapAfterMenuExpanded = () => {\n const appTitle =\n this.el.shadowRoot.querySelector(\".title-link ic-typography\") ||\n this.el.querySelector(\"[slot='app-title']\");\n\n appTitle.classList.add(\"ic-typography-no-wrap\");\n\n setTimeout(() => {\n appTitle.classList.remove(\"ic-typography-no-wrap\");\n }, this.ANIMATION_DURATION);\n };\n\n private toggleMenuExpanded = (): void => {\n this.menuExpanded = !this.menuExpanded;\n\n if (this.menuExpanded) {\n this.setAndRemoveNoWrapAfterMenuExpanded();\n this.el.shadowRoot\n .querySelector(\".app-title-inner-wrapper\")\n .classList.add(\"app-title-show\");\n } else {\n this.el.style.setProperty(\"--navigation-item-width\", \"320px\");\n this.el.shadowRoot\n .querySelector(\".app-title-inner-wrapper\")\n .classList.remove(\"app-title-show\");\n\n this.el.addEventListener(\"transitionend\", (e) => {\n if (e.propertyName === \"width\") {\n this.el.style.setProperty(\"--navigation-item-width\", null);\n }\n });\n }\n\n this.arrangeSlottedNavigationItem(this.menuExpanded);\n\n this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n if (this.collapsedIconLabels) {\n this.animateCollapsedIconLabels();\n }\n\n this.setExpandedButtonHeight();\n this.emitSideNavigationExpanded({ sideNavExpanded: this.menuExpanded });\n };\n\n /**\n * In order to style nested slotted elements (e.g. using React Router components), this method\n * rearranges the a tag and labels and adds inline styling expand/collapsed animations as external CSS classes are not\n * do not take affect.\n * @param menuExpanded boolean - true or false depending on side navigation state\n */\n private arrangeSlottedNavigationItem = (menuExpanded?: boolean) => {\n const navItems = this.el.querySelectorAll(\"ic-navigation-item\");\n navItems.forEach((navItem) => {\n const isNamedSlot = isSlotUsed(navItem, \"navigation-item\");\n const isUnnamedSlot =\n navItem.children[0] && !navItem.children[0].getAttribute(\"slot\");\n if (isNamedSlot || isUnnamedSlot) {\n let navItemSlot;\n if (isNamedSlot) {\n navItemSlot = navItem.querySelector(\"[slot='navigation-item']\");\n } else {\n navItemSlot = navItem.children[0];\n }\n const iconWrapper = document.createElement(\"div\");\n const icon = navItemSlot.querySelector(\"svg\");\n const label = navItem.textContent.trim();\n const icTypography = document.createElement(\"ic-typography\");\n icTypography.classList.add(\n \"ic-typography-label\",\n \"hydrated\",\n \"navigation-item-side-nav-slotted-text\"\n );\n\n iconWrapper.style.height = \"var(--ic-space-lg)\";\n iconWrapper.append(icon);\n\n navItemSlot.textContent = \"\";\n\n icTypography.textContent = label;\n\n navItemSlot.append(iconWrapper);\n navItemSlot.append(icTypography);\n\n if (this.collapsedIconLabels) {\n this.styleSlottedCollapsedIconLabels(menuExpanded, icTypography);\n } else {\n this.styleSlottedIconLabels(menuExpanded, icTypography);\n }\n }\n });\n };\n\n private styleSlottedCollapsedIconLabels = (\n menuExpanded: boolean,\n icTypography: HTMLIcTypographyElement\n ) => {\n if (menuExpanded) {\n icTypography.style.marginTop = \"0\";\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n } else {\n icTypography.style.marginTop = \"10px\";\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n }\n };\n\n private setExpandedButtonHeight = () => {\n const appStatusWrapper = this.el.shadowRoot.querySelector(\n \"#side-navigation > .bottom-wrapper > .bottom-side-nav > .app-status-wrapper\"\n ) as HTMLDivElement;\n\n if (appStatusWrapper.offsetHeight !== 0) {\n this.el.style.setProperty(\n \"--sm-side-navigation-bottom-bar-height\",\n `${appStatusWrapper.offsetHeight}px`\n );\n }\n };\n\n private styleSlottedIconLabels = (\n menuExpanded: boolean,\n icTypography: HTMLSpanElement\n ) => {\n if (menuExpanded) {\n icTypography.style.opacity = \"1\";\n icTypography.style.visibility = \"visible\";\n icTypography.style.transition =\n \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n } else {\n icTypography.style.opacity = \"0\";\n icTypography.style.visibility = \"hidden\";\n icTypography.style.transition =\n \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n }\n };\n\n private transitionHandler = (type: string) => {\n const primaryNavigationWrapper = this.el.shadowRoot.querySelector(\n \".primary-navigation\"\n );\n\n const secondaryNavigationWrapper = this.el.shadowRoot.querySelector(\n \".bottom-wrapper > .secondary-navigation\"\n );\n\n const classToRemove =\n type === \"start\"\n ? this.COLLAPSED_ICON_LABELS_END\n : this.COLLAPSED_ICON_LABELS_START;\n\n const classToAdd =\n type === \"start\"\n ? this.COLLAPSED_ICON_LABELS_START\n : this.COLLAPSED_ICON_LABELS_END;\n\n if (primaryNavigationWrapper) {\n primaryNavigationWrapper.classList.remove(classToRemove);\n primaryNavigationWrapper.classList.add(classToAdd);\n }\n\n if (secondaryNavigationWrapper) {\n secondaryNavigationWrapper.classList.remove(classToRemove);\n secondaryNavigationWrapper.classList.add(classToAdd);\n }\n };\n\n private transitionEndHandler = () => {\n this.transitionHandler(\"end\");\n };\n\n private animateCollapsedIconLabels = () => {\n this.transitionHandler(\"start\");\n this.transitionEndHandler();\n\n this.el.addEventListener(\"transitionend\", this.transitionEndHandler);\n };\n\n private paddingIconWidth = (\n navItems: HTMLIcNavigationItemElement[]\n ): number => {\n const navItemLink =\n (navItems[0].shadowRoot &&\n (navItems[0].shadowRoot.querySelector(\"ic-tooltip a\") ||\n navItems[0].shadowRoot.querySelector(\"ic-tooltip div\"))) ||\n navItems[0].querySelector(\"a\") ||\n navItems[0].querySelector(\"div\");\n const navItemSVG = navItems[0].querySelector(\"svg\");\n\n const navStyles = {\n gap: window.getComputedStyle(navItemLink).gap,\n iconWidth: window.getComputedStyle(navItemSVG).width,\n paddingLeft: window.getComputedStyle(navItemLink).paddingLeft,\n };\n\n return Object.values(navStyles).reduce((prev, curr) => {\n return (prev += parseInt(curr));\n }, 0);\n };\n\n private displayTooltipWithExpandedLongLabel = (menuExpanded: boolean) => {\n let timer;\n\n if (menuExpanded) {\n timer = setTimeout(() => {\n const sideNavWidth = this.el.clientWidth;\n\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n\n const paddingIconDelta = navigationItems.length\n ? this.paddingIconWidth(navigationItems)\n : 0;\n\n navigationItems.forEach(\n (navigationItem: HTMLIcNavigationItemElement) => {\n const icTypographyScrollWidth =\n (\n navigationItem.shadowRoot &&\n navigationItem.shadowRoot.querySelector(\n \"ic-tooltip .link ic-typography.ic-typography-label\"\n )\n )?.scrollWidth ||\n navigationItem.querySelector(\"ic-typography.ic-typography-label\")\n ?.scrollWidth;\n\n if (icTypographyScrollWidth > sideNavWidth - paddingIconDelta) {\n navigationItem.setAttribute(\"display-navigation-tooltip\", \"true\");\n }\n }\n );\n }, this.ANIMATION_DURATION);\n } else {\n clearTimeout(timer);\n\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n navigationItem.setAttribute(\"display-navigation-tooltip\", \"false\");\n });\n }\n };\n\n private setMenuExpanded = (expanded: boolean): void => {\n this.menuExpanded = expanded;\n };\n\n /**\n * As the mobile top bar is fixed, a padding top is required\n * to push main content down the height of the mobile top bar\n * @param value - padding-top css value\n */\n private setParentPaddingTop = (value: string) => {\n this.el.parentElement.style.setProperty(\"padding-top\", value);\n };\n\n private setParentPaddingLeft = (value: string) => {\n this.el.parentElement.style.setProperty(\"padding-left\", value);\n };\n\n private renderAppTitle = (isAppNameSubtitleVariant: boolean) => {\n const displayShortAppTitle =\n this.deviceSize <= DEVICE_SIZES.S && !isEmptyString(this.shortAppTitle);\n return (\n <ic-typography\n variant={\n displayShortAppTitle || isAppNameSubtitleVariant\n ? \"subtitle-small\"\n : \"h3\"\n }\n aria-label={\n displayShortAppTitle\n ? `${this.appTitle} (${this.shortAppTitle})`\n : undefined\n }\n >\n <h1>{displayShortAppTitle ? this.shortAppTitle : this.appTitle}</h1>\n </ic-typography>\n );\n };\n\n private resizeObserverCallback = (currSize: number) => {\n this.deviceSize = currSize;\n\n const isSmallAndDisableTopBar =\n currSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour;\n\n if (!this.disableAutoParentStyling) {\n const topBarHeight =\n this.el.shadowRoot.querySelector(\".top-bar\")?.scrollHeight;\n this.setParentPaddingTop(\n isSmallAndDisableTopBar ? `${topBarHeight}px` : \"0\"\n );\n if (isSmallAndDisableTopBar) this.setParentPaddingLeft(\"0\");\n if (isSmallAndDisableTopBar && this.inline) {\n this.el.parentElement.style.setProperty(\n \"height\",\n `calc(100% - ${topBarHeight}px)`\n );\n } else if (!isSmallAndDisableTopBar) {\n this.el.parentElement.style.setProperty(\"height\", \"100%\");\n }\n }\n\n if (!this.disableAutoParentStyling) {\n const paddingLeft = `calc(var(--ic-space-xxl) ${\n this.collapsedIconLabels ? \"* 2\" : \"+ var(--ic-space-xs)\"\n })`;\n\n if (currSize > DEVICE_SIZES.L) {\n this.setParentPaddingTop(\"0\");\n this.setParentPaddingLeft(\"0\");\n } else if (\n (currSize > DEVICE_SIZES.S || this.disableTopBarBehaviour) &&\n currSize <= DEVICE_SIZES.M &&\n this.static\n ) {\n this.setParentPaddingLeft(paddingLeft);\n } else if (\n (currSize > DEVICE_SIZES.S || this.disableTopBarBehaviour) &&\n currSize <= DEVICE_SIZES.L\n ) {\n this.setParentPaddingLeft(\n this.static && this.menuExpanded\n ? \"calc(var(--ic-space-xl) * 10)\"\n : paddingLeft\n );\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.deviceSizeAppTitle = currSize;\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(document.body, { box: \"content-box\" });\n };\n\n private setCollapsedIconLabels = () => {\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n navigationItem.setAttribute(\"collapsed-icon-label\", \"true\");\n });\n };\n\n private styleSlottedCollapsedIconLabel = () => {\n const dynamicSlottedIcTypographyComps: HTMLIcTypographyElement[] =\n Array.from(\n this.el.querySelectorAll(\".navigation-item-side-nav-slotted-text\")\n );\n\n dynamicSlottedIcTypographyComps.forEach((icTypography) => {\n if (\n icTypography?.parentElement?.parentElement?.classList.contains(\n \"navigation-item-side-nav-collapsed-with-label\"\n )\n ) {\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n icTypography.style.marginTop = \"10px\";\n }\n });\n };\n\n private renderTopBar = ({\n isSDevice,\n foregroundColor,\n menuOpen,\n href,\n isAppNameSubtitleVariant,\n }: IcTopBar) => {\n const hasTitle = this.appTitle !== \"\" && isPropDefined(this.appTitle);\n\n const Component = isSlotUsed(this.el, \"app-title\") ? \"div\" : \"a\";\n\n const attrs = Component == \"a\" && {\n href: href,\n };\n\n return (\n <div\n class={{\n \"top-bar\": true,\n [this.foregroundColor]: true,\n }}\n >\n {isSDevice && (\n <nav\n aria-labelledby=\"menu-navigation-toggle-button-landmark\"\n aria-hidden=\"false\"\n >\n <ic-button\n aria-label=\"Open navigation menu\"\n class=\"menu-button\"\n id=\"menu-button\"\n variant=\"secondary\"\n size=\"small\"\n full-width=\"true\"\n appearance={foregroundColor}\n onClick={this.toggleMenu}\n ariaOwnsId=\"side-navigation\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n ref={(el) => (this.menuButton = el)}\n >\n <span\n class=\"mobile-top-bar-menu-icon\"\n slot=\"icon\"\n innerHTML={menuOpen ? closeIcon : menuIcon}\n ></span>\n {menuOpen ? \"Close\" : \"Menu\"}\n </ic-button>\n <span\n id=\"menu-navigation-toggle-button-landmark\"\n class=\"navigation-landmark-title\"\n aria-hidden=\"true\"\n >\n Navigation menu toggle button\n </span>\n </nav>\n )}\n <div class=\"app-title-wrapper\">\n {(hasTitle || isSlotUsed(this.el, \"app-title\")) && (\n <Component {...attrs} class=\"title-link\">\n <div class=\"app-icon-container\" aria-hidden=\"true\">\n <slot name=\"app-icon\"></slot>\n </div>\n <div class=\"app-title-inner-wrapper\">\n {isSlotUsed(this.el, \"app-title\") ? (\n <slot name=\"app-title\"></slot>\n ) : (\n this.renderAppTitle(isAppNameSubtitleVariant)\n )}\n </div>\n </Component>\n )}\n </div>\n </div>\n );\n };\n\n render() {\n const {\n appTitle,\n menuOpen,\n foregroundColor,\n menuExpanded,\n href,\n status,\n version,\n collapsedIconLabels,\n inline,\n } = this;\n\n const isSDevice =\n !this.disableTopBarBehaviour && this.deviceSize === DEVICE_SIZES.S;\n const isMdDevice = this.deviceSize === DEVICE_SIZES.M;\n const isLgDevice = this.deviceSize >= DEVICE_SIZES.L;\n const isAppNameSubtitleVariant = this.deviceSizeAppTitle === DEVICE_SIZES.S;\n const displayExpandBtn =\n isMdDevice || this.disableTopBarBehaviour || (isLgDevice && !this.static);\n\n const topBarProps: IcTopBar = {\n isSDevice,\n foregroundColor,\n menuOpen,\n href,\n isAppNameSubtitleVariant,\n appTitle,\n };\n\n return (\n <Host\n class={{\n \"xs-menu-open\": menuOpen && isSDevice,\n \"xs-menu-close\": !menuOpen && isSDevice,\n \"sm-collapsed\": !isSDevice && !menuExpanded,\n \"sm-expanded\": !isSDevice && menuExpanded,\n \"side-display\":\n this.deviceSize > DEVICE_SIZES.S || this.disableTopBarBehaviour,\n [IcThemeForegroundEnum.Dark]:\n foregroundColor === IcThemeForegroundEnum.Dark,\n [\"collapsed-labels\"]:\n !isSDevice && !menuExpanded && collapsedIconLabels,\n [\"inline\"]: inline,\n }}\n >\n {isSDevice && this.renderTopBar({ ...topBarProps })}\n <div class=\"side-navigation\" id=\"side-navigation\">\n {!isSDevice && this.renderTopBar({ ...topBarProps })}\n <div class=\"side-navigation-inner\">\n {isSlotUsed(this.el, \"primary-navigation\") && (\n <nav\n class=\"primary-navigation\"\n aria-labelledby=\"primary-navigation-landmark\"\n >\n <span\n aria-hidden=\"true\"\n class=\"navigation-landmark-title\"\n id=\"primary-navigation-landmark\"\n >\n Primary\n </span>\n <ul class=\"navigation-list\">\n <slot name=\"primary-navigation\"></slot>\n </ul>\n </nav>\n )}\n </div>\n <div\n class={{\n [\"bottom-wrapper\"]: true,\n [\"classification-spacing\"]: hasClassificationBanner(),\n }}\n >\n {isSlotUsed(this.el, \"secondary-navigation\") && (\n <nav\n class=\"secondary-navigation\"\n aria-labelledby=\"secondary-navigation-landmark\"\n >\n <span\n aria-hidden=\"true\"\n class=\"navigation-landmark-title\"\n id=\"secondary-navigation-landmark\"\n >\n Secondary\n </span>\n <ul class=\"navigation-list\">\n <slot name=\"secondary-navigation\"></slot>\n </ul>\n </nav>\n )}\n <div class=\"bottom-side-nav\">\n {this.hasSecondaryNavigation && <ic-divider></ic-divider>}\n {displayExpandBtn && (\n <button\n class=\"menu-expand-button\"\n innerHTML={chevronIcon}\n onClick={this.toggleMenuExpanded}\n aria-label={`${\n menuExpanded ? \"Collapse\" : \"Expand\"\n } side navigation`}\n ></button>\n )}\n <div class=\"app-status-wrapper\">\n {status !== \"\" && (\n <div\n class={{\n [\"app-status\"]: true,\n }}\n >\n <ic-typography\n aria-label=\"app tag\"\n variant=\"label-uppercase\"\n class=\"app-status-text\"\n >\n {status}\n </ic-typography>\n </div>\n )}\n {version !== \"\" && (\n <ic-typography\n variant=\"label\"\n class=\"app-version\"\n aria-label=\"app version\"\n >\n {version}\n </ic-typography>\n )}\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-side-navigation.entry.cjs.js","mappings":"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","names":["getCssProperty","DEVICE_SIZES","isSlotUsed","isEmptyString","h","getCurrentDeviceSize","isPropDefined","closeIcon","getThemeForegroundColor","checkResizeObserver","onComponentRequiredPropUndefined","Host","IcThemeForegroundEnum","hasClassificationBanner","chevronIcon"],"sources":["src/components/ic-side-navigation/ic-side-navigation.css?tag=ic-side-navigation&encapsulation=shadow","src/components/ic-side-navigation/ic-side-navigation.tsx"],"sourcesContent":["/**\n * @prop --ic-z-index-side-navigation: z-index of side navigation panel\n */\n\n:host {\n display: block;\n\n --side-navigation-position: fixed;\n --side-navigation-position-left: 0;\n --side-navigation-position-top: var(--ic-space-xxl);\n --side-navigation-height: var(--ic-space-xxl);\n --sm-side-navigation-top-bar-height: 3.5rem;\n --sm-side-navigation-collapsed-labels-width: 6rem;\n --sm-side-navigation-expand-transition-duration: var(\n --ic-transition-duration-slow\n );\n --side-navigation-width: 20rem;\n --sm-side-navigation-bottom-bar-height: 3.5rem;\n\n z-index: var(--ic-z-index-side-navigation);\n}\n\n:host > * {\n box-sizing: border-box;\n}\n\n.side-navigation {\n display: flex;\n flex-direction: column;\n width: var(--side-navigation-width);\n color: var(--ic-theme-text);\n position: var(--side-navigation-position);\n top: var(--side-navigation-position-top);\n left: calc(var(--side-navigation-width) * -1);\n bottom: 0;\n background-color: var(--ic-theme-primary);\n z-index: var(--ic-z-index-side-navigation);\n}\n\n:host(.inline) .side-navigation {\n position: absolute;\n height: 100%;\n}\n\n:host(.anchor-right) .side-navigation {\n right: calc(var(--side-navigation-width) * -1);\n}\n\n.classification-spacing {\n margin-bottom: var(--ic-space-lg);\n}\n\n.navigation-list {\n padding: 0;\n margin: 0;\n list-style: none;\n}\n\n.side-navigation-inner {\n background-color: var(--ic-theme-primary);\n display: flex;\n flex-direction: column;\n flex: 1 1 0;\n overflow: auto;\n}\n\n:host(.inline) .side-navigation-inner {\n flex: 1;\n}\n\n:host(.xs-menu-open) .side-navigation {\n transition: left var(--ic-easing-transition-slow);\n left: 0;\n}\n\n:host(:has(.xs-menu-open, .xs-menu-close)) ::slotted(ic-navigation-item) {\n --navigation-item-side-nav-right: var(--ic-space-xl);\n}\n\n:host(.xs-menu-close) .side-navigation {\n left: calc(var(--side-navigation-width) * -1);\n transition: left var(--ic-easing-transition-slow);\n}\n\n:host(.xs-menu-close) .side-navigation > * {\n visibility: hidden;\n}\n\n:host(.anchor-right.xs-menu-open) .side-navigation {\n right: 0;\n left: auto;\n}\n\n:host(.anchor-right.xs-menu-close) .side-navigation {\n right: calc(var(--side-navigation-width) * -1);\n left: auto;\n transition: right var(--ic-easing-transition-slow);\n}\n\n.bottom-wrapper {\n border-top: var(--ic-keyline-lighten);\n bottom: 0;\n left: 0;\n z-index: 2;\n box-shadow: -0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n background-color: var(--ic-theme-primary);\n display: flex;\n flex-direction: column;\n}\n\n:host(.inline) .bottom-wrapper {\n position: sticky;\n}\n\n:host(.dark) .bottom-wrapper {\n border-top: var(--ic-keyline-darken);\n}\n\n/* Mobile Top Bar */\n\n.top-bar {\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: var(--side-navigation-height);\n padding: var(--ic-space-xs);\n box-sizing: border-box;\n background-color: var(--ic-theme-primary);\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n border-bottom: var(--ic-keyline-darken);\n box-shadow: var(--ic-elevation-overlay);\n z-index: 2;\n overflow: hidden;\n visibility: visible;\n}\n\n:host(.inline) .top-bar {\n position: absolute;\n}\n\n.top-bar.dark a:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.top-bar.light {\n border-bottom: var(--ic-keyline-lighten);\n}\n\n.app-title-wrapper {\n display: flex;\n margin-left: var(--ic-space-xs);\n border-left: var(--ic-keyline-darken);\n padding-left: var(--ic-space-xxs);\n color: var(--ic-theme-text);\n align-items: center;\n}\n\n.app-title-wrapper ic-typography h1 {\n margin: 0;\n}\n\n@media screen and (min-width: 340px) {\n .app-title-wrapper ic-typography {\n margin-left: var(--ic-space-xs);\n }\n}\n\n:host .title-link {\n display: flex;\n align-items: center;\n transition: box-shadow var(--ic-easing-transition-fast),\n background-color var(--ic-easing-transition-fast);\n text-decoration: none;\n padding: var(--ic-space-xxs);\n color: var(--ic-theme-text);\n}\n\n:host .title-link:visited,\n:host .title-link:active {\n color: var(--ic-theme-text);\n}\n\nslot[name=\"app-title\"]::slotted(a),\nslot[name=\"app-icon\"]::slotted(a) {\n color: var(--ic-theme-text);\n outline: none;\n text-decoration: none;\n display: flex;\n}\n\nslot[name=\"app-title\"]::slotted(ic-typography),\nslot[name=\"app-title\"]::slotted(a) {\n margin-left: var(--ic-space-xs) !important;\n}\n\nslot[name=\"app-title\"]::slotted(a) {\n font: var(--ic-font-subtitle-small);\n}\n\n@media screen and (min-width: 577px) {\n :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(ic-typography),\n :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(a) {\n position: absolute;\n left: -9999px;\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n }\n\n :host(.sm-expanded) slot[name=\"app-title\"]::slotted(a) {\n font: var(--ic-font-h3) !important;\n font-weight: var(--ic-font-weight-semibold) !important;\n margin-left: var(--ic-space-xs) !important;\n }\n}\n\n:host .title-link:hover {\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-theme-hover);\n}\n\n:host .title-link:active {\n background-color: var(--ic-theme-active);\n}\n\n:host .title-link:focus,\n:host .title-link:focus-within {\n border-radius: var(--ic-border-radius);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n background-color: transparent;\n}\n\n:host .title-link ic-typography {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.app-title-wrapper ::slotted(svg) {\n fill: var(--ic-theme-text);\n}\n\n.app-icon-container {\n display: none;\n}\n\n.button-label {\n display: flex;\n align-items: center;\n}\n\n.mobile-top-bar-menu-icon {\n display: flex;\n}\n\n.menu-button {\n width: 6.5rem;\n}\n\n.app-status-wrapper {\n inset: 0 var(--ic-space-sm) 0 3.5rem;\n width: auto;\n display: flex;\n gap: var(--ic-space-xs);\n padding: var(--ic-space-sm) 0;\n justify-content: flex-end;\n align-items: flex-end;\n pointer-events: none;\n height: fit-content;\n margin: 0 var(--ic-space-xs);\n}\n\n.app-status-wrapper .app-version {\n display: flex;\n overflow-wrap: break-word;\n padding-bottom: var(--ic-space-xxs);\n}\n\n.app-status-wrapper .app-status {\n display: flex;\n border-radius: 1rem;\n background-color: var(--ic-theme-text);\n color: var(--ic-color-primary-text);\n padding: var(--ic-space-xxs) var(--ic-space-lg);\n min-width: 1rem;\n}\n\n.app-status-wrapper .app-status-text {\n overflow-wrap: break-word;\n}\n\n:host(.dark) .app-status-wrapper .app-status {\n color: var(--ic-color-white-text);\n}\n\n.navigation-landmark-title {\n position: absolute;\n width: var(--ic-space-1px);\n height: var(--ic-space-1px);\n padding: 0;\n margin: calc(-1 * var(--ic-space-1px));\n overflow: hidden;\n}\n\n/* Navigation Group */\n\n::slotted(ic-navigation-group) {\n --navigation-group-height: 2.75rem;\n --navigation-group-width: 100%;\n --navigation-group-justify-content: space-between;\n --navigation-group-hover: var(--ic-theme-hover);\n --navigation-group-text-hover: var(--ic-theme-text);\n --navigation-item-child-height: 3.5rem;\n --navigation-item-child-active: var(--ic-action-dark-bg-active);\n --navigation-item-child-color: var(--ic-theme-text);\n --navigation-group-expand-toggle-padding: 0.25rem;\n}\n\n/* Navigation Items */\n\n::slotted(ic-navigation-item),\n::slotted(ic-navigation-group) {\n --navigation-item-justify-content: flex-start;\n --navigation-item-min-height: 56px;\n --navigation-item-height: auto;\n}\n\n/* Toggle Chevron */\n\n.bottom-side-nav {\n position: relative;\n align-content: flex-end;\n min-height: var(--sm-side-navigation-top-bar-height);\n}\n\n.bottom-side-nav ic-divider {\n position: absolute;\n top: 0;\n width: 100%;\n}\n\n.primary-navigation {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n /* Hide scrollbar when required but keep functionality */\n scrollbar-width: none;\n}\n\n.primary-navigation::-webkit-scrollbar {\n display: none;\n}\n\n.primary-navigation,\n.secondary-navigation {\n overflow-x: hidden;\n}\n\n.bottom-side-nav .menu-expand-button {\n position: absolute;\n display: none;\n}\n\n.menu-visibility-visible {\n visibility: visible;\n width: 100%;\n}\n\n.app-title-show {\n min-width: 15.5rem;\n}\n\n:host(.side-display) {\n display: flex;\n flex-direction: column;\n height: 100vh;\n position: var(--side-navigation-position);\n left: 0;\n top: 0;\n bottom: 0;\n}\n\n:host(.side-display) .app-icon-container {\n height: 40px;\n display: flex;\n align-items: center;\n}\n\n:host(.side-display) .top-bar {\n --side-navigation-height: var(--sm-side-navigation-top-bar-height);\n\n position: relative;\n padding: 0;\n box-shadow: -0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.inline.side-display) .top-bar {\n position: sticky;\n}\n\n:host(.anchor-right.side-display) .top-bar {\n box-shadow: 0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.anchor-right.side-display) .bottom-wrapper {\n box-shadow: 0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.side-display) .side-navigation,\n:host(.side-display) .top-bar {\n width: var(--sm-side-navigation-top-bar-height);\n}\n\n:host(.sm-collapsed.side-display) {\n width: var(--sm-side-navigation-top-bar-height);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) {\n width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-expanded.side-display) {\n width: var(--side-navigation-width);\n transition: width var(--ic-easing-transition-slow);\n box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.side-display) .side-navigation {\n --side-navigation-position-top: 0;\n\n flex: 1;\n position: relative;\n top: auto;\n left: auto;\n bottom: auto;\n}\n\n:host(.inline.side-display) .side-navigation {\n position: relative;\n}\n\n:host(.anchor-right.side-display) .side-navigation {\n left: auto;\n right: 0;\n}\n\n:host(.side-display) .app-title-wrapper {\n margin-left: 0;\n border-left: none;\n padding: var(--ic-space-xs) var(--ic-space-sm);\n}\n\n:host(.side-display) .app-title-wrapper ::slotted(svg) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host(.side-display) .app-title-wrapper ic-typography {\n font-weight: var(--ic-font-weight-semibold);\n}\n\n:host(.sm-collapsed.side-display) .app-title-wrapper ic-typography {\n position: absolute;\n left: -9999px;\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.sm-expanded.side-display) ic-typography {\n position: relative;\n left: 0;\n}\n\n:host(.sm-expanded.side-display) :is(.side-navigation, .top-bar) {\n width: var(--side-navigation-width);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.sm-collapsed.side-display) :is(.side-navigation, .top-bar) {\n width: var(--sm-side-navigation-top-bar-height);\n transition: width var(--ic-easing-transition-slow);\n}\n\n:host(.anchor-right.sm-expanded.side-display) :is(.side-navigation, .top-bar) {\n left: auto;\n right: 0;\n}\n\n:host(.side-display) .app-status-wrapper,\n:host(.sm-collapsed.side-display) .app-status-wrapper {\n display: none;\n margin-left: 0;\n}\n\n:host(.sm-expanded.side-display) .app-status-wrapper {\n display: flex;\n max-width: 16rem;\n margin-right: calc(var(--ic-space-xxxs) + var(--ic-space-xs));\n}\n\n:host(.side-display) .bottom-side-nav {\n justify-items: flex-end;\n align-items: flex-end;\n justify-content: flex-end;\n display: flex;\n outline: none;\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button {\n padding-left: var(--ic-space-md);\n height: var(--sm-side-navigation-top-bar-height);\n width: 100%;\n color: var(--ic-theme-text);\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n border: none;\n cursor: pointer;\n display: flex;\n transition: var(--ic-easing-transition-fast);\n}\n\n:host(.sm-expanded.side-display) .bottom-side-nav .menu-expand-button {\n height: 100%;\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button svg {\n justify-items: flex-start;\n align-self: center;\n display: inline-block;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button:hover {\n background-color: var(--ic-theme-hover);\n}\n\n:host(.side-display) .bottom-side-nav .menu-expand-button:focus {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n background-color: transparent;\n}\n\n:host(.sm-collapsed.side-display) .bottom-side-nav .menu-expand-button svg {\n transform: scaleX(1);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n:host(.sm-expanded.side-display) .bottom-side-nav .menu-expand-button svg {\n transform: scaleX(-1);\n transition: transform var(--ic-easing-transition-slow);\n align-self: flex-end;\n margin-bottom: 0.875rem;\n}\n\n:host(.anchor-right.sm-collapsed.side-display)\n .bottom-side-nav\n .menu-expand-button\n svg {\n transform: scaleX(-1);\n}\n\n:host(.anchor-right.sm-expanded.side-display)\n .bottom-side-nav\n .menu-expand-button\n svg {\n transform: scaleX(1);\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item) {\n --navigation-item-label-opacity: 1;\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item),\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-group) {\n --navigation-item-label-opacity: 0;\n --navigation-item-min-height: 56px;\n --navigation-item-height: 56px;\n}\n\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-item),\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-group) {\n --navigation-item-label-opacity: 1;\n --navigation-item-height: auto;\n --navigation-item-min-height: 56px;\n --navigation-item-width: 320px;\n --navigation-item-side-nav-right: var(--ic-space-xl);\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-group) {\n --navigation-group-title-position: absolute;\n --navigation-group-title-position-left: -9999px;\n --navigation-group-title-opacity: none;\n}\n\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-group) {\n --navigation-group-title-position: relative;\n --navigation-group-title-position-left: 0;\n --navigation-group-expand-toggle-padding: 0.25rem;\n --navigation-group-title-opacity: flex;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .side-navigation,\n:host(.sm-collapsed.collapsed-labels.side-display) .top-bar {\n width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .menu-expand-button {\n padding: 0;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .app-title-wrapper {\n width: 100%;\n justify-content: center;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display)\n ::slotted(ic-navigation-group) {\n --navigation-group-justify-content: center;\n --navigation-item-label-opacity: 1;\n --navigation-group-item-min-width: 100%;\n --navigation-group-expand-toggle-padding: 1rem;\n}\n\n:host(.collapsed-labels.side-display) .bottom-side-nav .menu-expand-button {\n justify-content: center;\n}\n\n:host(.side-display) .collapsed-icon-labels-start {\n visibility: hidden;\n opacity: 0;\n}\n\n:host(.side-display) .collapsed-icon-labels-end {\n visibility: visible;\n opacity: 1;\n transition: visibility 0s, opacity var(--ic-easing-transition-slow);\n}\n\n/* Media Queries */\n\n@media screen and (min-width: 340px) {\n .app-icon-container {\n display: flex;\n }\n}\n\n@media screen and (min-width: 993px) {\n :host(.side-display) {\n position: sticky;\n left: auto;\n top: 0;\n bottom: 0;\n }\n\n :host(.sm-expanded.side-display) {\n box-shadow: none;\n }\n}\n\n@media (forced-colors: active) {\n .side-navigation,\n .top-bar {\n border-right: var(--ic-hc-border);\n }\n\n .menu-expand-button {\n color: Highlight !important;\n }\n\n slot[name=\"app-icon\"]::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Element,\n Listen,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\n\nimport menuIcon from \"../../assets/hamburger-menu-icon.svg\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport {\n getCurrentDeviceSize,\n DEVICE_SIZES,\n checkResizeObserver,\n isSlotUsed,\n getThemeForegroundColor,\n getCssProperty,\n hasClassificationBanner,\n onComponentRequiredPropUndefined,\n isEmptyString,\n isPropDefined,\n} from \"../../utils/helpers\";\nimport {\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcTopBar, IcExpandedDetail } from \"./ic-side-navigation.types\";\n\n/**\n * @slot app-icon - Content will be rendered adjacent to the app title at the very top of the side navigation.\n * @slot app-title - Handle routing by nesting a route in the app title.\n * @slot primary-navigation - Content will be rendered at the top of the side navigation.\n * @slot secondary-navigation - Content will be rendered at the bottom of the side navigation.\n */\n\n@Component({\n tag: \"ic-side-navigation\",\n styleUrl: \"ic-side-navigation.css\",\n shadow: true,\n})\nexport class SideNavigation {\n private ANIMATION_DURATION =\n parseInt(getCssProperty(\"--ic-transition-duration-slow\")) || 0;\n private IC_NAVIGATION_ITEM: string = \"ic-navigation-item\";\n private resizeObserver: ResizeObserver = null;\n private COLLAPSED_ICON_LABELS_END = \"collapsed-icon-labels-end\";\n private COLLAPSED_ICON_LABELS_START = \"collapsed-icon-labels-start\";\n private menuButton: HTMLIcButtonElement = null;\n\n @Element() el: HTMLIcSideNavigationElement;\n\n @State() deviceSize: number = getCurrentDeviceSize();\n @State() deviceSizeAppTitle: number = DEVICE_SIZES.S;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n @State() hasSecondaryNavigation: boolean = false;\n @State() menuExpanded: boolean = false;\n @State() menuOpen: boolean = false;\n\n /**\n * The app title to be displayed. This is required, unless a slotted app title link is used.\n */\n @Prop() appTitle: string;\n\n /**\n * If `true`, the icon and label will appear when side navigation is collapsed.\n */\n @Prop() collapsedIconLabels: boolean = false;\n\n /**\n * If `true`, automatic parent wrapper styling will be disabled.\n */\n @Prop() disableAutoParentStyling: boolean = false;\n\n /**\n * If `true`, the side navigation will not display as a top bar on small devices.\n */\n @Prop() disableTopBarBehaviour: boolean = false;\n\n /**\n * If `true`, the side navigation will display in an expanded state.\n */\n @Prop() expanded: boolean = false;\n\n @Watch(\"expanded\")\n watchExpandedHandler(): void {\n this.toggleMenuExpanded(this.expanded);\n }\n\n /**\n * The URL that the app title link points to.\n */\n @Prop() href: string = \"/\";\n\n /**\n * @internal If `true`, side navigation will be contained by its parent element.\n */\n @Prop() inline: boolean = false;\n\n /**\n * The short title of the app to be displayed at small screen sizes in place of the app title.\n */\n @Prop() shortAppTitle: string = \"\";\n\n /**\n * If `true`, the menu expand button will be removed (PLEASE NOTE: This takes effect on screen sizes 992px and above).\n */\n @Prop() static: boolean = false;\n\n /**\n * The status of the app to be displayed.\n */\n @Prop() status: string;\n\n /**\n * The version of the app to be displayed.\n */\n @Prop() version: string;\n\n /**\n * Emitted when the side navigation is collapsed and expanded.\n */\n @Event() sideNavExpanded: EventEmitter<IcExpandedDetail>;\n\n componentWillLoad(): void {\n this.setMenuExpanded(this.expanded);\n\n if (this.collapsedIconLabels) {\n this.setCollapsedIconLabels();\n }\n\n this.hasSecondaryNavigation = isSlotUsed(this.el, \"secondary-navigation\");\n }\n\n componentDidLoad(): void {\n this.emitSideNavigationExpanded({\n sideNavExpanded: this.menuExpanded,\n sideNavMobile:\n this.deviceSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour,\n });\n\n checkResizeObserver(this.runResizeObserver);\n this.styleSlottedCollapsedIconLabel();\n this.arrangeSlottedNavigationItem(this.menuExpanded);\n this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n this.setExpandedButtonHeight();\n\n !isSlotUsed(this.el, \"app-title\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.appTitle, propName: \"app-title\" }],\n \"Side Navigation\"\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n\n this.el?.removeEventListener(\"transitionend\", this.transitionEndHandler);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler({ detail }: CustomEvent): void {\n this.foregroundColor = (detail as IcTheme).mode;\n }\n\n private emitSideNavigationExpanded = (objDetails: {\n sideNavExpanded: boolean;\n sideNavMobile?: boolean;\n }): void => {\n this.sideNavExpanded.emit({\n sideNavExpanded: objDetails.sideNavExpanded,\n sideNavMobile: objDetails.sideNavMobile,\n });\n };\n\n private toggleMenu = (): void => {\n this.menuOpen = !this.menuOpen;\n this.setMobileMenuAriaAttributes(this.menuOpen);\n\n this.arrangeSlottedNavigationItem(this.menuOpen);\n\n this.setToggleMenuFlyoutMenuVisibility(this.menuOpen);\n\n this.emitSideNavigationExpanded({\n sideNavExpanded: this.menuOpen,\n sideNavMobile: true,\n });\n };\n\n private setToggleMenuFlyoutMenuVisibility = (menuOpen: boolean) => {\n const sideNav = this.el.shadowRoot.querySelector(\n \"#side-navigation\"\n ) as HTMLDivElement;\n const sideNavInner = sideNav.querySelector(\n \".side-navigation-inner\"\n ) as HTMLElement;\n const bottomWrapper = sideNav.querySelector(\n \".bottom-wrapper\"\n ) as HTMLElement;\n\n const menuVisibilityVisible = \"menu-visibility-visible\";\n\n if (menuOpen) {\n bottomWrapper.classList.add(menuVisibilityVisible);\n sideNavInner.classList.add(menuVisibilityVisible);\n } else {\n setTimeout(() => {\n sideNavInner.classList.remove(menuVisibilityVisible);\n bottomWrapper.classList.remove(menuVisibilityVisible);\n }, this.ANIMATION_DURATION);\n }\n };\n\n private setMobileMenuAriaAttributes = (menuOpen: boolean) => {\n if (this.menuButton !== null) {\n this.menuButton.setAttribute(\"aria-expanded\", `${menuOpen}`);\n this.menuButton.setAttribute(\n \"aria-label\",\n `${menuOpen ? \"Close\" : \"Open\"} navigation menu`\n );\n }\n };\n\n private setAndRemoveNoWrapAfterMenuExpanded = () => {\n const appTitle =\n this.el.shadowRoot.querySelector(\".title-link ic-typography\") ||\n this.el.querySelector(\"[slot='app-title']\");\n\n appTitle.classList.add(\"ic-typography-no-wrap\");\n\n setTimeout(() => {\n appTitle.classList.remove(\"ic-typography-no-wrap\");\n }, this.ANIMATION_DURATION);\n };\n\n private toggleMenuExpanded = (expanded: boolean): void => {\n if (this.deviceSize > DEVICE_SIZES.S) {\n this.menuExpanded = expanded;\n }\n\n if (this.menuExpanded) {\n this.setAndRemoveNoWrapAfterMenuExpanded();\n this.el.shadowRoot\n .querySelector(\".app-title-inner-wrapper\")\n .classList.add(\"app-title-show\");\n } else {\n this.el.style.setProperty(\"--navigation-item-width\", \"320px\");\n this.el.shadowRoot\n .querySelector(\".app-title-inner-wrapper\")\n .classList.remove(\"app-title-show\");\n\n this.el.addEventListener(\"transitionend\", (e) => {\n if (e.propertyName === \"width\") {\n this.el.style.setProperty(\"--navigation-item-width\", null);\n }\n });\n }\n\n this.arrangeSlottedNavigationItem(this.menuExpanded);\n\n this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n if (this.collapsedIconLabels) {\n this.animateCollapsedIconLabels();\n }\n\n this.setExpandedButtonHeight();\n this.emitSideNavigationExpanded({ sideNavExpanded: this.menuExpanded });\n };\n\n /**\n * In order to style nested slotted elements (e.g. using React Router components), this method\n * rearranges the a tag and labels and adds inline styling expand/collapsed animations as external CSS classes are not\n * do not take affect.\n * @param menuExpanded boolean - true or false depending on side navigation state\n */\n private arrangeSlottedNavigationItem = (menuExpanded?: boolean) => {\n const navItems = this.el.querySelectorAll(\"ic-navigation-item\");\n navItems.forEach((navItem) => {\n const isNamedSlot = isSlotUsed(navItem, \"navigation-item\");\n const isUnnamedSlot =\n navItem.children[0] && !navItem.children[0].getAttribute(\"slot\");\n if (isNamedSlot || isUnnamedSlot) {\n let navItemSlot;\n if (isNamedSlot) {\n navItemSlot = navItem.querySelector(\"[slot='navigation-item']\");\n } else {\n navItemSlot = navItem.children[0];\n }\n const iconWrapper = document.createElement(\"div\");\n const icon = navItemSlot.querySelector(\"svg\");\n const label = navItem.textContent.trim();\n const icTypography = document.createElement(\"ic-typography\");\n icTypography.classList.add(\n \"ic-typography-label\",\n \"hydrated\",\n \"navigation-item-side-nav-slotted-text\"\n );\n\n iconWrapper.style.height = \"var(--ic-space-lg)\";\n iconWrapper.append(icon);\n\n navItemSlot.textContent = \"\";\n\n icTypography.textContent = label;\n\n navItemSlot.append(iconWrapper);\n navItemSlot.append(icTypography);\n\n if (this.collapsedIconLabels) {\n this.styleSlottedCollapsedIconLabels(menuExpanded, icTypography);\n } else {\n this.styleSlottedIconLabels(menuExpanded, icTypography);\n }\n }\n });\n };\n\n private styleSlottedCollapsedIconLabels = (\n menuExpanded: boolean,\n icTypography: HTMLIcTypographyElement\n ) => {\n if (menuExpanded) {\n icTypography.style.marginTop = \"0\";\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n } else {\n icTypography.style.marginTop = \"10px\";\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n }\n };\n\n private setExpandedButtonHeight = () => {\n const appStatusWrapper = this.el.shadowRoot.querySelector(\n \"#side-navigation > .bottom-wrapper > .bottom-side-nav > .app-status-wrapper\"\n ) as HTMLDivElement;\n\n if (appStatusWrapper.offsetHeight !== 0) {\n this.el.style.setProperty(\n \"--sm-side-navigation-bottom-bar-height\",\n `${appStatusWrapper.offsetHeight}px`\n );\n }\n };\n\n private styleSlottedIconLabels = (\n menuExpanded: boolean,\n icTypography: HTMLSpanElement\n ) => {\n if (menuExpanded) {\n icTypography.style.opacity = \"1\";\n icTypography.style.visibility = \"visible\";\n icTypography.style.transition =\n \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n } else {\n icTypography.style.opacity = \"0\";\n icTypography.style.visibility = \"hidden\";\n icTypography.style.transition =\n \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n }\n };\n\n private transitionHandler = (type: string) => {\n const primaryNavigationWrapper = this.el.shadowRoot.querySelector(\n \".primary-navigation\"\n );\n\n const secondaryNavigationWrapper = this.el.shadowRoot.querySelector(\n \".bottom-wrapper > .secondary-navigation\"\n );\n\n const classToRemove =\n type === \"start\"\n ? this.COLLAPSED_ICON_LABELS_END\n : this.COLLAPSED_ICON_LABELS_START;\n\n const classToAdd =\n type === \"start\"\n ? this.COLLAPSED_ICON_LABELS_START\n : this.COLLAPSED_ICON_LABELS_END;\n\n if (primaryNavigationWrapper) {\n primaryNavigationWrapper.classList.remove(classToRemove);\n primaryNavigationWrapper.classList.add(classToAdd);\n }\n\n if (secondaryNavigationWrapper) {\n secondaryNavigationWrapper.classList.remove(classToRemove);\n secondaryNavigationWrapper.classList.add(classToAdd);\n }\n };\n\n private transitionEndHandler = () => {\n this.transitionHandler(\"end\");\n };\n\n private animateCollapsedIconLabels = () => {\n this.transitionHandler(\"start\");\n this.transitionEndHandler();\n\n this.el.addEventListener(\"transitionend\", this.transitionEndHandler);\n };\n\n private paddingIconWidth = (\n navItems: HTMLIcNavigationItemElement[]\n ): number => {\n const navItemLink =\n (navItems[0].shadowRoot &&\n (navItems[0].shadowRoot.querySelector(\"ic-tooltip a\") ||\n navItems[0].shadowRoot.querySelector(\"ic-tooltip div\"))) ||\n navItems[0].querySelector(\"a\") ||\n navItems[0].querySelector(\"div\");\n const navItemSVG = navItems[0].querySelector(\"svg\");\n\n const navStyles = {\n gap: window.getComputedStyle(navItemLink).gap,\n iconWidth: window.getComputedStyle(navItemSVG).width,\n paddingLeft: window.getComputedStyle(navItemLink).paddingLeft,\n };\n\n return Object.values(navStyles).reduce((prev, curr) => {\n return (prev += parseInt(curr));\n }, 0);\n };\n\n private displayTooltipWithExpandedLongLabel = (menuExpanded: boolean) => {\n let timer;\n\n if (menuExpanded) {\n timer = setTimeout(() => {\n const sideNavWidth = this.el.clientWidth;\n\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n\n const paddingIconDelta = navigationItems.length\n ? this.paddingIconWidth(navigationItems)\n : 0;\n\n navigationItems.forEach(\n (navigationItem: HTMLIcNavigationItemElement) => {\n const icTypographyScrollWidth =\n (\n navigationItem.shadowRoot &&\n navigationItem.shadowRoot.querySelector(\n \"ic-tooltip .link ic-typography.ic-typography-label\"\n )\n )?.scrollWidth ||\n navigationItem.querySelector(\"ic-typography.ic-typography-label\")\n ?.scrollWidth;\n\n if (icTypographyScrollWidth > sideNavWidth - paddingIconDelta) {\n navigationItem.setAttribute(\"display-navigation-tooltip\", \"true\");\n }\n }\n );\n }, this.ANIMATION_DURATION);\n } else {\n clearTimeout(timer);\n\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n navigationItem.setAttribute(\"display-navigation-tooltip\", \"false\");\n });\n }\n };\n\n private setMenuExpanded = (expanded: boolean): void => {\n this.menuExpanded = expanded;\n };\n\n /**\n * As the mobile top bar is fixed, a padding top is required\n * to push main content down the height of the mobile top bar\n * @param value - padding-top css value\n */\n private setParentPaddingTop = (value: string) => {\n this.el.parentElement.style.setProperty(\"padding-top\", value);\n };\n\n private setParentPaddingLeft = (value: string) => {\n this.el.parentElement.style.setProperty(\"padding-left\", value);\n };\n\n private renderAppTitle = (isAppNameSubtitleVariant: boolean) => {\n const displayShortAppTitle =\n this.deviceSize <= DEVICE_SIZES.S && !isEmptyString(this.shortAppTitle);\n return (\n <ic-typography\n variant={\n displayShortAppTitle || isAppNameSubtitleVariant\n ? \"subtitle-small\"\n : \"h3\"\n }\n aria-label={\n displayShortAppTitle\n ? `${this.appTitle} (${this.shortAppTitle})`\n : undefined\n }\n >\n <h1>{displayShortAppTitle ? this.shortAppTitle : this.appTitle}</h1>\n </ic-typography>\n );\n };\n\n private resizeObserverCallback = (currSize: number) => {\n this.deviceSize = currSize;\n\n const isSmallAndDisableTopBar =\n currSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour;\n\n if (!this.disableAutoParentStyling) {\n const topBarHeight =\n this.el.shadowRoot.querySelector(\".top-bar\")?.scrollHeight;\n this.setParentPaddingTop(\n isSmallAndDisableTopBar ? `${topBarHeight}px` : \"0\"\n );\n if (isSmallAndDisableTopBar) this.setParentPaddingLeft(\"0\");\n if (isSmallAndDisableTopBar && this.inline) {\n this.el.parentElement.style.setProperty(\n \"height\",\n `calc(100% - ${topBarHeight}px)`\n );\n } else if (!isSmallAndDisableTopBar) {\n this.el.parentElement.style.setProperty(\"height\", \"100%\");\n }\n }\n\n if (!this.disableAutoParentStyling) {\n const paddingLeft = `calc(var(--ic-space-xxl) ${\n this.collapsedIconLabels ? \"* 2\" : \"+ var(--ic-space-xs)\"\n })`;\n\n if (currSize > DEVICE_SIZES.L) {\n this.setParentPaddingTop(\"0\");\n this.setParentPaddingLeft(\"0\");\n } else if (\n (currSize > DEVICE_SIZES.S || this.disableTopBarBehaviour) &&\n currSize <= DEVICE_SIZES.M &&\n this.static\n ) {\n this.setParentPaddingLeft(paddingLeft);\n } else if (\n (currSize > DEVICE_SIZES.S || this.disableTopBarBehaviour) &&\n currSize <= DEVICE_SIZES.L\n ) {\n this.setParentPaddingLeft(\n this.static && this.menuExpanded\n ? \"calc(var(--ic-space-xl) * 10)\"\n : paddingLeft\n );\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.deviceSizeAppTitle = currSize;\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(document.body, { box: \"content-box\" });\n };\n\n private setCollapsedIconLabels = () => {\n const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n );\n navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n navigationItem.setAttribute(\"collapsed-icon-label\", \"true\");\n });\n };\n\n private styleSlottedCollapsedIconLabel = () => {\n const dynamicSlottedIcTypographyComps: HTMLIcTypographyElement[] =\n Array.from(\n this.el.querySelectorAll(\".navigation-item-side-nav-slotted-text\")\n );\n\n dynamicSlottedIcTypographyComps.forEach((icTypography) => {\n if (\n icTypography?.parentElement?.parentElement?.classList.contains(\n \"navigation-item-side-nav-collapsed-with-label\"\n )\n ) {\n icTypography.style.whiteSpace = \"nowrap\";\n icTypography.style.overflow = \"hidden\";\n icTypography.style.textOverflow = \"ellipsis\";\n icTypography.style.marginTop = \"10px\";\n }\n });\n };\n\n private renderTopBar = ({\n isSDevice,\n foregroundColor,\n menuOpen,\n href,\n isAppNameSubtitleVariant,\n }: IcTopBar) => {\n const hasTitle = this.appTitle !== \"\" && isPropDefined(this.appTitle);\n\n const Component = isSlotUsed(this.el, \"app-title\") ? \"div\" : \"a\";\n\n const attrs = Component == \"a\" && {\n href: href,\n };\n\n return (\n <div\n class={{\n \"top-bar\": true,\n [this.foregroundColor]: true,\n }}\n >\n {isSDevice && (\n <nav\n aria-labelledby=\"menu-navigation-toggle-button-landmark\"\n aria-hidden=\"false\"\n >\n <ic-button\n aria-label=\"Open navigation menu\"\n class=\"menu-button\"\n id=\"menu-button\"\n variant=\"secondary\"\n size=\"small\"\n full-width=\"true\"\n appearance={foregroundColor}\n onClick={this.toggleMenu}\n ariaOwnsId=\"side-navigation\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n ref={(el) => (this.menuButton = el)}\n >\n <span\n class=\"mobile-top-bar-menu-icon\"\n slot=\"icon\"\n innerHTML={menuOpen ? closeIcon : menuIcon}\n ></span>\n {menuOpen ? \"Close\" : \"Menu\"}\n </ic-button>\n <span\n id=\"menu-navigation-toggle-button-landmark\"\n class=\"navigation-landmark-title\"\n aria-hidden=\"true\"\n >\n Navigation menu toggle button\n </span>\n </nav>\n )}\n <div class=\"app-title-wrapper\">\n {(hasTitle || isSlotUsed(this.el, \"app-title\")) && (\n <Component {...attrs} class=\"title-link\">\n <div class=\"app-icon-container\" aria-hidden=\"true\">\n <slot name=\"app-icon\"></slot>\n </div>\n <div class=\"app-title-inner-wrapper\">\n {isSlotUsed(this.el, \"app-title\") ? (\n <slot name=\"app-title\"></slot>\n ) : (\n this.renderAppTitle(isAppNameSubtitleVariant)\n )}\n </div>\n </Component>\n )}\n </div>\n </div>\n );\n };\n\n render() {\n const {\n appTitle,\n menuOpen,\n foregroundColor,\n menuExpanded,\n href,\n status,\n version,\n collapsedIconLabels,\n inline,\n } = this;\n\n const isSDevice =\n !this.disableTopBarBehaviour && this.deviceSize === DEVICE_SIZES.S;\n const isMdDevice = this.deviceSize === DEVICE_SIZES.M;\n const isLgDevice = this.deviceSize >= DEVICE_SIZES.L;\n const isAppNameSubtitleVariant = this.deviceSizeAppTitle === DEVICE_SIZES.S;\n const displayExpandBtn =\n isMdDevice || this.disableTopBarBehaviour || (isLgDevice && !this.static);\n\n const topBarProps: IcTopBar = {\n isSDevice,\n foregroundColor,\n menuOpen,\n href,\n isAppNameSubtitleVariant,\n appTitle,\n };\n\n return (\n <Host\n class={{\n \"xs-menu-open\": menuOpen && isSDevice,\n \"xs-menu-close\": !menuOpen && isSDevice,\n \"sm-collapsed\": !isSDevice && !menuExpanded,\n \"sm-expanded\": !isSDevice && menuExpanded,\n \"side-display\":\n this.deviceSize > DEVICE_SIZES.S || this.disableTopBarBehaviour,\n [IcThemeForegroundEnum.Dark]:\n foregroundColor === IcThemeForegroundEnum.Dark,\n [\"collapsed-labels\"]:\n !isSDevice && !menuExpanded && collapsedIconLabels,\n [\"inline\"]: inline,\n }}\n >\n {isSDevice && this.renderTopBar({ ...topBarProps })}\n <div class=\"side-navigation\" id=\"side-navigation\">\n {!isSDevice && this.renderTopBar({ ...topBarProps })}\n <div class=\"side-navigation-inner\">\n {isSlotUsed(this.el, \"primary-navigation\") && (\n <nav\n class=\"primary-navigation\"\n aria-labelledby=\"primary-navigation-landmark\"\n >\n <span\n aria-hidden=\"true\"\n class=\"navigation-landmark-title\"\n id=\"primary-navigation-landmark\"\n >\n Primary\n </span>\n <ul class=\"navigation-list\">\n <slot name=\"primary-navigation\"></slot>\n </ul>\n </nav>\n )}\n </div>\n <div\n class={{\n [\"bottom-wrapper\"]: true,\n [\"classification-spacing\"]: hasClassificationBanner(),\n }}\n >\n {isSlotUsed(this.el, \"secondary-navigation\") && (\n <nav\n class=\"secondary-navigation\"\n aria-labelledby=\"secondary-navigation-landmark\"\n >\n <span\n aria-hidden=\"true\"\n class=\"navigation-landmark-title\"\n id=\"secondary-navigation-landmark\"\n >\n Secondary\n </span>\n <ul class=\"navigation-list\">\n <slot name=\"secondary-navigation\"></slot>\n </ul>\n </nav>\n )}\n <div class=\"bottom-side-nav\">\n {this.hasSecondaryNavigation && <ic-divider></ic-divider>}\n {displayExpandBtn && (\n <button\n class=\"menu-expand-button\"\n innerHTML={chevronIcon}\n onClick={() => this.toggleMenuExpanded(!this.menuExpanded)}\n aria-label={`${\n menuExpanded ? \"Collapse\" : \"Expand\"\n } side navigation`}\n ></button>\n )}\n <div class=\"app-status-wrapper\">\n {status !== \"\" && (\n <div\n class={{\n [\"app-status\"]: true,\n }}\n >\n <ic-typography\n aria-label=\"app tag\"\n variant=\"label-uppercase\"\n class=\"app-status-text\"\n >\n {status}\n </ic-typography>\n </div>\n )}\n {version !== \"\" && (\n <ic-typography\n variant=\"label\"\n class=\"app-version\"\n aria-label=\"app version\"\n >\n {version}\n </ic-typography>\n )}\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -12,6 +12,10 @@ const ToggleButton = class {
12
12
  constructor(hostRef) {
13
13
  index.registerInstance(this, hostRef);
14
14
  this.icToggleChecked = index.createEvent(this, "icToggleChecked", 7);
15
+ this.hostMutationObserver = null;
16
+ this.hostMutationCallback = () => {
17
+ index.forceUpdate(this);
18
+ };
15
19
  this.handleFocus = (ev) => {
16
20
  ev.stopImmediatePropagation();
17
21
  };
@@ -45,6 +49,18 @@ const ToggleButton = class {
45
49
  propName: this.variant === "icon" ? "accessible-label" : "label",
46
50
  },
47
51
  ], "Toggle button");
52
+ if (typeof MutationObserver !== "undefined") {
53
+ this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
54
+ this.hostMutationObserver.observe(this.el, {
55
+ childList: true,
56
+ });
57
+ }
58
+ }
59
+ disconnectedCallback() {
60
+ if (this.hostMutationObserver !== null &&
61
+ this.hostMutationObserver !== undefined) {
62
+ this.hostMutationObserver.disconnect();
63
+ }
48
64
  }
49
65
  handleHostClick(e) {
50
66
  if (this.disabled) {
@@ -1 +1 @@
1
- {"file":"ic-toggle-button.entry.cjs.js","mappings":"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","names":["removeDisabledFalse","onComponentRequiredPropUndefined","h","Host","isSlotUsed"],"sources":["src/components/ic-toggle-button/ic-toggle-button.css?tag=ic-toggle-button&encapsulation=shadow","src/components/ic-toggle-button/ic-toggle-button.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/* VARIABLES FOR IC-TOGGLE-BUTTON-GROUP */\n:host {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-default)\n );\n}\n\n:host(.dark) {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-dark)\n );\n}\n\n:host(.light) {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-light)\n );\n}\n\n:host(.disabled) {\n --button-border: var(--toggle-button-border, var(--ic-border-disabled));\n}\n\n:host(.expand-toggle-group-child) ::part(button) {\n width: 100%;\n min-height: inherit;\n white-space: inherit;\n height: inherit;\n}\n\n:host ic-button {\n --icon-width: var(--ic-space-lg);\n --icon-height: var(--ic-space-lg);\n}\n\n:host(.expand-toggle-group-child) ic-button {\n min-width: 100%;\n min-height: 100%;\n white-space: normal;\n height: 100%;\n}\n\n:host(.expand-toggle-group-child) ::part(button):focus,\n:host(.expand-toggle-group-child.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-default),\n var(--ic-border-focus);\n}\n\n:host(.expand-toggle-group-child.light) ::part(button):focus,\n:host(.expand-toggle-group-child.dark) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-dark),\n var(--ic-border-focus);\n}\n\n:host(:focus) {\n z-index: 1;\n}\n\n:host ::part(button) {\n border: var(--button-border);\n}\n\n:host(.checked) ::part(button) {\n background-color: var(--ic-action-default);\n color: var(--ic-architectural-white);\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-white);\n}\n\n:host(.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-white),\n var(--ic-border-focus);\n}\n\n:host(.checked) ::part(button):hover {\n background-color: var(--button-default-hover);\n}\n\n:host(.checked) ::part(button):active,\n:host(.icon.checked) ::part(button):active {\n background-color: var(--ic-action-default-active);\n}\n\n:host(.dark.checked) ::part(button) {\n background-color: var(--ic-action-dark);\n}\n\n:host(.dark.checked) ::part(button):hover {\n background-color: var(--ic-action-dark-hover);\n}\n\n:host(.dark.checked) ::part(button):active,\n:host(.icon.dark.checked) ::part(button):active {\n background-color: var(--ic-action-dark-active);\n}\n\n:host(.light.checked) ::part(button) {\n background-color: var(--ic-action-light);\n color: var(--ic-color-primary-text);\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-black);\n}\n\n:host(.light.checked) ::part(button):hover {\n background-color: var(--ic-action-light-hover);\n}\n\n:host(.light.checked) ::part(button):active,\n:host(.icon.light.checked) ::part(button):active {\n background-color: var(--ic-action-light-active);\n}\n\n:host(.light.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-black),\n var(--ic-border-focus);\n}\n\n:host(.disabled) ::part(button),\n:host(.icon.disabled) ::part(button) {\n border: var(--button-border);\n}\n\n:host(.disabled.checked) ::part(button),\n:host(.icon.disabled.checked) ::part(button) {\n background-color: transparent;\n}\n\n:host(.disabled.checked) ::part(button),\n:host(.icon.disabled.checked) ::part(button)::before {\n background-image: radial-gradient(var(--ic-architectural-400) 95%, white 20%);\n background-repeat: no-repeat;\n}\n\n:host(.icon) ::part(button) {\n border: var(--button-border);\n height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n width: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.icon) ::part(button):active {\n background-color: var(--ic-action-default-bg-active);\n}\n\n:host(.icon.dark) ::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n:host(.icon.light) ::part(button):active {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.icon.small) ::part(button) {\n height: var(--ic-space-xl);\n width: var(--ic-space-xl);\n}\n\n:host(.icon.large) ::part(button) {\n height: var(--ic-space-xxl);\n width: var(--ic-space-xxl);\n}\n\n:host(.checked.loading) ::part(button) {\n background-color: var(--button-default-active);\n}\n\n:host(.loading) ::part(ic-loading-container) {\n --inner-color: var(--ic-architectural-white);\n}\n\n:host(.checked.loading.light) ::part(button) {\n background-color: var(--ic-action-light-active);\n}\n\n:host(.checked.loading.dark) ::part(button) {\n background-color: var(--ic-action-dark-active);\n}\n\n@media (forced-colors: active) {\n :host(.checked) ::part(button),\n :host(.checked) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.light) ::part(button),\n :host(.checked.light) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.dark) ::part(button),\n :host(.checked.dark) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.disabled) ::part(button) {\n background-color: GrayText;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n Event,\n EventEmitter,\n Listen,\n h,\n} from \"@stencil/core\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSizes, IcThemeForeground } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be displayed alongside the toggle button label.\n * @slot badge - Badge component overlaying the top right of the toggle button.\n */\n\n@Component({\n tag: \"ic-toggle-button\",\n styleUrl: \"ic-toggle-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class ToggleButton {\n private iconPosition: \"left\" | \"right\" | \"top\";\n\n @Element() el: HTMLIcToggleButtonElement;\n\n /**\n * The accessible label that will be applied to the toggle button. This is required for the icon variant of toggle buttons.\n */\n @Prop() accessibleLabel?: string;\n\n /**\n * The appearance of the toggle button.\n */\n @Prop() appearance?: IcThemeForeground = \"default\";\n\n /**\n * If `true`, the toggle button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n\n /**\n * If `true`, the toggle button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The placement of the icon in relation to the toggle button label.\n */\n @Prop() iconPlacement?: \"left\" | \"right\" | \"top\";\n\n /**\n * The label to display in the toggle button. This is required for the default variant of toggle buttons.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the toggle button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n\n /**\n * The size of the toggle button to be displayed.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * If `true`, the toggle button will be in a checked state.\n */\n @Prop({ mutable: true, reflect: true }) toggleChecked: boolean = false;\n\n /**\n * The variant of the toggle button.\n */\n @Prop({ reflect: true }) variant: \"default\" | \"icon\" = \"default\";\n\n /**\n * Emitted when the user clicks a toggle button.\n */\n @Event() icToggleChecked: EventEmitter<{\n checked: boolean;\n }>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n const parentIconPlacement = (\n this.el.parentElement as HTMLIcToggleButtonGroupElement\n ).iconPlacement;\n this.iconPosition = this.iconPlacement || parentIconPlacement;\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n {\n prop: this.variant === \"icon\" ? this.accessibleLabel : this.label,\n propName: this.variant === \"icon\" ? \"accessible-label\" : \"label\",\n },\n ],\n \"Toggle button\"\n );\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n } else if (!this.loading) {\n this.toggleChecked = !this.toggleChecked;\n }\n }\n\n private handleFocus = (ev: FocusEvent) => {\n ev.stopImmediatePropagation();\n };\n\n private handleClick = (): void => {\n !this.loading &&\n !this.disabled &&\n this.icToggleChecked.emit({\n checked: this.toggleChecked,\n });\n };\n\n render() {\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n [\"checked\"]: this.toggleChecked,\n [`${this.appearance}`]: true,\n [\"icon\"]: this.variant === \"icon\",\n [`${this.size}`]: true,\n [\"loading\"]: this.loading,\n }}\n onFocus={this.handleFocus}\n >\n <ic-button\n aria-pressed={this.toggleChecked.toString()}\n variant={this.variant === \"icon\" ? \"icon\" : \"secondary\"}\n onClick={this.handleClick}\n title={this.accessibleLabel}\n aria-label={`${\n this.accessibleLabel ? this.accessibleLabel : this.label\n }, ${this.toggleChecked ? \"ticked\" : \"unticked\"}`}\n disabled={this.disabled}\n appearance={this.appearance}\n size={this.size}\n fullWidth={this.fullWidth}\n loading={this.loading}\n aria-disabled={`${this.disabled}`}\n >\n {this.variant !== \"icon\" && this.label}\n <slot />\n {isSlotUsed(this.el, \"icon\") && (\n <slot\n name=\"icon\"\n slot={`${\n this.iconPosition ? `${this.iconPosition}-icon` : \"icon\"\n }`}\n ></slot>\n )}\n {isSlotUsed(this.el, \"badge\") && (\n <slot name=\"badge\" slot=\"badge\"></slot>\n )}\n </ic-button>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-toggle-button.entry.cjs.js","mappings":"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","names":["forceUpdate","removeDisabledFalse","onComponentRequiredPropUndefined","h","Host","isSlotUsed"],"sources":["src/components/ic-toggle-button/ic-toggle-button.css?tag=ic-toggle-button&encapsulation=shadow","src/components/ic-toggle-button/ic-toggle-button.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/* VARIABLES FOR IC-TOGGLE-BUTTON-GROUP */\n:host {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-default)\n );\n}\n\n:host(.dark) {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-dark)\n );\n}\n\n:host(.light) {\n --button-border: var(\n --toggle-button-border,\n var(--ic-border-width) solid var(--ic-action-light)\n );\n}\n\n:host(.disabled) {\n --button-border: var(--toggle-button-border, var(--ic-border-disabled));\n}\n\n:host(.expand-toggle-group-child) ::part(button) {\n width: 100%;\n min-height: inherit;\n white-space: inherit;\n height: inherit;\n}\n\n:host ic-button {\n --icon-width: var(--ic-space-lg);\n --icon-height: var(--ic-space-lg);\n}\n\n:host(.expand-toggle-group-child) ic-button {\n min-width: 100%;\n min-height: 100%;\n white-space: normal;\n height: 100%;\n}\n\n:host(.expand-toggle-group-child) ::part(button):focus,\n:host(.expand-toggle-group-child.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-default),\n var(--ic-border-focus);\n}\n\n:host(.expand-toggle-group-child.light) ::part(button):focus,\n:host(.expand-toggle-group-child.dark) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-dark),\n var(--ic-border-focus);\n}\n\n:host(:focus) {\n z-index: 1;\n}\n\n:host ::part(button) {\n border: var(--button-border);\n}\n\n:host(.checked) ::part(button) {\n background-color: var(--ic-action-default);\n color: var(--ic-architectural-white);\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-white);\n}\n\n:host(.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-white),\n var(--ic-border-focus);\n}\n\n:host(.checked) ::part(button):hover {\n background-color: var(--button-default-hover);\n}\n\n:host(.checked) ::part(button):active,\n:host(.icon.checked) ::part(button):active {\n background-color: var(--ic-action-default-active);\n}\n\n:host(.dark.checked) ::part(button) {\n background-color: var(--ic-action-dark);\n}\n\n:host(.dark.checked) ::part(button):hover {\n background-color: var(--ic-action-dark-hover);\n}\n\n:host(.dark.checked) ::part(button):active,\n:host(.icon.dark.checked) ::part(button):active {\n background-color: var(--ic-action-dark-active);\n}\n\n:host(.light.checked) ::part(button) {\n background-color: var(--ic-action-light);\n color: var(--ic-color-primary-text);\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-black);\n}\n\n:host(.light.checked) ::part(button):hover {\n background-color: var(--ic-action-light-hover);\n}\n\n:host(.light.checked) ::part(button):active,\n:host(.icon.light.checked) ::part(button):active {\n background-color: var(--ic-action-light-active);\n}\n\n:host(.light.checked) ::part(button):focus {\n box-shadow: inset 0 0 0 var(--ic-space-xxxs) var(--ic-architectural-black),\n var(--ic-border-focus);\n}\n\n:host(.disabled) ::part(button),\n:host(.icon.disabled) ::part(button) {\n border: var(--button-border);\n}\n\n:host(.disabled.checked) ::part(button),\n:host(.icon.disabled.checked) ::part(button) {\n background-color: transparent;\n}\n\n:host(.disabled.checked) ::part(button),\n:host(.icon.disabled.checked) ::part(button)::before {\n background-image: radial-gradient(var(--ic-architectural-400) 95%, white 20%);\n background-repeat: no-repeat;\n}\n\n:host(.icon) ::part(button) {\n border: var(--button-border);\n height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n width: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.icon) ::part(button):active {\n background-color: var(--ic-action-default-bg-active);\n}\n\n:host(.icon.dark) ::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n:host(.icon.light) ::part(button):active {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.icon.small) ::part(button) {\n height: var(--ic-space-xl);\n width: var(--ic-space-xl);\n}\n\n:host(.icon.large) ::part(button) {\n height: var(--ic-space-xxl);\n width: var(--ic-space-xxl);\n}\n\n:host(.checked.loading) ::part(button) {\n background-color: var(--button-default-active);\n}\n\n:host(.loading) ::part(ic-loading-container) {\n --inner-color: var(--ic-architectural-white);\n}\n\n:host(.checked.loading.light) ::part(button) {\n background-color: var(--ic-action-light-active);\n}\n\n:host(.checked.loading.dark) ::part(button) {\n background-color: var(--ic-action-dark-active);\n}\n\n@media (forced-colors: active) {\n :host(.checked) ::part(button),\n :host(.checked) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.light) ::part(button),\n :host(.checked.light) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.dark) ::part(button),\n :host(.checked.dark) ::part(button):hover {\n background-color: Highlight;\n }\n\n :host(.checked.disabled) ::part(button) {\n background-color: GrayText;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n Event,\n EventEmitter,\n Listen,\n h,\n forceUpdate,\n} from \"@stencil/core\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSizes, IcThemeForeground } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be displayed alongside the toggle button label.\n * @slot badge - Badge component overlaying the top right of the toggle button.\n */\n\n@Component({\n tag: \"ic-toggle-button\",\n styleUrl: \"ic-toggle-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class ToggleButton {\n private iconPosition: \"left\" | \"right\" | \"top\";\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcToggleButtonElement;\n\n /**\n * The accessible label that will be applied to the toggle button. This is required for the icon variant of toggle buttons.\n */\n @Prop() accessibleLabel?: string;\n\n /**\n * The appearance of the toggle button.\n */\n @Prop() appearance?: IcThemeForeground = \"default\";\n\n /**\n * If `true`, the toggle button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n\n /**\n * If `true`, the toggle button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The placement of the icon in relation to the toggle button label.\n */\n @Prop() iconPlacement?: \"left\" | \"right\" | \"top\";\n\n /**\n * The label to display in the toggle button. This is required for the default variant of toggle buttons.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the toggle button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n\n /**\n * The size of the toggle button to be displayed.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * If `true`, the toggle button will be in a checked state.\n */\n @Prop({ mutable: true, reflect: true }) toggleChecked: boolean = false;\n\n /**\n * The variant of the toggle button.\n */\n @Prop({ reflect: true }) variant: \"default\" | \"icon\" = \"default\";\n\n /**\n * Emitted when the user clicks a toggle button.\n */\n @Event() icToggleChecked: EventEmitter<{\n checked: boolean;\n }>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n const parentIconPlacement = (\n this.el.parentElement as HTMLIcToggleButtonGroupElement\n ).iconPlacement;\n this.iconPosition = this.iconPlacement || parentIconPlacement;\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n {\n prop: this.variant === \"icon\" ? this.accessibleLabel : this.label,\n propName: this.variant === \"icon\" ? \"accessible-label\" : \"label\",\n },\n ],\n \"Toggle button\"\n );\n if (typeof MutationObserver !== \"undefined\") {\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n }\n\n disconnectedCallback(): void {\n if (\n this.hostMutationObserver !== null &&\n this.hostMutationObserver !== undefined\n ) {\n this.hostMutationObserver.disconnect();\n }\n }\n\n private hostMutationCallback = (): void => {\n forceUpdate(this);\n };\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n } else if (!this.loading) {\n this.toggleChecked = !this.toggleChecked;\n }\n }\n\n private handleFocus = (ev: FocusEvent) => {\n ev.stopImmediatePropagation();\n };\n\n private handleClick = (): void => {\n !this.loading &&\n !this.disabled &&\n this.icToggleChecked.emit({\n checked: this.toggleChecked,\n });\n };\n\n render() {\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n [\"checked\"]: this.toggleChecked,\n [`${this.appearance}`]: true,\n [\"icon\"]: this.variant === \"icon\",\n [`${this.size}`]: true,\n [\"loading\"]: this.loading,\n }}\n onFocus={this.handleFocus}\n >\n <ic-button\n aria-pressed={this.toggleChecked.toString()}\n variant={this.variant === \"icon\" ? \"icon\" : \"secondary\"}\n onClick={this.handleClick}\n title={this.accessibleLabel}\n aria-label={`${\n this.accessibleLabel ? this.accessibleLabel : this.label\n }, ${this.toggleChecked ? \"ticked\" : \"unticked\"}`}\n disabled={this.disabled}\n appearance={this.appearance}\n size={this.size}\n fullWidth={this.fullWidth}\n loading={this.loading}\n aria-disabled={`${this.disabled}`}\n >\n {this.variant !== \"icon\" && this.label}\n <slot />\n {isSlotUsed(this.el, \"icon\") && (\n <slot\n name=\"icon\"\n slot={`${\n this.iconPosition ? `${this.iconPosition}-icon` : \"icon\"\n }`}\n ></slot>\n )}\n {isSlotUsed(this.el, \"badge\") && (\n <slot name=\"badge\" slot=\"badge\"></slot>\n )}\n </ic-button>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -63,7 +63,10 @@ export class Button {
63
63
  // triggered when attributes of host element change
64
64
  this.hostMutationCallback = (mutationList) => {
65
65
  let forceComponentUpdate = false;
66
- mutationList.forEach(({ attributeName }) => {
66
+ mutationList.forEach(({ attributeName, type }) => {
67
+ if (type === "childList") {
68
+ forceComponentUpdate = true;
69
+ }
67
70
  const attribute = this.el.getAttribute(attributeName);
68
71
  if (attributeName === "title")
69
72
  this.title = attribute;
@@ -173,6 +176,7 @@ export class Button {
173
176
  this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
174
177
  this.hostMutationObserver.observe(this.el, {
175
178
  attributes: true,
179
+ childList: true,
176
180
  });
177
181
  }
178
182
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ic-button.js","sourceRoot":"","sources":["../../../src/components/ic-button/ic-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n State,\n forceUpdate,\n h,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n getThemeFromContext,\n inheritAttributes,\n isSlotUsed,\n removeDisabledFalse,\n renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcSizes,\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Deprecated. This slot should not be used anymore. Use left-icon or right-icon slot instead.\n * @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n */\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n private buttonEl: HTMLElement;\n private buttonIdNum = buttonIds++;\n private hasTooltip: boolean = false;\n private id: string;\n private inheritedAttributes: { [k: string]: string } = {};\n private describedbyEl: HTMLElement = null;\n private describedById: string = null;\n private mutationObserver: MutationObserver = null;\n private hostMutationObserver: MutationObserver = null;\n private routerSlot: HTMLElement;\n\n @Element() el: HTMLIcButtonElement;\n\n @State() ariaLabel: string = null;\n @State() describedByContent: string = null;\n @State() title: string = null;\n\n /**\n * If `fileUpload` is set to `true`, this is the accepted list of file types.\n */\n @Prop() accept?: string = \"*\";\n\n /**\n * The appearance of the button, e.g. dark, light, or the default.\n */\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaControlsId: string | boolean;\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaOwnsId: string | boolean;\n\n /**\n * If `true`, the button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n */\n @Prop() disableTooltip?: boolean = false;\n\n /**\n * If `true`, the user can save the linked URL instead of navigating to it.\n */\n @Prop() download?: string | boolean = false;\n\n /**\n * If `true`, the button will show a dropdown icon.\n */\n @Prop() dropdown?: boolean = false;\n\n /**\n * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n */\n @Prop({ mutable: true, reflect: true }) dropdownExpanded?: boolean = false;\n\n /**\n * If `true`, when the button is clicked the native file explorer will be launched.\n */\n @Prop() fileUpload?: boolean = false;\n\n /**\n * The name of the control for the file input, which is submitted with the form data.\n */\n @Prop() fileInputName: string = `ic-button-file-upload-input-${buttonIds++}`;\n\n /**\n * The <form> element to associate the button with.\n */\n @Prop() form?: string;\n\n /**\n * The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner.\n */\n @Prop() formaction?: string;\n\n /**\n * The way the submitted form data is encoded.\n */\n @Prop() formenctype?: string;\n\n /**\n * The HTTP method used to submit the form.\n */\n @Prop() formmethod?: string;\n\n /**\n * If `true`, the form will not be validated when submitted.\n */\n @Prop() formnovalidate?: boolean;\n\n /**\n * The place to display the response from submitting the form. It overrides the target attribute of the button's form owner.\n */\n @Prop() formtarget?: string;\n\n /**\n * If `true`, the button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The URL that the link points to. This will render the button as an \"a\" tag.\n */\n @Prop() href?: string;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n\n /**\n * If `true`, the button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n\n /**\n * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n */\n @Prop() multiple?: boolean = false;\n\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n\n /**\n * The list of the files that have been selected by a user.\n */\n @Prop() selectedFiles: FileList;\n\n /**\n * The size of the button to be displayed.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n /**\n * The position of the tooltip in relation to the button.\n */\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n\n /**\n * If `true`, the secondary variant of button will have a transparent background rather than white.\n */\n @Prop() transparentBackground?: boolean = true;\n\n /**\n * The type of the button.\n */\n @Prop() type?: IcButtonTypes = \"button\";\n\n /**\n * The variant of the button to be displayed.\n */\n @Prop() variant?: IcButtonVariants = \"primary\";\n\n /**\n * Emitted when button has blur\n */\n @Event() icBlur!: EventEmitter<void>;\n\n /**\n * If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n */\n @Event() icFileSelection!: EventEmitter<FileList>;\n\n /**\n * Emitted when button has focus\n */\n @Event() icFocus!: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.mutationObserver !== null && this.mutationObserver !== undefined) {\n this.mutationObserver.disconnect();\n }\n if (\n this.hostMutationObserver !== null &&\n this.hostMutationObserver !== undefined\n ) {\n this.hostMutationObserver.disconnect();\n }\n }\n\n componentWillUpdate(): void {\n if (this.loading) {\n this.el.style.setProperty(\n \"--min-width\",\n `${this.el.getBoundingClientRect().width}px`\n );\n }\n this.setHasTooltip();\n }\n\n componentWillLoad(): void {\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n this.title = title;\n this.ariaLabel = ariaLabel;\n this.inheritedAttributes = restInheritedAttributes;\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n this.id = this.el.id || null;\n this.setHasTooltip();\n\n if (!this.hasTooltip) {\n const describedById = this.inheritedAttributes[\"aria-describedby\"];\n if (describedById !== undefined) {\n this.describedById = describedById;\n const el = this.el.parentElement.querySelector<HTMLElement>(\n `#${describedById}`\n );\n if (el) {\n this.describedByContent = el.innerText;\n this.describedbyEl = el;\n }\n }\n }\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n\n if (typeof MutationObserver !== \"undefined\") {\n if (this.describedById) {\n this.mutationObserver = new MutationObserver(this.mutationCallback);\n this.mutationObserver.observe(this.describedbyEl, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n }\n\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n });\n }\n }\n\n componentWillRender(): void {\n const iconEl = this.hasIconSlot(\"left\")\n ? this.el.querySelector(`[slot=\"left-icon\"]`)\n : this.hasIconSlot(\"right\")\n ? this.el.querySelector(`[slot=\"right-icon\"]`)\n : null;\n iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (!this.hasRouterSlot()) {\n if (this.fileUpload) {\n renderFileHiddenInput(\n this.icFileSelection,\n this.el,\n this.multiple,\n this.fileInputName,\n this.selectedFiles,\n this.disabled,\n this.accept\n );\n }\n if (this.disabled || this.loading) {\n event.stopImmediatePropagation();\n }\n if (this.dropdown) {\n this.dropdownExpanded = !this.dropdownExpanded;\n }\n }\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n this.updateTheme(detail.mode);\n }\n\n /**\n * Sets focus on the native `button`.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private async closeButtonTooltip(ev: KeyboardEvent): Promise<void> {\n const tooltip = this.el.shadowRoot.querySelector(\"ic-tooltip\");\n if (await tooltip.isTooltipVisible()) {\n tooltip.displayTooltip(false);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n }\n\n private hasIconSlot(position?: \"left\" | \"right\" | \"top\"): boolean {\n const selectorPrefix = position ? `${position}-` : \"\";\n return this.el.querySelector(`[slot=\"${selectorPrefix}icon\"]`) !== null;\n }\n\n private hasRouterSlot(): boolean {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n if (this.routerSlot) {\n this.routerSlot.ariaLabel = this.routerSlot.textContent;\n }\n return !!this.routerSlot;\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" || this.el.type === \"reset\") &&\n !this.hasRouterSlot() &&\n !!this.el.closest(\"FORM\")\n ) {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n this.el.closest(\"FORM\").appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n };\n\n private handleKeyDown = (ev: KeyboardEvent): void => {\n if (ev.key === \"Escape\" && this.hasTooltip) {\n this.closeButtonTooltip(ev);\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n // triggered when text content of sibling element in light DOM changes\n private mutationCallback = (): void => {\n this.describedByContent = this.describedbyEl.innerText;\n };\n\n // triggered when attributes of host element change\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n let forceComponentUpdate = false;\n mutationList.forEach(({ attributeName }) => {\n const attribute = this.el.getAttribute(attributeName);\n if (attributeName === \"title\") this.title = attribute;\n else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n if (IC_INHERITED_ARIA.includes(attributeName)) {\n this.inheritedAttributes[attributeName] = attribute;\n forceComponentUpdate = true;\n }\n });\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private setHasTooltip = (): void => {\n this.hasTooltip =\n !this.disableTooltip && (!!this.title || this.isIconVariant());\n };\n\n private isIconVariant = (): boolean => {\n return this.variant.startsWith(\"icon\");\n };\n\n render() {\n const TagType = (this.href && \"a\") || \"button\";\n const { title, ariaLabel, inheritedAttributes } = this;\n const buttonAttrs =\n TagType === \"button\"\n ? {\n type: this.type,\n disabled: this.disabled,\n form: this.form,\n formaction: this.formaction,\n formenctype: this.formenctype,\n formmethod: this.formmethod,\n formnovalidate: this.formnovalidate,\n formtarget: this.formtarget,\n }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n\n let describedby: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedby =\n this.variant === \"icon\" && !!ariaLabel\n ? null\n : `ic-tooltip-${buttonId}`;\n } else {\n describedby = this.describedById;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading || this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n {...buttonAttrs}\n {...inheritedAttributes}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n aria-describedby={describedby}\n part=\"button\"\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.hasIconSlot(\"left\") && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"left-icon\" />\n </div>\n )}\n {this.hasIconSlot(\"top\") &&\n !this.hasIconSlot(\"left\") &&\n !this.hasIconSlot(\"right\") &&\n !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"top-icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" ||\n this.variant === \"destructive\" ||\n this.appearance === IcThemeForegroundEnum.Dark ||\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n {this.hasIconSlot(\"right\") && !this.loading && !this.dropdown && (\n <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n <slot name=\"right-icon\" />\n </div>\n )}\n {this.dropdown &&\n !this.loading &&\n this.variant !== \"icon\" &&\n this.variant !== \"destructive\" && (\n <span\n class={{\n [\"arrow-dropdown\"]: !this.dropdownExpanded,\n [\"dropdown-expanded\"]: this.dropdownExpanded,\n }}\n innerHTML={arrowDropdown}\n />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n [\"with-badge\"]: isSlotUsed(this.el, \"badge\"),\n [\"dropdown-no-icon\"]:\n this.dropdown &&\n !isSlotUsed(this.el, \"icon\") &&\n !isSlotUsed(this.el, \"left-icon\"),\n [\"top-icon\"]: isSlotUsed(this.el, \"top-icon\"),\n [\"white-background\"]:\n this.variant === \"secondary\" &&\n !this.transparentBackground &&\n this.appearance !== \"light\",\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n aria-owns={this.ariaOwnsId}\n aria-controls={this.ariaControlsId}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n >\n {this.hasTooltip && (\n <ic-tooltip\n id={describedby}\n label={title || ariaLabel}\n target={buttonId}\n placement={this.tooltipPlacement}\n silent={this.isIconVariant() && !!ariaLabel}\n >\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n )}\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n {!this.hasTooltip &&\n (this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n ))}\n {this.describedByContent && (\n <span id={describedby} class=\"ic-button-describedby\">\n {this.describedByContent}\n </span>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"ic-button.js","sourceRoot":"","sources":["../../../src/components/ic-button/ic-button.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,IAAI,EACJ,MAAM,EACN,MAAM,EACN,IAAI,EACJ,KAAK,EACL,WAAW,EACX,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,mBAAmB,EACnB,iBAAiB,EACjB,UAAU,EACV,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAM1D,OAAO,EAIL,qBAAqB,GACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,aAAa,MAAM,iCAAiC,CAAC;AAE5D,IAAI,SAAS,GAAG,CAAC,CAAC;AAElB;;;;;;;GAOG;AAQH,MAAM,OAAO,MAAM;;QAET,gBAAW,GAAG,SAAS,EAAE,CAAC;QAC1B,eAAU,GAAY,KAAK,CAAC;QAE5B,wBAAmB,GAA4B,EAAE,CAAC;QAClD,kBAAa,GAAgB,IAAI,CAAC;QAClC,kBAAa,GAAW,IAAI,CAAC;QAC7B,qBAAgB,GAAqB,IAAI,CAAC;QAC1C,yBAAoB,GAAqB,IAAI,CAAC;QAuU9C,gBAAW,GAAG,GAAS,EAAE;YAC/B,IACE,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,OAAO,CAAC;gBACvD,CAAC,IAAI,CAAC,aAAa,EAAE;gBACrB,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,EACzB,CAAC;gBACD,MAAM,gBAAgB,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBAE1D,gBAAgB,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;gBACpD,gBAAgB,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;gBAExC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC;gBAEtD,gBAAgB,CAAC,KAAK,EAAE,CAAC;gBACzB,gBAAgB,CAAC,MAAM,EAAE,CAAC;YAC5B,CAAC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,EAAiB,EAAQ,EAAE;YAClD,IAAI,EAAE,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;gBAC3C,IAAI,CAAC,kBAAkB,CAAC,EAAE,CAAC,CAAC;YAC9B,CAAC;QACH,CAAC,CAAC;QAEM,YAAO,GAAG,GAAG,EAAE;YACrB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACtB,CAAC,CAAC;QAEM,WAAM,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC,CAAC;QAUF,sEAAsE;QAC9D,qBAAgB,GAAG,GAAS,EAAE;YACpC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC;QACzD,CAAC,CAAC;QAEF,mDAAmD;QAC3C,yBAAoB,GAAG,CAAC,YAA8B,EAAQ,EAAE;YACtE,IAAI,oBAAoB,GAAG,KAAK,CAAC;YACjC,YAAY,CAAC,OAAO,CAAC,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,EAAE,EAAE;gBAC/C,IAAI,IAAI,KAAK,WAAW,EAAE,CAAC;oBACzB,oBAAoB,GAAG,IAAI,CAAC;gBAC9B,CAAC;gBACD,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;gBACtD,IAAI,aAAa,KAAK,OAAO;oBAAE,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;qBACjD,IAAI,aAAa,KAAK,YAAY;oBAAE,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;gBAEpE,IAAI,iBAAiB,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;oBAC9C,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,GAAG,SAAS,CAAC;oBACpD,oBAAoB,GAAG,IAAI,CAAC;gBAC9B,CAAC;YACH,CAAC,CAAC,CAAC;YACH,IAAI,oBAAoB,EAAE,CAAC;gBACzB,WAAW,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAS,EAAE;YACjC,IAAI,CAAC,UAAU;gBACb,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;QACnE,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAY,EAAE;YACpC,OAAO,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;QACzC,CAAC,CAAC;yBA3Y2B,IAAI;kCACK,IAAI;qBACjB,IAAI;sBAKH,GAAG;0BAK6B,SAAS;;;wBAetC,KAAK;8BASC,KAAK;wBAKF,KAAK;wBAKd,KAAK;gCAKmC,KAAK;0BAK3C,KAAK;6BAKJ,+BAA+B,SAAS,EAAE,EAAE;;;;;;;yBAmC9C,KAAK;;;uBAeP,KAAK;wBAKJ,KAAK;;;;oBAoBT,SAAS;;gCAUoB,QAAQ;qCAKpB,IAAI;oBAKf,QAAQ;uBAKF,SAAS;;IApI9C,oBAAoB;QAClB,mBAAmB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;IAC9C,CAAC;IAmJD,oBAAoB;QAClB,IAAI,IAAI,CAAC,gBAAgB,KAAK,IAAI,IAAI,IAAI,CAAC,gBAAgB,KAAK,SAAS,EAAE,CAAC;YAC1E,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC;QACrC,CAAC;QACD,IACE,IAAI,CAAC,oBAAoB,KAAK,IAAI;YAClC,IAAI,CAAC,oBAAoB,KAAK,SAAS,EACvC,CAAC;YACD,IAAI,CAAC,oBAAoB,CAAC,UAAU,EAAE,CAAC;QACzC,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CACvB,aAAa,EACb,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAC7C,CAAC;QACJ,CAAC;QACD,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,iBAAiB;QACf,MAAM,KAIF,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,GAAG,iBAAiB,EAAE,OAAO,CAAC,CAAC,EAJzD,EACJ,KAAK,EACL,YAAY,EAAE,SAAS,OAEsC,EAD1D,uBAAuB,cAHtB,uBAIL,CAA8D,CAAC;QAEhE,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,mBAAmB,GAAG,uBAAuB,CAAC;QAEnD,mBAAmB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;QAE5C,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;QAE9C,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,IAAI,CAAC;QAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YACrB,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,kBAAkB,CAAC,CAAC;YACnE,IAAI,aAAa,KAAK,SAAS,EAAE,CAAC;gBAChC,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC;gBACnC,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,aAAa,CAC5C,IAAI,aAAa,EAAE,CACpB,CAAC;gBACF,IAAI,EAAE,EAAE,CAAC;oBACP,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC,SAAS,CAAC;oBACvC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;gBAC1B,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,OAAO,gBAAgB,KAAK,WAAW,EAAE,CAAC;YAC5C,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;gBACvB,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;gBACpE,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE;oBAChD,aAAa,EAAE,IAAI;oBACnB,SAAS,EAAE,IAAI;oBACf,OAAO,EAAE,IAAI;iBACd,CAAC,CAAC;YACL,CAAC;YAED,IAAI,CAAC,oBAAoB,GAAG,IAAI,gBAAgB,CAC9C,IAAI,CAAC,oBAAoB,CAC1B,CAAC;YACF,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;gBACzC,UAAU,EAAE,IAAI;gBAChB,SAAS,EAAE,IAAI;aAChB,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;YACrC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,oBAAoB,CAAC;YAC7C,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC;gBAC3B,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,qBAAqB,CAAC;gBAC9C,CAAC,CAAC,IAAI,CAAC;QACT,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,YAAY,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAC/C,CAAC;IAGD,eAAe,CAAC,KAAY;QAC1B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE,CAAC;YAC1B,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;gBACpB,qBAAqB,CACnB,IAAI,CAAC,eAAe,EACpB,IAAI,CAAC,EAAE,EACP,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,MAAM,CACZ,CAAC;YACJ,CAAC;YACD,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBAClC,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACnC,CAAC;YACD,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,IAAI,CAAC,gBAAgB,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC;YACjD,CAAC;QACH,CAAC;IACH,CAAC;IAGD,kBAAkB,CAAC,EAAE,MAAM,EAAwB;QACjD,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,QAAQ;;QACZ,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,EAAE,CAAC;IACzB,CAAC;IAEO,KAAK,CAAC,kBAAkB,CAAC,EAAiB;QAChD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QAC/D,IAAI,MAAM,OAAO,CAAC,gBAAgB,EAAE,EAAE,CAAC;YACrC,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;YAC9B,EAAE,CAAC,cAAc,EAAE,CAAC;YACpB,EAAE,CAAC,wBAAwB,EAAE,CAAC;QAChC,CAAC;IACH,CAAC;IAEO,WAAW,CAAC,QAAmC;QACrD,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;QACtD,OAAO,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,UAAU,cAAc,QAAQ,CAAC,KAAK,IAAI,CAAC;IAC1E,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;QAChE,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;QAC1D,CAAC;QACD,OAAO,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;IAC3B,CAAC;IAkCO,WAAW,CAAC,WAA8B,IAAI;QACpD,MAAM,eAAe,GAAG,mBAAmB,CAAC,IAAI,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QAE/D,IAAI,eAAe,KAAK,qBAAqB,CAAC,OAAO,EAAE,CAAC;YACtD,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC;QACpC,CAAC;IACH,CAAC;IAqCD,MAAM;QACJ,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,QAAQ,CAAC;QAC/C,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,GAAG,IAAI,CAAC;QACvD,MAAM,WAAW,GACf,OAAO,KAAK,QAAQ;YAClB,CAAC,CAAC;gBACE,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,UAAU,EAAE,IAAI,CAAC,UAAU;gBAC3B,WAAW,EAAE,IAAI,CAAC,WAAW;gBAC7B,UAAU,EAAE,IAAI,CAAC,UAAU;gBAC3B,cAAc,EAAE,IAAI,CAAC,cAAc;gBACnC,UAAU,EAAE,IAAI,CAAC,UAAU;aAC5B;YACH,CAAC,CAAC;gBACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI;gBACxD,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,GAAG,EAAE,IAAI,CAAC,GAAG;gBACb,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,cAAc,EAAE,IAAI,CAAC,cAAc;gBACnC,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,CAAC;QAER,IAAI,WAAW,GAAW,IAAI,CAAC;QAC/B,IAAI,QAAQ,GAAW,IAAI,CAAC;QAC5B,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,QAAQ;gBACN,IAAI,CAAC,EAAE,KAAK,IAAI;oBACd,CAAC,CAAC,0BAA0B,IAAI,CAAC,EAAE,EAAE;oBACrC,CAAC,CAAC,0BAA0B,IAAI,CAAC,WAAW,EAAE,CAAC;YACnD,WAAW;gBACT,IAAI,CAAC,OAAO,KAAK,MAAM,IAAI,CAAC,CAAC,SAAS;oBACpC,CAAC,CAAC,IAAI;oBACN,CAAC,CAAC,cAAc,QAAQ,EAAE,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC;QACnC,CAAC;QAED,MAAM,aAAa,GAAG,GAAG,EAAE;YACzB,OAAO,CACL,EAAC,OAAO,kBACN,KAAK,EAAC,QAAQ,mBACC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,gBAChD,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,mBACjC,IAAI,CAAC,QAAQ,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAE,IACtD,WAAW,EACX,mBAAmB,IACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,sBACf,WAAW,EAC7B,IAAI,EAAC,QAAQ;gBAEZ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CACtC,WAAK,KAAK,EAAC,gBAAgB;oBACzB,YAAM,IAAI,EAAC,MAAM,GAAG,CAChB,CACP;gBACA,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAC5C,WAAK,KAAK,EAAC,gBAAgB;oBACzB,YAAM,IAAI,EAAC,WAAW,GAAG,CACrB,CACP;gBACA,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;oBACtB,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;oBACzB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC;oBAC1B,CAAC,IAAI,CAAC,OAAO,IAAI,CACf,WAAK,KAAK,EAAC,gBAAgB;oBACzB,YAAM,IAAI,EAAC,UAAU,GAAG,CACpB,CACP;gBACF,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACd,WAAK,KAAK,EAAC,mBAAmB;oBAC5B,4BACE,IAAI,EAAC,QAAQ,EACb,UAAU,EACR,IAAI,CAAC,OAAO,KAAK,SAAS;4BAC1B,IAAI,CAAC,OAAO,KAAK,aAAa;4BAC9B,IAAI,CAAC,UAAU,KAAK,qBAAqB,CAAC,IAAI;4BAC9C,IAAI,CAAC,UAAU,KAAK,qBAAqB,CAAC,KAAK;4BAC7C,CAAC,CAAC,OAAO;4BACT,CAAC,CAAC,MAAM,GAEU,CACpB,CACP,CAAC,CAAC,CAAC,CACF,eAAQ,CACT;gBACA,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAC/D,WAAK,KAAK,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE;oBACxD,YAAM,IAAI,EAAC,YAAY,GAAG,CACtB,CACP;gBACA,IAAI,CAAC,QAAQ;oBACZ,CAAC,IAAI,CAAC,OAAO;oBACb,IAAI,CAAC,OAAO,KAAK,MAAM;oBACvB,IAAI,CAAC,OAAO,KAAK,aAAa,IAAI,CAChC,YACE,KAAK,EAAE;wBACL,CAAC,gBAAgB,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB;wBAC1C,CAAC,mBAAmB,CAAC,EAAE,IAAI,CAAC,gBAAgB;qBAC7C,EACD,SAAS,EAAE,aAAa,GACxB,CACH,CACK,CACX,CAAC;QACJ,CAAC,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,UAAU,CAAC,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;gBAC5C,CAAC,kBAAkB,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;gBACxC,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI;gBAClC,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO;gBACzB,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,UAAU,KAAK,qBAAqB,CAAC,IAAI;gBACxD,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,UAAU,KAAK,qBAAqB,CAAC,KAAK;gBAC1D,CAAC,YAAY,CAAC,EAAE,IAAI,CAAC,SAAS;gBAC9B,CAAC,YAAY,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC;gBAC5C,CAAC,kBAAkB,CAAC,EAClB,IAAI,CAAC,QAAQ;oBACb,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC;oBAC5B,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,WAAW,CAAC;gBACnC,CAAC,UAAU,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,UAAU,CAAC;gBAC7C,CAAC,kBAAkB,CAAC,EAClB,IAAI,CAAC,OAAO,KAAK,WAAW;oBAC5B,CAAC,IAAI,CAAC,qBAAqB;oBAC3B,IAAI,CAAC,UAAU,KAAK,OAAO;aAC9B,EACD,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,IAAI,CAAC,aAAa,eAClB,IAAI,CAAC,UAAU,mBACX,IAAI,CAAC,cAAc,mBACnB,IAAI,CAAC,QAAQ,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAE;YAEzD,IAAI,CAAC,UAAU,IAAI,CAClB,kBACE,EAAE,EAAE,WAAW,EACf,KAAK,EAAE,KAAK,IAAI,SAAS,EACzB,MAAM,EAAE,QAAQ,EAChB,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAChC,MAAM,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,SAAS,IAE1C,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,CACtB,YAAM,IAAI,EAAC,aAAa,GAAQ,CACjC,CAAC,CAAC,CAAC,CACF,EAAC,aAAa,OAAG,CAClB,CACU,CACd;YACA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,IAAI,YAAM,IAAI,EAAC,OAAO,GAAQ;YAC1D,CAAC,IAAI,CAAC,UAAU;gBACf,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,CACtB,YAAM,IAAI,EAAC,aAAa,GAAQ,CACjC,CAAC,CAAC,CAAC,CACF,EAAC,aAAa,OAAG,CAClB,CAAC;YACH,IAAI,CAAC,kBAAkB,IAAI,CAC1B,YAAM,EAAE,EAAE,WAAW,EAAE,KAAK,EAAC,uBAAuB,IACjD,IAAI,CAAC,kBAAkB,CACnB,CACR,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n State,\n forceUpdate,\n h,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n getThemeFromContext,\n inheritAttributes,\n isSlotUsed,\n removeDisabledFalse,\n renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcButtonTypes,\n IcButtonVariants,\n IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n IcSizes,\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Deprecated. This slot should not be used anymore. Use left-icon or right-icon slot instead.\n * @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n */\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n private buttonEl: HTMLElement;\n private buttonIdNum = buttonIds++;\n private hasTooltip: boolean = false;\n private id: string;\n private inheritedAttributes: { [k: string]: string } = {};\n private describedbyEl: HTMLElement = null;\n private describedById: string = null;\n private mutationObserver: MutationObserver = null;\n private hostMutationObserver: MutationObserver = null;\n private routerSlot: HTMLElement;\n\n @Element() el: HTMLIcButtonElement;\n\n @State() ariaLabel: string = null;\n @State() describedByContent: string = null;\n @State() title: string = null;\n\n /**\n * If `fileUpload` is set to `true`, this is the accepted list of file types.\n */\n @Prop() accept?: string = \"*\";\n\n /**\n * The appearance of the button, e.g. dark, light, or the default.\n */\n @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaControlsId: string | boolean;\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaOwnsId: string | boolean;\n\n /**\n * If `true`, the button will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n */\n @Prop() disableTooltip?: boolean = false;\n\n /**\n * If `true`, the user can save the linked URL instead of navigating to it.\n */\n @Prop() download?: string | boolean = false;\n\n /**\n * If `true`, the button will show a dropdown icon.\n */\n @Prop() dropdown?: boolean = false;\n\n /**\n * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n */\n @Prop({ mutable: true, reflect: true }) dropdownExpanded?: boolean = false;\n\n /**\n * If `true`, when the button is clicked the native file explorer will be launched.\n */\n @Prop() fileUpload?: boolean = false;\n\n /**\n * The name of the control for the file input, which is submitted with the form data.\n */\n @Prop() fileInputName: string = `ic-button-file-upload-input-${buttonIds++}`;\n\n /**\n * The <form> element to associate the button with.\n */\n @Prop() form?: string;\n\n /**\n * The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner.\n */\n @Prop() formaction?: string;\n\n /**\n * The way the submitted form data is encoded.\n */\n @Prop() formenctype?: string;\n\n /**\n * The HTTP method used to submit the form.\n */\n @Prop() formmethod?: string;\n\n /**\n * If `true`, the form will not be validated when submitted.\n */\n @Prop() formnovalidate?: boolean;\n\n /**\n * The place to display the response from submitting the form. It overrides the target attribute of the button's form owner.\n */\n @Prop() formtarget?: string;\n\n /**\n * If `true`, the button will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The URL that the link points to. This will render the button as an \"a\" tag.\n */\n @Prop() href?: string;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n\n /**\n * If `true`, the button will be in loading state.\n */\n @Prop() loading?: boolean = false;\n\n /**\n * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n */\n @Prop() multiple?: boolean = false;\n\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n\n /**\n * The list of the files that have been selected by a user.\n */\n @Prop() selectedFiles: FileList;\n\n /**\n * The size of the button to be displayed.\n */\n @Prop() size?: IcSizes = \"default\";\n\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n /**\n * The position of the tooltip in relation to the button.\n */\n @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n\n /**\n * If `true`, the secondary variant of button will have a transparent background rather than white.\n */\n @Prop() transparentBackground?: boolean = true;\n\n /**\n * The type of the button.\n */\n @Prop() type?: IcButtonTypes = \"button\";\n\n /**\n * The variant of the button to be displayed.\n */\n @Prop() variant?: IcButtonVariants = \"primary\";\n\n /**\n * Emitted when button has blur\n */\n @Event() icBlur!: EventEmitter<void>;\n\n /**\n * If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n */\n @Event() icFileSelection!: EventEmitter<FileList>;\n\n /**\n * Emitted when button has focus\n */\n @Event() icFocus!: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.mutationObserver !== null && this.mutationObserver !== undefined) {\n this.mutationObserver.disconnect();\n }\n if (\n this.hostMutationObserver !== null &&\n this.hostMutationObserver !== undefined\n ) {\n this.hostMutationObserver.disconnect();\n }\n }\n\n componentWillUpdate(): void {\n if (this.loading) {\n this.el.style.setProperty(\n \"--min-width\",\n `${this.el.getBoundingClientRect().width}px`\n );\n }\n this.setHasTooltip();\n }\n\n componentWillLoad(): void {\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n this.title = title;\n this.ariaLabel = ariaLabel;\n this.inheritedAttributes = restInheritedAttributes;\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n this.id = this.el.id || null;\n this.setHasTooltip();\n\n if (!this.hasTooltip) {\n const describedById = this.inheritedAttributes[\"aria-describedby\"];\n if (describedById !== undefined) {\n this.describedById = describedById;\n const el = this.el.parentElement.querySelector<HTMLElement>(\n `#${describedById}`\n );\n if (el) {\n this.describedByContent = el.innerText;\n this.describedbyEl = el;\n }\n }\n }\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n if (typeof MutationObserver !== \"undefined\") {\n if (this.describedById) {\n this.mutationObserver = new MutationObserver(this.mutationCallback);\n this.mutationObserver.observe(this.describedbyEl, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n }\n\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n childList: true,\n });\n }\n }\n\n componentWillRender(): void {\n const iconEl = this.hasIconSlot(\"left\")\n ? this.el.querySelector(`[slot=\"left-icon\"]`)\n : this.hasIconSlot(\"right\")\n ? this.el.querySelector(`[slot=\"right-icon\"]`)\n : null;\n iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (!this.hasRouterSlot()) {\n if (this.fileUpload) {\n renderFileHiddenInput(\n this.icFileSelection,\n this.el,\n this.multiple,\n this.fileInputName,\n this.selectedFiles,\n this.disabled,\n this.accept\n );\n }\n if (this.disabled || this.loading) {\n event.stopImmediatePropagation();\n }\n if (this.dropdown) {\n this.dropdownExpanded = !this.dropdownExpanded;\n }\n }\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n this.updateTheme(detail.mode);\n }\n\n /**\n * Sets focus on the native `button`.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private async closeButtonTooltip(ev: KeyboardEvent): Promise<void> {\n const tooltip = this.el.shadowRoot.querySelector(\"ic-tooltip\");\n if (await tooltip.isTooltipVisible()) {\n tooltip.displayTooltip(false);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n }\n\n private hasIconSlot(position?: \"left\" | \"right\" | \"top\"): boolean {\n const selectorPrefix = position ? `${position}-` : \"\";\n return this.el.querySelector(`[slot=\"${selectorPrefix}icon\"]`) !== null;\n }\n\n private hasRouterSlot(): boolean {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n if (this.routerSlot) {\n this.routerSlot.ariaLabel = this.routerSlot.textContent;\n }\n return !!this.routerSlot;\n }\n\n private handleClick = (): void => {\n if (\n (this.el.type === \"submit\" || this.el.type === \"reset\") &&\n !this.hasRouterSlot() &&\n !!this.el.closest(\"FORM\")\n ) {\n const hiddenFormButton = document.createElement(\"button\");\n\n hiddenFormButton.setAttribute(\"type\", this.el.type);\n hiddenFormButton.style.display = \"none\";\n\n this.el.closest(\"FORM\").appendChild(hiddenFormButton);\n\n hiddenFormButton.click();\n hiddenFormButton.remove();\n }\n };\n\n private handleKeyDown = (ev: KeyboardEvent): void => {\n if (ev.key === \"Escape\" && this.hasTooltip) {\n this.closeButtonTooltip(ev);\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(newTheme: IcThemeForeground = null): void {\n const foregroundColor = getThemeFromContext(this.el, newTheme);\n\n if (foregroundColor !== IcThemeForegroundEnum.Default) {\n this.appearance = foregroundColor;\n }\n }\n\n // triggered when text content of sibling element in light DOM changes\n private mutationCallback = (): void => {\n this.describedByContent = this.describedbyEl.innerText;\n };\n\n // triggered when attributes of host element change\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n let forceComponentUpdate = false;\n mutationList.forEach(({ attributeName, type }) => {\n if (type === \"childList\") {\n forceComponentUpdate = true;\n }\n const attribute = this.el.getAttribute(attributeName);\n if (attributeName === \"title\") this.title = attribute;\n else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n if (IC_INHERITED_ARIA.includes(attributeName)) {\n this.inheritedAttributes[attributeName] = attribute;\n forceComponentUpdate = true;\n }\n });\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private setHasTooltip = (): void => {\n this.hasTooltip =\n !this.disableTooltip && (!!this.title || this.isIconVariant());\n };\n\n private isIconVariant = (): boolean => {\n return this.variant.startsWith(\"icon\");\n };\n\n render() {\n const TagType = (this.href && \"a\") || \"button\";\n const { title, ariaLabel, inheritedAttributes } = this;\n const buttonAttrs =\n TagType === \"button\"\n ? {\n type: this.type,\n disabled: this.disabled,\n form: this.form,\n formaction: this.formaction,\n formenctype: this.formenctype,\n formmethod: this.formmethod,\n formnovalidate: this.formnovalidate,\n formtarget: this.formtarget,\n }\n : {\n download: this.download !== false ? this.download : null,\n href: this.href,\n rel: this.rel,\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n hreflang: this.hreflang,\n };\n\n let describedby: string = null;\n let buttonId: string = null;\n if (this.hasTooltip) {\n buttonId =\n this.id !== null\n ? `ic-button-with-tooltip-${this.id}`\n : `ic-button-with-tooltip-${this.buttonIdNum}`;\n describedby =\n this.variant === \"icon\" && !!ariaLabel\n ? null\n : `ic-tooltip-${buttonId}`;\n } else {\n describedby = this.describedById;\n }\n\n const ButtonContent = () => {\n return (\n <TagType\n class=\"button\"\n aria-disabled={this.loading || this.disabled ? \"true\" : null}\n aria-label={this.loading ? \"Loading\" : ariaLabel}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n {...buttonAttrs}\n {...inheritedAttributes}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n ref={(el) => (this.buttonEl = el)}\n aria-describedby={describedby}\n part=\"button\"\n >\n {this.hasIconSlot() && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n {this.hasIconSlot(\"left\") && !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"left-icon\" />\n </div>\n )}\n {this.hasIconSlot(\"top\") &&\n !this.hasIconSlot(\"left\") &&\n !this.hasIconSlot(\"right\") &&\n !this.loading && (\n <div class=\"icon-container\">\n <slot name=\"top-icon\" />\n </div>\n )}\n {this.loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type=\"linear\"\n appearance={\n this.variant === \"primary\" ||\n this.variant === \"destructive\" ||\n this.appearance === IcThemeForegroundEnum.Dark ||\n this.appearance === IcThemeForegroundEnum.Light\n ? \"light\"\n : \"dark\"\n }\n ></ic-loading-indicator>\n </div>\n ) : (\n <slot />\n )}\n {this.hasIconSlot(\"right\") && !this.loading && !this.dropdown && (\n <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n <slot name=\"right-icon\" />\n </div>\n )}\n {this.dropdown &&\n !this.loading &&\n this.variant !== \"icon\" &&\n this.variant !== \"destructive\" && (\n <span\n class={{\n [\"arrow-dropdown\"]: !this.dropdownExpanded,\n [\"dropdown-expanded\"]: this.dropdownExpanded,\n }}\n innerHTML={arrowDropdown}\n />\n )}\n </TagType>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled && !this.loading,\n [`button-variant-${this.variant}`]: true,\n [`button-size-${this.size}`]: true,\n [\"loading\"]: this.loading,\n [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n [\"full-width\"]: this.fullWidth,\n [\"with-badge\"]: isSlotUsed(this.el, \"badge\"),\n [\"dropdown-no-icon\"]:\n this.dropdown &&\n !isSlotUsed(this.el, \"icon\") &&\n !isSlotUsed(this.el, \"left-icon\"),\n [\"top-icon\"]: isSlotUsed(this.el, \"top-icon\"),\n [\"white-background\"]:\n this.variant === \"secondary\" &&\n !this.transparentBackground &&\n this.appearance !== \"light\",\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n aria-owns={this.ariaOwnsId}\n aria-controls={this.ariaControlsId}\n aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n >\n {this.hasTooltip && (\n <ic-tooltip\n id={describedby}\n label={title || ariaLabel}\n target={buttonId}\n placement={this.tooltipPlacement}\n silent={this.isIconVariant() && !!ariaLabel}\n >\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n )}\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n {!this.hasTooltip &&\n (this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <ButtonContent />\n ))}\n {this.describedByContent && (\n <span id={describedby} class=\"ic-button-describedby\">\n {this.describedByContent}\n </span>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -501,6 +501,10 @@ video {
501
501
  background-color: var(--ic-action-dark-bg-active);
502
502
  }
503
503
 
504
+ :host ic-section-container {
505
+ outline: none;
506
+ }
507
+
504
508
  .footer-link-group-title {
505
509
  margin-top: var(--footer-link-group-title-margin-top);
506
510
  margin-bottom: var(--footer-link-group-title-margin-bottom);
@@ -50,7 +50,7 @@ export class FooterLinkGroup {
50
50
  }, role: "listitem" }, h("div", { class: "footer-link-group-title" }, h("ic-typography", { variant: "subtitle-small" }, groupTitle)), h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null)))) : (h(Host, { class: {
51
51
  ["footer-link-group footer-link-group-small"]: true,
52
52
  [`footer-link-group-${this.dropdownIconStyle}`]: true,
53
- }, tabIndex: "1", onClick: this.toggleExpanded, onKeydown: this.handleKeydown, "aria-expanded": this.expanded }, h("ic-section-container", { fullHeight: true }, h("div", { class: "footer-link-group-header" }, h("div", { class: "footer-link-group-title" }, h("ic-typography", { variant: "label" }, groupTitle)), this.expanded ? (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))) : (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("g", { transform: "translate(0 1200) scale(1 -1)" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))))), this.expanded && (h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null))))));
53
+ }, onClick: this.toggleExpanded, onKeydown: this.handleKeydown, "aria-expanded": this.expanded, role: "listitem" }, h("ic-section-container", { tabindex: "0", fullHeight: true }, h("div", { class: "footer-link-group-header" }, h("div", { class: "footer-link-group-title" }, h("ic-typography", { variant: "label" }, groupTitle)), this.expanded ? (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))) : (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("g", { transform: "translate(0 1200) scale(1 -1)" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))))), this.expanded && (h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null))))));
54
54
  }
55
55
  static get is() { return "ic-footer-link-group"; }
56
56
  static get encapsulation() { return "shadow"; }