@ukic/web-components 2.22.0 → 2.23.0

package/dist/core/p-bbfe15b5.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["icButtonCss","buttonIds","Button","this","buttonIdNum","hasTooltip","inheritedAttributes","describedbyEl","describedById","mutationObserver","hostMutationObserver","handleClick","el","type","hasRouterSlot","closest","hiddenFormButton","document","createElement","setAttribute","style","display","appendChild","click","remove","onFocus","icFocus","emit","onBlur","icBlur","mutationCallback","describedByContent","innerText","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","attribute","getAttribute","title","ariaLabel","IC_INHERITED_ARIA","includes","forceUpdate","setHasTooltip","disableTooltip","variant","watchDisabledHandler","removeDisabledFalse","disabled","disconnectedCallback","undefined","disconnect","componentWillUpdate","loading","setProperty","getBoundingClientRect","width","componentWillLoad","_a","inheritAttributes","restInheritedAttributes","__rest","id","parentElement","querySelector","componentDidLoad","updateTheme","MutationObserver","observe","characterData","childList","subtree","attributes","componentWillRender","iconEl","hasIconSlot","handleHostClick","event","fileUpload","renderFileHiddenInput","icFileSelection","multiple","fileInputName","selectedFiles","accept","stopImmediatePropagation","dropdown","dropdownExpanded","themeChangeHandler","detail","mode","setFocus","buttonEl","focus","position","selectorPrefix","routerSlot","textContent","newTheme","foregroundColor","getThemeFromContext","IcThemeForegroundEnum","Default","appearance","render","TagType","href","buttonAttrs","form","formaction","formenctype","formmethod","formnovalidate","formtarget","download","rel","target","referrerpolicy","hreflang","describedby","buttonId","ButtonContent","h","Object","assign","class","ref","part","name","Dark","Light","innerHTML","arrowDropdown","Host","size","fullWidth","isSlotUsed","transparentBackground","onClick","ariaOwnsId","ariaControlsId","label","placement","tooltipPlacement","silent","icLoadingIndicatorCss","LoadingIndicator","updateCircularProgressMeter","indeterminate","circularMeter","String","progress","getLabel","labelIndex","setLabel","Promise","interval","setInterval","labelList","length","labelDuration","getLabelVariant","outerElement","offsetWidth","setCircleLineWidth","compactStepCircularLineWidth","classList","contains","toastDismissTimerCircularLineWidth","circularLineWidth","circularDiameter","setLinearDeterminateWidth","innerElement","Math","min","max","proportion","showSecond","add","calcOuterClass","cls","updateLabel","isPropDefined","split","indicatorLabel","setCircleXY","r","x","y","nextRadius","setDashSteps","radius","dashArray","PI","watchPropHandler","watchProgressHandler","clearInterval","shadowRoot","Number","componentDidUpdate","description","innerLabel","role","viewBox","cx","cy","icTooltipCss","Tooltip","delayedHideEvents","dialogOverflow","instantHideEvents","mouseOverTool","persistTooltip","onDialog","showEvents","disableHover","disableClick","getTooltipTranslate","dialogEl","child","children","tooltipX","tooltipY","left","bottom","top","right","height","toolTip","show","icDialogEl","popperInstance","createPopper","modifiers","options","offset","element","arrow","scroll","resize","console","warn","hide","removeAttribute","checkCloseTooltip","setTimeout","mouseEnterTooltip","mouseLeaveTooltip","handleKeyDown","key","manageEventListeners","action","method","destroy","onComponentRequiredPropUndefined","prop","propName","componentDidRender","typographyEl","maxLines","displayTooltip"],"sources":["src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","src/components/ic-button/ic-button.tsx","src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","src/components/ic-loading-indicator/ic-loading-indicator.tsx","src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","src/components/ic-tooltip/ic-tooltip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n* @prop --min-width: Minimum width of the button.\n* @prop --height: The height of the button.\n*/\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  --button-default: var(--ic-action-default);\n  --button-default-hover: var(--ic-action-default-hover);\n  --button-default-active: var(--ic-action-default-active);\n  --button-default-background-hover: var(--ic-action-default-bg-hover);\n  --button-default-background-active: var(--ic-action-default-bg-active);\n  --icon-width: 100%;\n  --icon-height: 100%;\n}\n\n.button,\n::slotted(a) {\n  font-family: var(--ic-font-body-family);\n  text-decoration: none;\n  font-weight: 600;\n  font-size: 0.875rem;\n  transition: var(--ic-easing-transition-fast);\n  border-radius: var(--ic-border-radius);\n  min-width: var(--min-width, 6.25rem);\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  white-space: nowrap;\n  vertical-align: middle;\n}\n\n:host(.with-badge) .button {\n  border-radius: 0.2188rem;\n}\n\n.button:hover,\n::slotted(a:hover) {\n  cursor: pointer;\n}\n\n.button:focus,\n::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible,\n::slotted(a:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button,\n:host(.dark) ::slotted(a) {\n  --button-default: var(--ic-action-dark);\n  --button-default-hover: var(--ic-action-dark);\n  --button-default-active: var(--ic-action-dark);\n  --button-default-background-hover: var(--ic-action-dark-bg-hover);\n  --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button,\n:host(.light) ::slotted(a) {\n  --button-default: var(--ic-action-light);\n  --button-default-hover: var(--ic-action-light);\n  --button-default-active: var(--ic-action-light);\n  --button-default-background-hover: var(--ic-action-light-bg-hover);\n  --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.white-background) .button,\n:host(.white-background) ::slotted(a) {\n  --button-default-background-hover: var(--ic-action-default-bg-hover-no-alpha);\n  --button-default-background-active: var(\n    --ic-action-default-bg-active-no-alpha\n  );\n\n  background-color: var(--ic-architectural-white);\n}\n\n:host(.white-background.dark) .button,\n:host(.white-background.dark) ::slotted(a) {\n  --button-default-background-hover: var(--ic-action-dark-bg-hover-no-alpha);\n  --button-default-background-active: var(--ic-action-dark-bg-active-no-alpha);\n}\n\n:host(.button-variant-primary.light) .button,\n:host(.button-variant-primary.light) ::slotted(a) {\n  color: var(--ic-color-primary-text);\n\n  --button-default-hover: var(--ic-action-light-hover);\n  --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button,\n:host(.button-variant-primary.dark) ::slotted(a) {\n  --button-default-hover: var(--ic-action-dark-hover);\n  --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.disabled) ::slotted(a),\n:host(.loading),\n:host(.loading) .button {\n  pointer-events: none;\n}\n\n:host(.top-icon) .button {\n  flex-direction: column;\n  --height: fit-content;\n}\n\n:host(.top-icon) .button .icon-container {\n  margin-right: 0;\n}\n\n/* Variants */\n\n/* Primary */\n\n:host(.button-variant-primary) .button,\n:host(.button-variant-primary) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover {\n  background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary.loading) .button,\n:host(.button-variant-primary) .button:active {\n  background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button,\n:host(.button-variant-primary.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button,\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n  background: var(--ic-architectural-600);\n  color: var(--ic-architectural-500);\n}\n\n/* Secondary  */\n\n:host(.button-variant-secondary) .button,\n:host(.button-variant-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default);\n  color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover,\n:host(.button-variant-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  border-color: var(--button-default-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active,\n:host(.button-variant-secondary) ::slotted(a:active),\n:host(.button-variant-secondary.loading) .button {\n  border-color: var(--button-default-active);\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) ::slotted(a) {\n  border-color: var(--ic-architectural-300);\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) ::slotted(a) {\n  border-color: var(--ic-architectural-500);\n  color: var(--ic-architectural-500);\n}\n\n/* Tertiary */\n\n:host(.button-variant-tertiary) .button,\n:host(.button-variant-tertiary) ::slotted(a) {\n  color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover,\n:host(.button-variant-tertiary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active,\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-tertiary.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) ::slotted(a) {\n  color: var(--ic-architectural-500);\n}\n\n/* Destructive */\n\n:host(.button-variant-destructive) .button,\n:host(.button-variant-destructive) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-action-destructive);\n  text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover {\n  background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active,\n:host(.button-variant-destructive.loading) .button {\n  background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button,\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n/* Icon */\n\n:host(.button-variant-icon) .button,\n:host(.button-variant-icon) ::slotted(a) {\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon) .button:hover,\n:host(.button-variant-icon) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)),\n:host(.button-variant-icon.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n/***********************\n * Icon Variants\n ***********************/\n\n/* Icon-primary */\n\n:host(.button-variant-icon-primary) .button,\n:host(.button-variant-icon-primary) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-primary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-primary) .button:hover,\n:host(.button-variant-icon-primary) ::slotted(a:hover) {\n  background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-primary) .button:active,\n:host(.button-variant-icon-primary) ::slotted(a:active),\n:host(.button-variant-icon-primary.loading) .button {\n  background: var(--button-default-active);\n}\n\n:host(.button-variant-icon-primary.loading) .button ic-loading-indicator {\n  --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-primary.disabled) .button,\n:host(.button-variant-icon-primary.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: var(--ic-architectural-200);\n}\n\n:host(.button-variant-icon-primary.light) .button,\n:host(.button-variant-icon-primary.light) ::slotted(a) {\n  color: var(--ic-color-primary-text);\n}\n\n:host(.button-variant-icon-primary.light) .button:hover,\n:host(.button-variant-icon-primary.light) ::slotted(a:hover) {\n  background: var(--ic-action-light-hover);\n}\n\n:host(.button-variant-icon-primary.light) .button:active,\n:host(.button-variant-icon-primary.light) ::slotted(a:active),\n:host(.button-variant-icon-primary.light.loading) .button,\n:host(.button-variant-icon-primary.light.loading) ::slotted(a) {\n  background: var(--ic-action-light-active);\n}\n\n:host(.button-variant-icon-primary.dark) .button:hover,\n:host(.button-variant-icon-primary.dark) ::slotted(a:hover) {\n  background: var(--ic-action-dark-hover);\n}\n\n:host(.button-variant-icon-primary.dark) .button:active,\n:host(.button-variant-icon-primary.dark) ::slotted(a:active),\n:host(.button-variant-icon-primary.dark.loading) .button,\n:host(.button-variant-icon-primary.dark.loading) ::slotted(a) {\n  background: var(--ic-action-dark-active);\n}\n\n/* Icon-secondary */\n\n:host(.button-variant-icon-secondary) .button,\n:host(.button-variant-icon-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default);\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-secondary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-secondary) .button:hover,\n:host(.button-variant-icon-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  border-color: var(--button-default-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-secondary) .button:active,\n:host(.button-variant-icon-secondary) ::slotted(a:active),\n:host(.button-variant-icon-secondary.loading) .button {\n  border-color: var(--button-default-active);\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-secondary.disabled) .button,\n:host(.button-variant-icon-secondary.disabled) .button:hover,\n:host(.button-variant-icon-secondary.disabled) .button:active,\n:host(.button-variant-icon-secondary.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-300);\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-icon-secondary.light.disabled) .button,\n:host(.button-variant-icon-secondary.light.disabled) .button:hover,\n:host(.button-variant-icon-secondary.light.disabled) .button:active,\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-500);\n  color: var(--ic-architectural-500);\n}\n\n/* Icon-tertiary */\n\n:host(.button-variant-icon-tertiary) .button,\n:host(.button-variant-icon-tertiary) ::slotted(a) {\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-tertiary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-tertiary) .button:hover,\n:host(.button-variant-icon-tertiary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-tertiary) .button:active,\n:host(.button-variant-icon-tertiary) ::slotted(a:active),\n:host(.button-variant-icon-tertiary.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-tertiary.disabled) .button,\n:host(.button-variant-icon-tertiary.disabled) .button:hover,\n:host(.button-variant-icon-tertiary.disabled) .button:active,\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:active) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n/* Icon-destructive */\n\n:host(.button-variant-icon-destructive) .button,\n:host(.button-variant-icon-destructive) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-action-destructive);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-destructive) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-destructive) .button:hover,\n:host(.button-variant-icon-destructive) ::slotted(a:hover) {\n  background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-icon-destructive) .button:active,\n:host(.button-variant-icon-destructive) ::slotted(a:active),\n:host(.button-variant-icon-destructive.loading) .button {\n  background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-icon-destructive.loading) .button ic-loading-indicator {\n  --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-destructive.disabled) .button,\n:host(.button-variant-icon-destructive.disabled) .button:hover,\n:host(.button-variant-icon-destructive.disabled) .button:active,\n:host(.button-variant-icon-destructive.disabled) ::slotted(a),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:active) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n/* Sizing */\n\n:host(.button-size-default) .button {\n  height: var(--height, 2.5rem);\n  padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n  height: var(--height, var(--ic-space-xl));\n  padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n  height: var(--height, var(--ic-space-xxl));\n  padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button,\n:host(.button-size-default.button-variant-icon-primary) .button,\n:host(.button-size-default.button-variant-icon-secondary) .button,\n:host(.button-size-default.button-variant-icon-tertiary) .button,\n:host(.button-size-default.button-variant-icon-destructive) .button,\n:host(.button-size-default.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl));\n  width: var(--ic-space-xl);\n  padding: 0.375rem;\n}\n\n:host(.button-size-small.button-variant-icon) .button,\n:host(.button-size-small.button-variant-icon-primary) .button,\n:host(.button-size-small.button-variant-icon-secondary) .button,\n:host(.button-size-small.button-variant-icon-tertiary) .button,\n:host(.button-size-small.button-variant-icon-destructive) .button,\n:host(.button-size-small.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-lg));\n  width: var(--ic-space-lg);\n  padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button,\n:host(.button-size-large.button-variant-icon-primary) .button,\n:host(.button-size-large.button-variant-icon-secondary) .button,\n:host(.button-size-large.button-variant-icon-tertiary) .button,\n:host(.button-size-large.button-variant-icon-destructive) .button,\n:host(.button-size-large.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n  height: var(--height, 2.5rem);\n  width: 2.5rem;\n  padding: var(--ic-space-xs);\n}\n\n/* Width */\n:host(.full-width),\n:host(.full-width) .button,\n:host(.full-width) ::slotted(a) {\n  width: 100%;\n}\n\n/* Loading */\n\ndiv.loading-container {\n  position: relative;\n  align-items: center;\n  width: 100%;\n}\n\nic-loading-indicator {\n  --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n  0% {\n    width: 0%;\n    left: 0%;\n  }\n\n  25% {\n    width: 0%;\n    left: 0%;\n    opacity: 0;\n  }\n\n  50% {\n    width: 100%;\n    left: 0%;\n    opacity: 1;\n  }\n\n  75% {\n    width: 0%;\n    left: 100%;\n  }\n\n  100% {\n    width: 0%;\n    left: 100%;\n    opacity: 0;\n  }\n}\n\n/* Icons */\n\ndiv.icon-container {\n  box-sizing: border-box;\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: var(--ic-space-xs);\n}\n\ndiv.right-icon {\n  margin-right: auto;\n  margin-left: var(--ic-space-xs);\n}\n\n:host(.full-width) .right-icon {\n  margin-right: var(--ic-space-xs);\n}\n\n::slotted(:not(ic-badge)) {\n  width: var(--icon-width) !important;\n  height: var(--icon-height) !important;\n  fill: currentcolor !important;\n  pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n  margin: 0;\n  pointer-events: none;\n}\n\n/** SEARCH **/\n\n:host(.search-submit-button) ::slotted(svg) {\n  --icon-height: 1.25rem;\n  --icon-width: 1.25rem;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n  --icon-height: 1rem;\n  --icon-width: 1rem;\n}\n\n:host(.clear-button) {\n  margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus,\n:host(.calendar-button) .button:focus {\n  box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n  box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n  box-shadow: none;\n  background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n  display: flex;\n  align-items: center;\n  margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n  --icon-height: 0.875rem;\n  --icon-width: 0.875rem;\n}\n\n:host(.popout-menu-button) .button {\n  height: var(--height);\n  justify-content: left;\n  border-radius: 0;\n  white-space: pre-line;\n  text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n  flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n  display: none;\n}\n\n:host .ic-tooltip {\n  display: block;\n}\n\n/** Dropdown **/\n:host .arrow-dropdown {\n  margin-top: auto;\n}\n\n:host .dropdown-expanded {\n  transform: rotate(180deg);\n  margin-bottom: var(--ic-space-xxxs);\n}\n\n:host(.dropdown-no-icon) .button {\n  padding-right: var(--ic-space-xs);\n}\n\n/** Slotted router item **/\nslot[name=\"router-item\"]::slotted(a) {\n  pointer-events: all;\n}\n\n::slotted(a) {\n  font-size: 0.875rem !important;\n  border: none !important;\n  vertical-align: middle !important;\n}\n\n:host(.white-background) ::slotted(a) {\n  background-color: var(--ic-architectural-white) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a) {\n  background-color: var(--button-default) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:hover) {\n  background-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:active) {\n  background-color: var(--button-default-active) !important;\n}\n\n:host(.button-variant-primary.disabled) ::slotted(a),\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200) !important;\n}\n\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n  background: var(--ic-architectural-600) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover) !important;\n  border-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:active) {\n  border-color: var(--button-default-active) !important;\n  background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-secondary.disabled) ::slotted(a),\n:host(.button-variant-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.disabled) ::slotted(a),\n:host(.button-variant-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-300) !important;\n  background: none !important;\n}\n\n:host(.button-variant-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-500) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:hover),\n:host(.button-variant-icon) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:active:not(:focus)),\n:host(.button-variant-tertiary) ::slotted(a:active:focus),\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)) {\n  background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-icon.disabled) ::slotted(a),\n:host(.button-variant-icon.disabled) ::slotted(a:hover),\n:host(.button-variant-icon.disabled) ::slotted(a:active) {\n  background: none !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a) {\n  background-color: var(--ic-action-destructive) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:hover) {\n  background-color: var(--ic-action-destructive-hover) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:active) {\n  background-color: var(--ic-action-destructive-active) !important;\n}\n\n:host(.button-size-default) ::slotted(a) {\n  height: var(--height, 2.5rem) !important;\n  padding: var(--ic-space-xs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-small) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl)) !important;\n  padding: var(--ic-space-xxs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-large) ::slotted(a) {\n  height: var(--height, var(--ic-space-xxl)) !important;\n  padding: var(--ic-space-sm) var(--ic-space-md) !important;\n}\n\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl)) !important;\n  padding: 0.375rem !important;\n}\n\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n  padding: var(--ic-space-xxs) !important;\n}\n\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n  padding: var(--ic-space-xs) !important;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  .button,\n  ::slotted(a) {\n    border: 0.125rem solid transparent !important;\n  }\n}\n\n/** Pagination **/\n\n:host(.flip) ::slotted(svg) {\n  transform: scaleX(-1);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  forceUpdate,\n  h,\n  Watch,\n} from \"@stencil/core\";\n\nimport {\n  getThemeFromContext,\n  inheritAttributes,\n  isSlotUsed,\n  removeDisabledFalse,\n  renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n  IcButtonTypes,\n  IcButtonVariants,\n  IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n  IcSizes,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Deprecated. This slot should not be used anymore. Use left-icon or right-icon slot instead.\n * @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n */\n@Component({\n  tag: \"ic-button\",\n  styleUrl: \"ic-button.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Button {\n  private buttonEl: HTMLElement;\n  private buttonIdNum = buttonIds++;\n  private hasTooltip: boolean = false;\n  private id: string;\n  private inheritedAttributes: { [k: string]: string } = {};\n  private describedbyEl: HTMLElement = null;\n  private describedById: string = null;\n  private mutationObserver: MutationObserver = null;\n  private hostMutationObserver: MutationObserver = null;\n  private routerSlot: HTMLElement;\n\n  @Element() el: HTMLIcButtonElement;\n\n  @State() ariaLabel: string = null;\n  @State() describedByContent: string = null;\n  @State() title: string = null;\n\n  /**\n   * If `fileUpload` is set to `true`, this is the accepted list of file types.\n   */\n  @Prop() accept?: string = \"*\";\n\n  /**\n   * The appearance of the button, e.g. dark, light, or the default.\n   */\n  @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaControlsId: string | boolean;\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaOwnsId: string | boolean;\n\n  /**\n   * If `true`, the button will be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n   */\n  @Prop() disableTooltip?: boolean = false;\n\n  /**\n   * If `true`, the user can save the linked URL instead of navigating to it.\n   */\n  @Prop() download?: string | boolean = false;\n\n  /**\n   * If `true`, the button will show a dropdown icon.\n   */\n  @Prop() dropdown?: boolean = false;\n\n  /**\n   * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n   */\n  @Prop({ mutable: true, reflect: true }) dropdownExpanded?: boolean = false;\n\n  /**\n   * If `true`, when the button is clicked the native file explorer will be launched.\n   */\n  @Prop() fileUpload?: boolean = false;\n\n  /**\n   * The name of the control for the file input, which is submitted with the form data.\n   */\n  @Prop() fileInputName: string = `ic-button-file-upload-input-${buttonIds++}`;\n\n  /**\n   * The <form> element to associate the button with.\n   */\n  @Prop() form?: string;\n\n  /**\n   * The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner.\n   */\n  @Prop() formaction?: string;\n\n  /**\n   * The way the submitted form data is encoded.\n   */\n  @Prop() formenctype?: string;\n\n  /**\n   * The HTTP method used to submit the form.\n   */\n  @Prop() formmethod?: string;\n\n  /**\n   * If `true`, the form will not be validated when submitted.\n   */\n  @Prop() formnovalidate?: boolean;\n\n  /**\n   * The place to display the response from submitting the form. It overrides the target attribute of the button's form owner.\n   */\n  @Prop() formtarget?: string;\n\n  /**\n   * If `true`, the button will fill the width of the container.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * The URL that the link points to. This will render the button as an \"a\" tag.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n\n  /**\n   * If `true`, the button will be in loading state.\n   */\n  @Prop() loading?: boolean = false;\n\n  /**\n   * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n   */\n  @Prop() multiple?: boolean = false;\n\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n\n  /**\n   * The list of the files that have been selected by a user.\n   */\n  @Prop() selectedFiles: FileList;\n\n  /**\n   * The size of the button to be displayed.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n\n  /**\n   * The position of the tooltip in relation to the button.\n   */\n  @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n\n  /**\n   * If `true`, the secondary variant of button will have a transparent background rather than white.\n   */\n  @Prop() transparentBackground?: boolean = true;\n\n  /**\n   * The type of the button.\n   */\n  @Prop() type?: IcButtonTypes = \"button\";\n\n  /**\n   * The variant of the button to be displayed.\n   */\n  @Prop() variant?: IcButtonVariants = \"primary\";\n\n  /**\n   * Emitted when button has blur\n   */\n  @Event() icBlur!: EventEmitter<void>;\n\n  /**\n   * If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n   */\n  @Event() icFileSelection!: EventEmitter<FileList>;\n\n  /**\n   * Emitted when button has focus\n   */\n  @Event() icFocus!: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    if (this.mutationObserver !== null && this.mutationObserver !== undefined) {\n      this.mutationObserver.disconnect();\n    }\n    if (\n      this.hostMutationObserver !== null &&\n      this.hostMutationObserver !== undefined\n    ) {\n      this.hostMutationObserver.disconnect();\n    }\n  }\n\n  componentWillUpdate(): void {\n    if (this.loading) {\n      this.el.style.setProperty(\n        \"--min-width\",\n        `${this.el.getBoundingClientRect().width}px`\n      );\n    }\n    this.setHasTooltip();\n  }\n\n  componentWillLoad(): void {\n    const {\n      title,\n      \"aria-label\": ariaLabel,\n      ...restInheritedAttributes\n    } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n    this.title = title;\n    this.ariaLabel = ariaLabel;\n    this.inheritedAttributes = restInheritedAttributes;\n\n    removeDisabledFalse(this.disabled, this.el);\n\n    this.el.setAttribute(\"exportparts\", \"button\");\n\n    this.id = this.el.id || null;\n    this.setHasTooltip();\n\n    if (!this.hasTooltip) {\n      const describedById = this.inheritedAttributes[\"aria-describedby\"];\n      if (describedById !== undefined) {\n        this.describedById = describedById;\n        const el = this.el.parentElement.querySelector<HTMLElement>(\n          `#${describedById}`\n        );\n        if (el) {\n          this.describedByContent = el.innerText;\n          this.describedbyEl = el;\n        }\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    this.updateTheme();\n\n    if (typeof MutationObserver !== \"undefined\") {\n      if (this.describedById) {\n        this.mutationObserver = new MutationObserver(this.mutationCallback);\n        this.mutationObserver.observe(this.describedbyEl, {\n          characterData: true,\n          childList: true,\n          subtree: true,\n        });\n      }\n\n      this.hostMutationObserver = new MutationObserver(\n        this.hostMutationCallback\n      );\n      this.hostMutationObserver.observe(this.el, {\n        attributes: true,\n      });\n    }\n  }\n\n  componentWillRender(): void {\n    const iconEl = this.hasIconSlot(\"left\")\n      ? this.el.querySelector(`[slot=\"left-icon\"]`)\n      : this.hasIconSlot(\"right\")\n      ? this.el.querySelector(`[slot=\"right-icon\"]`)\n      : null;\n    iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n  }\n\n  @Listen(\"click\", { capture: true })\n  handleHostClick(event: Event): void {\n    if (!this.hasRouterSlot()) {\n      if (this.fileUpload) {\n        renderFileHiddenInput(\n          this.icFileSelection,\n          this.el,\n          this.multiple,\n          this.fileInputName,\n          this.selectedFiles,\n          this.disabled,\n          this.accept\n        );\n      }\n      if (this.disabled || this.loading) {\n        event.stopImmediatePropagation();\n      }\n      if (this.dropdown) {\n        this.dropdownExpanded = !this.dropdownExpanded;\n      }\n    }\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n    this.updateTheme(detail.mode);\n  }\n\n  /**\n   * Sets focus on the native `button`.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.buttonEl?.focus();\n  }\n\n  private 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 onFocus = () => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.icBlur.emit();\n  };\n\n  private updateTheme(newTheme: IcThemeForeground = null): void {\n    const foregroundColor = getThemeFromContext(this.el, newTheme);\n\n    if (foregroundColor !== IcThemeForegroundEnum.Default) {\n      this.appearance = foregroundColor;\n    }\n  }\n\n  // triggered when text content of sibling element in light DOM changes\n  private mutationCallback = (): void => {\n    this.describedByContent = this.describedbyEl.innerText;\n  };\n\n  // triggered when attributes of host element change\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(({ attributeName }) => {\n      const attribute = this.el.getAttribute(attributeName);\n      if (attributeName === \"title\") this.title = attribute;\n      else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n      if (IC_INHERITED_ARIA.includes(attributeName)) {\n        this.inheritedAttributes[attributeName] = attribute;\n        forceComponentUpdate = true;\n      }\n    });\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  private setHasTooltip = (): void => {\n    this.hasTooltip =\n      !this.disableTooltip && (!!this.title || this.variant === \"icon\");\n  };\n\n  render() {\n    const TagType = (this.href && \"a\") || \"button\";\n    const { title, ariaLabel, inheritedAttributes } = this;\n    const buttonAttrs =\n      TagType === \"button\"\n        ? {\n            type: this.type,\n            disabled: this.disabled,\n            form: this.form,\n            formaction: this.formaction,\n            formenctype: this.formenctype,\n            formmethod: this.formmethod,\n            formnovalidate: this.formnovalidate,\n            formtarget: this.formtarget,\n          }\n        : {\n            download: this.download !== false ? this.download : null,\n            href: this.href,\n            rel: this.rel,\n            target: this.target,\n            referrerpolicy: this.referrerpolicy,\n            hreflang: this.hreflang,\n          };\n\n    let describedby: string = null;\n    let buttonId: string = null;\n    if (this.hasTooltip) {\n      buttonId =\n        this.id !== null\n          ? `ic-button-with-tooltip-${this.id}`\n          : `ic-button-with-tooltip-${this.buttonIdNum}`;\n      describedby =\n        this.variant === \"icon\" && !!ariaLabel\n          ? null\n          : `ic-tooltip-${buttonId}`;\n    } else {\n      describedby = this.describedById;\n    }\n\n    const ButtonContent = () => {\n      return (\n        <TagType\n          class=\"button\"\n          aria-disabled={this.loading || this.disabled ? \"true\" : null}\n          aria-label={this.loading ? \"Loading\" : ariaLabel}\n          aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n          {...buttonAttrs}\n          {...inheritedAttributes}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n          ref={(el) => (this.buttonEl = el)}\n          aria-describedby={describedby}\n          part=\"button\"\n        >\n          {this.hasIconSlot() && !this.loading && (\n            <div class=\"icon-container\">\n              <slot name=\"icon\" />\n            </div>\n          )}\n          {this.hasIconSlot(\"left\") && !this.loading && (\n            <div class=\"icon-container\">\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          {this.hasIconSlot(\"top\") &&\n            !this.hasIconSlot(\"left\") &&\n            !this.hasIconSlot(\"right\") &&\n            !this.loading && (\n              <div class=\"icon-container\">\n                <slot name=\"top-icon\" />\n              </div>\n            )}\n          {this.loading ? (\n            <div class=\"loading-container\">\n              <ic-loading-indicator\n                type=\"linear\"\n                appearance={\n                  this.variant === \"primary\" ||\n                  this.variant === \"destructive\" ||\n                  this.appearance === IcThemeForegroundEnum.Dark ||\n                  this.appearance === IcThemeForegroundEnum.Light\n                    ? \"light\"\n                    : \"dark\"\n                }\n              ></ic-loading-indicator>\n            </div>\n          ) : (\n            <slot />\n          )}\n          {this.hasIconSlot(\"right\") && !this.loading && !this.dropdown && (\n            <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n              <slot name=\"right-icon\" />\n            </div>\n          )}\n          {this.dropdown &&\n            !this.loading &&\n            this.variant !== \"icon\" &&\n            this.variant !== \"destructive\" && (\n              <span\n                class={{\n                  [\"arrow-dropdown\"]: !this.dropdownExpanded,\n                  [\"dropdown-expanded\"]: this.dropdownExpanded,\n                }}\n                innerHTML={arrowDropdown}\n              />\n            )}\n        </TagType>\n      );\n    };\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: this.disabled && !this.loading,\n          [`button-variant-${this.variant}`]: true,\n          [`button-size-${this.size}`]: true,\n          [\"loading\"]: this.loading,\n          [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n          [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n          [\"full-width\"]: this.fullWidth,\n          [\"with-badge\"]: isSlotUsed(this.el, \"badge\"),\n          [\"dropdown-no-icon\"]:\n            this.dropdown &&\n            !isSlotUsed(this.el, \"icon\") &&\n            !isSlotUsed(this.el, \"left-icon\"),\n          [\"top-icon\"]: isSlotUsed(this.el, \"top-icon\"),\n          [\"white-background\"]:\n            this.variant === \"secondary\" &&\n            !this.transparentBackground &&\n            this.appearance !== \"light\",\n        }}\n        onClick={this.handleClick}\n        aria-owns={this.ariaOwnsId}\n        aria-controls={this.ariaControlsId}\n        aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n      >\n        {this.hasTooltip && (\n          <ic-tooltip\n            id={describedby}\n            label={title || ariaLabel}\n            target={buttonId}\n            placement={this.tooltipPlacement}\n            silent={this.variant === \"icon\" && !!ariaLabel}\n          >\n            {this.hasRouterSlot() ? (\n              <slot name=\"router-item\"></slot>\n            ) : (\n              <ButtonContent />\n            )}\n          </ic-tooltip>\n        )}\n        {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n        {!this.hasTooltip &&\n          (this.hasRouterSlot() ? (\n            <slot name=\"router-item\"></slot>\n          ) : (\n            <ButtonContent />\n          ))}\n        {this.describedByContent && (\n          <span id={describedby} class=\"ic-button-describedby\">\n            {this.describedByContent}\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --circular-diameter: Diameter of the circular-indicator\n   */\n\n  display: block;\n\n  --linear-border-radius: 0.25rem;\n  --inner-color: var(--ic-action-default);\n  --outer-color: var(--ic-architectural-100);\n  --label-color: var(--ic-color-primary-text);\n  --margin: none;\n  --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n  --inner-color: var(--ic-architectural-white);\n  --outer-color: var(--ic-architectural-800);\n  --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n:host([size=\"small\"]) {\n  --circular-diameter: 2.5rem;\n  --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n  --circular-diameter: 5rem;\n}\n\n:host([size=\"large\"]) {\n  --circular-diameter: 7.5rem;\n}\n\n:host([size=\"icon\"]) {\n  display: inline-block;\n\n  --margin: var(--ic-space-xxxs);\n  --circular-diameter: 1.25rem;\n}\n\n:host(.label) {\n  --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n  color: var(--label-color);\n  margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n  height: var(--circular-diameter);\n  width: var(--circular-diameter);\n}\n\n.ic-loading-circular-outer.indeterminate {\n  animation: circular-animation 1s linear;\n  animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n  margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n  background-color: var(--outer-color);\n  height: var(--linear-line-height);\n  width: 100%;\n  border-radius: var(--linear-border-radius);\n  overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n  position: relative;\n  height: 100%;\n  background-color: var(--inner-color);\n  border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n  animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n  transition: width 0.5s;\n  width: var(--linear-width);\n}\n\n:host(.full-width) {\n  --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n  0% {\n    width: 0%;\n    left: -1%;\n  }\n\n  25% {\n    width: 0%;\n    left: -1%;\n  }\n\n  50% {\n    width: 101%;\n    left: -1%;\n  }\n\n  75% {\n    width: 0%;\n    left: 101%;\n  }\n\n  100% {\n    width: 0%;\n    left: 101%;\n  }\n}\n\n.ic-loading-circular-svg {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n  width: 100%;\n  height: 100%;\n  fill: none;\n  stroke: var(--compact-step-outer-color, var(--outer-color));\n  stroke-width: var(--circular-line-width);\n  stroke-linecap: round;\n}\n\n/* --stroke-dash-array calculated via dashArray method */\n.ic-loading-circular-svg circle:nth-child(2) {\n  --circular-indeterminate: calc(\n    (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n  );\n\n  stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n  stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n  stroke: var(--compact-step-inner-color, var(--inner-color));\n}\n\n:host(.inner-label) .ic-loading-circular-inner {\n  display: grid;\n}\n\n:host(.inner-label) .ic-loading-circular-svg,\n.inner-text {\n  grid-column: 1;\n  grid-row: 1;\n}\n\n:host(.not-required.compact-step-progress-indicator)\n  .ic-loading-circular-svg\n  circle:nth-child(2) {\n  stroke: var(--ic-architectural-300);\n}\n\n.inner-text {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--ic-space-lg);\n  height: inherit;\n  overflow: hidden;\n  margin: auto;\n  color: var(--compact-step-inner-color, var(--ic-status-info));\n}\n\n:host(.not-required.compact-step-progress-indicator) .inner-text {\n  color: var(--ic-color-tertiary-text);\n}\n\n:host(.light.not-required.compact-step-progress-indicator) .inner-text {\n  color: var(--ic-architectural-400);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  .indeterminate > .ic-loading-circular-inner {\n    forced-color-adjust: none;\n  }\n\n  .ic-loading-linear-outer {\n    border: var(--ic-hc-border);\n  }\n\n  .ic-loading-linear-inner {\n    background-color: canvastext;\n  }\n\n  .ic-loading-circular-svg circle {\n    stroke: Background;\n  }\n\n  .ic-loading-circular-svg circle:nth-child(2) {\n    stroke: canvastext;\n  }\n\n  :host(.not-required.compact-step-progress-indicator)\n    .ic-loading-circular-svg\n    circle:nth-child(2) {\n    stroke: GrayText;\n  }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n  IcLoadingCircleXYR,\n  IcLoadingSizes,\n  IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n  IcThemeForegroundEnum,\n  IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\nimport { isPropDefined } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-loading-indicator\",\n  styleUrl: \"ic-loading-indicator.css\",\n  shadow: true,\n})\nexport class LoadingIndicator {\n  private circularMeter: SVGCircleElement;\n  private innerElement?: HTMLDivElement;\n  private interval: ReturnType<typeof setInterval>;\n  private labelList: string[];\n  private outerElement?: HTMLDivElement;\n\n  @Element() el: HTMLIcLoadingIndicatorElement;\n\n  @State() circularDiameter: number;\n  @State() circularLineWidth: number;\n  @State() indeterminate: boolean;\n  @State() indicatorLabel: string;\n  @State() showSecond: boolean = false;\n\n  /**\n   * The appearance of the loading indicator, e.g. dark or light.\n   */\n  @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n  /**\n   * The description that will be set as the aria-label of the loading indicator when not using a visible label.\n   */\n  @Prop() description?: string = \"Loading\";\n\n  /**\n   * If `true`, when linear, the full-width variant (i.e. without a border radius) will be displayed.\n   */\n  @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n  /**\n   * @internal The step number of a compact step, managed by ic-step.\n   */\n  @Prop() innerLabel?: number;\n\n  /**\n   * The time in milliseconds before the label changes.\n   */\n  @Prop() labelDuration?: number = 8000;\n\n  /**\n   * The maximum value that the progress value can take.\n   * Used to calculate the proportional width of the progress bar.\n   */\n  @Prop() max?: number = 100;\n\n  /**\n   * The minimum value that the progress value can take.\n   * Used to calculate the proportional width of the progress bar.\n   */\n  @Prop() min?: number = 0;\n\n  /**\n   * The size of the loading indicator.\n   */\n  @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n  /**\n   * The type of indicator, either linear or circular.\n   */\n  @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n  /**\n   * The label to be displayed beneath the loading indicator.\n   * Display a changing label by separating multiple messages with forward slashes.\n   */\n  @Prop() label?: string;\n\n  @Watch(\"label\")\n  watchPropHandler(): void {\n    this.updateLabel();\n  }\n\n  /**\n   * The current amount of progress made.\n   * If not provided, component acts as an indeterminate loading indicator.\n   */\n  @Prop() progress?: number;\n\n  @Watch(\"progress\")\n  watchProgressHandler(): void {\n    if (this.type === \"circular\") {\n      this.updateCircularProgressMeter();\n    }\n  }\n\n  disconnectedCallback(): void {\n    clearInterval(this.interval);\n  }\n\n  componentWillLoad(): void {\n    this.indeterminate = this.progress === undefined;\n    this.updateLabel();\n    this.el.setAttribute(\"exportparts\", \"ic-loading-container\");\n  }\n\n  componentDidLoad(): void {\n    if (this.type === \"circular\") {\n      this.setCircleLineWidth();\n      this.circularMeter = this.el.shadowRoot.querySelector(\n        \".ic-loading-circular-svg circle:nth-child(2)\"\n      );\n      this.updateCircularProgressMeter();\n    }\n\n    if (Number(this.progress) >= 0 && this.type === \"linear\") {\n      this.setLinearDeterminateWidth();\n    }\n  }\n\n  componentWillUpdate(): void {\n    this.indeterminate = this.progress === undefined;\n  }\n\n  componentDidUpdate(): void {\n    if (Number(this.progress) >= 0 && this.type === \"linear\") {\n      this.setLinearDeterminateWidth();\n    }\n  }\n\n  private updateCircularProgressMeter = () => {\n    if (!this.indeterminate) {\n      this.circularMeter.style.setProperty(\n        \"--progress-value\",\n        String(this.progress)\n      );\n    }\n  };\n\n  private getLabel = (\n    labelIndex: number,\n    setLabel: (label: string) => void\n  ) => {\n    return new Promise(() => {\n      this.interval = setInterval(() => {\n        if (labelIndex < this.labelList.length - 1) {\n          labelIndex++;\n        } else {\n          labelIndex = 0;\n        }\n        setLabel(this.labelList[labelIndex]);\n      }, this.labelDuration);\n    });\n  };\n\n  private getLabelVariant = () => {\n    let variant: \"label\" | \"h4\" | \"h2\" = \"h4\";\n    const width = this.outerElement?.offsetWidth;\n    if (this.size === \"small\" || (this.type === \"circular\" && width < 60)) {\n      variant = \"label\";\n    } else if (\n      this.size === \"large\" ||\n      (this.type === \"circular\" && width >= 120)\n    ) {\n      variant = \"h2\";\n    }\n    return variant;\n  };\n\n  // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n  private setCircleLineWidth = () => {\n    const { offsetWidth: width } = this.outerElement;\n\n    const compactStepCircularLineWidth = this.el.classList.contains(\n      \"compact-step-progress-indicator\"\n    )\n      ? 40\n      : 0;\n    const toastDismissTimerCircularLineWidth = this.el.classList.contains(\n      \"toast-dismiss-timer\"\n    )\n      ? 20\n      : 0;\n\n    if (\n      width ||\n      compactStepCircularLineWidth ||\n      toastDismissTimerCircularLineWidth\n    ) {\n      this.circularLineWidth =\n        (compactStepCircularLineWidth ||\n          toastDismissTimerCircularLineWidth ||\n          width) * 0.1;\n      this.circularDiameter =\n        compactStepCircularLineWidth ||\n        toastDismissTimerCircularLineWidth ||\n        width;\n      this.outerElement.style.setProperty(\n        \"--circular-line-width\",\n        `${this.circularLineWidth}px`\n      );\n    }\n  };\n\n  private setLinearDeterminateWidth = () => {\n    if (!this.innerElement) return;\n    // Ensure progress cannot be out of bounds\n\n    const progress = Math.min(this.max, Math.max(this.min, this.progress));\n    const proportion = (progress - this.min) / (this.max - this.min);\n    this.showSecond = proportion > 0.5;\n    if (this.showSecond) {\n      this.innerElement.classList.remove(\"clip\");\n    } else {\n      this.innerElement.classList.add(\"clip\");\n    }\n    this.innerElement.style.setProperty(\n      \"--linear-width\",\n      `${proportion * 100}%`\n    );\n  };\n\n  private calcOuterClass = (): string => {\n    let cls = `ic-loading-${this.type}-outer`;\n    cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n    return cls;\n  };\n\n  private updateLabel = (): void => {\n    if (isPropDefined(this.label)) {\n      this.labelList = this.label.split(\"/\");\n      const labelIndex = 0;\n      this.indicatorLabel = this.labelList[labelIndex];\n      if (this.labelList.length > 1) {\n        this.getLabel(labelIndex, (label) => {\n          this.indicatorLabel = label;\n        });\n      }\n    }\n  };\n\n  private setCircleXY = (): IcLoadingCircleXYR => {\n    if (this.circularDiameter > 0) {\n      const r = this.circularDiameter / 2;\n      const x = r;\n      const y = r;\n      const nextRadius = r - this.circularLineWidth / 2;\n      this.setDashSteps(nextRadius);\n\n      return { x, y, r: nextRadius };\n    }\n    return { x: 0, y: 0, r: 0 };\n  };\n\n  private setDashSteps = (radius: number) => {\n    const dashArray = 2 * Math.PI * radius;\n    const progress = Math.min(Math.max(this.progress, this.min), this.max);\n    const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n    this.circularMeter.style.setProperty(\n      \"--stroke-dasharray\",\n      `${dashArray}px`\n    );\n\n    if (!this.indeterminate) {\n      this.circularMeter.style.setProperty(\n        \"--circular-steps-max\",\n        String(this.max)\n      );\n      this.circularMeter.style.setProperty(\n        \"--stroke-dashoffset\",\n        `${proportion * dashArray}px`\n      );\n    }\n  };\n\n  render() {\n    const { appearance, label, description, size, fullWidth, innerLabel } =\n      this;\n    const { x, y, r } = this.setCircleXY();\n\n    return (\n      <Host\n        class={{\n          [\"light\"]: appearance === IcThemeForegroundEnum.Light,\n          [\"label\"]: !!label,\n          [\"full-width\"]: fullWidth,\n          [\"inner-label\"]: !!innerLabel,\n        }}\n      >\n        <div class=\"ic-loading-container\" part=\"ic-loading-container\">\n          <div\n            ref={(el) => (this.outerElement = el as HTMLDivElement)}\n            class={this.calcOuterClass()}\n            role=\"progressbar\"\n            aria-labelledby={\n              this.label && this.size !== \"icon\" && \"ic-loading-label\"\n            }\n            aria-label={description}\n            aria-valuenow={this.progress}\n            aria-valuemin={this.min}\n            aria-valuemax={this.max}\n          >\n            <div\n              ref={(el) => (this.innerElement = el as HTMLDivElement)}\n              class={`ic-loading-${this.type}-inner`}\n            >\n              {this.innerLabel &&\n                this.innerLabel !== undefined &&\n                this.size === \"small\" && (\n                  <ic-typography variant=\"subtitle-small\" class=\"inner-text\">\n                    {this.innerLabel}\n                  </ic-typography>\n                )}\n              {this.type === \"circular\" && (\n                <svg\n                  class=\"ic-loading-circular-svg\"\n                  viewBox={`0 0 ${this.circularDiameter || 0} ${\n                    this.circularDiameter || 0\n                  }`}\n                >\n                  <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n                  <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n                </svg>\n              )}\n            </div>\n          </div>\n          {label && size !== \"icon\" && (\n            <ic-typography\n              id=\"ic-loading-label\"\n              class=\"ic-loading-label\"\n              role=\"status\"\n              variant={this.getLabelVariant()}\n            >\n              <p>{this.indicatorLabel}</p>\n            </ic-typography>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-tooltip: z-index of tooltip\n */\n\n:host(.ic-tooltip) {\n  width: max-content;\n  height: max-content;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container {\n  background-color: var(--ic-architectural-800);\n  color: #ffff;\n  text-align: center;\n  padding: var(--ic-space-xxxs) var(--ic-space-xs);\n  border-radius: var(--ic-border-radius);\n  border: var(--ic-border-width) solid var(--ic-architectural-40);\n  position: absolute;\n  max-width: 20rem;\n  display: none;\n  z-index: var(--ic-z-index-tooltip);\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n  .ic-tooltip-container,\n:host(.tooltip-disabled) .ic-tooltip-container {\n  display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n  .ic-tooltip-container[data-show] {\n  display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n  position: absolute;\n  background: inherit;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n  visibility: hidden;\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n  visibility: visible;\n  content: \"\";\n  border: var(--ic-border-width) solid var(--ic-architectural-40);\n  width: 100%;\n  height: 100%;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n  display: block;\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"top\"]\n  > .ic-tooltip-arrow {\n  height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"top\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n  left: 0;\n  top: var(--ic-space-xxxs);\n  border-top: 0;\n  transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n  > .ic-tooltip-arrow {\n  top: calc(-1 * var(--ic-space-xxs));\n  height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n  left: 0;\n  top: var(--ic-space-1px);\n  border-bottom: 0;\n  transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"left\"]\n  > .ic-tooltip-arrow {\n  width: var(--ic-space-xxxs);\n  right: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"left\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n  border-left: 0;\n  top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"right\"]\n  > .ic-tooltip-arrow {\n  width: var(--ic-space-xxxs);\n  left: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"right\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n  border-right: 0;\n  top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.on-dialog) .ic-tooltip-container {\n  transform: translate(\n    var(--tooltip-translate-x),\n    var(--tooltip-translate-y)\n  ) !important;\n}\n\n@media screen and (max-width: 576px) {\n  :host(.ic-tooltip) .ic-tooltip-container {\n    max-width: 18.875rem;\n  }\n}\n\n@media (forced-colors: active) {\n  :host(.ic-tooltip) .ic-tooltip-container,\n  :host(.ic-tooltip) .ic-tooltip-arrow::before {\n    border: var(--ic-hc-border);\n  }\n}\n","import { Component, Element, Host, Prop, h, Method } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-tooltip\",\n  styleUrl: \"ic-tooltip.css\",\n  shadow: true,\n})\nexport class Tooltip {\n  private arrow: HTMLDivElement;\n  private delayedHideEvents = [\"mouseleave\"];\n  private dialogOverflow = false;\n  private icDialogEl: HTMLIcDialogElement;\n  private instantHideEvents = [\"focusout\"];\n  private mouseOverTool: boolean = false;\n  private persistTooltip = false;\n  private popperInstance: Instance;\n  private onDialog: boolean = false;\n  private showEvents = [\n    !this.disableHover && \"mouseenter\",\n    !this.disableHover && \"focusin\",\n    !this.disableClick && \"click\",\n  ];\n  private toolTip: HTMLDivElement;\n\n  @Element() el: HTMLIcTooltipElement;\n\n  /**\n   * @internal If `true`, the tooltip will not be displayed on click, it will require hover or using the display method.\n   */\n  @Prop() disableClick?: boolean = false;\n\n  /**\n   * If `true`, the tooltip will not be displayed on hover, it will require a click.\n   */\n  @Prop() disableHover?: boolean = false;\n\n  /**\n   * The number of lines to display before truncating the text.\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * The position of the tooltip in relation to the parent element.\n   */\n  @Prop({ mutable: true }) placement?: IcTooltipPlacements = \"bottom\";\n\n  /**\n   * @internal Sets the tooltip to aria-hidden, when used as part of components that are already announced.\n   */\n  @Prop() silent?: boolean = false;\n\n  /**\n   * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n   */\n  @Prop({ reflect: true }) target?: string;\n\n  /**\n   * The text to display on the tooltip.\n   */\n  @Prop() label!: string;\n\n  disconnectedCallback(): void {\n    this.manageEventListeners(\"remove\");\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  }\n\n  componentDidLoad(): void {\n    this.manageEventListeners(\"add\");\n\n    this.icDialogEl = this.el.closest(\"ic-dialog\");\n    this.dialogOverflow =\n      this.icDialogEl?.getAttribute(\"data-overflow\") === \"true\";\n\n    this.onDialog = this.icDialogEl !== null;\n\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Tooltip\"\n    );\n  }\n\n  componentDidRender(): void {\n    const typographyEl = this.el.shadowRoot.querySelector(\n      \".ic-tooltip-container > ic-typography\"\n    );\n    this.maxLines > 0 &&\n      typographyEl.setAttribute(\n        \"style\",\n        `--truncation-max-lines: ${this.maxLines}`\n      );\n  }\n  /**\n   * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n   * @param show Whether to show or hide the tooltip\n   * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n   */\n  @Method()\n  async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n    this.persistTooltip = persistTooltip;\n    show ? this.show() : this.hide();\n  }\n\n  private getTooltipTranslate = (dialogEl: DOMRect) => {\n    const child = this.el.children[0].getBoundingClientRect();\n    let tooltipX;\n    let tooltipY;\n    switch (this.placement) {\n      case \"bottom\":\n        tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"bottom-start\":\n        tooltipX = child.left - dialogEl.left;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"bottom-end\":\n        tooltipX = child.right - dialogEl.right;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"top\":\n        tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"top-start\":\n        tooltipX = child.left - dialogEl.left;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"top-end\":\n        tooltipX = child.right - dialogEl.right;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"left\":\n      case \"left-start\":\n        tooltipX = child.right - dialogEl.right - child.width;\n        tooltipY = child.bottom - dialogEl.top - child.height;\n        break;\n      case \"left-end\":\n        tooltipX = child.right - dialogEl.right - child.width;\n        tooltipY = child.top - dialogEl.bottom + child.height;\n        break;\n      case \"right\":\n      case \"right-start\":\n        tooltipX = child.left - dialogEl.left + child.width;\n        tooltipY = child.bottom - dialogEl.top - child.height;\n        break;\n      case \"right-end\":\n        tooltipX = child.left - dialogEl.left + child.width;\n        tooltipY = child.top - dialogEl.bottom + child.height;\n        break;\n    }\n    if (this.dialogOverflow && tooltipX < 0) {\n      if (this.placement.includes(\"top\") || this.placement.includes(\"bottom\")) {\n        this.toolTip.style.setProperty(\n          \"--tooltip-arrow-translate\",\n          `${tooltipX}px`\n        );\n        tooltipX = child.left - dialogEl.left;\n      }\n      if (this.placement.includes(\"left\")) {\n        this.placement = \"right\";\n        tooltipX = child.left - dialogEl.left + child.width;\n      }\n    }\n\n    this.toolTip.style.setProperty(\"--tooltip-translate-x\", `${tooltipX}px`);\n    this.toolTip.style.setProperty(\"--tooltip-translate-y\", `${tooltipY}px`);\n  };\n\n  private show = () => {\n    if (this.label) {\n      this.toolTip.setAttribute(\"data-show\", \"\");\n\n      if (this.onDialog) {\n        this.el.classList.add(\"on-dialog\");\n        const dialogEl = this.icDialogEl.shadowRoot\n          .querySelector(\"dialog\")\n          .getBoundingClientRect();\n\n        this.getTooltipTranslate(dialogEl);\n      }\n\n      this.popperInstance = createPopper(this.el, this.toolTip, {\n        placement: this.placement,\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 10],\n            },\n          },\n          {\n            name: \"arrow\",\n            options: {\n              element: this.arrow,\n            },\n          },\n          {\n            name: \"eventListeners\",\n            options: { scroll: false, resize: false },\n          },\n        ],\n      });\n    } else {\n      console.warn(`Tooltip can't display without prop 'label' set`);\n    }\n  };\n\n  private hide = () => {\n    this.toolTip.removeAttribute(\"data-show\");\n    this.persistTooltip = false;\n  };\n\n  private checkCloseTooltip = () => {\n    setTimeout(() => {\n      if (!this.mouseOverTool && !this.persistTooltip) {\n        this.hide();\n      }\n    }, 100);\n  };\n\n  private mouseEnterTooltip = () => {\n    this.mouseOverTool = true;\n  };\n\n  private mouseLeaveTooltip = () => {\n    this.mouseOverTool = false;\n    this.checkCloseTooltip();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && !this.persistTooltip) {\n      this.hide();\n    }\n  };\n\n  private manageEventListeners = (action: \"add\" | \"remove\") => {\n    const method =\n      action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n    this.showEvents.forEach((event) => {\n      this.el[method](event, this.show);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseEnterTooltip);\n      }\n    });\n\n    if (!this.persistTooltip) {\n      this.instantHideEvents.forEach((event) => {\n        this.el[method](event, this.hide);\n      });\n    }\n\n    this.delayedHideEvents.forEach((event) => {\n      this.el[method](event, this.checkCloseTooltip);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseLeaveTooltip);\n      }\n    });\n\n    document[method](\"keydown\", this.handleKeyDown);\n  };\n\n  render() {\n    const { label, maxLines, silent } = this;\n    return (\n      <Host class={{ \"ic-tooltip\": true }}>\n        <div\n          ref={(el) => (this.toolTip = el as HTMLDivElement)}\n          role=\"tooltip\"\n          class=\"ic-tooltip-container\"\n          aria-hidden={`${silent}`}\n        >\n          <ic-typography maxLines={maxLines} variant=\"caption\">\n            {label}\n          </ic-typography>\n          <div\n            ref={(el) => (this.arrow = el as HTMLDivElement)}\n            class=\"ic-tooltip-arrow\"\n          ></div>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["icButtonCss","buttonIds","Button","this","buttonIdNum","hasTooltip","inheritedAttributes","describedbyEl","describedById","mutationObserver","hostMutationObserver","handleClick","el","type","hasRouterSlot","closest","hiddenFormButton","document","createElement","setAttribute","style","display","appendChild","click","remove","onFocus","icFocus","emit","onBlur","icBlur","mutationCallback","describedByContent","innerText","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","attribute","getAttribute","title","ariaLabel","IC_INHERITED_ARIA","includes","forceUpdate","setHasTooltip","disableTooltip","variant","watchDisabledHandler","removeDisabledFalse","disabled","disconnectedCallback","undefined","disconnect","componentWillUpdate","loading","setProperty","getBoundingClientRect","width","componentWillLoad","_a","inheritAttributes","restInheritedAttributes","__rest","id","parentElement","querySelector","componentDidLoad","updateTheme","MutationObserver","observe","characterData","childList","subtree","attributes","componentWillRender","iconEl","hasIconSlot","handleHostClick","event","fileUpload","renderFileHiddenInput","icFileSelection","multiple","fileInputName","selectedFiles","accept","stopImmediatePropagation","dropdown","dropdownExpanded","themeChangeHandler","detail","mode","setFocus","buttonEl","focus","position","selectorPrefix","routerSlot","textContent","newTheme","foregroundColor","getThemeFromContext","IcThemeForegroundEnum","Default","appearance","render","TagType","href","buttonAttrs","form","formaction","formenctype","formmethod","formnovalidate","formtarget","download","rel","target","referrerpolicy","hreflang","describedby","buttonId","ButtonContent","h","Object","assign","class","ref","part","name","Dark","Light","innerHTML","arrowDropdown","Host","size","fullWidth","isSlotUsed","transparentBackground","onClick","ariaOwnsId","ariaControlsId","label","placement","tooltipPlacement","silent","icLoadingIndicatorCss","LoadingIndicator","updateCircularProgressMeter","indeterminate","circularMeter","String","progress","getLabel","labelIndex","setLabel","Promise","interval","setInterval","labelList","length","labelDuration","getLabelVariant","outerElement","offsetWidth","setCircleLineWidth","compactStepCircularLineWidth","classList","contains","toastDismissTimerCircularLineWidth","circularLineWidth","circularDiameter","setLinearDeterminateWidth","innerElement","Math","min","max","proportion","showSecond","add","calcOuterClass","cls","updateLabel","isPropDefined","split","indicatorLabel","setCircleXY","r","x","y","nextRadius","setDashSteps","radius","dashArray","PI","watchPropHandler","watchProgressHandler","clearInterval","shadowRoot","Number","componentDidUpdate","description","innerLabel","role","viewBox","cx","cy","icTooltipCss","Tooltip","delayedHideEvents","dialogOverflow","instantHideEvents","mouseOverTool","persistTooltip","onDialog","showEvents","disableHover","disableClick","getTooltipTranslate","dialogEl","child","children","tooltipX","tooltipY","left","bottom","top","right","height","toolTip","show","icDialogEl","popperInstance","createPopper","modifiers","options","offset","element","arrow","scroll","resize","console","warn","hide","removeAttribute","checkCloseTooltip","setTimeout","mouseEnterTooltip","mouseLeaveTooltip","handleKeyDown","key","manageEventListeners","action","method","destroy","onComponentRequiredPropUndefined","prop","propName","componentDidRender","typographyEl","maxLines","displayTooltip"],"sources":["src/components/ic-button/ic-button.css?tag=ic-button&encapsulation=shadow","src/components/ic-button/ic-button.tsx","src/components/ic-loading-indicator/ic-loading-indicator.css?tag=ic-loading-indicator&encapsulation=shadow","src/components/ic-loading-indicator/ic-loading-indicator.tsx","src/components/ic-tooltip/ic-tooltip.css?tag=ic-tooltip&encapsulation=shadow","src/components/ic-tooltip/ic-tooltip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n* @prop --min-width: Minimum width of the button.\n* @prop --height: The height of the button.\n*/\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  --button-default: var(--ic-action-default);\n  --button-default-hover: var(--ic-action-default-hover);\n  --button-default-active: var(--ic-action-default-active);\n  --button-default-background-hover: var(--ic-action-default-bg-hover);\n  --button-default-background-active: var(--ic-action-default-bg-active);\n  --icon-width: 100%;\n  --icon-height: 100%;\n}\n\n.button,\n::slotted(a) {\n  font-family: var(--ic-font-body-family);\n  text-decoration: none;\n  font-weight: 600;\n  font-size: 0.875rem;\n  transition: var(--ic-easing-transition-fast);\n  border-radius: var(--ic-border-radius);\n  min-width: var(--min-width, 6.25rem);\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  white-space: nowrap;\n  vertical-align: middle;\n}\n\n:host(.with-badge) .button {\n  border-radius: 0.2188rem;\n}\n\n.button:hover,\n::slotted(a:hover) {\n  cursor: pointer;\n}\n\n.button:focus,\n::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.button:focus-visible,\n::slotted(a:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.dark) .button,\n:host(.dark) ::slotted(a) {\n  --button-default: var(--ic-action-dark);\n  --button-default-hover: var(--ic-action-dark);\n  --button-default-active: var(--ic-action-dark);\n  --button-default-background-hover: var(--ic-action-dark-bg-hover);\n  --button-default-background-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.light) .button,\n:host(.light) ::slotted(a) {\n  --button-default: var(--ic-action-light);\n  --button-default-hover: var(--ic-action-light);\n  --button-default-active: var(--ic-action-light);\n  --button-default-background-hover: var(--ic-action-light-bg-hover);\n  --button-default-background-active: var(--ic-action-light-bg-active);\n}\n\n:host(.white-background) .button,\n:host(.white-background) ::slotted(a) {\n  --button-default-background-hover: var(--ic-action-default-bg-hover-no-alpha);\n  --button-default-background-active: var(\n    --ic-action-default-bg-active-no-alpha\n  );\n\n  background-color: var(--ic-architectural-white);\n}\n\n:host(.white-background.dark) .button,\n:host(.white-background.dark) ::slotted(a) {\n  --button-default-background-hover: var(--ic-action-dark-bg-hover-no-alpha);\n  --button-default-background-active: var(--ic-action-dark-bg-active-no-alpha);\n}\n\n:host(.button-variant-primary.light) .button,\n:host(.button-variant-primary.light) ::slotted(a) {\n  color: var(--ic-color-primary-text);\n\n  --button-default-hover: var(--ic-action-light-hover);\n  --button-default-active: var(--ic-action-light-active);\n}\n\n:host(.button-variant-primary.dark) .button,\n:host(.button-variant-primary.dark) ::slotted(a) {\n  --button-default-hover: var(--ic-action-dark-hover);\n  --button-default-active: var(--ic-action-dark-active);\n}\n\n:host(.disabled),\n:host(.disabled) .button,\n:host(.disabled) ::slotted(a),\n:host(.loading),\n:host(.loading) .button {\n  pointer-events: none;\n}\n\n:host(.top-icon) .button {\n  flex-direction: column;\n\n  --height: fit-content;\n}\n\n:host(.top-icon) .button .icon-container {\n  margin-right: 0;\n}\n\n/* Variants */\n\n/* Primary */\n\n:host(.button-variant-primary) .button,\n:host(.button-variant-primary) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--button-default);\n}\n\n:host(.button-variant-primary) .button:hover {\n  background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-primary.loading) .button,\n:host(.button-variant-primary) .button:active {\n  background-color: var(--button-default-active);\n}\n\n:host(.button-variant-primary.disabled) .button,\n:host(.button-variant-primary.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n:host(.button-variant-primary.light.disabled) .button,\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n  background: var(--ic-architectural-600);\n  color: var(--ic-architectural-500);\n}\n\n/* Secondary  */\n\n:host(.button-variant-secondary) .button,\n:host(.button-variant-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default);\n  color: var(--button-default);\n}\n\n:host(.button-variant-secondary) .button:hover,\n:host(.button-variant-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  border-color: var(--button-default-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-secondary) .button:active,\n:host(.button-variant-secondary) ::slotted(a:active),\n:host(.button-variant-secondary.loading) .button {\n  border-color: var(--button-default-active);\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-secondary.disabled) .button,\n:host(.button-variant-secondary.disabled) ::slotted(a) {\n  border-color: var(--ic-architectural-300);\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-secondary.light.disabled) .button,\n:host(.button-variant-secondary.light.disabled) ::slotted(a) {\n  border-color: var(--ic-architectural-500);\n  color: var(--ic-architectural-500);\n}\n\n/* Tertiary */\n\n:host(.button-variant-tertiary) .button,\n:host(.button-variant-tertiary) ::slotted(a) {\n  color: var(--button-default);\n}\n\n:host(.button-variant-tertiary) .button:hover,\n:host(.button-variant-tertiary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-tertiary) .button:active,\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-tertiary.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-tertiary.disabled) .button,\n:host(.button-variant-tertiary.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-tertiary.light.disabled) .button,\n:host(.button-variant-tertiary.light.disabled) ::slotted(a) {\n  color: var(--ic-architectural-500);\n}\n\n/* Destructive */\n\n:host(.button-variant-destructive) .button,\n:host(.button-variant-destructive) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-action-destructive);\n  text-transform: uppercase;\n}\n\n:host(.button-variant-destructive) .button:hover {\n  background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-destructive) .button:active,\n:host(.button-variant-destructive.loading) .button {\n  background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-destructive.disabled) .button,\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n/* Icon */\n\n:host(.button-variant-icon) .button,\n:host(.button-variant-icon) ::slotted(a) {\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon) .button:hover,\n:host(.button-variant-icon) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon) .button:active:not(:focus),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)),\n:host(.button-variant-icon.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon.disabled) .button,\n:host(.button-variant-icon.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n/***********************\n * Icon Variants\n ***********************/\n\n/* Icon-primary */\n\n:host(.button-variant-icon-primary) .button,\n:host(.button-variant-icon-primary) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-primary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-primary) .button:hover,\n:host(.button-variant-icon-primary) ::slotted(a:hover) {\n  background-color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-primary) .button:active,\n:host(.button-variant-icon-primary) ::slotted(a:active),\n:host(.button-variant-icon-primary.loading) .button {\n  background: var(--button-default-active);\n}\n\n:host(.button-variant-icon-primary.loading) .button ic-loading-indicator {\n  --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-primary.disabled) .button,\n:host(.button-variant-icon-primary.disabled) ::slotted(a) {\n  color: var(--ic-architectural-300);\n  background: var(--ic-architectural-200);\n}\n\n:host(.button-variant-icon-primary.light) .button,\n:host(.button-variant-icon-primary.light) ::slotted(a) {\n  color: var(--ic-color-primary-text);\n}\n\n:host(.button-variant-icon-primary.light) .button:hover,\n:host(.button-variant-icon-primary.light) ::slotted(a:hover) {\n  background: var(--ic-action-light-hover);\n}\n\n:host(.button-variant-icon-primary.light) .button:active,\n:host(.button-variant-icon-primary.light) ::slotted(a:active),\n:host(.button-variant-icon-primary.light.loading) .button,\n:host(.button-variant-icon-primary.light.loading) ::slotted(a) {\n  background: var(--ic-action-light-active);\n}\n\n:host(.button-variant-icon-primary.dark) .button:hover,\n:host(.button-variant-icon-primary.dark) ::slotted(a:hover) {\n  background: var(--ic-action-dark-hover);\n}\n\n:host(.button-variant-icon-primary.dark) .button:active,\n:host(.button-variant-icon-primary.dark) ::slotted(a:active),\n:host(.button-variant-icon-primary.dark.loading) .button,\n:host(.button-variant-icon-primary.dark.loading) ::slotted(a) {\n  background: var(--ic-action-dark-active);\n}\n\n/* Icon-secondary */\n\n:host(.button-variant-icon-secondary) .button,\n:host(.button-variant-icon-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default);\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-secondary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-secondary) .button:hover,\n:host(.button-variant-icon-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  border-color: var(--button-default-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-secondary) .button:active,\n:host(.button-variant-icon-secondary) ::slotted(a:active),\n:host(.button-variant-icon-secondary.loading) .button {\n  border-color: var(--button-default-active);\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-secondary.disabled) .button,\n:host(.button-variant-icon-secondary.disabled) .button:hover,\n:host(.button-variant-icon-secondary.disabled) .button:active,\n:host(.button-variant-icon-secondary.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-300);\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n:host(.button-variant-icon-secondary.light.disabled) .button,\n:host(.button-variant-icon-secondary.light.disabled) .button:hover,\n:host(.button-variant-icon-secondary.light.disabled) .button:active,\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-secondary.light.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-500);\n  color: var(--ic-architectural-500);\n}\n\n/* Icon-tertiary */\n\n:host(.button-variant-icon-tertiary) .button,\n:host(.button-variant-icon-tertiary) ::slotted(a) {\n  color: var(--button-default);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-tertiary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-tertiary) .button:hover,\n:host(.button-variant-icon-tertiary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover);\n  color: var(--button-default-hover);\n}\n\n:host(.button-variant-icon-tertiary) .button:active,\n:host(.button-variant-icon-tertiary) ::slotted(a:active),\n:host(.button-variant-icon-tertiary.loading) .button {\n  background-color: var(--button-default-background-active);\n  color: var(--button-default-active);\n}\n\n:host(.button-variant-icon-tertiary.disabled) .button,\n:host(.button-variant-icon-tertiary.disabled) .button:hover,\n:host(.button-variant-icon-tertiary.disabled) .button:active,\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-tertiary.disabled) ::slotted(a:active) {\n  color: var(--ic-architectural-300);\n  background: none;\n}\n\n/* Icon-destructive */\n\n:host(.button-variant-icon-destructive) .button,\n:host(.button-variant-icon-destructive) ::slotted(a) {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-action-destructive);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n}\n\n:host(.button-variant-icon-destructive) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.button-variant-icon-destructive) .button:hover,\n:host(.button-variant-icon-destructive) ::slotted(a:hover) {\n  background-color: var(--ic-action-destructive-hover);\n}\n\n:host(.button-variant-icon-destructive) .button:active,\n:host(.button-variant-icon-destructive) ::slotted(a:active),\n:host(.button-variant-icon-destructive.loading) .button {\n  background-color: var(--ic-action-destructive-active);\n}\n\n:host(.button-variant-icon-destructive.loading) .button ic-loading-indicator {\n  --inner-color: var(--ic-architectural-white);\n}\n\n:host(.button-variant-icon-destructive.disabled) .button,\n:host(.button-variant-icon-destructive.disabled) .button:hover,\n:host(.button-variant-icon-destructive.disabled) .button:active,\n:host(.button-variant-icon-destructive.disabled) ::slotted(a),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:hover),\n:host(.button-variant-icon-destructive.disabled) ::slotted(a:active) {\n  background: var(--ic-architectural-200);\n  color: var(--ic-architectural-300);\n}\n\n/* Sizing */\n\n:host(.button-size-default) .button {\n  height: var(--height, 2.5rem);\n  padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.button-size-small) .button {\n  height: var(--height, var(--ic-space-xl));\n  padding: var(--ic-space-xxs) var(--ic-space-md);\n}\n\n:host(.button-size-large) .button {\n  height: var(--height, var(--ic-space-xxl));\n  padding: var(--ic-space-sm) var(--ic-space-md);\n}\n\n:host(.button-size-default.button-variant-icon) .button,\n:host(.button-size-default.button-variant-icon-primary) .button,\n:host(.button-size-default.button-variant-icon-secondary) .button,\n:host(.button-size-default.button-variant-icon-tertiary) .button,\n:host(.button-size-default.button-variant-icon-destructive) .button,\n:host(.button-size-default.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-default.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl));\n  width: var(--ic-space-xl);\n  padding: 0.375rem;\n}\n\n:host(.button-size-small.button-variant-icon) .button,\n:host(.button-size-small.button-variant-icon-primary) .button,\n:host(.button-size-small.button-variant-icon-secondary) .button,\n:host(.button-size-small.button-variant-icon-tertiary) .button,\n:host(.button-size-small.button-variant-icon-destructive) .button,\n:host(.button-size-small.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-small.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-lg));\n  width: var(--ic-space-lg);\n  padding: var(--ic-space-xxs);\n}\n\n:host(.button-size-large.button-variant-icon) .button,\n:host(.button-size-large.button-variant-icon-primary) .button,\n:host(.button-size-large.button-variant-icon-secondary) .button,\n:host(.button-size-large.button-variant-icon-tertiary) .button,\n:host(.button-size-large.button-variant-icon-destructive) .button,\n:host(.button-size-large.button-variant-icon-primary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-secondary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-tertiary) ::slotted(a),\n:host(.button-size-large.button-variant-icon-destructive) ::slotted(a),\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n  height: var(--height, 2.5rem);\n  width: 2.5rem;\n  padding: var(--ic-space-xs);\n}\n\n/* Width */\n:host(.full-width),\n:host(.full-width) .button,\n:host(.full-width) ::slotted(a) {\n  width: 100%;\n}\n\n/* Loading */\n\ndiv.loading-container {\n  position: relative;\n  align-items: center;\n  width: 100%;\n}\n\nic-loading-indicator {\n  --outer-color: transparent;\n}\n\n@keyframes loading-animation {\n  0% {\n    width: 0%;\n    left: 0%;\n  }\n\n  25% {\n    width: 0%;\n    left: 0%;\n    opacity: 0;\n  }\n\n  50% {\n    width: 100%;\n    left: 0%;\n    opacity: 1;\n  }\n\n  75% {\n    width: 0%;\n    left: 100%;\n  }\n\n  100% {\n    width: 0%;\n    left: 100%;\n    opacity: 0;\n  }\n}\n\n/* Icons */\n\ndiv.icon-container {\n  box-sizing: border-box;\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: var(--ic-space-xs);\n}\n\ndiv.right-icon {\n  margin-right: auto;\n  margin-left: var(--ic-space-xs);\n}\n\n:host(.full-width) .right-icon {\n  margin-right: var(--ic-space-xs);\n}\n\n::slotted(:not(ic-badge)) {\n  width: var(--icon-width) !important;\n  height: var(--icon-height) !important;\n  fill: currentcolor !important;\n  pointer-events: none;\n}\n\n:host(.button-variant-icon) .button .icon-container {\n  margin: 0;\n  pointer-events: none;\n}\n\n/** SEARCH **/\n\n:host(.search-submit-button) ::slotted(svg) {\n  --icon-height: 1.25rem;\n  --icon-width: 1.25rem;\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n  --icon-height: 1rem;\n  --icon-width: 1rem;\n}\n\n:host(.clear-button) {\n  margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus,\n:host(.calendar-button) .button:focus {\n  box-shadow: none;\n}\n\n:host(.search-submit-button) .button:focus {\n  box-shadow: none;\n}\n\n:host(.search-submit-button) .button:not(:active):focus {\n  box-shadow: none;\n  background-color: var(--ic-action-default-bg-hover);\n}\n\n:host(.search-submit-button) {\n  display: flex;\n  align-items: center;\n  margin: 0 var(--ic-space-xxs);\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n  --icon-height: 0.875rem;\n  --icon-width: 0.875rem;\n}\n\n:host(.popout-menu-button) .button {\n  height: var(--height);\n  justify-content: left;\n  border-radius: 0;\n  white-space: pre-line;\n  text-align: start;\n}\n\n:host(.popout-menu-button) div.icon-container {\n  flex: none;\n}\n\n:host(.popout-menu-button) .button:focus {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n}\n\n.ic-button-describedby {\n  display: none;\n}\n\n:host .ic-tooltip {\n  display: block;\n}\n\n/** Dropdown **/\n:host .arrow-dropdown {\n  margin-top: auto;\n}\n\n:host .dropdown-expanded {\n  transform: rotate(180deg);\n  margin-bottom: var(--ic-space-xxxs);\n}\n\n:host(.dropdown-no-icon) .button {\n  padding-right: var(--ic-space-xs);\n}\n\n/** Slotted router item **/\nslot[name=\"router-item\"]::slotted(a) {\n  pointer-events: all;\n}\n\n::slotted(a) {\n  font-size: 0.875rem !important;\n  border: none !important;\n  vertical-align: middle !important;\n}\n\n:host(.white-background) ::slotted(a) {\n  background-color: var(--ic-architectural-white) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a) {\n  background-color: var(--button-default) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:hover) {\n  background-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-primary) ::slotted(a:active) {\n  background-color: var(--button-default-active) !important;\n}\n\n:host(.button-variant-primary.disabled) ::slotted(a),\n:host(.button-variant-destructive.disabled) ::slotted(a) {\n  background: var(--ic-architectural-200) !important;\n}\n\n:host(.button-variant-primary.light.disabled) ::slotted(a) {\n  background: var(--ic-architectural-600) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--button-default) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover) !important;\n  border-color: var(--button-default-hover) !important;\n}\n\n:host(.button-variant-secondary) ::slotted(a:active) {\n  border-color: var(--button-default-active) !important;\n  background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-secondary.disabled) ::slotted(a),\n:host(.button-variant-secondary.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.disabled) ::slotted(a),\n:host(.button-variant-tertiary.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-300) !important;\n  background: none !important;\n}\n\n:host(.button-variant-secondary.light.disabled) ::slotted(a),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-secondary.light.disabled) ::slotted(a:active),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:hover),\n:host(.button-variant-tertiary.light.disabled) ::slotted(a:active) {\n  border-color: var(--ic-architectural-500) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:hover),\n:host(.button-variant-icon) ::slotted(a:hover) {\n  background-color: var(--button-default-background-hover) !important;\n}\n\n:host(.button-variant-tertiary) ::slotted(a:active:not(:focus)),\n:host(.button-variant-tertiary) ::slotted(a:active:focus),\n:host(.button-variant-tertiary) ::slotted(a:active),\n:host(.button-variant-icon) ::slotted(a:active:not(:focus)) {\n  background-color: var(--button-default-background-active) !important;\n}\n\n:host(.button-variant-icon.disabled) ::slotted(a),\n:host(.button-variant-icon.disabled) ::slotted(a:hover),\n:host(.button-variant-icon.disabled) ::slotted(a:active) {\n  background: none !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a) {\n  background-color: var(--ic-action-destructive) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:hover) {\n  background-color: var(--ic-action-destructive-hover) !important;\n}\n\n:host(.button-variant-destructive) ::slotted(a:active) {\n  background-color: var(--ic-action-destructive-active) !important;\n}\n\n:host(.button-size-default) ::slotted(a) {\n  height: var(--height, 2.5rem) !important;\n  padding: var(--ic-space-xs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-small) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl)) !important;\n  padding: var(--ic-space-xxs) var(--ic-space-md) !important;\n}\n\n:host(.button-size-large) ::slotted(a) {\n  height: var(--height, var(--ic-space-xxl)) !important;\n  padding: var(--ic-space-sm) var(--ic-space-md) !important;\n}\n\n:host(.button-size-default.button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl)) !important;\n  padding: 0.375rem !important;\n}\n\n:host(.button-size-small.button-variant-icon) ::slotted(a) {\n  padding: var(--ic-space-xxs) !important;\n}\n\n:host(.button-size-large.button-variant-icon) ::slotted(a) {\n  padding: var(--ic-space-xs) !important;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  .button,\n  ::slotted(a) {\n    border: 0.125rem solid transparent !important;\n  }\n}\n\n/** Pagination **/\n\n:host(.flip) ::slotted(svg) {\n  transform: scaleX(-1);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  forceUpdate,\n  h,\n  Watch,\n} from \"@stencil/core\";\n\nimport {\n  getThemeFromContext,\n  inheritAttributes,\n  isSlotUsed,\n  removeDisabledFalse,\n  renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n  IcButtonTypes,\n  IcButtonVariants,\n  IcButtonTooltipPlacement,\n} from \"./ic-button.types\";\nimport {\n  IcSizes,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\n * @slot icon - Deprecated. This slot should not be used anymore. Use left-icon or right-icon slot instead.\n * @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n */\n@Component({\n  tag: \"ic-button\",\n  styleUrl: \"ic-button.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Button {\n  private buttonEl: HTMLElement;\n  private buttonIdNum = buttonIds++;\n  private hasTooltip: boolean = false;\n  private id: string;\n  private inheritedAttributes: { [k: string]: string } = {};\n  private describedbyEl: HTMLElement = null;\n  private describedById: string = null;\n  private mutationObserver: MutationObserver = null;\n  private hostMutationObserver: MutationObserver = null;\n  private routerSlot: HTMLElement;\n\n  @Element() el: HTMLIcButtonElement;\n\n  @State() ariaLabel: string = null;\n  @State() describedByContent: string = null;\n  @State() title: string = null;\n\n  /**\n   * If `fileUpload` is set to `true`, this is the accepted list of file types.\n   */\n  @Prop() accept?: string = \"*\";\n\n  /**\n   * The appearance of the button, e.g. dark, light, or the default.\n   */\n  @Prop({ mutable: true }) appearance?: IcThemeForeground = \"default\";\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaControlsId: string | boolean;\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaOwnsId: string | boolean;\n\n  /**\n   * If `true`, the button will be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n   */\n  @Prop() disableTooltip?: boolean = false;\n\n  /**\n   * If `true`, the user can save the linked URL instead of navigating to it.\n   */\n  @Prop() download?: string | boolean = false;\n\n  /**\n   * If `true`, the button will show a dropdown icon.\n   */\n  @Prop() dropdown?: boolean = false;\n\n  /**\n   * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n   */\n  @Prop({ mutable: true, reflect: true }) dropdownExpanded?: boolean = false;\n\n  /**\n   * If `true`, when the button is clicked the native file explorer will be launched.\n   */\n  @Prop() fileUpload?: boolean = false;\n\n  /**\n   * The name of the control for the file input, which is submitted with the form data.\n   */\n  @Prop() fileInputName: string = `ic-button-file-upload-input-${buttonIds++}`;\n\n  /**\n   * The <form> element to associate the button with.\n   */\n  @Prop() form?: string;\n\n  /**\n   * The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner.\n   */\n  @Prop() formaction?: string;\n\n  /**\n   * The way the submitted form data is encoded.\n   */\n  @Prop() formenctype?: string;\n\n  /**\n   * The HTTP method used to submit the form.\n   */\n  @Prop() formmethod?: string;\n\n  /**\n   * If `true`, the form will not be validated when submitted.\n   */\n  @Prop() formnovalidate?: boolean;\n\n  /**\n   * The place to display the response from submitting the form. It overrides the target attribute of the button's form owner.\n   */\n  @Prop() formtarget?: string;\n\n  /**\n   * If `true`, the button will fill the width of the container.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * The URL that the link points to. This will render the button as an \"a\" tag.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n\n  /**\n   * If `true`, the button will be in loading state.\n   */\n  @Prop() loading?: boolean = false;\n\n  /**\n   * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n   */\n  @Prop() multiple?: boolean = false;\n\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n\n  /**\n   * The list of the files that have been selected by a user.\n   */\n  @Prop() selectedFiles: FileList;\n\n  /**\n   * The size of the button to be displayed.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n\n  /**\n   * The position of the tooltip in relation to the button.\n   */\n  @Prop() tooltipPlacement?: IcButtonTooltipPlacement = \"bottom\";\n\n  /**\n   * If `true`, the secondary variant of button will have a transparent background rather than white.\n   */\n  @Prop() transparentBackground?: boolean = true;\n\n  /**\n   * The type of the button.\n   */\n  @Prop() type?: IcButtonTypes = \"button\";\n\n  /**\n   * The variant of the button to be displayed.\n   */\n  @Prop() variant?: IcButtonVariants = \"primary\";\n\n  /**\n   * Emitted when button has blur\n   */\n  @Event() icBlur!: EventEmitter<void>;\n\n  /**\n   * If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n   */\n  @Event() icFileSelection!: EventEmitter<FileList>;\n\n  /**\n   * Emitted when button has focus\n   */\n  @Event() icFocus!: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    if (this.mutationObserver !== null && this.mutationObserver !== undefined) {\n      this.mutationObserver.disconnect();\n    }\n    if (\n      this.hostMutationObserver !== null &&\n      this.hostMutationObserver !== undefined\n    ) {\n      this.hostMutationObserver.disconnect();\n    }\n  }\n\n  componentWillUpdate(): void {\n    if (this.loading) {\n      this.el.style.setProperty(\n        \"--min-width\",\n        `${this.el.getBoundingClientRect().width}px`\n      );\n    }\n    this.setHasTooltip();\n  }\n\n  componentWillLoad(): void {\n    const {\n      title,\n      \"aria-label\": ariaLabel,\n      ...restInheritedAttributes\n    } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n    this.title = title;\n    this.ariaLabel = ariaLabel;\n    this.inheritedAttributes = restInheritedAttributes;\n\n    removeDisabledFalse(this.disabled, this.el);\n\n    this.el.setAttribute(\"exportparts\", \"button\");\n\n    this.id = this.el.id || null;\n    this.setHasTooltip();\n\n    if (!this.hasTooltip) {\n      const describedById = this.inheritedAttributes[\"aria-describedby\"];\n      if (describedById !== undefined) {\n        this.describedById = describedById;\n        const el = this.el.parentElement.querySelector<HTMLElement>(\n          `#${describedById}`\n        );\n        if (el) {\n          this.describedByContent = el.innerText;\n          this.describedbyEl = el;\n        }\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    this.updateTheme();\n\n    if (typeof MutationObserver !== \"undefined\") {\n      if (this.describedById) {\n        this.mutationObserver = new MutationObserver(this.mutationCallback);\n        this.mutationObserver.observe(this.describedbyEl, {\n          characterData: true,\n          childList: true,\n          subtree: true,\n        });\n      }\n\n      this.hostMutationObserver = new MutationObserver(\n        this.hostMutationCallback\n      );\n      this.hostMutationObserver.observe(this.el, {\n        attributes: true,\n      });\n    }\n  }\n\n  componentWillRender(): void {\n    const iconEl = this.hasIconSlot(\"left\")\n      ? this.el.querySelector(`[slot=\"left-icon\"]`)\n      : this.hasIconSlot(\"right\")\n      ? this.el.querySelector(`[slot=\"right-icon\"]`)\n      : null;\n    iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n  }\n\n  @Listen(\"click\", { capture: true })\n  handleHostClick(event: Event): void {\n    if (!this.hasRouterSlot()) {\n      if (this.fileUpload) {\n        renderFileHiddenInput(\n          this.icFileSelection,\n          this.el,\n          this.multiple,\n          this.fileInputName,\n          this.selectedFiles,\n          this.disabled,\n          this.accept\n        );\n      }\n      if (this.disabled || this.loading) {\n        event.stopImmediatePropagation();\n      }\n      if (this.dropdown) {\n        this.dropdownExpanded = !this.dropdownExpanded;\n      }\n    }\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n    this.updateTheme(detail.mode);\n  }\n\n  /**\n   * Sets focus on the native `button`.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.buttonEl?.focus();\n  }\n\n  private 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 onFocus = () => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.icBlur.emit();\n  };\n\n  private updateTheme(newTheme: IcThemeForeground = null): void {\n    const foregroundColor = getThemeFromContext(this.el, newTheme);\n\n    if (foregroundColor !== IcThemeForegroundEnum.Default) {\n      this.appearance = foregroundColor;\n    }\n  }\n\n  // triggered when text content of sibling element in light DOM changes\n  private mutationCallback = (): void => {\n    this.describedByContent = this.describedbyEl.innerText;\n  };\n\n  // triggered when attributes of host element change\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(({ attributeName }) => {\n      const attribute = this.el.getAttribute(attributeName);\n      if (attributeName === \"title\") this.title = attribute;\n      else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n      if (IC_INHERITED_ARIA.includes(attributeName)) {\n        this.inheritedAttributes[attributeName] = attribute;\n        forceComponentUpdate = true;\n      }\n    });\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  private setHasTooltip = (): void => {\n    this.hasTooltip =\n      !this.disableTooltip && (!!this.title || this.variant === \"icon\");\n  };\n\n  render() {\n    const TagType = (this.href && \"a\") || \"button\";\n    const { title, ariaLabel, inheritedAttributes } = this;\n    const buttonAttrs =\n      TagType === \"button\"\n        ? {\n            type: this.type,\n            disabled: this.disabled,\n            form: this.form,\n            formaction: this.formaction,\n            formenctype: this.formenctype,\n            formmethod: this.formmethod,\n            formnovalidate: this.formnovalidate,\n            formtarget: this.formtarget,\n          }\n        : {\n            download: this.download !== false ? this.download : null,\n            href: this.href,\n            rel: this.rel,\n            target: this.target,\n            referrerpolicy: this.referrerpolicy,\n            hreflang: this.hreflang,\n          };\n\n    let describedby: string = null;\n    let buttonId: string = null;\n    if (this.hasTooltip) {\n      buttonId =\n        this.id !== null\n          ? `ic-button-with-tooltip-${this.id}`\n          : `ic-button-with-tooltip-${this.buttonIdNum}`;\n      describedby =\n        this.variant === \"icon\" && !!ariaLabel\n          ? null\n          : `ic-tooltip-${buttonId}`;\n    } else {\n      describedby = this.describedById;\n    }\n\n    const ButtonContent = () => {\n      return (\n        <TagType\n          class=\"button\"\n          aria-disabled={this.loading || this.disabled ? \"true\" : null}\n          aria-label={this.loading ? \"Loading\" : ariaLabel}\n          aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n          {...buttonAttrs}\n          {...inheritedAttributes}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n          ref={(el) => (this.buttonEl = el)}\n          aria-describedby={describedby}\n          part=\"button\"\n        >\n          {this.hasIconSlot() && !this.loading && (\n            <div class=\"icon-container\">\n              <slot name=\"icon\" />\n            </div>\n          )}\n          {this.hasIconSlot(\"left\") && !this.loading && (\n            <div class=\"icon-container\">\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          {this.hasIconSlot(\"top\") &&\n            !this.hasIconSlot(\"left\") &&\n            !this.hasIconSlot(\"right\") &&\n            !this.loading && (\n              <div class=\"icon-container\">\n                <slot name=\"top-icon\" />\n              </div>\n            )}\n          {this.loading ? (\n            <div class=\"loading-container\">\n              <ic-loading-indicator\n                type=\"linear\"\n                appearance={\n                  this.variant === \"primary\" ||\n                  this.variant === \"destructive\" ||\n                  this.appearance === IcThemeForegroundEnum.Dark ||\n                  this.appearance === IcThemeForegroundEnum.Light\n                    ? \"light\"\n                    : \"dark\"\n                }\n              ></ic-loading-indicator>\n            </div>\n          ) : (\n            <slot />\n          )}\n          {this.hasIconSlot(\"right\") && !this.loading && !this.dropdown && (\n            <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n              <slot name=\"right-icon\" />\n            </div>\n          )}\n          {this.dropdown &&\n            !this.loading &&\n            this.variant !== \"icon\" &&\n            this.variant !== \"destructive\" && (\n              <span\n                class={{\n                  [\"arrow-dropdown\"]: !this.dropdownExpanded,\n                  [\"dropdown-expanded\"]: this.dropdownExpanded,\n                }}\n                innerHTML={arrowDropdown}\n              />\n            )}\n        </TagType>\n      );\n    };\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: this.disabled && !this.loading,\n          [`button-variant-${this.variant}`]: true,\n          [`button-size-${this.size}`]: true,\n          [\"loading\"]: this.loading,\n          [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n          [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n          [\"full-width\"]: this.fullWidth,\n          [\"with-badge\"]: isSlotUsed(this.el, \"badge\"),\n          [\"dropdown-no-icon\"]:\n            this.dropdown &&\n            !isSlotUsed(this.el, \"icon\") &&\n            !isSlotUsed(this.el, \"left-icon\"),\n          [\"top-icon\"]: isSlotUsed(this.el, \"top-icon\"),\n          [\"white-background\"]:\n            this.variant === \"secondary\" &&\n            !this.transparentBackground &&\n            this.appearance !== \"light\",\n        }}\n        onClick={this.handleClick}\n        aria-owns={this.ariaOwnsId}\n        aria-controls={this.ariaControlsId}\n        aria-expanded={this.dropdown && `${this.dropdownExpanded}`}\n      >\n        {this.hasTooltip && (\n          <ic-tooltip\n            id={describedby}\n            label={title || ariaLabel}\n            target={buttonId}\n            placement={this.tooltipPlacement}\n            silent={this.variant === \"icon\" && !!ariaLabel}\n          >\n            {this.hasRouterSlot() ? (\n              <slot name=\"router-item\"></slot>\n            ) : (\n              <ButtonContent />\n            )}\n          </ic-tooltip>\n        )}\n        {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n        {!this.hasTooltip &&\n          (this.hasRouterSlot() ? (\n            <slot name=\"router-item\"></slot>\n          ) : (\n            <ButtonContent />\n          ))}\n        {this.describedByContent && (\n          <span id={describedby} class=\"ic-button-describedby\">\n            {this.describedByContent}\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --circular-diameter: Diameter of the circular-indicator\n   */\n\n  display: block;\n\n  --linear-border-radius: 0.25rem;\n  --inner-color: var(--ic-action-default);\n  --outer-color: var(--ic-architectural-100);\n  --label-color: var(--ic-color-primary-text);\n  --margin: none;\n  --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.light) {\n  --inner-color: var(--ic-architectural-white);\n  --outer-color: var(--ic-architectural-800);\n  --label-color: var(--ic-architectural-white);\n}\n\n.ic-loading-container {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n:host([size=\"small\"]) {\n  --circular-diameter: 2.5rem;\n  --linear-line-height: var(--ic-space-xxs);\n}\n\n:host([size=\"default\"]) {\n  --circular-diameter: 5rem;\n}\n\n:host([size=\"large\"]) {\n  --circular-diameter: 7.5rem;\n}\n\n:host([size=\"icon\"]) {\n  display: inline-block;\n\n  --margin: var(--ic-space-xxxs);\n  --circular-diameter: 1.25rem;\n}\n\n:host(.label) {\n  --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n  color: var(--label-color);\n  margin-left: var(--label-margin-left);\n}\n\n.ic-loading-circular-outer {\n  height: var(--circular-diameter);\n  width: var(--circular-diameter);\n}\n\n.ic-loading-circular-outer.indeterminate {\n  animation: circular-animation 1s linear;\n  animation-iteration-count: infinite;\n}\n\n@keyframes circular-animation {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.ic-loading-circular-outer,\n.ic-loading-linear-outer {\n  margin: var(--margin);\n}\n\n.ic-loading-linear-outer {\n  background-color: var(--outer-color);\n  height: var(--linear-line-height);\n  width: 100%;\n  border-radius: var(--linear-border-radius);\n  overflow: hidden;\n}\n\n.ic-loading-linear-inner {\n  position: relative;\n  height: 100%;\n  background-color: var(--inner-color);\n  border-radius: var(--linear-border-radius);\n}\n\n.indeterminate > .ic-loading-linear-inner {\n  animation: linear-animation 2s infinite;\n}\n\n.determinate > .ic-loading-linear-inner {\n  transition: width 0.5s;\n  width: var(--linear-width);\n}\n\n:host(.full-width) {\n  --linear-border-radius: none;\n}\n\n@keyframes linear-animation {\n  0% {\n    width: 0%;\n    left: -1%;\n  }\n\n  25% {\n    width: 0%;\n    left: -1%;\n  }\n\n  50% {\n    width: 101%;\n    left: -1%;\n  }\n\n  75% {\n    width: 0%;\n    left: 101%;\n  }\n\n  100% {\n    width: 0%;\n    left: 101%;\n  }\n}\n\n.ic-loading-circular-svg {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  transform: rotate(-90deg);\n}\n\n.ic-loading-circular-svg circle {\n  width: 100%;\n  height: 100%;\n  fill: none;\n  stroke: var(--compact-step-outer-color, var(--outer-color));\n  stroke-width: var(--circular-line-width);\n  stroke-linecap: round;\n}\n\n/* --stroke-dash-array calculated via dashArray method */\n.ic-loading-circular-svg circle:nth-child(2) {\n  --circular-indeterminate: calc(\n    (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n  );\n\n  stroke-dasharray: var(--stroke-dasharray), var(--stroke-dasharray);\n  stroke-dashoffset: var(--stroke-dashoffset, var(--circular-indeterminate));\n  stroke: var(--compact-step-inner-color, var(--inner-color));\n}\n\n:host(.inner-label) .ic-loading-circular-inner {\n  display: grid;\n}\n\n:host(.inner-label) .ic-loading-circular-svg,\n.inner-text {\n  grid-column: 1;\n  grid-row: 1;\n}\n\n:host(.not-required.compact-step-progress-indicator)\n  .ic-loading-circular-svg\n  circle:nth-child(2) {\n  stroke: var(--ic-architectural-300);\n}\n\n.inner-text {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--ic-space-lg);\n  height: inherit;\n  overflow: hidden;\n  margin: auto;\n  color: var(--compact-step-inner-color, var(--ic-status-info));\n}\n\n:host(.not-required.compact-step-progress-indicator) .inner-text {\n  color: var(--ic-color-tertiary-text);\n}\n\n:host(.light.not-required.compact-step-progress-indicator) .inner-text {\n  color: var(--ic-architectural-400);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  .indeterminate > .ic-loading-circular-inner {\n    forced-color-adjust: none;\n  }\n\n  .ic-loading-linear-outer {\n    border: var(--ic-hc-border);\n  }\n\n  .ic-loading-linear-inner {\n    background-color: canvastext;\n  }\n\n  .ic-loading-circular-svg circle {\n    stroke: Background;\n  }\n\n  .ic-loading-circular-svg circle:nth-child(2) {\n    stroke: canvastext;\n  }\n\n  :host(.not-required.compact-step-progress-indicator)\n    .ic-loading-circular-svg\n    circle:nth-child(2) {\n    stroke: GrayText;\n  }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport {\n  IcLoadingCircleXYR,\n  IcLoadingSizes,\n  IcLoadingTypes,\n} from \"./ic-loading-indicator.types\";\nimport {\n  IcThemeForegroundEnum,\n  IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\nimport { isPropDefined } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-loading-indicator\",\n  styleUrl: \"ic-loading-indicator.css\",\n  shadow: true,\n})\nexport class LoadingIndicator {\n  private circularMeter: SVGCircleElement;\n  private innerElement?: HTMLDivElement;\n  private interval: ReturnType<typeof setInterval>;\n  private labelList: string[];\n  private outerElement?: HTMLDivElement;\n\n  @Element() el: HTMLIcLoadingIndicatorElement;\n\n  @State() circularDiameter: number;\n  @State() circularLineWidth: number;\n  @State() indeterminate: boolean;\n  @State() indicatorLabel: string;\n  @State() showSecond: boolean = false;\n\n  /**\n   * The appearance of the loading indicator, e.g. dark or light.\n   */\n  @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n  /**\n   * The description that will be set as the aria-label of the loading indicator when not using a visible label.\n   */\n  @Prop() description?: string = \"Loading\";\n\n  /**\n   * If `true`, when linear, the full-width variant (i.e. without a border radius) will be displayed.\n   */\n  @Prop({ reflect: true }) fullWidth?: boolean = false;\n\n  /**\n   * @internal The step number of a compact step, managed by ic-step.\n   */\n  @Prop() innerLabel?: number;\n\n  /**\n   * The time in milliseconds before the label changes.\n   */\n  @Prop() labelDuration?: number = 8000;\n\n  /**\n   * The maximum value that the progress value can take.\n   * Used to calculate the proportional width of the progress bar.\n   */\n  @Prop() max?: number = 100;\n\n  /**\n   * The minimum value that the progress value can take.\n   * Used to calculate the proportional width of the progress bar.\n   */\n  @Prop() min?: number = 0;\n\n  /**\n   * The size of the loading indicator.\n   */\n  @Prop({ reflect: true }) size?: IcLoadingSizes = \"default\";\n\n  /**\n   * The type of indicator, either linear or circular.\n   */\n  @Prop({ reflect: true }) type?: IcLoadingTypes = \"circular\";\n\n  /**\n   * The label to be displayed beneath the loading indicator.\n   * Display a changing label by separating multiple messages with forward slashes.\n   */\n  @Prop() label?: string;\n\n  @Watch(\"label\")\n  watchPropHandler(): void {\n    this.updateLabel();\n  }\n\n  /**\n   * The current amount of progress made.\n   * If not provided, component acts as an indeterminate loading indicator.\n   */\n  @Prop() progress?: number;\n\n  @Watch(\"progress\")\n  watchProgressHandler(): void {\n    if (this.type === \"circular\") {\n      this.updateCircularProgressMeter();\n    }\n  }\n\n  disconnectedCallback(): void {\n    clearInterval(this.interval);\n  }\n\n  componentWillLoad(): void {\n    this.indeterminate = this.progress === undefined;\n    this.updateLabel();\n    this.el.setAttribute(\"exportparts\", \"ic-loading-container\");\n  }\n\n  componentDidLoad(): void {\n    if (this.type === \"circular\") {\n      this.setCircleLineWidth();\n      this.circularMeter = this.el.shadowRoot.querySelector(\n        \".ic-loading-circular-svg circle:nth-child(2)\"\n      );\n      this.updateCircularProgressMeter();\n    }\n\n    if (Number(this.progress) >= 0 && this.type === \"linear\") {\n      this.setLinearDeterminateWidth();\n    }\n  }\n\n  componentWillUpdate(): void {\n    this.indeterminate = this.progress === undefined;\n  }\n\n  componentDidUpdate(): void {\n    if (Number(this.progress) >= 0 && this.type === \"linear\") {\n      this.setLinearDeterminateWidth();\n    }\n  }\n\n  private updateCircularProgressMeter = () => {\n    if (!this.indeterminate) {\n      this.circularMeter.style.setProperty(\n        \"--progress-value\",\n        String(this.progress)\n      );\n    }\n  };\n\n  private getLabel = (\n    labelIndex: number,\n    setLabel: (label: string) => void\n  ) => {\n    return new Promise(() => {\n      this.interval = setInterval(() => {\n        if (labelIndex < this.labelList.length - 1) {\n          labelIndex++;\n        } else {\n          labelIndex = 0;\n        }\n        setLabel(this.labelList[labelIndex]);\n      }, this.labelDuration);\n    });\n  };\n\n  private getLabelVariant = () => {\n    let variant: \"label\" | \"h4\" | \"h2\" = \"h4\";\n    const width = this.outerElement?.offsetWidth;\n    if (this.size === \"small\" || (this.type === \"circular\" && width < 60)) {\n      variant = \"label\";\n    } else if (\n      this.size === \"large\" ||\n      (this.type === \"circular\" && width >= 120)\n    ) {\n      variant = \"h2\";\n    }\n    return variant;\n  };\n\n  // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n  private setCircleLineWidth = () => {\n    const { offsetWidth: width } = this.outerElement;\n\n    const compactStepCircularLineWidth = this.el.classList.contains(\n      \"compact-step-progress-indicator\"\n    )\n      ? 40\n      : 0;\n    const toastDismissTimerCircularLineWidth = this.el.classList.contains(\n      \"toast-dismiss-timer\"\n    )\n      ? 20\n      : 0;\n\n    if (\n      width ||\n      compactStepCircularLineWidth ||\n      toastDismissTimerCircularLineWidth\n    ) {\n      this.circularLineWidth =\n        (compactStepCircularLineWidth ||\n          toastDismissTimerCircularLineWidth ||\n          width) * 0.1;\n      this.circularDiameter =\n        compactStepCircularLineWidth ||\n        toastDismissTimerCircularLineWidth ||\n        width;\n      this.outerElement.style.setProperty(\n        \"--circular-line-width\",\n        `${this.circularLineWidth}px`\n      );\n    }\n  };\n\n  private setLinearDeterminateWidth = () => {\n    if (!this.innerElement) return;\n    // Ensure progress cannot be out of bounds\n\n    const progress = Math.min(this.max, Math.max(this.min, this.progress));\n    const proportion = (progress - this.min) / (this.max - this.min);\n    this.showSecond = proportion > 0.5;\n    if (this.showSecond) {\n      this.innerElement.classList.remove(\"clip\");\n    } else {\n      this.innerElement.classList.add(\"clip\");\n    }\n    this.innerElement.style.setProperty(\n      \"--linear-width\",\n      `${proportion * 100}%`\n    );\n  };\n\n  private calcOuterClass = (): string => {\n    let cls = `ic-loading-${this.type}-outer`;\n    cls += this.indeterminate ? \" indeterminate\" : \" determinate\";\n    return cls;\n  };\n\n  private updateLabel = (): void => {\n    if (isPropDefined(this.label)) {\n      this.labelList = this.label.split(\"/\");\n      const labelIndex = 0;\n      this.indicatorLabel = this.labelList[labelIndex];\n      if (this.labelList.length > 1) {\n        this.getLabel(labelIndex, (label) => {\n          this.indicatorLabel = label;\n        });\n      }\n    }\n  };\n\n  private setCircleXY = (): IcLoadingCircleXYR => {\n    if (this.circularDiameter > 0) {\n      const r = this.circularDiameter / 2;\n      const x = r;\n      const y = r;\n      const nextRadius = r - this.circularLineWidth / 2;\n      this.setDashSteps(nextRadius);\n\n      return { x, y, r: nextRadius };\n    }\n    return { x: 0, y: 0, r: 0 };\n  };\n\n  private setDashSteps = (radius: number) => {\n    const dashArray = 2 * Math.PI * radius;\n    const progress = Math.min(Math.max(this.progress, this.min), this.max);\n    const proportion = -1 - (progress - this.min) / (this.max - this.min);\n\n    this.circularMeter.style.setProperty(\n      \"--stroke-dasharray\",\n      `${dashArray}px`\n    );\n\n    if (!this.indeterminate) {\n      this.circularMeter.style.setProperty(\n        \"--circular-steps-max\",\n        String(this.max)\n      );\n      this.circularMeter.style.setProperty(\n        \"--stroke-dashoffset\",\n        `${proportion * dashArray}px`\n      );\n    }\n  };\n\n  render() {\n    const { appearance, label, description, size, fullWidth, innerLabel } =\n      this;\n    const { x, y, r } = this.setCircleXY();\n\n    return (\n      <Host\n        class={{\n          [\"light\"]: appearance === IcThemeForegroundEnum.Light,\n          [\"label\"]: !!label,\n          [\"full-width\"]: fullWidth,\n          [\"inner-label\"]: !!innerLabel,\n        }}\n      >\n        <div class=\"ic-loading-container\" part=\"ic-loading-container\">\n          <div\n            ref={(el) => (this.outerElement = el as HTMLDivElement)}\n            class={this.calcOuterClass()}\n            role=\"progressbar\"\n            aria-labelledby={\n              this.label && this.size !== \"icon\" && \"ic-loading-label\"\n            }\n            aria-label={description}\n            aria-valuenow={this.progress}\n            aria-valuemin={this.min}\n            aria-valuemax={this.max}\n          >\n            <div\n              ref={(el) => (this.innerElement = el as HTMLDivElement)}\n              class={`ic-loading-${this.type}-inner`}\n            >\n              {this.innerLabel &&\n                this.innerLabel !== undefined &&\n                this.size === \"small\" && (\n                  <ic-typography variant=\"subtitle-small\" class=\"inner-text\">\n                    {this.innerLabel}\n                  </ic-typography>\n                )}\n              {this.type === \"circular\" && (\n                <svg\n                  class=\"ic-loading-circular-svg\"\n                  viewBox={`0 0 ${this.circularDiameter || 0} ${\n                    this.circularDiameter || 0\n                  }`}\n                >\n                  <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n                  <circle cx={`${x}`} cy={`${y}`} r={`${r}`}></circle>\n                </svg>\n              )}\n            </div>\n          </div>\n          {label && size !== \"icon\" && (\n            <ic-typography\n              id=\"ic-loading-label\"\n              class=\"ic-loading-label\"\n              role=\"status\"\n              variant={this.getLabelVariant()}\n            >\n              <p>{this.indicatorLabel}</p>\n            </ic-typography>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-tooltip: z-index of tooltip\n */\n\n:host(.ic-tooltip) {\n  width: max-content;\n  height: max-content;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container {\n  background-color: var(--ic-architectural-800);\n  color: #ffff;\n  text-align: center;\n  padding: var(--ic-space-xxxs) var(--ic-space-xs);\n  border-radius: var(--ic-border-radius);\n  border: var(--ic-border-width) solid var(--ic-architectural-40);\n  position: absolute;\n  max-width: 20rem;\n  display: none;\n  z-index: var(--ic-z-index-tooltip);\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed))\n  .ic-tooltip-container,\n:host(.tooltip-disabled) .ic-tooltip-container {\n  display: none !important;\n}\n\n:host(.tooltip-long-label-navigation-item-side-nav-expanded)\n  .ic-tooltip-container[data-show] {\n  display: block !important;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow,\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n  position: absolute;\n  background: inherit;\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow {\n  visibility: hidden;\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n}\n\n:host(.ic-tooltip) .ic-tooltip-arrow::before {\n  visibility: visible;\n  content: \"\";\n  border: var(--ic-border-width) solid var(--ic-architectural-40);\n  width: 100%;\n  height: 100%;\n}\n\n:host(.ic-tooltip) .ic-tooltip-container[data-show] {\n  display: block;\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"top\"]\n  > .ic-tooltip-arrow {\n  height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"top\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: 0 0 var(--ic-border-radius) var(--ic-border-radius);\n  left: 0;\n  top: var(--ic-space-xxxs);\n  border-top: 0;\n  transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n  > .ic-tooltip-arrow {\n  top: calc(-1 * var(--ic-space-xxs));\n  height: var(--ic-space-xxxs);\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"bottom\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: var(--ic-border-radius) var(--ic-border-radius) 0 0;\n  left: 0;\n  top: var(--ic-space-1px);\n  border-bottom: 0;\n  transform: translateX(var(--tooltip-arrow-translate));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"left\"]\n  > .ic-tooltip-arrow {\n  width: var(--ic-space-xxxs);\n  right: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"left\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: 0 var(--ic-border-radius) var(--ic-border-radius) 0;\n  border-left: 0;\n  top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"right\"]\n  > .ic-tooltip-arrow {\n  width: var(--ic-space-xxxs);\n  left: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-tooltip)\n  .ic-tooltip-container[data-popper-placement^=\"right\"]\n  > .ic-tooltip-arrow::before {\n  border-radius: var(--ic-border-radius) 0 0 var(--ic-border-radius);\n  border-right: 0;\n  top: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.on-dialog) .ic-tooltip-container {\n  transform: translate(\n    var(--tooltip-translate-x),\n    var(--tooltip-translate-y)\n  ) !important;\n}\n\n@media screen and (max-width: 576px) {\n  :host(.ic-tooltip) .ic-tooltip-container {\n    max-width: 18.875rem;\n  }\n}\n\n@media (forced-colors: active) {\n  :host(.ic-tooltip) .ic-tooltip-container,\n  :host(.ic-tooltip) .ic-tooltip-arrow::before {\n    border: var(--ic-hc-border);\n  }\n}\n","import { Component, Element, Host, Prop, h, Method } from \"@stencil/core\";\nimport { Instance, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-tooltip\",\n  styleUrl: \"ic-tooltip.css\",\n  shadow: true,\n})\nexport class Tooltip {\n  private arrow: HTMLDivElement;\n  private delayedHideEvents = [\"mouseleave\"];\n  private dialogOverflow = false;\n  private icDialogEl: HTMLIcDialogElement;\n  private instantHideEvents = [\"focusout\"];\n  private mouseOverTool: boolean = false;\n  private persistTooltip = false;\n  private popperInstance: Instance;\n  private onDialog: boolean = false;\n  private showEvents = [\n    !this.disableHover && \"mouseenter\",\n    !this.disableHover && \"focusin\",\n    !this.disableClick && \"click\",\n  ];\n  private toolTip: HTMLDivElement;\n\n  @Element() el: HTMLIcTooltipElement;\n\n  /**\n   * @internal If `true`, the tooltip will not be displayed on click, it will require hover or using the display method.\n   */\n  @Prop() disableClick?: boolean = false;\n\n  /**\n   * If `true`, the tooltip will not be displayed on hover, it will require a click.\n   */\n  @Prop() disableHover?: boolean = false;\n\n  /**\n   * The number of lines to display before truncating the text.\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * The position of the tooltip in relation to the parent element.\n   */\n  @Prop({ mutable: true }) placement?: IcTooltipPlacements = \"bottom\";\n\n  /**\n   * @internal Sets the tooltip to aria-hidden, when used as part of components that are already announced.\n   */\n  @Prop() silent?: boolean = false;\n\n  /**\n   * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n   */\n  @Prop({ reflect: true }) target?: string;\n\n  /**\n   * The text to display on the tooltip.\n   */\n  @Prop() label!: string;\n\n  disconnectedCallback(): void {\n    this.manageEventListeners(\"remove\");\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  }\n\n  componentDidLoad(): void {\n    this.manageEventListeners(\"add\");\n\n    this.icDialogEl = this.el.closest(\"ic-dialog\");\n    this.dialogOverflow =\n      this.icDialogEl?.getAttribute(\"data-overflow\") === \"true\";\n\n    this.onDialog = this.icDialogEl !== null;\n\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Tooltip\"\n    );\n  }\n\n  componentDidRender(): void {\n    const typographyEl = this.el.shadowRoot.querySelector(\n      \".ic-tooltip-container > ic-typography\"\n    );\n    this.maxLines > 0 &&\n      typographyEl.setAttribute(\n        \"style\",\n        `--truncation-max-lines: ${this.maxLines}`\n      );\n  }\n  /**\n   * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n   * @param show Whether to show or hide the tooltip\n   * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n   */\n  @Method()\n  async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n    this.persistTooltip = persistTooltip;\n    show ? this.show() : this.hide();\n  }\n\n  private getTooltipTranslate = (dialogEl: DOMRect) => {\n    const child = this.el.children[0].getBoundingClientRect();\n    let tooltipX;\n    let tooltipY;\n    switch (this.placement) {\n      case \"bottom\":\n        tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"bottom-start\":\n        tooltipX = child.left - dialogEl.left;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"bottom-end\":\n        tooltipX = child.right - dialogEl.right;\n        tooltipY = child.bottom - dialogEl.top;\n        break;\n      case \"top\":\n        tooltipX = child.left - dialogEl.left - 0.5 * child.width;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"top-start\":\n        tooltipX = child.left - dialogEl.left;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"top-end\":\n        tooltipX = child.right - dialogEl.right;\n        tooltipY = child.top - dialogEl.bottom;\n        break;\n      case \"left\":\n      case \"left-start\":\n        tooltipX = child.right - dialogEl.right - child.width;\n        tooltipY = child.bottom - dialogEl.top - child.height;\n        break;\n      case \"left-end\":\n        tooltipX = child.right - dialogEl.right - child.width;\n        tooltipY = child.top - dialogEl.bottom + child.height;\n        break;\n      case \"right\":\n      case \"right-start\":\n        tooltipX = child.left - dialogEl.left + child.width;\n        tooltipY = child.bottom - dialogEl.top - child.height;\n        break;\n      case \"right-end\":\n        tooltipX = child.left - dialogEl.left + child.width;\n        tooltipY = child.top - dialogEl.bottom + child.height;\n        break;\n    }\n    if (this.dialogOverflow && tooltipX < 0) {\n      if (this.placement.includes(\"top\") || this.placement.includes(\"bottom\")) {\n        this.toolTip.style.setProperty(\n          \"--tooltip-arrow-translate\",\n          `${tooltipX}px`\n        );\n        tooltipX = child.left - dialogEl.left;\n      }\n      if (this.placement.includes(\"left\")) {\n        this.placement = \"right\";\n        tooltipX = child.left - dialogEl.left + child.width;\n      }\n    }\n\n    this.toolTip.style.setProperty(\"--tooltip-translate-x\", `${tooltipX}px`);\n    this.toolTip.style.setProperty(\"--tooltip-translate-y\", `${tooltipY}px`);\n  };\n\n  private show = () => {\n    if (this.label) {\n      this.toolTip.setAttribute(\"data-show\", \"\");\n\n      if (this.onDialog) {\n        this.el.classList.add(\"on-dialog\");\n        const dialogEl = this.icDialogEl.shadowRoot\n          .querySelector(\"dialog\")\n          .getBoundingClientRect();\n\n        this.getTooltipTranslate(dialogEl);\n      }\n\n      this.popperInstance = createPopper(this.el, this.toolTip, {\n        placement: this.placement,\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 10],\n            },\n          },\n          {\n            name: \"arrow\",\n            options: {\n              element: this.arrow,\n            },\n          },\n          {\n            name: \"eventListeners\",\n            options: { scroll: false, resize: false },\n          },\n        ],\n      });\n    } else {\n      console.warn(`Tooltip can't display without prop 'label' set`);\n    }\n  };\n\n  private hide = () => {\n    this.toolTip.removeAttribute(\"data-show\");\n    this.persistTooltip = false;\n  };\n\n  private checkCloseTooltip = () => {\n    setTimeout(() => {\n      if (!this.mouseOverTool && !this.persistTooltip) {\n        this.hide();\n      }\n    }, 100);\n  };\n\n  private mouseEnterTooltip = () => {\n    this.mouseOverTool = true;\n  };\n\n  private mouseLeaveTooltip = () => {\n    this.mouseOverTool = false;\n    this.checkCloseTooltip();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && !this.persistTooltip) {\n      this.hide();\n    }\n  };\n\n  private manageEventListeners = (action: \"add\" | \"remove\") => {\n    const method =\n      action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n    this.showEvents.forEach((event) => {\n      this.el[method](event, this.show);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseEnterTooltip);\n      }\n    });\n\n    if (!this.persistTooltip) {\n      this.instantHideEvents.forEach((event) => {\n        this.el[method](event, this.hide);\n      });\n    }\n\n    this.delayedHideEvents.forEach((event) => {\n      this.el[method](event, this.checkCloseTooltip);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseLeaveTooltip);\n      }\n    });\n\n    document[method](\"keydown\", this.handleKeyDown);\n  };\n\n  render() {\n    const { label, maxLines, silent } = this;\n    return (\n      <Host class={{ \"ic-tooltip\": true }}>\n        <div\n          ref={(el) => (this.toolTip = el as HTMLDivElement)}\n          role=\"tooltip\"\n          class=\"ic-tooltip-container\"\n          aria-hidden={`${silent}`}\n        >\n          <ic-typography maxLines={maxLines} variant=\"caption\">\n            {label}\n          </ic-typography>\n          <div\n            ref={(el) => (this.arrow = el as HTMLDivElement)}\n            class=\"ic-tooltip-arrow\"\n          ></div>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-c59c733e.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as i,H as s,g as e}from"./p-6b5e91e2.js";import{F as h,f as l}from"./p-063587c6.js";import"./p-26b7b18f.js";const p=":host{display:flex;width:100%}.step-item-list{display:flex;margin:0;padding:0}:host(.default:not(.aligned-left)) .step-item-list{flex:auto}:host(.compact) ul ::slotted(ic-step){display:none}:host(.compact) ul ::slotted(ic-step.show){display:flex}:host(.compact) ul ::slotted(ic-step.hide){display:none;opacity:0;visibility:hidden}";const a=class{constructor(i){t(this,i);this.resizeObserver=null;this.visuallyHidden="visually-hidden";this.getChildren=()=>{this.steps=Array.from(this.el.querySelectorAll("ic-step"));this.stepsWithStepTitles=Array.from(this.el.querySelectorAll("ic-step[step-title]"))};this.checkStepTitles=()=>{if(this.stepsWithStepTitles.length<this.steps.length&&this.variantOverride&&this.variant==="compact"){this.noOfResizes=this.noOfResizes+1;if(this.noOfResizes===1){console.error(`The prop 'step-title' (web components) / 'stepTitle' (react) is required for all steps of the Stepper component (compact variant)`)}}};this.setStepTypes=()=>{this.getChildren();this.stepTypes=[];for(let t=0;t<this.steps.length;t++){this.stepTypes.push("active")}};this.setStepperWidth=()=>{this.alignedFullWidth=this.variant==="default"&&this.aligned==="full-width";const t=this.steps[this.steps.length-1];t.style.maxWidth="none";if(this.alignedFullWidth){this.stepperWidth=this.el.offsetWidth;t.style.maxWidth=h(`${this.stepperWidth/this.steps.length}px`);this.lastStepWidth=t.offsetWidth}};this.initialiseStepStates=()=>{this.steps.forEach(((t,i)=>{t.variant=this.variant;t.stepNum=i+1;t.lastStep=i===this.steps.length-1;t.lastStepNum=this.steps.length;if(t.stepType!=="current"){t.current=false;this.stepTypes[i]=t.stepType}else{t.current=true}const s=t.shadowRoot&&t.shadowRoot.querySelector(".step > .step-title-area");if(this.stepsWithStepTitles.length==0&&this.variantOverride){if(this.variant==="compact"){this.autoSetStepTitles=true;if(this.autoSetStepTitles){t.stepTitle="Step "+t.stepNum;s&&s.querySelector(".step-title").setAttribute("aria-hidden","true")}}if(this.variant==="default"){this.autoSetStepTitles=false;if(!this.autoSetStepTitles){t.stepTitle=undefined;s&&s.querySelector(".step-title").removeAttribute("aria-hidden")}}}if(this.variant==="compact"){if(t.current===true||t.stepType==="current"){t.classList.remove("hide");t.classList.add("show")}else if(t.classList.contains("show")){t.classList.remove("show");t.classList.add("hide")}if(!t.lastStep){t.nextStepTitle=this.steps[i+1].stepTitle;t.progress=t.stepNum/this.steps.length*100}else if(t.lastStep&&this.stepTypes[i]!=="completed"){t.progress=95}else{t.progress=100}if(this.hideStepInfo&&s!==null){s.classList.remove(this.visuallyHidden)}t.compactStepStyling=this.stepTypes[i]}if(this.variant==="default"){if(!t.lastStep){if(this.alignedFullWidth){t.style.width=h(`${(this.stepperWidth-this.lastStepWidth)/(this.steps.length-1)}px`);t.style.minWidth=h("148px")}}else if(t.lastStep){t.classList.add("last-step");if(this.alignedFullWidth){t.style.maxWidth=`${this.lastStepWidth}px`}else{t.style.maxWidth=this.connectorWidth>100?h(`${this.connectorWidth+48}px`):h("148px")}}if(this.aligned==="left"){t.style.width=this.connectorWidth>100?h(`${this.connectorWidth+48}px`):h("148px");const i=t.shadowRoot.querySelector(".step > .step-top > .step-connect");if(i){i.style.width=this.connectorWidth>100?h(`${this.connectorWidth}px`):h("100px")}}if(this.hideStepInfo&&s!==null){s.classList.add(this.visuallyHidden)}}}))};this.setHideStepInfo=()=>{this.steps.forEach((t=>{var i,s;const e=t.shadowRoot.querySelector(".step > .step-title-area");if(e!==null){if(this.hideStepInfo){(i=e.classList)===null||i===void 0?void 0:i.add(this.visuallyHidden)}else{(s=e.classList)===null||s===void 0?void 0:s.remove(this.visuallyHidden)}}}))};this.overrideVariant=()=>{if(this.variantOverride){let t=148*this.steps.length;if(this.aligned==="left"&&this.connectorWidth>100){t=(this.connectorWidth+48)*this.steps.length}if(this.el.clientWidth<t){this.variant="compact"}else{this.variant="default"}}};this.resizeObserverCallback=()=>{this.getChildren();this.checkStepTitles();this.overrideVariant();this.setStepperWidth();this.initialiseStepStates()};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.el)};this.alignedFullWidth=true;this.autoSetStepTitles=true;this.lastStepWidth=0;this.noOfResizes=0;this.stepperWidth=document.querySelector("ic-stepper").getBoundingClientRect().width;this.stepTypes=[];this.variantOverride=this.variant!=="compact";this.aligned="full-width";this.appearance="default";this.connectorWidth=100;this.hideStepInfo=false;this.variant="default"}handlePropChange(){this.setHideStepInfo();this.getChildren()}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentWillLoad(){this.setStepTypes();if(this.variant==="compact"){this.variantOverride=false}}componentWillRender(){this.initialiseStepStates()}componentDidLoad(){l(this.runResizeObserver)}render(){return i(s,{class:{[`${this.variant}`]:true,["aligned-left"]:this.variant==="default"&&this.aligned==="left"}},i("ul",{class:"step-item-list"},i("slot",null)))}get el(){return e(this)}static get watchers(){return{hideStepInfo:["handlePropChange"],variant:["handlePropChange"]}}};a.style=p;export{a as ic_stepper};
+//# sourceMappingURL=p-c59c733e.entry.js.map

package/dist/core/p-c59c733e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icStepperCss","Stepper","this","resizeObserver","visuallyHidden","getChildren","steps","Array","from","el","querySelectorAll","stepsWithStepTitles","checkStepTitles","length","variantOverride","variant","noOfResizes","console","error","setStepTypes","stepTypes","i","push","setStepperWidth","alignedFullWidth","aligned","lastStep","style","maxWidth","stepperWidth","offsetWidth","pxToRem","lastStepWidth","initialiseStepStates","forEach","step","index","stepNum","lastStepNum","stepType","current","stepTitleArea","shadowRoot","querySelector","autoSetStepTitles","stepTitle","setAttribute","undefined","removeAttribute","classList","remove","add","contains","nextStepTitle","progress","hideStepInfo","compactStepStyling","width","minWidth","connectorWidth","stepConnect","setHideStepInfo","_a","_b","overrideVariant","minDefaultStepperWidth","clientWidth","resizeObserverCallback","runResizeObserver","ResizeObserver","observe","document","getBoundingClientRect","handlePropChange","disconnectedCallback","disconnect","componentWillLoad","componentWillRender","componentDidLoad","checkResizeObserver","render","h","Host","class"],"sources":["src/components/ic-stepper/ic-stepper.css?tag=ic-stepper&encapsulation=shadow","src/components/ic-stepper/ic-stepper.tsx"],"sourcesContent":[":host {\n  display: flex;\n  width: 100%;\n}\n\n.step-item-list {\n  display: flex;\n  margin: 0;\n  padding: 0;\n}\n\n:host(.default:not(.aligned-left)) .step-item-list {\n  flex: auto;\n}\n\n:host(.compact) ul ::slotted(ic-step) {\n  display: none;\n}\n\n:host(.compact) ul ::slotted(ic-step.show) {\n  display: flex;\n}\n\n:host(.compact) ul ::slotted(ic-step.hide) {\n  display: none;\n  opacity: 0;\n  visibility: hidden;\n}\n","import { Component, Element, Host, Prop, h, State, Watch } from \"@stencil/core\";\nimport { checkResizeObserver, pxToRem } from \"../../utils/helpers\";\nimport { IcStepperAlignment } from \"./ic-stepper.types\";\nimport { IcStepTypes, IcStepVariants } from \"../ic-step/ic-step.types\";\n\n@Component({\n  tag: \"ic-stepper\",\n  styleUrl: \"ic-stepper.css\",\n  shadow: true,\n})\nexport class Stepper {\n  private resizeObserver: ResizeObserver = null;\n  private steps: HTMLIcStepElement[];\n  private stepsWithStepTitles: HTMLIcStepElement[];\n  private visuallyHidden: string = \"visually-hidden\";\n\n  @Element() el: HTMLIcStepperElement;\n\n  @State() alignedFullWidth: boolean = true;\n  @State() autoSetStepTitles: boolean = true;\n  @State() lastStepWidth: number = 0;\n  @State() noOfResizes?: number = 0;\n  @State() stepperWidth: number = document\n    .querySelector(\"ic-stepper\")\n    .getBoundingClientRect().width;\n  @State() stepTypes: IcStepTypes[] = [];\n  @State() variantOverride?: boolean = this.variant !== \"compact\";\n\n  /**\n   * The alignment of the default stepper within its container.\n   */\n  @Prop() aligned?: IcStepperAlignment = \"full-width\";\n\n  /**\n   * The appearance of the stepper.\n   */\n  @Prop() appearance?: \"light\" | \"default\" = \"default\";\n\n  /**\n   * The length of the connnector between each step in pixels. Minimum length is 100px.\n   */\n  @Prop() connectorWidth?: number = 100;\n\n  /**\n   * If `true`, the information about each step, i.e. step title, step subtitle and step status, will be hidden on all default steps. The information about each step will still be visible in the compact variant of the stepper.\n   */\n  @Prop() hideStepInfo?: boolean = false;\n\n  /**\n   * The variant of the stepper.\n   */\n  @Prop({ mutable: true }) variant?: IcStepVariants = \"default\";\n\n  @Watch(\"hideStepInfo\")\n  @Watch(\"variant\")\n  handlePropChange(): void {\n    this.setHideStepInfo();\n    this.getChildren();\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.setStepTypes();\n\n    if (this.variant === \"compact\") {\n      this.variantOverride = false;\n    }\n  }\n\n  componentWillRender(): void {\n    this.initialiseStepStates();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n  }\n\n  // Get all steps currently within this stepper\n  private getChildren = (): void => {\n    this.steps = Array.from(this.el.querySelectorAll(\"ic-step\"));\n\n    this.stepsWithStepTitles = Array.from(\n      this.el.querySelectorAll(\"ic-step[step-title]\")\n    );\n  };\n\n  // Inform the user that stepTitles are required on all steps in a compact stepper\n  private checkStepTitles = (): void => {\n    if (\n      this.stepsWithStepTitles.length < this.steps.length &&\n      this.variantOverride &&\n      this.variant === \"compact\"\n    ) {\n      this.noOfResizes = this.noOfResizes + 1;\n      if (this.noOfResizes === 1) {\n        console.error(\n          `The prop 'step-title' (web components) / 'stepTitle' (react) is required for all steps of the Stepper component (compact variant)`\n        );\n      }\n    }\n  };\n\n  private setStepTypes = (): void => {\n    this.getChildren();\n    this.stepTypes = [];\n    for (let i = 0; i < this.steps.length; i++) {\n      this.stepTypes.push(\"active\");\n    }\n  };\n\n  private setStepperWidth = (): void => {\n    this.alignedFullWidth =\n      this.variant === \"default\" && this.aligned === \"full-width\";\n\n    const lastStep = this.steps[this.steps.length - 1];\n    lastStep.style.maxWidth = \"none\";\n\n    if (this.alignedFullWidth) {\n      this.stepperWidth = this.el.offsetWidth;\n      lastStep.style.maxWidth = pxToRem(\n        `${this.stepperWidth / this.steps.length}px`\n      );\n      this.lastStepWidth = lastStep.offsetWidth;\n    }\n  };\n\n  private initialiseStepStates = (): void => {\n    this.steps.forEach((step, index) => {\n      // Set variant\n      step.variant = this.variant;\n      // Assign stepNum to each step\n      step.stepNum = index + 1;\n      // Assign lastStep to final step\n      step.lastStep = index === this.steps.length - 1;\n      step.lastStepNum = this.steps.length;\n\n      if (step.stepType !== \"current\") {\n        step.current = false;\n        this.stepTypes[index] = step.stepType;\n      } else {\n        step.current = true;\n      }\n\n      const stepTitleArea =\n        step.shadowRoot &&\n        step.shadowRoot.querySelector(\".step > .step-title-area\");\n\n      if (this.stepsWithStepTitles.length == 0 && this.variantOverride) {\n        if (this.variant === \"compact\") {\n          this.autoSetStepTitles = true;\n          if (this.autoSetStepTitles) {\n            step.stepTitle = \"Step \" + step.stepNum;\n            stepTitleArea &&\n              stepTitleArea\n                .querySelector(\".step-title\")\n                .setAttribute(\"aria-hidden\", \"true\");\n          }\n        }\n        if (this.variant === \"default\") {\n          this.autoSetStepTitles = false;\n          if (!this.autoSetStepTitles) {\n            step.stepTitle = undefined;\n            stepTitleArea &&\n              stepTitleArea\n                .querySelector(\".step-title\")\n                .removeAttribute(\"aria-hidden\");\n          }\n        }\n      }\n\n      if (this.variant === \"compact\") {\n        if (step.current === true || step.stepType === \"current\") {\n          step.classList.remove(\"hide\");\n          step.classList.add(\"show\");\n        } else if (step.classList.contains(\"show\")) {\n          step.classList.remove(\"show\");\n          step.classList.add(\"hide\");\n        }\n\n        if (!step.lastStep) {\n          step.nextStepTitle = this.steps[index + 1].stepTitle;\n          step.progress = (step.stepNum / this.steps.length) * 100;\n        } else if (step.lastStep && this.stepTypes[index] !== \"completed\") {\n          step.progress = 95;\n        } else {\n          step.progress = 100;\n        }\n\n        if (this.hideStepInfo && stepTitleArea !== null) {\n          stepTitleArea.classList.remove(this.visuallyHidden);\n        }\n\n        step.compactStepStyling = this.stepTypes[index];\n      }\n\n      if (this.variant === \"default\") {\n        if (!step.lastStep) {\n          if (this.alignedFullWidth) {\n            step.style.width = pxToRem(\n              `${\n                (this.stepperWidth - this.lastStepWidth) /\n                (this.steps.length - 1)\n              }px`\n            );\n            step.style.minWidth = pxToRem(\"148px\");\n          }\n        } else if (step.lastStep) {\n          step.classList.add(\"last-step\");\n          if (this.alignedFullWidth) {\n            step.style.maxWidth = `${this.lastStepWidth}px`;\n          } else {\n            step.style.maxWidth =\n              this.connectorWidth > 100\n                ? pxToRem(`${this.connectorWidth + 48}px`)\n                : pxToRem(\"148px\");\n          }\n        }\n\n        if (this.aligned === \"left\") {\n          step.style.width =\n            this.connectorWidth > 100\n              ? pxToRem(`${this.connectorWidth + 48}px`)\n              : pxToRem(\"148px\");\n          const stepConnect = step.shadowRoot.querySelector(\n            \".step > .step-top > .step-connect\"\n          ) as HTMLElement;\n\n          if (stepConnect) {\n            stepConnect.style.width =\n              this.connectorWidth > 100\n                ? pxToRem(`${this.connectorWidth}px`)\n                : pxToRem(\"100px\");\n          }\n        }\n\n        if (this.hideStepInfo && stepTitleArea !== null) {\n          stepTitleArea.classList.add(this.visuallyHidden);\n        }\n      }\n    });\n  };\n\n  private setHideStepInfo = (): void => {\n    this.steps.forEach((step) => {\n      const stepTitleArea = step.shadowRoot.querySelector(\n        \".step > .step-title-area\"\n      );\n\n      if (stepTitleArea !== null) {\n        if (this.hideStepInfo) {\n          stepTitleArea.classList?.add(this.visuallyHidden);\n        } else {\n          stepTitleArea.classList?.remove(this.visuallyHidden);\n        }\n      }\n    });\n  };\n\n  private overrideVariant = () => {\n    if (this.variantOverride) {\n      let minDefaultStepperWidth = 148 * this.steps.length;\n\n      if (this.aligned === \"left\" && this.connectorWidth > 100) {\n        minDefaultStepperWidth = (this.connectorWidth + 48) * this.steps.length;\n      }\n      if (this.el.clientWidth < minDefaultStepperWidth) {\n        this.variant = \"compact\";\n      } else {\n        this.variant = \"default\";\n      }\n    }\n  };\n\n  private resizeObserverCallback = () => {\n    this.getChildren();\n    this.checkStepTitles();\n    this.overrideVariant();\n    this.setStepperWidth();\n    this.initialiseStepStates();\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback();\n    });\n    this.resizeObserver.observe(this.el);\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          [`${this.variant}`]: true,\n          [\"aligned-left\"]:\n            this.variant === \"default\" && this.aligned === \"left\",\n        }}\n      >\n        <ul class=\"step-item-list\">\n          <slot></slot>\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-cf93053d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as i,g as e}from"./p-6b5e91e2.js";import{o,a as n}from"./p-063587c6.js";import"./p-26b7b18f.js";const a=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" aria-hidden="true">\n    <path d="M0 8L1.41 9.41L7 3.83V16H9V3.83L14.58 9.42L16 8L8 0L0 8Z"/>\n</svg>\n`;const s='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;position:absolute;right:0}.positioning{position:fixed;right:var(--ic-space-md);bottom:var(--ic-space-md);transition:visibility 0s linear var(--ic-transition-duration-slow),\n    opacity var(--ic-transition-duration-slow);z-index:var(--ic-z-index-back-to-top)}.icon-only{width:2.5rem;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs)\n    var(--ic-space-xs)}.icon-only .ic-back-to-top-icon{padding-left:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}button{height:2.5rem;align-items:center;padding:var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n    var(--ic-space-sm);margin:0;gap:var(--ic-space-xs);display:flex;background-color:var(--ic-architectural-white);border:var(--ic-border-width) solid var(--ic-action-default);outline-width:inherit;box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);border-radius:5rem;text-decoration:none;visibility:hidden;opacity:0;cursor:pointer}button:hover{text-decoration:none;background-color:var(--ic-action-default-bg-hover-no-alpha);border:var(--ic-border-width) solid var(--ic-action-default-hover)}button:active{text-decoration:none;background-color:var(--ic-action-default-bg-active-no-alpha);border:var(--ic-border-width) solid var(--ic-action-default-active)}button:focus{box-shadow:var(--ic-border-focus)}.ic-back-to-top-link.show{visibility:visible;opacity:1;transition:visibility 0s linear 0s,\n    opacity var(--ic-transition-duration-slow),\n    box-shadow var(--ic-easing-transition-fast)}.ic-back-to-top-link.by-footer{position:relative;right:var(--ic-space-md);bottom:3.5rem}.ic-back-to-top-link.offset-banner{margin-bottom:var(--ic-space-lg)}.ic-back-to-top-icon{fill:var(--ic-action-default);padding-left:var(--ic-space-xxs);padding-top:var(--ic-space-xxxs)}.ic-back-to-top-icon>svg{height:var(--ic-space-md);width:var(--ic-space-md);display:inline-block}.ic-back-to-top-link span{color:var(--ic-action-default)}.ic-back-to-top-link:hover .ic-back-to-top-icon{fill:var(--ic-action-default-hover)}.ic-back-to-top-link:hover span{color:var(--ic-action-default-hover)}@media (forced-colors: active){.ic-back-to-top-icon{fill:currentcolor}}';const r="Back to top";const c=class{constructor(e){t(this,e);this.topObserver=null;this.setTargetElVisible=t=>{this.targetElVisible=t};this.setFooterVisible=t=>{this.checkForClassificationBanner();this.footerVisible=typeof window!=="undefined"&&window.scrollY===0?false:t};this.targetElObserverCallback=t=>{this.setTargetElVisible(t[0].isIntersecting)};this.footerObserverCallback=t=>{this.setFooterVisible(t[0].isIntersecting)};this.findTargetEl=t=>{let i=null;if(t===null||t===undefined){console.log("Error: No target ID specified for back to top component - defaulting to top of page")}else{i=document.querySelector(`${t.startsWith("#")?"":"#"}${t}`);if(i===null){console.log(`Error: Back to top target element '${t}' not found - defaulting to top of page`)}}return i};this.createTopObserver=t=>{this.targetEl=this.findTargetEl(t);let i;if(this.topObserver!==null){const t=document.querySelector("#ic-back-to-top-target");if(t!==null){this.topObserver.unobserve(t);t.remove()}}if(this.targetEl===null){i=document.body;this.targetEl=i.firstElementChild;this.isTargetElNull=true}else{i=this.targetEl.parentNode;this.isTargetElNull=false}const e=document.createElement("div");e.setAttribute("id","ic-back-to-top-target");i.insertBefore(e,this.targetEl);const o=getComputedStyle(this.targetEl).marginTop;this.topObserver=new IntersectionObserver(this.targetElObserverCallback,{threshold:[0],rootMargin:`${o} 0px 0px 0px`});this.topObserver.observe(e)};this.handleClick=()=>{if(this.isTargetElNull){window.scrollTo(0,0)}else{this.targetEl.scrollIntoView()}};this.checkForClassificationBanner=()=>{const t=document.querySelectorAll("ic-classification-banner:not([inline='true'])");this.bannerOffset=t.length>0};this.buildButton=()=>{const{bannerOffset:t,targetElVisible:e,footerVisible:o,variant:n}=this;return i("button",{class:{["ic-back-to-top-link"]:true,["offset-banner"]:t,["show"]:!e,["by-footer"]:o,["positioning"]:n!=="icon",["icon-only"]:n==="icon"},"aria-label":r,onClick:this.handleClick},i("span",{class:"ic-back-to-top-icon",innerHTML:a}),this.variant!=="icon"&&i("ic-typography",{variant:"subtitle-small"},i("span",null,r)))};this.bannerOffset=false;this.footerVisible=false;this.targetElVisible=true;this.target=undefined;this.variant="default"}watchPropHandler(t,i){o(i,t,(()=>{this.createTopObserver(t)}))}componentWillLoad(){this.createTopObserver(this.target);this.checkForClassificationBanner();let t=document.querySelectorAll("ic-footer");if(t.length===0){t=document.querySelectorAll("footer")}if(t.length){const i=t[t.length-1];const e=this.bannerOffset?.15:0;const o=new IntersectionObserver(this.footerObserverCallback,{threshold:[e]});o.observe(i)}}componentDidLoad(){n([{prop:this.target,propName:"target"}],"Back to Top")}render(){const{variant:t,buildButton:e}=this;return t==="icon"?i("ic-tooltip",{label:r,placement:"top",class:"positioning"},e()):e()}static get delegatesFocus(){return true}get el(){return e(this)}static get watchers(){return{target:["watchPropHandler"]}}};c.style=s;export{c as ic_back_to_top};
+//# sourceMappingURL=p-cf93053d.entry.js.map

package/dist/core/p-cf93053d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icBackToTopCss","backToTopLabel","BackToTop","this","topObserver","setTargetElVisible","visible","targetElVisible","setFooterVisible","checkForClassificationBanner","footerVisible","window","scrollY","targetElObserverCallback","entries","isIntersecting","footerObserverCallback","findTargetEl","target","targetElement","undefined","console","log","document","querySelector","startsWith","createTopObserver","targetEl","objParent","observedEl","unobserve","remove","body","firstElementChild","isTargetElNull","parentNode","objBackToTopTargetEl","createElement","setAttribute","insertBefore","marginTop","getComputedStyle","IntersectionObserver","threshold","rootMargin","observe","handleClick","scrollTo","scrollIntoView","banners","querySelectorAll","bannerOffset","length","buildButton","variant","h","class","onClick","innerHTML","ArrowUpward","watchPropHandler","newValue","oldValue","onComponentPropUndefinedChange","componentWillLoad","footers","footerEl","footerObserver","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","render","label","placement"],"sources":["src/components/ic-back-to-top/ic-back-to-top.css?tag=ic-back-to-top&encapsulation=shadow","src/components/ic-back-to-top/ic-back-to-top.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-back-to-top: z-index of back to top\n */\n\n:host {\n  display: block;\n  position: absolute;\n  right: 0;\n}\n\n.positioning {\n  position: fixed;\n  right: var(--ic-space-md);\n  bottom: var(--ic-space-md);\n  transition: visibility 0s linear var(--ic-transition-duration-slow),\n    opacity var(--ic-transition-duration-slow);\n  z-index: var(--ic-z-index-back-to-top);\n}\n\n.icon-only {\n  width: 2.5rem;\n  padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs)\n    var(--ic-space-xs);\n}\n\n.icon-only .ic-back-to-top-icon {\n  padding-left: calc(var(--ic-space-xxxs) + var(--ic-space-1px));\n}\n\nbutton {\n  height: 2.5rem;\n  align-items: center;\n  padding: var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n    var(--ic-space-sm);\n  margin: 0;\n  gap: var(--ic-space-xs);\n  display: flex;\n  background-color: var(--ic-architectural-white);\n  border: var(--ic-border-width) solid var(--ic-action-default);\n  outline-width: inherit;\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n  border-radius: 5rem;\n  text-decoration: none;\n  visibility: hidden;\n  opacity: 0;\n  cursor: pointer;\n}\n\nbutton:hover {\n  text-decoration: none;\n  background-color: var(--ic-action-default-bg-hover-no-alpha);\n  border: var(--ic-border-width) solid var(--ic-action-default-hover);\n}\n\nbutton:active {\n  text-decoration: none;\n  background-color: var(--ic-action-default-bg-active-no-alpha);\n  border: var(--ic-border-width) solid var(--ic-action-default-active);\n}\n\nbutton:focus {\n  box-shadow: var(--ic-border-focus);\n}\n\n.ic-back-to-top-link.show {\n  visibility: visible;\n  opacity: 1;\n  transition: visibility 0s linear 0s,\n    opacity var(--ic-transition-duration-slow),\n    box-shadow var(--ic-easing-transition-fast);\n}\n\n.ic-back-to-top-link.by-footer {\n  position: relative;\n  right: var(--ic-space-md);\n  bottom: 3.5rem;\n}\n\n.ic-back-to-top-link.offset-banner {\n  margin-bottom: var(--ic-space-lg);\n}\n\n.ic-back-to-top-icon {\n  fill: var(--ic-action-default);\n  padding-left: var(--ic-space-xxs);\n  padding-top: var(--ic-space-xxxs);\n}\n\n.ic-back-to-top-icon > svg {\n  height: var(--ic-space-md);\n  width: var(--ic-space-md);\n  display: inline-block;\n}\n\n.ic-back-to-top-link span {\n  color: var(--ic-action-default);\n}\n\n.ic-back-to-top-link:hover .ic-back-to-top-icon {\n  fill: var(--ic-action-default-hover);\n}\n\n.ic-back-to-top-link:hover span {\n  color: var(--ic-action-default-hover);\n}\n\n@media (forced-colors: active) {\n  .ic-back-to-top-icon {\n    fill: currentcolor;\n  }\n}\n","import { Component, h, Element, Prop, State, Watch } from \"@stencil/core\";\nimport ArrowUpward from \"./assets/ArrowUpward.svg\";\nimport {\n  onComponentPropUndefinedChange,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcBackToTopVariants } from \"./ic-back-to-top.types\";\n\nconst backToTopLabel = \"Back to top\";\n\n@Component({\n  tag: \"ic-back-to-top\",\n  styleUrl: \"ic-back-to-top.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BackToTop {\n  private isTargetElNull: boolean;\n  private targetEl: Element;\n  private topObserver: IntersectionObserver = null;\n\n  @Element() el: HTMLIcBackToTopElement;\n\n  @State() bannerOffset: boolean = false;\n  @State() footerVisible: boolean = false;\n  @State() targetElVisible: boolean = true;\n\n  /**\n   * The ID of the element to jump back to when the link is clicked.\n   */\n  @Prop() target!: string;\n\n  /**\n   * The variant of the button to render\n   */\n  @Prop() variant: IcBackToTopVariants = \"default\";\n\n  @Watch(\"target\")\n  watchPropHandler(newValue: string, oldValue: string): void {\n    //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n    onComponentPropUndefinedChange(oldValue, newValue, () => {\n      this.createTopObserver(newValue);\n    });\n  }\n\n  componentWillLoad(): void {\n    this.createTopObserver(this.target);\n    this.checkForClassificationBanner();\n\n    //observer for when footer scrolls into view\n    let footers = document.querySelectorAll(\n      \"ic-footer\"\n    ) as NodeListOf<HTMLElement>;\n    if (footers.length === 0) {\n      footers = document.querySelectorAll(\"footer\");\n    }\n\n    if (footers.length) {\n      const footerEl = footers[footers.length - 1];\n      const threshold = this.bannerOffset ? 0.15 : 0;\n      const footerObserver = new IntersectionObserver(\n        this.footerObserverCallback,\n        { threshold: [threshold] }\n      );\n      footerObserver.observe(footerEl);\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.target, propName: \"target\" }],\n      \"Back to Top\"\n    );\n  }\n\n  private setTargetElVisible = (visible: boolean) => {\n    this.targetElVisible = visible;\n  };\n\n  private setFooterVisible = (visible: boolean) => {\n    this.checkForClassificationBanner();\n    this.footerVisible =\n      typeof window !== \"undefined\" && window.scrollY === 0 ? false : visible;\n  };\n\n  private targetElObserverCallback = (entries: IntersectionObserverEntry[]) => {\n    this.setTargetElVisible(entries[0].isIntersecting);\n  };\n\n  private footerObserverCallback = (entries: IntersectionObserverEntry[]) => {\n    this.setFooterVisible(entries[0].isIntersecting);\n  };\n\n  private findTargetEl = (target: string): Element => {\n    let targetElement: Element = null;\n    if (target === null || target === undefined) {\n      console.log(\n        \"Error: No target ID specified for back to top component - defaulting to top of page\"\n      );\n    } else {\n      targetElement = document.querySelector(\n        `${target.startsWith(\"#\") ? \"\" : \"#\"}${target}`\n      );\n      if (targetElement === null) {\n        console.log(\n          `Error: Back to top target element '${target}' not found - defaulting to top of page`\n        );\n      }\n    }\n    return targetElement;\n  };\n\n  private createTopObserver = (target: string) => {\n    this.targetEl = this.findTargetEl(target);\n    let objParent: HTMLElement;\n\n    //remove old element & observer\n    if (this.topObserver !== null) {\n      const observedEl = document.querySelector(\"#ic-back-to-top-target\");\n      if (observedEl !== null) {\n        this.topObserver.unobserve(observedEl);\n        observedEl.remove();\n      }\n    }\n\n    if (this.targetEl === null) {\n      objParent = document.body;\n      this.targetEl = objParent.firstElementChild;\n      this.isTargetElNull = true;\n    } else {\n      objParent = this.targetEl.parentNode as HTMLElement;\n      this.isTargetElNull = false;\n    }\n\n    //insert a new 0px height element before specified target that can be used to determine when page is scrolled\n    const objBackToTopTargetEl = document.createElement(\"div\");\n    objBackToTopTargetEl.setAttribute(\"id\", \"ic-back-to-top-target\");\n    objParent.insertBefore(objBackToTopTargetEl, this.targetEl);\n\n    // resize observer needs to factor in any top margin on the target el\n    const marginTop = getComputedStyle(this.targetEl).marginTop;\n    this.topObserver = new IntersectionObserver(this.targetElObserverCallback, {\n      threshold: [0],\n      rootMargin: `${marginTop} 0px 0px 0px`,\n    });\n    this.topObserver.observe(objBackToTopTargetEl);\n  };\n\n  private handleClick = () => {\n    if (this.isTargetElNull) {\n      window.scrollTo(0, 0);\n    } else {\n      this.targetEl.scrollIntoView();\n    }\n  };\n\n  private checkForClassificationBanner = () => {\n    //adjust position for classification banner at bottom\n    const banners = document.querySelectorAll(\n      \"ic-classification-banner:not([inline='true'])\"\n    );\n    this.bannerOffset = banners.length > 0;\n  };\n\n  private buildButton = () => {\n    const { bannerOffset, targetElVisible, footerVisible, variant } = this;\n\n    return (\n      <button\n        class={{\n          [\"ic-back-to-top-link\"]: true,\n          [\"offset-banner\"]: bannerOffset,\n          [\"show\"]: !targetElVisible,\n          [\"by-footer\"]: footerVisible,\n          [\"positioning\"]: variant !== \"icon\",\n          [\"icon-only\"]: variant === \"icon\",\n        }}\n        aria-label={backToTopLabel}\n        onClick={this.handleClick}\n      >\n        <span class=\"ic-back-to-top-icon\" innerHTML={ArrowUpward} />\n\n        {this.variant !== \"icon\" && (\n          <ic-typography variant=\"subtitle-small\">\n            <span>{backToTopLabel}</span>\n          </ic-typography>\n        )}\n      </button>\n    );\n  };\n\n  render() {\n    const { variant, buildButton } = this;\n\n    return variant === \"icon\" ? (\n      <ic-tooltip label={backToTopLabel} placement=\"top\" class=\"positioning\">\n        {buildButton()}\n      </ic-tooltip>\n    ) : (\n      buildButton()\n    );\n  }\n}\n"],"mappings":"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"}