@ukic/web-components 3.17.0 → 3.19.0

package/dist/core/p-4fa7fbc4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icButtonCss","IcButtonStyle0","buttonIds","Button","constructor","hostRef","this","buttonIdNum","hasTooltip","inheritedAttributes","describedbyEl","mutationObserver","hostMutationObserver","ariaLabel","title","accept","disabled","disableTooltip","download","dropdown","dropdownExpanded","fileUpload","fileInputName","fullWidth","loading","monochrome","multiple","size","theme","tooltipFixedPositioning","tooltipPlacement","transparentBackground","type","variant","getSlottedIcon","position","el","querySelector","handleClick","hasRouterSlot","form","closest","document","handleHiddenFormButtonClick","handleKeyDown","ev","key","closeButtonTooltip","onFocus","icFocus","emit","onBlur","icBlur","updateAriaDescribedbyClone","describedbyNode","wrapper","_a","shadowRoot","_b","appendChild","Object","assign","createElement","id","className","firstChild","remove","mutationCallback","cloneNode","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","attribute","getAttribute","IC_INHERITED_ARIA","includes","forceUpdate","setHasTooltip","isIconVariant","startsWith","arrangeRouterItem","setStyles","element","styles","entries","value","style","setProperty","routerSlot","icTypography","gap","icon","iconSlot","iconWrapper","fill","display","marginPlacement","append","badge","label","textContent","trim","watchDescribedbyNodeHandler","watchDisabledHandler","removeDisabledFalse","watchVariantHandler","newVariant","disconnectedCallback","disconnect","componentWillUpdate","getBoundingClientRect","width","componentWillLoad","inheritAttributes","restInheritedAttributes","__rest","setAttribute","describedById","componentDidLoad","updateTheme","MutationObserver","observe","characterData","childList","subtree","attributes","componentWillRender","iconEl","handleHostClick","event","renderFileHiddenInput","icFileSelection","selectedFiles","stopImmediatePropagation","brandChangeHandler","detail","mode","setFocus","buttonEl","focus","tooltip","isTooltipVisible","displayTooltip","preventDefault","foregroundColor","getBrandFromContext","IcBrandForegroundEnum","Default","Light","Dark","render","ariaControlsId","ariaOwnsId","formaction","formenctype","formmethod","formnovalidate","formtarget","href","hreflang","referrerpolicy","rel","target","TagType","buttonAttrs","buttonId","undefined","describedby","hasLeftIcon","hasRightIcon","ButtonContent","h","name","class","tabindex","ref","part","Fragment","innerHTML","arrowDropdown","Host","background","isSlotUsed","onClick","onKeyDown","placement","fixedPositioning","silent","icLoadingIndicatorCss","IcLoadingIndicatorStyle0","LOADING_INDICATOR_WIDTHS","large","medium","small","LoadingIndicator","labelList","circularDiameter","circularLineWidth","circularDimensions","x","y","r","clipInnerElement","internalType","description","labelDuration","max","min","getLabel","labelIndex","Promise","interval","setInterval","length","indicatorLabel","getLabelVariant","calculateWidth","outerElement","offsetWidth","window","getComputedStyle","match","parseFloat","parentWidth","_c","parentElement","calculateProportion","progress","minProgress","Math","setLinearDeterminateWidth","innerElement","proportion","classList","add","setInternalType","updateLabel","setCircleDimensions","nextRadius","dashArray","PI","dashOffset","watchPropHandler","handleProgressChange","handleIconSize","setIndicatorDimensions","diameter","clearInterval","innerLabel","role","viewBox","cx","cy","icTooltipCss","IcTooltipStyle0","Tooltip","delayedHideEvents","instantHideEvents","mouseOverTool","persistTooltip","showEvents","disableHover","disableClick","popperProps","show","toolTip","dialogContentArea","popperInstance","createPopper","strategy","modifiers","options","offset","arrow","scroll","resize","boundary","padding","console","warn","hide","removeAttribute","destroy","checkCloseTooltip","setTimeout","mouseEnterTooltip","mouseLeaveTooltip","manageEventListeners","action","method","updateTooltipEvents","watchDisableClickHandler","watchDisableHoverHandler","watchLabelHandler","hasAttribute","update","setExternalPopperProps","props","dialog","getRootNode","host","onComponentRequiredPropUndefined","prop","propName","componentDidRender","typographyEl","maxLines","resolve","isSafari"],"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":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\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  --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(.ic-button-disabled),\n:host(.ic-button-disabled) .button,\n:host(.ic-button-disabled) ::slotted(a),\n:host(.ic-button-loading),\n:host(.ic-button-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(.ic-button-variant-primary) .button,\n:host(.ic-button-variant-icon-primary) .button {\n  color: var(--ic-button-primary-text);\n  background-color: var(--ic-button-primary-background);\n}\n\n:host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg) {\n  color: var(--ic-button-primary-icon);\n}\n\n:host(.ic-button-variant-primary) ::slotted(a),\n:host(.ic-button-variant-icon-primary) ::slotted(a) {\n  --ic-typography-color: var(--ic-button-primary-text);\n\n  color: var(--ic-button-primary-text);\n  background-color: var(--ic-button-primary-background) !important;\n}\n\n:host(.ic-button-variant-primary) .button:hover,\n:host(.ic-button-variant-icon-primary) .button:hover {\n  background-color: var(--ic-button-primary-background-hover);\n}\n\n:host(.ic-button-variant-primary) ::slotted(a:hover),\n:host(.ic-button-variant-icon-primary) ::slotted(a:hover) {\n  background-color: var(--ic-button-primary-background-hover) !important;\n}\n\n:host(.ic-button-variant-primary.ic-button-loading) .button,\n:host(.ic-button-variant-primary) .button:active,\n:host(.ic-button-variant-icon-primary.ic-button-loading) .button,\n:host(.ic-button-variant-icon-primary) .button:active {\n  background-color: var(--ic-button-primary-background-pressed);\n\n  --button-loading-inner-color: var(--ic-button-primary-text);\n  --button-loading-outer-color: var(--ic-button-primary-background-pressed);\n}\n\n:host(.ic-button-variant-primary) ::slotted(a:active),\n:host(.ic-button-variant-icon-primary) ::slotted(a:active) {\n  background-color: var(--ic-button-primary-background-pressed) !important;\n}\n\n:host(.ic-button-variant-primary.ic-button-disabled) .button,\n:host(.ic-button-variant-icon-primary.ic-button-disabled) .button {\n  background: var(--ic-button-primary-background-disabled);\n  color: var(--ic-button-primary-text-disabled);\n}\n\n:host(.ic-button-variant-primary.ic-button-disabled) ::slotted(a),\n:host(.ic-button-variant-icon-primary.ic-button-disabled) ::slotted(a) {\n  background: var(--ic-button-primary-background-disabled) !important;\n\n  --ic-typography-color: var(--ic-button-primary-text-disabled) !important;\n\n  color: var(--ic-button-primary-text-disabled) !important;\n}\n\n/* Primary - monochrome */\n\n:host(.ic-button-variant-primary.monochrome) .button,\n:host(.ic-button-variant-icon-primary.monochrome) .button {\n  color: var(--ic-button-primary-text-monochrome);\n  background-color: var(--ic-button-primary-background-monochrome);\n}\n\n:host(.ic-button-variant-primary.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a) {\n  background-color: var(--ic-button-primary-background-monochrome) !important;\n}\n\n:host(.ic-button-variant-primary.monochrome) .button:hover,\n:host(.ic-button-variant-icon-primary.monochrome) .button:hover {\n  background-color: var(--ic-button-primary-background-hover-monochrome);\n}\n\n:host(.ic-button-variant-primary.monochrome) ::slotted(a:hover),\n:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:hover) {\n  background-color: var(\n    --ic-button-primary-background-hover-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-primary.ic-button-loading.monochrome) .button,\n:host(.ic-button-variant-primary.monochrome) .button:active,\n:host(.ic-button-variant-icon-primary.ic-button-loading.monochrome) .button,\n:host(.ic-button-variant-icon-primary.monochrome) .button:active {\n  background-color: var(--ic-button-primary-background-pressed-monochrome);\n\n  --button-loading-inner-color: var(--ic-button-primary-text-monochrome);\n  --button-loading-outer-color: var(--ic-button-primary-background-monochrome);\n}\n\n:host(.ic-button-variant-primary.monochrome) ::slotted(a:active),\n:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:active) {\n  background-color: var(\n    --ic-button-primary-background-pressed-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-primary.ic-button-disabled.monochrome) .button,\n:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome) .button {\n  background-color: var(--ic-button-primary-background-disabled-monochrome);\n  color: var(--ic-button-primary-text-disabled-monochrome);\n}\n\n:host(.ic-button-variant-primary.ic-button-disabled.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome)\n  ::slotted(a) {\n  background-color: var(\n    --ic-button-primary-background-disabled-monochrome\n  ) !important;\n}\n\n/* Secondary  */\n\n:host(.ic-button-variant-secondary) .button,\n:host(.ic-button-variant-icon-secondary) .button {\n  border: var(--ic-border-width) solid var(--ic-button-secondary-border);\n  color: var(--ic-button-secondary-text);\n}\n\n:host(.ic-button-variant-secondary) ::slotted(a),\n:host(.ic-button-variant-icon-secondary) ::slotted(a) {\n  border: var(--ic-border-width) solid var(--ic-button-secondary-border) !important;\n  color: var(--ic-button-secondary-text) !important;\n\n  --ic-typography-color: var(--ic-button-secondary-text) !important;\n}\n\n:host(.ic-button-variant-secondary) .button:hover,\n:host(.ic-button-variant-icon-secondary) .button:hover {\n  background-color: var(--ic-button-secondary-background-hover-active);\n  border-color: var(--ic-button-secondary-border-hover);\n  color: var(--ic-button-secondary-text-hover-active);\n}\n\n:host(.ic-button-variant-secondary) ::slotted(a:hover),\n:host(.ic-button-variant-icon-secondary) ::slotted(a:hover) {\n  background-color: var(\n    --ic-button-secondary-background-hover-active\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary) .button:active,\n:host(.ic-button-variant-icon-secondary) .button:active {\n  border-color: var(--ic-button-secondary-border-pressed);\n  background-color: var(--ic-button-secondary-background-pressed-active);\n  color: var(--ic-button-secondary-text-pressed-active);\n}\n\n:host(.ic-button-variant-secondary) ::slotted(a:active),\n:host(.ic-button-variant-icon-secondary) ::slotted(a:active) {\n  background-color: var(\n    --ic-button-secondary-background-pressed-active\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary.ic-button-loading) .button,\n:host(.ic-button-variant-icon-secondary.ic-button-loading) .button {\n  border-color: var(--ic-button-secondary-border-pressed);\n  background-color: var(\n    --loading-button-background,\n    var(--ic-button-secondary-background-pressed-active)\n  ) !important;\n  color: var(--ic-button-secondary-text-pressed-active);\n\n  --button-loading-inner-color: var(--ic-button-secondary-border-pressed);\n  --button-loading-outer-color: var(\n    --ic-button-secondary-background-pressed-active\n  );\n}\n\n:host(.ic-button-variant-secondary.ic-button-disabled) .button,\n:host(.ic-button-variant-icon-secondary.ic-button-disabled) .button {\n  border-color: var(--ic-button-secondary-border-disabled);\n  color: var(--ic-button-secondary-text-disabled);\n  background: none;\n}\n\n:host(.ic-button-variant-secondary.ic-button-disabled) ::slotted(a),\n:host(.ic-button-variant-icon-secondary.ic-button-disabled) ::slotted(a) {\n  background: none !important;\n}\n\n/* Secondary - non-transparent background */\n\n:host(.ic-button-variant-secondary.background) .button,\n:host(.ic-button-variant-icon-secondary.background) .button {\n  background-color: var(--ic-button-secondary-background);\n}\n\n:host(.ic-button-variant-secondary.background) ::slotted(a),\n:host(.ic-button-variant-icon-secondary.background) ::slotted(a) {\n  background-color: var(--ic-button-secondary-background) !important;\n}\n\n:host(.ic-button-variant-secondary.background) .button:hover,\n:host(.ic-button-variant-icon-secondary.background) .button:hover {\n  background-image: var(--ic-button-secondary-background-non-transparent-hover);\n}\n\n:host(.ic-button-variant-secondary.background) ::slotted(a:hover),\n:host(.ic-button-variant-icon-secondary.background) ::slotted(a:hover) {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-hover\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary.background) .button:active,\n:host(.ic-button-variant-icon-secondary.background) .button:active {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-active\n  );\n}\n\n:host(.ic-button-variant-secondary.background) ::slotted(a:active),\n:host(.ic-button-variant-icon-secondary.background) ::slotted(a:active) {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-active\n  ) !important;\n}\n\n/* Secondary - monochrome */\n\n:host(.ic-button-variant-secondary.monochrome) .button,\n:host(.ic-button-variant-icon-secondary.monochrome) .button {\n  background-color: none;\n  border: var(--ic-border-width) solid\n    var(--ic-button-secondary-border-monochrome);\n  color: var(--ic-button-secondary-text-monochrome);\n}\n\n:host(.ic-button-variant-secondary.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a) {\n  background-color: none !important;\n}\n\n:host(.ic-button-variant-secondary.monochrome) .button:hover,\n:host(.ic-button-variant-icon-secondary.monochrome) .button:hover {\n  background-color: var(--ic-button-secondary-background-hover-monochrome);\n  border-color: var(--ic-button-secondary-border-hover-monochrome);\n  color: var(--ic-button-secondary-text-hover-monochrome);\n}\n\n:host(.ic-button-variant-secondary.monochrome) ::slotted(a:hover),\n:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:hover) {\n  background-color: var(\n    --ic-button-secondary-background-hover-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary.monochrome) .button:active,\n:host(.ic-button-variant-icon-secondary.monochrome) .button:active {\n  background-color: var(--ic-button-secondary-background-pressed-monochrome);\n  border-color: var(--ic-button-secondary-border-pressed-monochrome);\n  color: var(--ic-button-secondary-text-pressed-monochrome);\n}\n\n:host(.ic-button-variant-secondary.monochrome) ::slotted(a:active),\n:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:active) {\n  background-color: var(\n    --ic-button-secondary-background-pressed-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary.ic-button-loading.monochrome) .button,\n:host(.ic-button-variant-icon-secondary.ic-button-loading.monochrome) .button {\n  background-color: var(\n    --ic-button-secondary-background-pressed-monochrome\n  ) !important;\n  border-color: var(--ic-button-secondary-border-pressed-monochrome);\n  color: var(--ic-button-secondary-text-pressed-monochrome);\n\n  --button-loading-inner-color: var(\n    --ic-button-secondary-text-pressed-monochrome\n  );\n  --button-loading-outer-color: var(\n    --ic-button-secondary-background-pressed-monochrome\n  );\n}\n\n:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) .button,\n:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome) .button {\n  background: none;\n  border-color: var(--ic-button-secondary-border-disabled-monochrome);\n  color: var(--ic-button-secondary-text-disabled-monochrome);\n}\n\n:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome)\n  ::slotted(a) {\n  background: none !important;\n}\n\n/* Secondary - non-transparent background - monochrome */\n\n:host(.ic-button-variant-secondary.background.monochrome) .button,\n:host(.ic-button-variant-icon-secondary.background.monochrome) .button {\n  background-color: var(--ic-button-secondary-background-monochrome);\n}\n\n:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a) {\n  background-color: var(--ic-button-secondary-background-monochrome) !important;\n}\n\n:host(.ic-button-variant-secondary.background.monochrome) .button:hover,\n:host(.ic-button-variant-icon-secondary.background.monochrome) .button:hover {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-monochrome-hover\n  );\n}\n\n:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:hover),\n:host(.ic-button-variant-icon-secondary.background.monochrome)\n  ::slotted(a:hover) {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-monochrome-hover\n  ) !important;\n}\n\n:host(.ic-button-variant-secondary.background.monochrome) .button:active,\n:host(.ic-button-variant-icon-secondary.background.monochrome) .button:active {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-monochrome-active\n  );\n}\n\n:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:active),\n:host(.ic-button-variant-icon-secondary.background.monochrome)\n  ::slotted(a:active) {\n  background-image: var(\n    --ic-button-secondary-background-non-transparent-monochrome-active\n  ) !important;\n}\n\n/* Tertiary */\n\n:host(.ic-button-variant-tertiary) .button,\n:host(.ic-button-variant-icon-tertiary) .button,\n:host(.ic-button-variant-tertiary) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary) ::slotted(a) {\n  color: var(--ic-button-tertiary-text-active);\n\n  --ic-typography-color: var(--ic-button-tertiary-text-active);\n}\n\n:host(.ic-button-variant-tertiary) .button:hover,\n:host(.ic-button-variant-icon-tertiary) .button:hover {\n  background-color: var(--ic-button-tertiary-background-hover-active);\n  color: var(--ic-button-tertiary-text-hover-active);\n}\n\n:host(.ic-button-variant-tertiary) ::slotted(a:hover),\n:host(.ic-button-variant-icon-tertiary) ::slotted(a:hover) {\n  background-color: var(\n    --ic-button-tertiary-background-hover-active\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary) .button:active,\n:host(.ic-button-variant-tertiary.ic-button-loading) .button,\n:host(.ic-button-variant-icon-tertiary) .button:active,\n:host(.ic-button-variant-icon-tertiary.ic-button-loading) .button {\n  background-color: var(--ic-button-tertiary-background-pressed-active);\n  color: var(--ic-button-tertiary-text-pressed-active);\n\n  --button-loading-inner-color: var(--ic-button-tertiary-text-pressed-active);\n  --button-loading-outer-color: var(--ic-button-tertiary-background-pressed);\n}\n\n:host(.ic-button-variant-tertiary) ::slotted(a:active),\n:host(.ic-button-variant-icon-tertiary) ::slotted(a:active) {\n  background-color: var(\n    --ic-button-tertiary-background-pressed-active\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary.ic-button-disabled) .button,\n:host(.ic-button-variant-icon-tertiary.ic-button-disabled) .button {\n  color: var(--ic-button-tertiary-text-disabled);\n  background: none;\n}\n\n:host(.ic-button-variant-tertiary.ic-button-disabled) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary.ic-button-disabled) ::slotted(a) {\n  background: none !important;\n}\n\n/* Tertiary - non-transparent background */\n\n:host(.ic-button-variant-tertiary.background) .button,\n:host(.ic-button-variant-icon-tertiary.background) .button {\n  background-color: var(--ic-button-tertiary-background);\n}\n\n:host(.ic-button-variant-tertiary.background) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary.background) ::slotted(a) {\n  background-color: var(--ic-button-tertiary-background) !important;\n}\n\n:host(.ic-button-variant-tertiary.background) .button:hover,\n:host(.ic-button-variant-icon-tertiary.background) .button:hover {\n  background-image: var(--ic-button-tertiary-background-non-transparent-hover);\n}\n\n:host(.ic-button-variant-tertiary.background) ::slotted(a:hover),\n:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:hover) {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-hover\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary.background) .button:active,\n:host(.ic-button-variant-icon-tertiary.background) .button:active {\n  background-image: var(--ic-button-tertiary-background-non-transparent-active);\n}\n\n:host(.ic-button-variant-tertiary.background) ::slotted(a:active),\n:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:active) {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-active\n  ) !important;\n}\n\n/* Tertiary - monochrome */\n\n:host(.ic-button-variant-tertiary.monochrome) .button,\n:host(.ic-button-variant-tertiary.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary.monochrome) .button,\n:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a) {\n  color: var(--ic-button-tertiary-text-monochrome);\n\n  --ic-typography-color: var(--ic-button-tertiary-text-monochrome);\n}\n\n:host(.ic-button-variant-tertiary.monochrome) .button:hover,\n:host(.ic-button-variant-icon-tertiary.monochrome) .button:hover {\n  background-color: var(--ic-button-tertiary-background-hover-monochrome);\n  color: var(--ic-button-tertiary-text-hover-monochrome);\n}\n\n:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:hover),\n:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:hover) {\n  background-color: var(\n    --ic-button-tertiary-background-hover-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary.monochrome) .button:active,\n:host(.ic-button-variant-tertiary.ic-button-loading.monochrome) .button,\n:host(.ic-button-variant-icon-tertiary.monochrome) .button:active,\n:host(.ic-button-variant-icon-tertiary.ic-button-loading.monochrome) .button {\n  background-color: var(--ic-button-tertiary-background-pressed-monochrome);\n  color: var(--ic-button-tertiary-text-pressed-monochrome);\n\n  --button-loading-inner-color: var(\n    --ic-button-tertiary-text-pressed-monochrome\n  );\n  --button-loading-outer-color: var(\n    --ic-button-tertiary-background-pressed-monochrome\n  );\n}\n\n:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:active),\n:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:active) {\n  background-color: var(\n    --ic-button-tertiary-background-pressed-monochrome\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) .button,\n:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome) .button {\n  color: var(--ic-button-tertiary-text-disabled-monochrome);\n  background: none;\n}\n\n:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome)\n  ::slotted(a) {\n  background: none !important;\n}\n\n/* Tertiary - non-transparent background - monochrome */\n\n:host(.ic-button-variant-tertiary.background.monochrome) .button,\n:host(.ic-button-variant-icon-tertiary.background.monochrome) .button {\n  background-color: var(--ic-button-tertiary-background-monochrome);\n}\n\n:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a) {\n  background-color: var(--ic-button-tertiary-background-monochrome) !important;\n}\n\n:host(.ic-button-variant-tertiary.background.monochrome) .button:hover,\n:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:hover {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-monochrome-hover\n  );\n}\n\n:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:hover),\n:host(.ic-button-variant-icon-tertiary.background.monochrome)\n  ::slotted(a:hover) {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-monochrome-hover\n  ) !important;\n}\n\n:host(.ic-button-variant-tertiary.background.monochrome) .button:active,\n:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:active {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-monochrome-active\n  );\n}\n\n:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:active),\n:host(.ic-button-variant-icon-tertiary.background.monochrome)\n  ::slotted(a:active) {\n  background-image: var(\n    --ic-button-tertiary-background-non-transparent-monochrome-active\n  ) !important;\n}\n\n/* Destructive */\n\n:host(.ic-button-variant-destructive) .button,\n:host(.ic-button-variant-icon-destructive) .button {\n  color: var(--ic-button-destructive-text);\n  background-color: var(--ic-button-destructive-background);\n  text-transform: uppercase;\n}\n\n:host(.ic-button-variant-destructive) ::slotted(a),\n:host(.ic-button-variant-icon-destructive) ::slotted(a) {\n  color: var(--ic-button-destructive-text) !important;\n\n  --ic-typography-color: var(--ic-button-destructive-text) !important;\n\n  background-color: var(--ic-button-destructive-background) !important;\n  text-transform: uppercase !important;\n}\n\n:host(.ic-button-variant-destructive) .button:hover,\n:host(.ic-button-variant-icon-destructive) .button:hover {\n  background-color: var(--ic-button-destructive-background-hover);\n}\n\n:host(.ic-button-variant-destructive) ::slotted(a:hover),\n:host(.ic-button-variant-icon-destructive) ::slotted(a:hover) {\n  background-color: var(--ic-button-destructive-background-hover) !important;\n}\n\n:host(.ic-button-variant-destructive) .button:active,\n:host(.ic-button-variant-destructive.ic-button-loading) .button,\n:host(.ic-button-variant-icon-destructive.ic-button-loading) .button {\n  color: var(--ic-button-primary-text);\n  background-color: var(--ic-button-destructive-background-pressed);\n\n  --button-loading-inner-color: var(--ic-button-primary-text);\n  --button-loading-outer-color: var(--ic-button-destructive-background-pressed);\n}\n\n:host(.ic-button-variant-destructive) ::slotted(a:active),\n:host(.ic-button-variant-icon-destructive) ::slotted(a:active) {\n  background-color: var(--ic-button-destructive-background-pressed) !important;\n}\n\n:host(.ic-button-variant-destructive.ic-button-disabled) .button,\n:host(.ic-button-variant-icon-destructive.ic-button-disabled) .button {\n  background-color: var(--ic-button-destructive-background-disabled);\n  color: var(--ic-button-destructive-text-disabled);\n}\n\n:host(.ic-button-variant-destructive.ic-button-disabled) ::slotted(a),\n:host(.ic-button-variant-icon-destructive.ic-button-disabled) ::slotted(a) {\n  background-color: var(--ic-button-destructive-background-disabled) !important;\n}\n\n/***********************\n     Icon Variants\n ***********************/\n\n/* Icon */\n\n:host(.ic-button-variant-icon) .button {\n  color: var(--ic-button-icon-color);\n  background-color: var(--ic-button-icon-color-background);\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\n\n:host(.ic-button-variant-icon) ::slotted(a) {\n  color: var(--ic-button-icon-color);\n  background-color: var(--ic-button-icon-color-background) !important;\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\n\n:host(.ic-button-variant-icon) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n}\n\n:host(.ic-button-variant-icon) .button:hover {\n  color: var(--ic-button-icon-color-hover);\n  background-color: var(--ic-button-icon-color-background-hover);\n}\n\n:host(.ic-button-variant-icon) ::slotted(a:hover) {\n  color: var(--ic-button-icon-color-hover);\n  background-color: var(--ic-button-icon-color-background-hover) !important;\n}\n\n:host(.ic-button-variant-icon) .button:active:not(:focus),\n:host(.ic-button-variant-icon.ic-button-loading) .button {\n  color: var(--ic-button-icon-color-active);\n  background-color: var(--ic-button-icon-color-background-active);\n}\n\n:host(.ic-button-variant-icon) ::slotted(a:active:not(:focus)) {\n  color: var(--ic-button-icon-color-active);\n  background-color: var(--ic-button-icon-color-background-active) !important;\n}\n\n:host(.ic-button-variant-icon.ic-button-disabled) .button {\n  color: var(--ic-color-icon-disabled-mid);\n  background: none;\n}\n\n:host(.ic-button-variant-icon.ic-button-disabled) ::slotted(a) {\n  color: var(--ic-color-icon-disabled-mid);\n  background: none !important;\n}\n\n/* Icon-primary */\n\n:host(.ic-button-variant-icon-primary) .button,\n:host(.ic-button-variant-icon-primary) ::slotted(a) {\n  min-width: 0;\n  gap: var(--ic-space-xs);\n  color: var(--ic-button-primary-icon);\n}\n\n:host(.ic-button-variant-icon-primary.monochrome) .button,\n:host(.ic-button-variant-primary.monochrome:not(.ic-button-disabled))\n  ::slotted(svg) {\n  color: var(--ic-button-primary-icon-monochrome);\n}\n\n:host(.ic-button-variant-icon-primary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n  margin: 0;\n  pointer-events: none;\n}\n\n:host(.ic-button-variant-icon.monochrome) ::slotted(a),\n:host(.ic-button-variant-icon.monochrome) ::slotted(svg) {\n  color: var(--ic-button-icon-monochrome);\n}\n\n/* Icon-secondary */\n\n:host(.ic-button-variant-icon-secondary) .button,\n:host(.ic-button-variant-icon-secondary) ::slotted(a) {\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\n\n:host(.ic-button-variant-icon-secondary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n  margin: 0;\n  pointer-events: none;\n}\n\n/* Icon-tertiary */\n\n:host(.ic-button-variant-icon-tertiary) .button,\n:host(.ic-button-variant-icon-tertiary) ::slotted(a) {\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\n\n:host(.ic-button-variant-icon-tertiary) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n  margin: 0;\n  pointer-events: none;\n}\n\n/* Icon-destructive */\n\n:host(.ic-button-variant-icon-destructive) .button,\n:host(.ic-button-variant-icon-destructive) ::slotted(a) {\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\n\n:host(.ic-button-variant-icon-destructive) .icon-container {\n  width: var(--ic-space-lg) !important;\n  height: var(--ic-space-lg) !important;\n  margin: 0;\n  pointer-events: none;\n}\n\n/* Sizing */\n\n:host(.ic-button-size-medium) .button {\n  height: var(--height, 2.5rem);\n  padding: var(--ic-space-xs) var(--ic-space-md);\n}\n\n:host(.ic-button-size-medium) ::slotted(a) {\n  height: var(--height, 2.5rem) !important;\n  padding: var(--ic-space-xs) var(--ic-space-md) !important;\n}\n\n:host(.ic-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(.ic-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(.ic-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(.ic-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(.ic-button-size-medium.ic-button-variant-icon) .button,\n:host(.ic-button-size-medium.ic-button-variant-icon-primary) .button,\n:host(.ic-button-size-medium.ic-button-variant-icon-secondary) .button,\n:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) .button,\n:host(.ic-button-size-medium.ic-button-variant-icon-destructive) .button {\n  height: var(--height, var(--ic-space-xl));\n  width: var(--ic-space-xl);\n  padding: 0.375rem;\n}\n\n:host(.ic-button-size-medium.ic-button-variant-icon-primary) ::slotted(a),\n:host(.ic-button-size-medium.ic-button-variant-icon-secondary) ::slotted(a),\n:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) ::slotted(a),\n:host(.ic-button-size-medium.ic-button-variant-icon-destructive) ::slotted(a) {\n  height: var(--height, var(--ic-space-xl)) !important;\n  width: var(--ic-space-xl) !important;\n  padding: 0.375rem !important;\n}\n\n:host(.ic-button-size-small.ic-button-variant-icon) .button,\n:host(.ic-button-size-small.ic-button-variant-icon-primary) .button,\n:host(.ic-button-size-small.ic-button-variant-icon-secondary) .button,\n:host(.ic-button-size-small.ic-button-variant-icon-tertiary) .button,\n:host(.ic-button-size-small.ic-button-variant-icon-destructive) .button {\n  height: var(--height, var(--ic-space-lg));\n  width: var(--ic-space-lg);\n  padding: var(--ic-space-xxs);\n}\n\n:host(.ic-button-size-small.ic-button-variant-icon-primary) ::slotted(a),\n:host(.ic-button-size-small.ic-button-variant-icon-secondary) ::slotted(a),\n:host(.ic-button-size-small.ic-button-variant-icon-tertiary) ::slotted(a),\n:host(.ic-button-size-small.ic-button-variant-icon-destructive) ::slotted(a),\n:host(.ic-button-size-small.ic-button-variant-icon) ::slotted(a) {\n  height: var(--height, var(--ic-space-lg)) !important;\n  width: var(--ic-space-lg) !important;\n  padding: var(--ic-space-xxs) !important;\n}\n\n:host(.ic-button-size-large.ic-button-variant-icon) .button,\n:host(.ic-button-size-large.ic-button-variant-icon-primary) .button,\n:host(.ic-button-size-large.ic-button-variant-icon-secondary) .button,\n:host(.ic-button-size-large.ic-button-variant-icon-tertiary) .button,\n:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button {\n  height: var(--height, 2.5rem);\n  width: 2.5rem;\n  padding: var(--ic-space-xs);\n}\n\n:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button,\n:host(.ic-button-size-large.ic-button-variant-icon-primary) ::slotted(a),\n:host(.ic-button-size-large.ic-button-variant-icon-secondary) ::slotted(a),\n:host(.ic-button-size-large.ic-button-variant-icon-tertiary) ::slotted(a),\n:host(.ic-button-size-large.ic-button-variant-icon-destructive) ::slotted(a),\n:host(.ic-button-size-large.ic-button-variant-icon) ::slotted(a) {\n  height: var(--height, 2.5rem) !important;\n  width: 2.5rem !important;\n  padding: var(--ic-space-xs) !important;\n}\n\n/* Width */\n:host(.ic-button-full-width),\n:host(.ic-button-full-width) .button {\n  width: 100%;\n}\n\n:host(.ic-button-full-width) ::slotted(a) {\n  width: 100% !important;\n}\n\n/* Loading */\n\ndiv.loading-container {\n  position: relative;\n  align-items: center;\n  width: 100%;\n}\n\n.loading-indicator-icon-button {\n  --circular-diameter: var(--ic-space-md);\n}\n\n:host(.ic-button-size-small) .loading-indicator-icon-button {\n  --circular-diameter: calc(var(--ic-space-sm) + var(--ic-space-xxxs));\n}\n\n:host(.ic-button-size-large) .loading-indicator-icon-button {\n  --circular-diameter: calc(var(--ic-space-sm) + var(--ic-space-xs));\n}\n\nic-loading-indicator {\n  --inner-color: var(--button-loading-inner-color);\n  --outer-color: var(--button-loading-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(.ic-button-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(.ic-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  color: var(--ic-atoms-input-search-button);\n}\n\n:host(.search-submit-button-small) ::slotted(svg) {\n  --icon-height: 1rem;\n  --icon-width: 1rem;\n\n  color: var(--ic-atoms-input-search-button);\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) .button:not(:active):focus ::slotted(svg) {\n  color: var(--ic-button-primary-text);\n}\n\n:host(.search-submit-button) {\n  display: flex;\n  align-items: center;\n  margin: 0 var(--ic-space-xxs);\n}\n\n/** CLEAR & DISMISS **/\n\n:host(.ic-button-variant-icon) .button,\n:host(.ic-button-variant-icon) ::slotted(a) {\n  background-color: inherit;\n  min-width: 0;\n  gap: var(--ic-space-xs);\n}\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}\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-color-icon-disabled-mid);\n  background: none;\n}\n\n:host(.clear-button) {\n  color: var(--ic-atoms-input-clear-button);\n  margin: 0 var(--ic-space-xxs);\n}\n\n:host(.clear-button) .button:focus,\n:host(.calendar-button) .button:focus,\n:host(.clock-button) .button:focus {\n  box-shadow: none;\n}\n\n:host(.clear-button) .button,\n:host(.clear-button) ::slotted(a) {\n  background-color: inherit;\n  color: var(--ic-atoms-input-clear-button);\n}\n\n:host(.clear-button) .button:hover,\n:host(.clear-button) ::slotted(a:hover) {\n  color: var(--ic-atoms-input-clear-button);\n}\n\n:host(.clear-button) .button:not(:active):focus ::slotted(svg) {\n  background-color: var(--ic-atoms-input-clear-button-focus-inner);\n  color: var(--ic-button-primary-text);\n\n  /* border: var(--ic-atoms-input-clear-button-focus-outer); */\n}\n\n:host(.menu-close-button) ::slotted(svg) {\n  --icon-height: 0.875rem;\n  --icon-width: 0.875rem;\n\n  color: var(--ic-top-navigation-icon-active);\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\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 **/\n\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/** menu button on top navigation\\side navigation \n  * uses secondary monochrome tokens which are duplicated here to avoid multiple copies in each component\n  */\n\n:host(#menu-button.ic-theme-dark) {\n  --ic-button-secondary-background-hover-monochrome: var(\n    --ic-action-dark-bg-hover\n  );\n  --ic-button-secondary-background-pressed-monochrome: var(\n    --ic-action-dark-bg-pressed\n  );\n  --ic-button-secondary-text-hover-monochrome: var(\n    --ic-action-monochrome-hover-dark\n  );\n  --ic-button-secondary-text-pressed-monochrome: var(\n    --ic-action-monochrome-pressed-dark\n  );\n  --ic-button-secondary-border-hover-monochrome: var(\n    --ic-color-border-neutral-hover-dark\n  );\n  --ic-button-secondary-border-pressed-monochrome: var(\n    --ic-color-border-neutral-pressed-dark\n  );\n}\n\n:host(#menu-button.ic-theme-light) {\n  --ic-button-secondary-background-hover-monochrome: var(\n    --ic-action-light-bg-hover\n  );\n  --ic-button-secondary-background-pressed-monochrome: var(\n    --ic-action-light-bg-pressed\n  );\n  --ic-button-secondary-text-hover-monochrome: var(\n    --ic-action-monochrome-hover\n  );\n  --ic-button-secondary-text-pressed-monochrome: var(\n    --ic-action-monochrome-pressed\n  );\n  --ic-button-secondary-border-hover-monochrome: var(\n    --ic-color-border-neutral-hover-light\n  );\n  --ic-button-secondary-border-pressed-monochrome: var(\n    --ic-color-border-neutral-default\n  );\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  .search-submit-button ::slotted(a),\n  .ic-button-variant-icon ::slotted(a),\n  .clear-button ::slotted(a),\n  .search-submit-button ::slotted(svg),\n  .ic-button-variant-icon ::slotted(svg),\n  .clear-button ::slotted(svg) {\n    color: HighlightText;\n  }\n\n  :host(.ic-button-variant-icon.monochrome) ::slotted(a),\n  :host(.ic-button-variant-icon.monochrome) ::slotted(svg) {\n    color: white;\n  }\n\n  :host(.clear-button) .button:not(:active):focus ::slotted(svg) {\n    color: white !important;\n    background-color: inherit;\n  }\n\n  :host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg) {\n    color: currentcolor !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  Fragment,\n} from \"@stencil/core\";\n\nimport {\n  getBrandFromContext,\n  handleHiddenFormButtonClick,\n  inheritAttributes,\n  isSlotUsed,\n  removeDisabledFalse,\n  renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport { IcButtonTypes, IcButtonVariants } from \"./ic-button.types\";\nimport {\n  IcSizes,\n  IcBrand,\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n  IcThemeMode,\n  IcButtonTooltipPlacement,\n  IcIconPlacementOptions,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/**\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 = false;\n  private id: string | null;\n  private inheritedAttributes: { [k: string]: string } = {};\n  private describedbyEl: HTMLElement | null = null;\n  private describedById?: string;\n  private mutationObserver: MutationObserver | null = null;\n  private hostMutationObserver: MutationObserver | null = null;\n  private routerSlot: HTMLElement | null;\n\n  @Element() el: HTMLIcButtonElement;\n\n  @State() ariaLabel = \"\";\n  @State() describedbyNode: Node | null;\n  @Watch(\"describedbyNode\")\n  watchDescribedbyNodeHandler(): void {\n    this.updateAriaDescribedbyClone();\n  }\n  @State() title = \"\";\n\n  /**\n   * If `fileUpload` is set to `true`, this is the accepted list of file types.\n   */\n  @Prop() accept = \"*\";\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 = 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 = 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 = 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 = false;\n\n  /**\n   * If `true`, when the button is clicked the native file explorer will be launched.\n   */\n  @Prop() fileUpload = false;\n\n  /**\n   * The name of the control for the file input, which is submitted with the form data.\n   */\n  @Prop() fileInputName = `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 = 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 = false;\n\n  /**\n   * If `true`, the button will display as monochromatic in either `light` or `dark` theme.\n   */\n  @Prop({ mutable: true }) monochrome = false;\n\n  /**\n   * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n   */\n  @Prop() multiple = 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 = \"medium\";\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   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop({ mutable: true }) theme: IcThemeMode = \"inherit\";\n\n  /**\n   * Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n   */\n  @Prop() tooltipFixedPositioning: boolean = false;\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 & tertiary variants of button will have a transparent background when not hovered, pressed or loading.\n   */\n  @Prop() transparentBackground = 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({ mutable: true }) variant: IcButtonVariants = \"primary\";\n  @Watch(\"variant\")\n  watchVariantHandler(newVariant: IcButtonVariants): void {\n    if (newVariant === \"icon\") this.variant = \"icon-tertiary\";\n  }\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    this.mutationObserver?.disconnect();\n    this.hostMutationObserver?.disconnect();\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) {\n        this.describedById = describedById;\n        const el = document.querySelector<HTMLElement>(`#${describedById}`);\n        if (el) {\n          this.describedbyEl = el;\n          this.describedbyNode = el.cloneNode(true);\n        }\n      }\n    }\n\n    if (this.variant === \"icon\") {\n      this.variant = \"icon-tertiary\";\n    }\n  }\n\n  componentDidLoad(): void {\n    this.updateTheme();\n\n    if (typeof MutationObserver !== \"undefined\") {\n      if (this.describedbyEl && 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      if (this.hasRouterSlot()) this.arrangeRouterItem();\n    }\n\n    this.updateAriaDescribedbyClone();\n  }\n\n  componentWillRender(): void {\n    const iconEl = this.getSlottedIcon(\"left\") || this.getSlottedIcon(\"right\");\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.disabled,\n          this.accept,\n          this.fileInputName,\n          this.selectedFiles\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(\"brandChange\", { target: \"document\" })\n  brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n    this.updateTheme(detail.mode);\n  }\n\n  /**\n   * Sets focus on the native `button`.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.buttonEl?.focus();\n  }\n\n  private async closeButtonTooltip(ev: KeyboardEvent) {\n    const tooltip = this.el.shadowRoot?.querySelector(\"ic-tooltip\");\n    if (tooltip && (await tooltip.isTooltipVisible())) {\n      tooltip.displayTooltip(false);\n      ev.preventDefault();\n      ev.stopImmediatePropagation();\n    }\n  }\n\n  private getSlottedIcon = (position: IcIconPlacementOptions) =>\n    this.el.querySelector(`[slot=\"${position}-icon\"]`);\n\n  private hasRouterSlot() {\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 = () => {\n    if (\n      (this.el.type === \"submit\" || this.el.type === \"reset\") &&\n      !this.hasRouterSlot() &&\n      (this.form || !!this.el.closest(\"FORM\"))\n    ) {\n      const form = this.form\n        ? document.querySelector<HTMLFormElement>(`form[id=${this.form}]`)\n        : this.el.closest<HTMLFormElement>(\"FORM\");\n\n      handleHiddenFormButtonClick(form, this.el);\n    }\n  };\n\n  private handleKeyDown = (ev: KeyboardEvent) => {\n    if (ev.key === \"Escape\" && this.hasTooltip) {\n      this.closeButtonTooltip(ev);\n    }\n  };\n\n  private onFocus = () => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.icBlur.emit();\n  };\n\n  private updateTheme(mode: IcBrandForeground | null = null) {\n    const foregroundColor = getBrandFromContext(this.el, mode);\n    if (foregroundColor !== IcBrandForegroundEnum.Default) {\n      this.theme =\n        foregroundColor === IcBrandForegroundEnum.Light\n          ? IcBrandForegroundEnum.Dark\n          : IcBrandForegroundEnum.Light;\n      this.monochrome = true;\n    }\n  }\n\n  /**\n   * Creates/updates clone of aria-describedby element node tree in shadow dom\n   * Required due to ids being scoped to the shadow dom\n   */\n  private updateAriaDescribedbyClone = () => {\n    if (this.describedbyNode) {\n      const wrapper = this.el.shadowRoot?.querySelector(\"#describedby-wrapper\");\n      if (!wrapper) {\n        this.el.shadowRoot?.appendChild(\n          Object.assign(document.createElement(\"div\"), {\n            id: \"describedby-wrapper\",\n            className: \"ic-button-describedby\",\n          })\n        );\n      }\n\n      while (wrapper?.firstChild) wrapper.firstChild.remove();\n      wrapper?.appendChild(this.describedbyNode);\n    }\n  };\n\n  /**\n   * Triggered when light dom aria-describedby element updates\n   */\n  private mutationCallback = () => {\n    if (this.describedbyEl)\n      this.describedbyNode = this.describedbyEl?.cloneNode(true);\n  };\n\n  /**\n   * Triggered when attributes of host element change\n   * @param mutationList the list of changes made to the host element\n   */\n  private hostMutationCallback = (mutationList: MutationRecord[]) => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(({ attributeName }) => {\n      if (attributeName) {\n        const attribute = this.el.getAttribute(attributeName);\n        if (attribute) {\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      }\n    });\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  private setHasTooltip = () => {\n    this.hasTooltip =\n      !this.disableTooltip && (!!this.title || !!this.isIconVariant());\n  };\n\n  private isIconVariant = () => this.variant.startsWith(\"icon\");\n\n  private arrangeRouterItem = () => {\n    const setStyles = (\n      element: HTMLElement | SVGElement,\n      styles: { [key: string]: string }\n    ) => {\n      Object.entries(styles).forEach(([key, value]) => {\n        element.style.setProperty(key, value);\n      });\n    };\n\n    if (this.routerSlot) {\n      const icTypography = document.createElement(\"ic-typography\");\n\n      setStyles(icTypography, {\n        \"font-family\": \"var(--ic-font-body-family)\",\n        \"font-size\": \"0.875rem\",\n        \"font-weight\": \"600\",\n      });\n      setStyles(this.routerSlot, {\n        gap: \"0\",\n      });\n\n      const icon = this.routerSlot.querySelector(\"svg\");\n      const iconSlot = icon?.getAttribute(\"slot\");\n      const iconWrapper = document.createElement(\"div\");\n\n      if (icon) {\n        setStyles(icon, {\n          fill: \"currentcolor\",\n        });\n\n        if (iconSlot === \"top-icon\") {\n          setStyles(this.routerSlot, {\n            display: \"flex\",\n            \"flex-direction\": \"column\",\n            \"--height\": \"fit-content\",\n          });\n        } else if (iconSlot) {\n          const marginPlacement = iconSlot === \"left-icon\" ? \"right\" : \"left\";\n          setStyles(iconWrapper, {\n            [`margin-${marginPlacement}`]: \"var(--ic-space-xs)\",\n          });\n        }\n\n        iconWrapper.append(icon);\n      }\n\n      const badge = this.routerSlot.querySelector(\"ic-badge\");\n      const label = this.routerSlot.textContent?.trim();\n\n      if (badge) iconWrapper.append(badge);\n      if (label) icTypography.textContent = label;\n\n      this.routerSlot.textContent = \"\";\n\n      if (iconSlot === \"right-icon\") {\n        this.routerSlot.append(icTypography);\n        this.routerSlot.append(iconWrapper);\n      } else {\n        this.routerSlot.append(iconWrapper);\n        this.routerSlot.append(icTypography);\n      }\n    }\n  };\n\n  render() {\n    const {\n      ariaControlsId,\n      ariaLabel,\n      ariaOwnsId,\n      buttonIdNum,\n      describedById,\n      disabled,\n      download,\n      dropdown,\n      dropdownExpanded,\n      form,\n      formaction,\n      formenctype,\n      formmethod,\n      formnovalidate,\n      formtarget,\n      fullWidth,\n      handleClick,\n      handleKeyDown,\n      hasTooltip,\n      href,\n      hreflang,\n      id,\n      inheritedAttributes,\n      isIconVariant,\n      loading,\n      monochrome,\n      onBlur,\n      onFocus,\n      referrerpolicy,\n      rel,\n      size,\n      target,\n      theme,\n      title,\n      tooltipFixedPositioning,\n      tooltipPlacement,\n      transparentBackground,\n      type,\n      variant,\n    } = this;\n\n    const TagType = href ? \"a\" : \"button\";\n    const buttonAttrs =\n      TagType === \"button\"\n        ? {\n            type,\n            disabled,\n            form,\n            formaction,\n            formenctype,\n            formmethod,\n            formnovalidate,\n            formtarget,\n          }\n        : {\n            download: download !== false ? download : null,\n            href,\n            rel,\n            target,\n            referrerpolicy,\n            hreflang,\n          };\n\n    const buttonId = hasTooltip\n      ? `ic-button-with-tooltip-${id || buttonIdNum}`\n      : undefined;\n\n    const describedby = !hasTooltip ? describedById : `ic-tooltip-${buttonId}`;\n\n    const hasLeftIcon = !!this.getSlottedIcon(\"left\");\n    const hasRightIcon = !!this.getSlottedIcon(\"right\");\n\n    const ButtonContent = () =>\n      this.hasRouterSlot() ? (\n        <slot name=\"router-item\"></slot>\n      ) : (\n        <TagType\n          class=\"button\"\n          tabindex={0}\n          aria-disabled={loading || disabled ? \"true\" : null}\n          aria-label={loading ? \"Loading\" : ariaLabel}\n          aria-expanded={dropdown && `${dropdownExpanded}`}\n          {...buttonAttrs}\n          {...inheritedAttributes}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          ref={(el) => (this.buttonEl = el)}\n          aria-describedby={describedby}\n          part=\"button\"\n        >\n          {loading ? (\n            <div class=\"loading-container\">\n              <ic-loading-indicator\n                type={isIconVariant() ? \"circular\" : \"linear\"}\n                class={{ \"loading-indicator-icon-button\": isIconVariant() }}\n                monochrome={monochrome}\n                theme={theme}\n              ></ic-loading-indicator>\n            </div>\n          ) : (\n            <Fragment>\n              {(hasLeftIcon ||\n                (!!this.getSlottedIcon(\"top\") && !hasRightIcon)) && (\n                <div class=\"icon-container\">\n                  <slot name={`${hasLeftIcon ? \"left\" : \"top\"}-icon`} />\n                </div>\n              )}\n              <slot />\n              {!dropdown\n                ? hasRightIcon && (\n                    <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n                      <slot name=\"right-icon\" />\n                    </div>\n                  )\n                : variant !== \"icon\" &&\n                  variant !== \"destructive\" && (\n                    <span\n                      class={\n                        dropdownExpanded\n                          ? \"dropdown-expanded\"\n                          : \"arrow-dropdown\"\n                      }\n                      innerHTML={arrowDropdown}\n                    />\n                  )}\n            </Fragment>\n          )}\n        </TagType>\n      );\n\n    return (\n      <Host\n        class={{\n          \"ic-button-disabled\": disabled && !loading,\n          \"ic-button-full-width\": fullWidth,\n          \"ic-button-loading\": loading,\n          [`ic-button-size-${size}`]: true,\n          [`ic-button-variant-${variant}`]: true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n          background:\n            (variant === \"secondary\" || variant === \"tertiary\") &&\n            !transparentBackground &&\n            !disabled,\n          \"dropdown-no-icon\":\n            dropdown &&\n            !isSlotUsed(this.el, \"icon\") &&\n            !isSlotUsed(this.el, \"left-icon\"),\n          monochrome,\n          \"top-icon\": isSlotUsed(this.el, \"top-icon\"),\n          \"with-badge\": isSlotUsed(this.el, \"badge\"),\n        }}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        aria-owns={ariaOwnsId}\n        aria-controls={ariaControlsId}\n        aria-expanded={dropdown && `${dropdownExpanded}`}\n      >\n        {hasTooltip && (\n          <ic-tooltip\n            id={describedby}\n            label={title || ariaLabel}\n            target={buttonId}\n            placement={tooltipPlacement}\n            fixedPositioning={tooltipFixedPositioning}\n            silent={isIconVariant() && !!ariaLabel}\n          >\n            <ButtonContent />\n          </ic-tooltip>\n        )}\n        {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n        {!hasTooltip && <ButtonContent />}\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --circular-diameter: Diameter of the circular-indicator in px, rem or %\n   */\n\n  display: block;\n\n  --linear-border-radius: 0.25rem;\n  --inner-color: var(--ic-loading-indicator-inner-color);\n  --outer-color: var(--ic-loading-indicator-outer-color);\n  --label-color: var(--ic-loading-indicator-label-color);\n  --margin: none;\n  --linear-line-height: var(--ic-space-xs);\n}\n\n:host(.ic-loading-indicator-monochrome) {\n  --inner-color: var(--ic-loading-indicator-inner-color-monochrome);\n  --outer-color: var(--ic-loading-indicator-outer-color-monochrome);\n  --label-color: var(--ic-loading-indicator-label-color-monochrome);\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(.ic-loading-indicator-size-small) {\n  --circular-diameter: 2.5rem;\n  --linear-line-height: var(--ic-space-xxs);\n}\n\n:host(.ic-loading-indicator-size-medium) {\n  --circular-diameter: 5rem;\n}\n\n:host(.ic-loading-indicator-size-large) {\n  --circular-diameter: 7.5rem;\n}\n\n:host(.ic-loading-indicator-size-icon) {\n  display: inline-block;\n\n  --margin: var(--ic-space-xxxs);\n  --circular-diameter: 1.25rem;\n}\n\n:host(.ic-loading-indicator-label) {\n  --margin: 0 0 var(--ic-space-xs) 0;\n}\n\n.ic-loading-label {\n  --ic-typography-color: var(--label-color);\n\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-circular-outer[aria-valuenow=\"0\"] .ic-loading-circular-inner,\n.ic-loading-linear-outer[aria-valuenow=\"0\"] .ic-loading-linear-inner {\n  --inner-color: var(--outer-color);\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(.ic-loading-indicator-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.inner-label {\n  height: 100%;\n  display: grid;\n}\n\n.inner-label .ic-loading-circular-svg,\n.inner-text {\n  grid-column: 1;\n  grid-row: 1;\n}\n\n/** ic-stepper **/\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\n  --ic-typography-color: var(\n    --ic-step-indicator-text-current,\n    var(--ic-status-info-default)\n  );\n}\n\n:host(.not-required.compact-step-progress-indicator) .inner-text {\n  --ic-typography-color: var(--ic-step-indicator-text-disabled);\n}\n\n:host(.ic-loading-indicator-light.not-required.compact-step-progress-indicator)\n  .inner-text {\n  --ic-typography-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-border-hc);\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 { IcThemeMode } from \"../../utils/types\";\n\nconst LOADING_INDICATOR_WIDTHS = {\n  large: 120,\n  medium: 80,\n  small: 40,\n  icon: 20,\n};\n\n@Component({\n  tag: \"ic-loading-indicator\",\n  styleUrl: \"ic-loading-indicator.css\",\n  shadow: true,\n})\nexport class LoadingIndicator {\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 = 0;\n  @State() circularLineWidth = 0;\n  @State() circularDimensions: IcLoadingCircleXYR = {\n    x: 0,\n    y: 0,\n    r: 0,\n  };\n  @State() indicatorLabel?: string;\n  @State() clipInnerElement = false;\n  @State() internalType: IcLoadingTypes = \"circular\";\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 = \"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 = 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 label to be displayed beneath the loading indicator.\n   * Display a changing label by supplying an array of messages.\n   */\n  @Prop() label?: string | string[];\n  @Watch(\"label\")\n  watchPropHandler(): void {\n    this.updateLabel();\n  }\n\n  /**\n   * The time in milliseconds before the label changes.\n   */\n  @Prop() labelDuration = 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 = 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 = 0;\n\n  /**\n   * If `true`, the element will display as black and white.\n   */\n  @Prop() monochrome = false;\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  @Watch(\"max\")\n  @Watch(\"min\")\n  @Watch(\"progress\")\n  handleProgressChange(): void {\n    if (this.internalType === \"linear\") {\n      this.setLinearDeterminateWidth();\n    } else {\n      this.setCircleDimensions();\n    }\n  }\n\n  /**\n   * The size of the loading indicator.\n   */\n  @Prop({ reflect: true }) size: IcLoadingSizes = \"medium\";\n  @Watch(\"size\")\n  handleIconSize(): void {\n    this.setIndicatorDimensions();\n  }\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n\n  /**\n   * The type of indicator, either linear or circular. When size is set to 'icon' the type will be set to circular.\n   */\n  @Prop({ reflect: true }) type: IcLoadingTypes = \"circular\";\n  @Watch(\"type\")\n  setIndicatorDimensions(): void {\n    this.setInternalType();\n    if (this.internalType === \"circular\") {\n      // Sets the circular indicator line width - accounting for the circle size being altered using the CSS custom property\n      const diameter = this.calculateWidth();\n      if (this.outerElement && diameter !== this.circularDiameter) {\n        this.circularLineWidth = diameter * 0.1;\n        this.circularDiameter = diameter;\n        this.outerElement.style.setProperty(\n          \"--circular-line-width\",\n          `${this.circularLineWidth}px`\n        );\n      }\n      this.setCircleDimensions();\n    } else {\n      this.setLinearDeterminateWidth();\n    }\n  }\n\n  disconnectedCallback(): void {\n    clearInterval(this.interval);\n  }\n\n  componentWillLoad(): void {\n    this.updateLabel();\n    this.el.setAttribute(\"exportparts\", \"ic-loading-container\");\n  }\n\n  componentDidLoad(): void {\n    this.setIndicatorDimensions();\n  }\n\n  private getLabel = (labelIndex: number) =>\n    new Promise(() => {\n      this.interval = setInterval(() => {\n        if (labelIndex < this.labelList.length - 1) {\n          labelIndex++;\n        } else {\n          labelIndex = 0;\n        }\n        this.indicatorLabel = this.labelList[labelIndex];\n      }, this.labelDuration);\n    });\n\n  private getLabelVariant = () => {\n    const width = this.internalType === \"circular\" ? this.calculateWidth() : 0;\n\n    if (this.size === \"small\" || (width && width < 60)) {\n      return \"label\";\n    } else if (this.size === \"large\" || width >= 120) {\n      return \"h2\";\n    }\n    return \"h4\";\n  };\n\n  private calculateWidth = () => {\n    if (this.outerElement?.offsetWidth) return this.outerElement.offsetWidth;\n\n    if (this.outerElement) {\n      const { width } = window.getComputedStyle(this.outerElement);\n\n      if (width) {\n        // Regex to check the units of the css string\n        if (width.match(/\\D+$/)?.[0] !== \"%\") return parseFloat(width);\n\n        const parentWidth = this.outerElement.parentElement?.offsetWidth;\n        if (parentWidth) return parentWidth * (parseFloat(width) / 100);\n      }\n    }\n\n    return LOADING_INDICATOR_WIDTHS[this.size];\n  };\n\n  private calculateProportion = (progress: number) => {\n    const minProgress = Math.min(this.max, Math.max(this.min, progress));\n    return (minProgress - this.min) / (this.max - this.min);\n  };\n\n  private setLinearDeterminateWidth = () => {\n    // Ensure progress cannot be out of bounds\n    if (!this.innerElement || !this.progress) return;\n\n    const proportion = this.calculateProportion(this.progress);\n    this.clipInnerElement = proportion > 0.5;\n    if (this.clipInnerElement) {\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 setInternalType = () => {\n    this.internalType = this.type;\n    if (this.type == \"linear\") {\n      this.internalType = this.size == \"icon\" ? \"circular\" : \"linear\";\n    }\n  };\n\n  private updateLabel = () => {\n    if (!this.label) return;\n\n    if (typeof this.label === \"string\") {\n      this.indicatorLabel = this.label;\n    } else {\n      this.labelList = this.label;\n      this.indicatorLabel = this.labelList[0];\n      if (this.labelList.length > 1) {\n        this.getLabel(0);\n      }\n    }\n  };\n\n  private setCircleDimensions = () => {\n    if (this.circularDiameter <= 0) return;\n\n    const r = this.circularDiameter / 2;\n    const nextRadius = r - this.circularLineWidth / 2;\n    const dashArray = 2 * Math.PI * nextRadius;\n\n    this.circularDimensions = {\n      x: r,\n      y: r,\n      r: nextRadius,\n      dashArray: `${dashArray}px`,\n      dashOffset: this.progress\n        ? `${(-1 - this.calculateProportion(this.progress)) * dashArray}px`\n        : undefined,\n    };\n  };\n\n  render() {\n    const {\n      circularDiameter,\n      circularDimensions: { x, y, r, dashArray, dashOffset },\n      description,\n      fullWidth,\n      indicatorLabel,\n      innerLabel,\n      internalType,\n      label,\n      max,\n      min,\n      monochrome,\n      progress,\n      size,\n      theme,\n    } = this;\n\n    return (\n      <Host\n        class={{\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n          \"ic-loading-indicator-full-width\": fullWidth,\n          \"ic-loading-indicator-label\": !!label,\n          \"ic-loading-indicator-monochrome\": monochrome,\n          [`ic-loading-indicator-size-${size}`]: true,\n        }}\n      >\n        <div class=\"ic-loading-container\" part=\"ic-loading-container\">\n          <div\n            ref={(el) => (this.outerElement = el)}\n            class={{\n              [`ic-loading-${internalType}-outer`]: true,\n              [progress === undefined ? \"indeterminate\" : \"determinate\"]: true,\n            }}\n            role=\"progressbar\"\n            aria-labelledby={label && size !== \"icon\" && \"ic-loading-label\"}\n            aria-label={description}\n            aria-valuenow={progress}\n            aria-valuemin={min}\n            aria-valuemax={max}\n          >\n            <div\n              ref={(el) => (this.innerElement = el)}\n              class={{\n                [`ic-loading-${internalType}-inner`]: true,\n                \"inner-label\": !!innerLabel,\n              }}\n            >\n              {innerLabel && size === \"small\" && (\n                <ic-typography variant=\"subtitle-small\" class=\"inner-text\">\n                  {innerLabel}\n                </ic-typography>\n              )}\n              {internalType === \"circular\" && (\n                <svg\n                  class=\"ic-loading-circular-svg\"\n                  viewBox={`0 0 ${circularDiameter} ${circularDiameter}`}\n                >\n                  <circle cx={x} cy={y} r={r}></circle>\n                  <circle\n                    style={{\n                      \"--circular-steps-max\": progress ? `${max}` : undefined,\n                      \"--progress-value\":\n                        progress !== undefined ? `${progress}` : undefined,\n                      \"--stroke-dasharray\": dashArray,\n                      \"--stroke-dashoffset\": dashOffset,\n                    }}\n                    cx={x}\n                    cy={y}\n                    r={r}\n                  ></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=\"alert\"\n              variant={this.getLabelVariant()}\n            >\n              <p>{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  --ic-tooltip-background: var(--ic-color-background-primary-dark);\n  --ic-tooltip-text: var(--ic-color-text-primary-dark);\n  --ic-tooltip-border: var(--ic-color-border-neutral-grey-light);\n}\n\n:host(.ic-tooltip) .ic-tooltip-container {\n  background-color: var(--ic-tooltip-background);\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-tooltip-border);\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  width: max-content;\n}\n\n:host(.ic-tooltip) ic-typography {\n  --ic-typography-color: var(--ic-tooltip-text);\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-tooltip-border);\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(.ic-tooltip-on-dialog) {\n  display: inline-block;\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-border-hc);\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { Instance, Options, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport {\n  isSafari,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\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 dialogContentArea: HTMLDivElement | null;\n  private instantHideEvents = [\"focusout\"];\n  private mouseOverTool: boolean = false;\n  private persistTooltip = false;\n  private popperInstance: Instance;\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   * 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  @Watch(\"disableClick\")\n  watchDisableClickHandler(): void {\n    if (this.disableClick) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * If `true`, the tooltip will not be displayed on hover, it will require a click.\n   */\n  @Prop() disableHover?: boolean = false;\n\n  @Watch(\"disableHover\")\n  watchDisableHoverHandler(): void {\n    if (this.disableHover) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n   */\n  @Prop() fixedPositioning: 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() 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   * Sets the tooltip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * The text to display on the tooltip.\n   */\n  @Prop() label!: string;\n  @Watch(\"label\")\n  watchLabelHandler(): void {\n    if (this.toolTip?.hasAttribute(\"data-show\") && this.popperInstance) {\n      this.popperInstance.update();\n    }\n  }\n\n  @State() popperProps: Partial<Options> = {};\n\n  /**\n   * @internal This method allows props to be added to the PopperJS createPopper instance outside of tooltip\n   * @param props object - createPopper props set externally\n   */\n  @Method()\n  async setExternalPopperProps<T extends Partial<Options>>(props: T) {\n    this.popperProps = props;\n  }\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    let dialog: HTMLIcDialogElement | null;\n    if ((this.el.getRootNode() as ShadowRoot).host) {\n      dialog = (this.el.getRootNode() as ShadowRoot).host.closest(\"ic-dialog\");\n    } else {\n      dialog = this.el.closest(\"ic-dialog\");\n    }\n    this.dialogContentArea =\n      dialog?.shadowRoot?.querySelector(\".content-area\") ?? 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 &&\n      this.maxLines > 0 &&\n      typographyEl?.setAttribute(\n        \"style\",\n        `--truncation-max-lines: ${this.maxLines}`\n      );\n  }\n  /**\n   * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n   * @param show Whether to show or hide the tooltip\n   * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n   */\n  @Method()\n  async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n    this.persistTooltip = !!persistTooltip;\n    show ? this.show() : this.hide();\n  }\n\n  /**\n   * @internal Method to return if tooltip is currently visible.\n   */\n  @Method()\n  async isTooltipVisible(): Promise<boolean> {\n    return Promise.resolve(this.toolTip.hasAttribute(\"data-show\"));\n  }\n\n  private show = () => {\n    if (this.label) {\n      this.toolTip.setAttribute(\"data-show\", \"\");\n\n      if (this.dialogContentArea) {\n        this.el.classList.add(\"ic-tooltip-on-dialog\");\n      }\n\n      this.popperInstance = createPopper(this.el, this.toolTip, {\n        strategy: this.fixedPositioning ? \"fixed\" : \"absolute\",\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          ...(this.dialogContentArea\n            ? [\n                {\n                  name: \"preventOverflow\",\n                  options: {\n                    boundary: this.dialogContentArea,\n                    padding: 8,\n                  },\n                },\n                {\n                  name: \"flip\",\n                  options: {\n                    boundary: this.dialogContentArea,\n                  },\n                },\n              ]\n            : []),\n        ],\n        ...this.popperProps,\n      });\n    } else {\n      console.warn(`Tooltip can't display without prop 'label' set`);\n    }\n  };\n\n  private hide = () => {\n    if (this.toolTip !== undefined) {\n      this.toolTip.removeAttribute(\"data-show\");\n      this.persistTooltip = false;\n    }\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  };\n\n  private checkCloseTooltip = () => {\n    setTimeout(() => {\n      if (!this.mouseOverTool && !this.persistTooltip) {\n        this.hide();\n      }\n    }, 100);\n  };\n\n  private mouseEnterTooltip = () => {\n    this.mouseOverTool = true;\n  };\n\n  private mouseLeaveTooltip = () => {\n    this.mouseOverTool = false;\n    this.checkCloseTooltip();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && !this.persistTooltip) {\n      this.hide();\n    }\n  };\n\n  private manageEventListeners = (action: \"add\" | \"remove\") => {\n    const method =\n      action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n    this.showEvents.forEach((event) => {\n      if (event) {\n        this.el[method](event, this.show);\n        if (this.toolTip !== undefined) {\n          this.toolTip[method](event, this.mouseEnterTooltip);\n        }\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 as EventListener);\n  };\n\n  private updateTooltipEvents = () => {\n    this.manageEventListeners(\"remove\");\n    this.showEvents = [\n      !this.disableHover && \"mouseenter\",\n      !this.disableHover && \"focusin\",\n      !this.disableClick && \"click\",\n    ];\n    this.manageEventListeners(\"add\");\n  };\n\n  render() {\n    const { label, maxLines, silent, theme } = this;\n    return (\n      <Host\n        class={{\n          \"ic-tooltip\": true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n        aria-label={isSafari && label} // accessible name needs to be in light dom to be announced by VoiceOver. Replace in v4 as aria-label on element with no role is not well-supported\n      >\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":"kaAAA,MAAMA,EAAc,k2nCACpB,MAAAC,EAAeD,E,8WCoCf,IAAIE,EAAY,E,MAgBHC,EAAM,MAPnB,WAAAC,CAAAC,G,2HASUC,KAAAC,YAAcL,IACdI,KAAAE,WAAa,MAEbF,KAAAG,oBAA+C,GAC/CH,KAAAI,cAAoC,KAEpCJ,KAAAK,iBAA4C,KAC5CL,KAAAM,qBAAgD,KAK/CN,KAAAO,UAAY,GAMZP,KAAAQ,MAAQ,GAKTR,KAAAS,OAAS,IAeTT,KAAAU,SAAW,MASXV,KAAAW,eAAiB,MAKjBX,KAAAY,SAA6B,MAK7BZ,KAAAa,SAAW,MAKqBb,KAAAc,iBAAmB,MAKnDd,KAAAe,WAAa,MAKbf,KAAAgB,cAAgB,+BAA+BpB,MAmC/CI,KAAAiB,UAAY,MAeZjB,KAAAkB,QAAU,MAKOlB,KAAAmB,WAAa,MAK9BnB,KAAAoB,SAAW,MAoBXpB,KAAAqB,KAAgB,SAUCrB,KAAAsB,MAAqB,UAKtCtB,KAAAuB,wBAAmC,MAKnCvB,KAAAwB,iBAA6C,SAK7CxB,KAAAyB,sBAAwB,KAKxBzB,KAAA0B,KAAsB,SAKL1B,KAAA2B,QAA4B,UAmJ7C3B,KAAA4B,eAAkBC,GACxB7B,KAAK8B,GAAGC,cAAc,UAAUF,YAU1B7B,KAAAgC,YAAc,KACpB,IACGhC,KAAK8B,GAAGJ,OAAS,UAAY1B,KAAK8B,GAAGJ,OAAS,WAC9C1B,KAAKiC,kBACLjC,KAAKkC,QAAUlC,KAAK8B,GAAGK,QAAQ,SAChC,CACA,MAAMD,EAAOlC,KAAKkC,KACdE,SAASL,cAA+B,WAAW/B,KAAKkC,SACxDlC,KAAK8B,GAAGK,QAAyB,QAErCE,EAA4BH,EAAMlC,KAAK8B,G,GAInC9B,KAAAsC,cAAiBC,IACvB,GAAIA,EAAGC,MAAQ,UAAYxC,KAAKE,WAAY,CAC1CF,KAAKyC,mBAAmBF,E,GAIpBvC,KAAA0C,QAAU,KAChB1C,KAAK2C,QAAQC,MAAM,EAGb5C,KAAA6C,OAAS,KACf7C,KAAK8C,OAAOF,MAAM,EAkBZ5C,KAAA+C,2BAA6B,K,QACnC,GAAI/C,KAAKgD,gBAAiB,CACxB,MAAMC,GAAUC,EAAAlD,KAAK8B,GAAGqB,cAAU,MAAAD,SAAA,SAAAA,EAAEnB,cAAc,wBAClD,IAAKkB,EAAS,EACZG,EAAApD,KAAK8B,GAAGqB,cAAU,MAAAC,SAAA,SAAAA,EAAEC,YAClBC,OAAOC,OAAOnB,SAASoB,cAAc,OAAQ,CAC3CC,GAAI,sBACJC,UAAW,0B,CAKjB,MAAOT,IAAO,MAAPA,SAAO,SAAPA,EAASU,WAAYV,EAAQU,WAAWC,SAC/CX,IAAO,MAAPA,SAAO,SAAPA,EAASI,YAAYrD,KAAKgD,gB,GAOtBhD,KAAA6D,iBAAmB,K,MACzB,GAAI7D,KAAKI,cACPJ,KAAKgD,iBAAkBE,EAAAlD,KAAKI,iBAAa,MAAA8C,SAAA,SAAAA,EAAEY,UAAU,KAAK,EAOtD9D,KAAA+D,qBAAwBC,IAC9B,IAAIC,EAAuB,MAC3BD,EAAaE,SAAQ,EAAGC,oBACtB,GAAIA,EAAe,CACjB,MAAMC,EAAYpE,KAAK8B,GAAGuC,aAAaF,GACvC,GAAIC,EAAW,CACb,GAAID,IAAkB,QAASnE,KAAKQ,MAAQ4D,OACvC,GAAID,IAAkB,aAAcnE,KAAKO,UAAY6D,EAE1D,GAAIE,EAAkBC,SAASJ,GAAgB,CAC7CnE,KAAKG,oBAAoBgE,GAAiBC,EAC1CH,EAAuB,I,OAK/B,GAAIA,EAAsB,CACxBO,EAAYxE,K,GAIRA,KAAAyE,cAAgB,KACtBzE,KAAKE,YACFF,KAAKW,mBAAqBX,KAAKQ,SAAWR,KAAK0E,gBAAgB,EAG5D1E,KAAA0E,cAAgB,IAAM1E,KAAK2B,QAAQgD,WAAW,QAE9C3E,KAAA4E,kBAAoB,K,MAC1B,MAAMC,EAAY,CAChBC,EACAC,KAEAzB,OAAO0B,QAAQD,GAAQb,SAAQ,EAAE1B,EAAKyC,MACpCH,EAAQI,MAAMC,YAAY3C,EAAKyC,EAAM,GACrC,EAGJ,GAAIjF,KAAKoF,WAAY,CACnB,MAAMC,EAAejD,SAASoB,cAAc,iBAE5CqB,EAAUQ,EAAc,CACtB,cAAe,6BACf,YAAa,WACb,cAAe,QAEjBR,EAAU7E,KAAKoF,WAAY,CACzBE,IAAK,MAGP,MAAMC,EAAOvF,KAAKoF,WAAWrD,cAAc,OAC3C,MAAMyD,EAAWD,IAAI,MAAJA,SAAI,SAAJA,EAAMlB,aAAa,QACpC,MAAMoB,EAAcrD,SAASoB,cAAc,OAE3C,GAAI+B,EAAM,CACRV,EAAUU,EAAM,CACdG,KAAM,iBAGR,GAAIF,IAAa,WAAY,CAC3BX,EAAU7E,KAAKoF,WAAY,CACzBO,QAAS,OACT,iBAAkB,SAClB,WAAY,e,MAET,GAAIH,EAAU,CACnB,MAAMI,EAAkBJ,IAAa,YAAc,QAAU,OAC7DX,EAAUY,EAAa,CACrB,CAAC,UAAUG,KAAoB,sB,CAInCH,EAAYI,OAAON,E,CAGrB,MAAMO,EAAQ9F,KAAKoF,WAAWrD,cAAc,YAC5C,MAAMgE,GAAQ7C,EAAAlD,KAAKoF,WAAWY,eAAW,MAAA9C,SAAA,SAAAA,EAAE+C,OAE3C,GAAIH,EAAOL,EAAYI,OAAOC,GAC9B,GAAIC,EAAOV,EAAaW,YAAcD,EAEtC/F,KAAKoF,WAAWY,YAAc,GAE9B,GAAIR,IAAa,aAAc,CAC7BxF,KAAKoF,WAAWS,OAAOR,GACvBrF,KAAKoF,WAAWS,OAAOJ,E,KAClB,CACLzF,KAAKoF,WAAWS,OAAOJ,GACvBzF,KAAKoF,WAAWS,OAAOR,E,IA1e7B,2BAAAa,GACElG,KAAK+C,4B,CAwBP,oBAAAoD,GACEC,EAAoBpG,KAAKU,SAAUV,KAAK8B,G,CAoJ1C,mBAAAuE,CAAoBC,GAClB,GAAIA,IAAe,OAAQtG,KAAK2B,QAAU,e,CAkB5C,oBAAA4E,G,SACErD,EAAAlD,KAAKK,oBAAgB,MAAA6C,SAAA,SAAAA,EAAEsD,cACvBpD,EAAApD,KAAKM,wBAAoB,MAAA8C,SAAA,SAAAA,EAAEoD,Y,CAG7B,mBAAAC,GACE,GAAIzG,KAAKkB,QAAS,CAChBlB,KAAK8B,GAAGoD,MAAMC,YACZ,cACA,GAAGnF,KAAK8B,GAAG4E,wBAAwBC,U,CAGvC3G,KAAKyE,e,CAGP,iBAAAmC,GACE,MAAM1D,EAIF2D,EAAkB7G,KAAK8B,GAAI,IAAIwC,EAAmB,WAJhD9D,MACJA,EACA,aAAcD,GAAS2C,EACpB4D,EAAuBC,EAAA7D,EAHtB,wBAMNlD,KAAKQ,MAAQA,EACbR,KAAKO,UAAYA,EACjBP,KAAKG,oBAAsB2G,EAE3BV,EAAoBpG,KAAKU,SAAUV,KAAK8B,IAExC9B,KAAK8B,GAAGkF,aAAa,cAAe,UAEpChH,KAAKyD,GAAKzD,KAAK8B,GAAG2B,IAAM,KACxBzD,KAAKyE,gBAEL,IAAKzE,KAAKE,WAAY,CACpB,MAAM+G,EAAgBjH,KAAKG,oBAAoB,oBAC/C,GAAI8G,EAAe,CACjBjH,KAAKiH,cAAgBA,EACrB,MAAMnF,EAAKM,SAASL,cAA2B,IAAIkF,KACnD,GAAInF,EAAI,CACN9B,KAAKI,cAAgB0B,EACrB9B,KAAKgD,gBAAkBlB,EAAGgC,UAAU,K,GAK1C,GAAI9D,KAAK2B,UAAY,OAAQ,CAC3B3B,KAAK2B,QAAU,e,EAInB,gBAAAuF,GACElH,KAAKmH,cAEL,UAAWC,mBAAqB,YAAa,CAC3C,GAAIpH,KAAKI,eAAiBJ,KAAKiH,cAAe,CAC5CjH,KAAKK,iBAAmB,IAAI+G,iBAAiBpH,KAAK6D,kBAClD7D,KAAKK,iBAAiBgH,QAAQrH,KAAKI,cAAe,CAChDkH,cAAe,KACfC,UAAW,KACXC,QAAS,M,CAIbxH,KAAKM,qBAAuB,IAAI8G,iBAC9BpH,KAAK+D,sBAEP/D,KAAKM,qBAAqB+G,QAAQrH,KAAK8B,GAAI,CACzC2F,WAAY,OAGd,GAAIzH,KAAKiC,gBAAiBjC,KAAK4E,mB,CAGjC5E,KAAK+C,4B,CAGP,mBAAA2E,GACE,MAAMC,EAAS3H,KAAK4B,eAAe,SAAW5B,KAAK4B,eAAe,SAClE+F,IAAM,MAANA,SAAM,SAANA,EAAQX,aAAa,UAAW,Y,CAIlC,eAAAY,CAAgBC,GACd,IAAK7H,KAAKiC,gBAAiB,CACzB,GAAIjC,KAAKe,WAAY,CACnB+G,EACE9H,KAAK+H,gBACL/H,KAAK8B,KACH9B,KAAKoB,WACLpB,KAAKU,SACPV,KAAKS,OACLT,KAAKgB,cACLhB,KAAKgI,c,CAGT,GAAIhI,KAAKU,UAAYV,KAAKkB,QAAS,CACjC2G,EAAMI,0B,CAER,GAAIjI,KAAKa,SAAU,CACjBb,KAAKc,kBAAoBd,KAAKc,gB,GAMpC,kBAAAoH,EAAmBC,OAAEA,IACnBnI,KAAKmH,YAAYgB,EAAOC,K,CAO1B,cAAMC,G,OACJnF,EAAAlD,KAAKsI,YAAQ,MAAApF,SAAA,SAAAA,EAAEqF,O,CAGT,wBAAM9F,CAAmBF,G,MAC/B,MAAMiG,GAAUtF,EAAAlD,KAAK8B,GAAGqB,cAAU,MAAAD,SAAA,SAAAA,EAAEnB,cAAc,cAClD,GAAIyG,SAAkBA,EAAQC,mBAAqB,CACjDD,EAAQE,eAAe,OACvBnG,EAAGoG,iBACHpG,EAAG0F,0B,EAOC,aAAAhG,GACNjC,KAAKoF,WAAapF,KAAK8B,GAAGC,cAAc,wBACxC,GAAI/B,KAAKoF,WAAY,CACnBpF,KAAKoF,WAAW7E,UAAYP,KAAKoF,WAAWY,W,CAE9C,QAAShG,KAAKoF,U,CA+BR,WAAA+B,CAAYiB,EAAiC,MACnD,MAAMQ,EAAkBC,EAAoB7I,KAAK8B,GAAIsG,GACrD,GAAIQ,IAAoBE,EAAsBC,QAAS,CACrD/I,KAAKsB,MACHsH,IAAoBE,EAAsBE,MACtCF,EAAsBG,KACtBH,EAAsBE,MAC5BhJ,KAAKmB,WAAa,I,EAkItB,MAAA+H,GACE,MAAMC,eACJA,EAAc5I,UACdA,EAAS6I,WACTA,EAAUnJ,YACVA,EAAWgH,cACXA,EAAavG,SACbA,EAAQE,SACRA,EAAQC,SACRA,EAAQC,iBACRA,EAAgBoB,KAChBA,EAAImH,WACJA,EAAUC,YACVA,EAAWC,WACXA,EAAUC,eACVA,EAAcC,WACdA,EAAUxI,UACVA,EAASe,YACTA,EAAWM,cACXA,EAAapC,WACbA,EAAUwJ,KACVA,EAAIC,SACJA,EAAQlG,GACRA,EAAEtD,oBACFA,EAAmBuE,cACnBA,EAAaxD,QACbA,EAAOC,WACPA,EAAU0B,OACVA,EAAMH,QACNA,EAAOkH,eACPA,EAAcC,IACdA,EAAGxI,KACHA,EAAIyI,OACJA,EAAMxI,MACNA,EAAKd,MACLA,EAAKe,wBACLA,EAAuBC,iBACvBA,EAAgBC,sBAChBA,EAAqBC,KACrBA,EAAIC,QACJA,GACE3B,KAEJ,MAAM+J,EAAUL,EAAO,IAAM,SAC7B,MAAMM,EACJD,IAAY,SACR,CACErI,OACAhB,WACAwB,OACAmH,aACAC,cACAC,aACAC,iBACAC,cAEF,CACE7I,SAAUA,IAAa,MAAQA,EAAW,KAC1C8I,OACAG,MACAC,SACAF,iBACAD,YAGR,MAAMM,EAAW/J,EACb,0BAA0BuD,GAAMxD,IAChCiK,UAEJ,MAAMC,GAAejK,EAAa+G,EAAgB,cAAcgD,IAEhE,MAAMG,IAAgBpK,KAAK4B,eAAe,QAC1C,MAAMyI,IAAiBrK,KAAK4B,eAAe,SAE3C,MAAM0I,EAAgB,IACpBtK,KAAKiC,gBACHsI,EAAA,QAAMC,KAAK,gBAEXD,EAACR,EAAOzG,OAAAC,OAAA,CACNkH,MAAM,SACNC,SAAU,EAAC,gBACIxJ,GAAWR,EAAW,OAAS,KAAI,aACtCQ,EAAU,UAAYX,EAAS,gBAC5BM,GAAY,GAAGC,KAC1BkJ,EACA7J,EAAmB,CACvBuC,QAASA,EACTG,OAAQA,EACR8H,IAAM7I,GAAQ9B,KAAKsI,SAAWxG,EAAG,mBACfqI,EAClBS,KAAK,WAEJ1J,EACCqJ,EAAA,OAAKE,MAAM,qBACTF,EAAA,wBACE7I,KAAMgD,IAAkB,WAAa,SACrC+F,MAAO,CAAE,gCAAiC/F,KAC1CvD,WAAYA,EACZG,MAAOA,KAIXiJ,EAACM,EAAQ,MACLT,KACGpK,KAAK4B,eAAe,SAAWyI,IAClCE,EAAA,OAAKE,MAAM,kBACTF,EAAA,QAAMC,KAAM,GAAGJ,EAAc,OAAS,gBAG1CG,EAAA,cACE1J,EACEwJ,GACEE,EAAA,OAAKE,MAAO,CAAE,iBAAkB,KAAM,aAAc,OAClDF,EAAA,QAAMC,KAAK,gBAGf7I,IAAY,QACZA,IAAY,eACV4I,EAAA,QACEE,MACE3J,EACI,oBACA,iBAENgK,UAAWC,MAQ7B,OACER,EAACS,EAAI,CAAAxI,IAAA,2CACHiI,MAAO,CACL,qBAAsB/J,IAAaQ,EACnC,uBAAwBD,EACxB,oBAAqBC,EACrB,CAAC,kBAAkBG,KAAS,KAC5B,CAAC,qBAAqBM,KAAY,KAClC,CAAC,YAAYL,KAAUA,IAAU,UACjC2J,YACGtJ,IAAY,aAAeA,IAAY,cACvCF,IACAf,EACH,mBACEG,IACCqK,EAAWlL,KAAK8B,GAAI,UACpBoJ,EAAWlL,KAAK8B,GAAI,aACvBX,aACA,WAAY+J,EAAWlL,KAAK8B,GAAI,YAChC,aAAcoJ,EAAWlL,KAAK8B,GAAI,UAEpCqJ,QAASnJ,EACToJ,UAAW9I,EAAa,YACb8G,EAAU,gBACND,EAAc,gBACdtI,GAAY,GAAGC,KAE7BZ,GACCqK,EAAA,cAAA/H,IAAA,2CACEiB,GAAI0G,EACJpE,MAAOvF,GAASD,EAChBuJ,OAAQG,EACRoB,UAAW7J,EACX8J,iBAAkB/J,EAClBgK,OAAQ7G,OAAqBnE,GAE7BgK,EAACD,EAAa,CAAA9H,IAAA,8CAGjB0I,EAAWlL,KAAK8B,GAAI,UAAYyI,EAAA,QAAA/H,IAAA,2CAAMgI,KAAK,WAC1CtK,GAAcqK,EAACD,EAAa,CAAA9H,IAAA,6C,6NCjuBtC,MAAMgJ,EAAwB,y3MAC9B,MAAAC,EAAeD,ECOf,MAAME,EAA2B,CAC/BC,MAAO,IACPC,OAAQ,GACRC,MAAO,GACPtG,KAAM,I,MAQKuG,EAAgB,MAL7B,WAAAhM,CAAAC,G,UAQUC,KAAA+L,UAAsB,GAKrB/L,KAAAgM,iBAAmB,EACnBhM,KAAAiM,kBAAoB,EACpBjM,KAAAkM,mBAAyC,CAChDC,EAAG,EACHC,EAAG,EACHC,EAAG,GAGIrM,KAAAsM,iBAAmB,MACnBtM,KAAAuM,aAA+B,WAKhCvM,KAAAwM,YAAc,UAKGxM,KAAAiB,UAAY,MAoB7BjB,KAAAyM,cAAgB,IAMhBzM,KAAA0M,IAAM,IAMN1M,KAAA2M,IAAM,EAKN3M,KAAAmB,WAAa,MAqBInB,KAAAqB,KAAuB,SASxCrB,KAAAsB,MAAqB,UAKJtB,KAAA0B,KAAuB,WAkCxC1B,KAAA4M,SAAYC,GAClB,IAAIC,SAAQ,KACV9M,KAAK+M,SAAWC,aAAY,KAC1B,GAAIH,EAAa7M,KAAK+L,UAAUkB,OAAS,EAAG,CAC1CJ,G,KACK,CACLA,EAAa,C,CAEf7M,KAAKkN,eAAiBlN,KAAK+L,UAAUc,EAAW,GAC/C7M,KAAKyM,cAAc,IAGlBzM,KAAAmN,gBAAkB,KACxB,MAAMxG,EAAQ3G,KAAKuM,eAAiB,WAAavM,KAAKoN,iBAAmB,EAEzE,GAAIpN,KAAKqB,OAAS,SAAYsF,GAASA,EAAQ,GAAK,CAClD,MAAO,O,MACF,GAAI3G,KAAKqB,OAAS,SAAWsF,GAAS,IAAK,CAChD,MAAO,I,CAET,MAAO,IAAI,EAGL3G,KAAAoN,eAAiB,K,UACvB,IAAIlK,EAAAlD,KAAKqN,gBAAY,MAAAnK,SAAA,SAAAA,EAAEoK,YAAa,OAAOtN,KAAKqN,aAAaC,YAE7D,GAAItN,KAAKqN,aAAc,CACrB,MAAM1G,MAAEA,GAAU4G,OAAOC,iBAAiBxN,KAAKqN,cAE/C,GAAI1G,EAAO,CAET,KAAIvD,EAAAuD,EAAM8G,MAAM,WAAO,MAAArK,SAAA,SAAAA,EAAG,MAAO,IAAK,OAAOsK,WAAW/G,GAExD,MAAMgH,GAAcC,EAAA5N,KAAKqN,aAAaQ,iBAAa,MAAAD,SAAA,SAAAA,EAAEN,YACrD,GAAIK,EAAa,OAAOA,GAAeD,WAAW/G,GAAS,I,EAI/D,OAAO+E,EAAyB1L,KAAKqB,KAAK,EAGpCrB,KAAA8N,oBAAuBC,IAC7B,MAAMC,EAAcC,KAAKtB,IAAI3M,KAAK0M,IAAKuB,KAAKvB,IAAI1M,KAAK2M,IAAKoB,IAC1D,OAAQC,EAAchO,KAAK2M,MAAQ3M,KAAK0M,IAAM1M,KAAK2M,IAAI,EAGjD3M,KAAAkO,0BAA4B,KAElC,IAAKlO,KAAKmO,eAAiBnO,KAAK+N,SAAU,OAE1C,MAAMK,EAAapO,KAAK8N,oBAAoB9N,KAAK+N,UACjD/N,KAAKsM,iBAAmB8B,EAAa,GACrC,GAAIpO,KAAKsM,iBAAkB,CACzBtM,KAAKmO,aAAaE,UAAUzK,OAAO,O,KAC9B,CACL5D,KAAKmO,aAAaE,UAAUC,IAAI,O,CAElCtO,KAAKmO,aAAajJ,MAAMC,YACtB,iBACA,GAAGiJ,EAAa,OACjB,EAGKpO,KAAAuO,gBAAkB,KACxBvO,KAAKuM,aAAevM,KAAK0B,KACzB,GAAI1B,KAAK0B,MAAQ,SAAU,CACzB1B,KAAKuM,aAAevM,KAAKqB,MAAQ,OAAS,WAAa,Q,GAInDrB,KAAAwO,YAAc,KACpB,IAAKxO,KAAK+F,MAAO,OAEjB,UAAW/F,KAAK+F,QAAU,SAAU,CAClC/F,KAAKkN,eAAiBlN,KAAK+F,K,KACtB,CACL/F,KAAK+L,UAAY/L,KAAK+F,MACtB/F,KAAKkN,eAAiBlN,KAAK+L,UAAU,GACrC,GAAI/L,KAAK+L,UAAUkB,OAAS,EAAG,CAC7BjN,KAAK4M,SAAS,E,IAKZ5M,KAAAyO,oBAAsB,KAC5B,GAAIzO,KAAKgM,kBAAoB,EAAG,OAEhC,MAAMK,EAAIrM,KAAKgM,iBAAmB,EAClC,MAAM0C,EAAarC,EAAIrM,KAAKiM,kBAAoB,EAChD,MAAM0C,EAAY,EAAIV,KAAKW,GAAKF,EAEhC1O,KAAKkM,mBAAqB,CACxBC,EAAGE,EACHD,EAAGC,EACHA,EAAGqC,EACHC,UAAW,GAAGA,MACdE,WAAY7O,KAAK+N,SACb,KAAK,EAAI/N,KAAK8N,oBAAoB9N,KAAK+N,WAAaY,MACpDzE,UACL,C,CAhMH,gBAAA4E,GACE9O,KAAKwO,a,CAiCP,oBAAAO,GACE,GAAI/O,KAAKuM,eAAiB,SAAU,CAClCvM,KAAKkO,2B,KACA,CACLlO,KAAKyO,qB,EAST,cAAAO,GACEhP,KAAKiP,wB,CAaP,sBAAAA,GACEjP,KAAKuO,kBACL,GAAIvO,KAAKuM,eAAiB,WAAY,CAEpC,MAAM2C,EAAWlP,KAAKoN,iBACtB,GAAIpN,KAAKqN,cAAgB6B,IAAalP,KAAKgM,iBAAkB,CAC3DhM,KAAKiM,kBAAoBiD,EAAW,GACpClP,KAAKgM,iBAAmBkD,EACxBlP,KAAKqN,aAAanI,MAAMC,YACtB,wBACA,GAAGnF,KAAKiM,sB,CAGZjM,KAAKyO,qB,KACA,CACLzO,KAAKkO,2B,EAIT,oBAAA3H,GACE4I,cAAcnP,KAAK+M,S,CAGrB,iBAAAnG,GACE5G,KAAKwO,cACLxO,KAAK8B,GAAGkF,aAAa,cAAe,uB,CAGtC,gBAAAE,GACElH,KAAKiP,wB,CAyGP,MAAA/F,GACE,MAAM8C,iBACJA,EACAE,oBAAoBC,EAAEA,EAACC,EAAEA,EAACC,EAAEA,EAACsC,UAAEA,EAASE,WAAEA,GAAYrC,YACtDA,EAAWvL,UACXA,EAASiM,eACTA,EAAckC,WACdA,EAAU7C,aACVA,EAAYxG,MACZA,EAAK2G,IACLA,EAAGC,IACHA,EAAGxL,WACHA,EAAU4M,SACVA,EAAQ1M,KACRA,EAAIC,MACJA,GACEtB,KAEJ,OACEuK,EAACS,EAAI,CAAAxI,IAAA,2CACHiI,MAAO,CACL,CAAC,YAAYnJ,KAAUA,IAAU,UACjC,kCAAmCL,EACnC,+BAAgC8E,EAChC,kCAAmC5E,EACnC,CAAC,6BAA6BE,KAAS,OAGzCkJ,EAAA,OAAA/H,IAAA,2CAAKiI,MAAM,uBAAuBG,KAAK,wBACrCL,EAAA,OAAA/H,IAAA,2CACEmI,IAAM7I,GAAQ9B,KAAKqN,aAAevL,EAClC2I,MAAO,CACL,CAAC,cAAc8B,WAAuB,KACtC,CAACwB,IAAa7D,UAAY,gBAAkB,eAAgB,MAE9DmF,KAAK,cAAa,kBACDtJ,GAAS1E,IAAS,QAAU,mBAAkB,aACnDmL,EAAW,gBACRuB,EAAQ,gBACRpB,EAAG,gBACHD,GAEfnC,EAAA,OAAA/H,IAAA,2CACEmI,IAAM7I,GAAQ9B,KAAKmO,aAAerM,EAClC2I,MAAO,CACL,CAAC,cAAc8B,WAAuB,KACtC,gBAAiB6C,IAGlBA,GAAc/N,IAAS,SACtBkJ,EAAA,iBAAA/H,IAAA,2CAAeb,QAAQ,iBAAiB8I,MAAM,cAC3C2E,GAGJ7C,IAAiB,YAChBhC,EAAA,OAAA/H,IAAA,2CACEiI,MAAM,0BACN6E,QAAS,OAAOtD,KAAoBA,KAEpCzB,EAAA,UAAA/H,IAAA,2CAAQ+M,GAAIpD,EAAGqD,GAAIpD,EAAGC,EAAGA,IACzB9B,EAAA,UAAA/H,IAAA,2CACE0C,MAAO,CACL,uBAAwB6I,EAAW,GAAGrB,IAAQxC,UAC9C,mBACE6D,IAAa7D,UAAY,GAAG6D,IAAa7D,UAC3C,qBAAsByE,EACtB,sBAAuBE,GAEzBU,GAAIpD,EACJqD,GAAIpD,EACJC,EAAGA,OAMZtG,GAAS1E,IAAS,QACjBkJ,EAAA,iBAAA/H,IAAA,2CACEiB,GAAG,mBACHgH,MAAM,mBACN4E,KAAK,QACL1N,QAAS3B,KAAKmN,mBAEd5C,EAAA,KAAA/H,IAAA,4CAAI0K,K,kPClVlB,MAAMuC,EAAe,onLACrB,MAAAC,EAAeD,E,MCsBFE,EAAO,MALpB,WAAA7P,CAAAC,G,UAOUC,KAAA4P,kBAAoB,CAAC,cAErB5P,KAAA6P,kBAAoB,CAAC,YACrB7P,KAAA8P,cAAyB,MACzB9P,KAAA+P,eAAiB,MAEjB/P,KAAAgQ,WAAa,EAClBhQ,KAAKiQ,cAAgB,cACrBjQ,KAAKiQ,cAAgB,WACrBjQ,KAAKkQ,cAAgB,SAShBlQ,KAAAkQ,aAAyB,MAazBlQ,KAAAiQ,aAAyB,MAazBjQ,KAAAsL,iBAA4B,MAU5BtL,KAAAqL,UAAkC,SAKlCrL,KAAAuL,OAAmB,MAUnBvL,KAAAsB,MAAsB,UAarBtB,KAAAmQ,YAAgC,GAkEjCnQ,KAAAoQ,KAAO,KACb,GAAIpQ,KAAK+F,MAAO,CACd/F,KAAKqQ,QAAQrJ,aAAa,YAAa,IAEvC,GAAIhH,KAAKsQ,kBAAmB,CAC1BtQ,KAAK8B,GAAGuM,UAAUC,IAAI,uB,CAGxBtO,KAAKuQ,eAAiBC,EAAaxQ,KAAK8B,GAAI9B,KAAKqQ,QAAO/M,OAAAC,OAAA,CACtDkN,SAAUzQ,KAAKsL,iBAAmB,QAAU,WAC5CD,UAAWrL,KAAKqL,UAChBqF,UAAW,CACT,CACElG,KAAM,SACNmG,QAAS,CACPC,OAAQ,CAAC,EAAG,MAGhB,CACEpG,KAAM,QACNmG,QAAS,CACP7L,QAAS9E,KAAK6Q,QAGlB,CACErG,KAAM,iBACNmG,QAAS,CAAEG,OAAQ,MAAOC,OAAQ,WAEhC/Q,KAAKsQ,kBACL,CACE,CACE9F,KAAM,kBACNmG,QAAS,CACPK,SAAUhR,KAAKsQ,kBACfW,QAAS,IAGb,CACEzG,KAAM,OACNmG,QAAS,CACPK,SAAUhR,KAAKsQ,qBAIrB,KAEHtQ,KAAKmQ,a,KAEL,CACLe,QAAQC,KAAK,iD,GAITnR,KAAAoR,KAAO,KACb,GAAIpR,KAAKqQ,UAAYnG,UAAW,CAC9BlK,KAAKqQ,QAAQgB,gBAAgB,aAC7BrR,KAAK+P,eAAiB,K,CAExB,GAAI/P,KAAKuQ,iBAAmBrG,UAAW,CACrClK,KAAKuQ,eAAee,S,GAIhBtR,KAAAuR,kBAAoB,KAC1BC,YAAW,KACT,IAAKxR,KAAK8P,gBAAkB9P,KAAK+P,eAAgB,CAC/C/P,KAAKoR,M,IAEN,IAAI,EAGDpR,KAAAyR,kBAAoB,KAC1BzR,KAAK8P,cAAgB,IAAI,EAGnB9P,KAAA0R,kBAAoB,KAC1B1R,KAAK8P,cAAgB,MACrB9P,KAAKuR,mBAAmB,EAGlBvR,KAAAsC,cAAiBuF,IACvB,GAAIA,EAAMrF,MAAQ,WAAaxC,KAAK+P,eAAgB,CAClD/P,KAAKoR,M,GAIDpR,KAAA2R,qBAAwBC,IAC9B,MAAMC,EACJD,IAAW,MAAQ,mBAAqB,sBAE1C5R,KAAKgQ,WAAW9L,SAAS2D,IACvB,GAAIA,EAAO,CACT7H,KAAK8B,GAAG+P,GAAQhK,EAAO7H,KAAKoQ,MAC5B,GAAIpQ,KAAKqQ,UAAYnG,UAAW,CAC9BlK,KAAKqQ,QAAQwB,GAAQhK,EAAO7H,KAAKyR,kB,MAKvC,IAAKzR,KAAK+P,eAAgB,CACxB/P,KAAK6P,kBAAkB3L,SAAS2D,IAC9B7H,KAAK8B,GAAG+P,GAAQhK,EAAO7H,KAAKoR,KAAK,G,CAIrCpR,KAAK4P,kBAAkB1L,SAAS2D,IAC9B7H,KAAK8B,GAAG+P,GAAQhK,EAAO7H,KAAKuR,mBAC5B,GAAIvR,KAAKqQ,UAAYnG,UAAW,CAC9BlK,KAAKqQ,QAAQwB,GAAQhK,EAAO7H,KAAK0R,kB,KAIrCtP,SAASyP,GAAQ,UAAW7R,KAAKsC,cAA+B,EAG1DtC,KAAA8R,oBAAsB,KAC5B9R,KAAK2R,qBAAqB,UAC1B3R,KAAKgQ,WAAa,EACfhQ,KAAKiQ,cAAgB,cACrBjQ,KAAKiQ,cAAgB,WACrBjQ,KAAKkQ,cAAgB,SAExBlQ,KAAK2R,qBAAqB,MAAM,C,CAzPlC,wBAAAI,GACE,GAAI/R,KAAKkQ,aAAc,CACrBlQ,KAAKoR,M,CAEPpR,KAAK8R,qB,CASP,wBAAAE,GACE,GAAIhS,KAAKiQ,aAAc,CACrBjQ,KAAKoR,M,CAEPpR,KAAK8R,qB,CAsCP,iBAAAG,G,MACE,KAAI/O,EAAAlD,KAAKqQ,WAAO,MAAAnN,SAAA,SAAAA,EAAEgP,aAAa,eAAgBlS,KAAKuQ,eAAgB,CAClEvQ,KAAKuQ,eAAe4B,Q,EAWxB,4BAAMC,CAAmDC,GACvDrS,KAAKmQ,YAAckC,C,CAGrB,oBAAA9L,GACEvG,KAAK2R,qBAAqB,UAC1B,GAAI3R,KAAKuQ,iBAAmBrG,UAAW,CACrClK,KAAKuQ,eAAee,S,EAIxB,gBAAApK,G,QACElH,KAAK2R,qBAAqB,OAE1B,IAAIW,EACJ,GAAKtS,KAAK8B,GAAGyQ,cAA6BC,KAAM,CAC9CF,EAAUtS,KAAK8B,GAAGyQ,cAA6BC,KAAKrQ,QAAQ,Y,KACvD,CACLmQ,EAAStS,KAAK8B,GAAGK,QAAQ,Y,CAE3BnC,KAAKsQ,mBACHlN,GAAAF,EAAAoP,IAAM,MAANA,SAAM,SAANA,EAAQnP,cAAU,MAAAD,SAAA,SAAAA,EAAEnB,cAAc,oBAAgB,MAAAqB,SAAA,EAAAA,EAAI,KAExDqP,EACE,CAAC,CAAEC,KAAM1S,KAAK+F,MAAO4M,SAAU,UAC/B,U,CAIJ,kBAAAC,G,MACE,MAAMC,GAAe3P,EAAAlD,KAAK8B,GAAGqB,cAAU,MAAAD,SAAA,SAAAA,EAAEnB,cACvC,yCAEF/B,KAAK8S,UACH9S,KAAK8S,SAAW,IAChBD,IAAY,MAAZA,SAAY,SAAZA,EAAc7L,aACZ,QACA,2BAA2BhH,KAAK8S,Y,CAStC,oBAAMpK,CAAe0H,EAAeL,GAClC/P,KAAK+P,iBAAmBA,EACxBK,EAAOpQ,KAAKoQ,OAASpQ,KAAKoR,M,CAO5B,sBAAM3I,GACJ,OAAOqE,QAAQiG,QAAQ/S,KAAKqQ,QAAQ6B,aAAa,a,CAgInD,MAAAhJ,GACE,MAAMnD,MAAEA,EAAK+M,SAAEA,EAAQvH,OAAEA,EAAMjK,MAAEA,GAAUtB,KAC3C,OACEuK,EAACS,EAAI,CAAAxI,IAAA,2CACHiI,MAAO,CACL,aAAc,KACd,CAAC,YAAYnJ,KAAUA,IAAU,WAClC,aACW0R,GAAYjN,GAExBwE,EAAA,OAAA/H,IAAA,2CACEmI,IAAM7I,GAAQ9B,KAAKqQ,QAAUvO,EAC7BuN,KAAK,UACL5E,MAAM,uBAAsB,cACf,GAAGc,KAEhBhB,EAAA,iBAAA/H,IAAA,2CAAesQ,SAAUA,EAAUnR,QAAQ,WACxCoE,GAEHwE,EAAA,OAAA/H,IAAA,2CACEmI,IAAM7I,GAAQ9B,KAAK6Q,MAAQ/O,EAC3B2I,MAAM,sBAGVF,EAAA,QAAA/H,IAAA,6C","ignoreList":[]}

package/dist/core/{p-2026f4fa.entry.js → p-52fa3eec.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as i,h as e,F as a,H as o,g as n}from"./p-8e4e97b4.js";import{D as s,g as r,i as c,N as l,f as d,c as h,h as p,o as b,L as m,I as v,e as f}from"./p-a5658054.js";import"./p-bddf799a.js";const u='/*! 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;color:var(--ic-top-navigation-text);width:100%;position:relative;--ic-typography-color:var(--ic-top-navigation-text);--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color);--navigation-link-colour:var(--ic-top-navigation-text);--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-light);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-lighten-20)}:host(.dark){--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-dark);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-darken-10);--ic-top-navigation-title-hover:var(--ic-action-dark-bg-hover);--ic-top-navigation-title-pressed:var(--ic-action-dark-bg-pressed)}:host(.dark) ::slotted(ic-navigation-button){--ic-button-icon-monochrome:var(--ic-color-text-primary-light)}::slotted(ic-navigation-button){--ic-button-icon-monochrome:white}:host .top-navigation{background-color:var(--ic-top-navigation-background);height:-moz-max-content;height:max-content}:host(.fullwidth-searchbar) slot[name="search"]::slotted(form){width:100%}:host .title-link{display:inline-flex;align-items:center;text-decoration:none;padding:var(--ic-space-xxs);transition:var(--ic-easing-transition-fast)}:host .title-link,:host .title-link:visited,:host .title-link:active,:host .title-link ::slotted(a),:host .title-link:visited ::slotted(a),:host .title-link:active ::slotted(a){color:var(--ic-top-navigation-icon-and-label);text-decoration:none;outline:none;--ic-typography-color:var(--ic-top-navigation-icon-and-label)}:host .title-link:hover:not(:focus){background-color:var(--ic-top-navigation-title-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-top-navigation-title-pressed)}:host .title-link:hover{border-radius:var(--ic-border-radius)}:host .menu-button-container{--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color)}:host .title-link:focus,:host .title-link:focus-within{border-radius:var(--ic-border-radius);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}:host .title-link ic-typography{font-weight:600}:host .nav-panel-container{border-top:var(--ic-space-1px) solid var(--ic-top-navigation-keyline);padding:0 var(--ic-space-lg);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin));display:flex}:host(.dark) .nav-panel-container{border-top:var(--ic-border-keyline-darken)}.top-panel-container{display:flex;padding-top:0.5rem;padding-bottom:0.5rem}.navigation-tabs{margin-top:calc(-1 * var(--ic-space-1px))}.app-details-container{display:flex;align-items:center;flex:1 1 auto;margin-right:var(--ic-space-md)}.app-icon-container{display:flex;padding-right:var(--ic-space-xs)}.icon-buttons-container{display:flex;margin-left:var(--ic-space-md)}.icon-buttons-container ::slotted(nav){display:flex}.title-wrap{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}:host .app-status{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag);color:var(--ic-top-navigation-status-tag-text);--ic-typography-color:var(--ic-top-navigation-status-tag-text);padding:var(--ic-space-xxs) var(--ic-space-lg);margin-left:var(--ic-space-md);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag-secondary);color:var(--ic-top-navigation-status-tag);padding:var(--ic-space-xxs) var(--ic-space-sm);margin-left:var(--ic-space-xs);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content;--ic-typography-color:var(--ic-top-navigation-status-tag)}slot[name="app-icon"]::slotted(*){fill:var(--ic-top-navigation-logo);width:2em;height:2em;cursor:pointer}slot[name="toggle-icon"] svg{fill:var(--ic-top-navigation-icon)}.search-menu-container{justify-content:right;display:flex;align-items:center}.menu-button-container{margin-left:var(--ic-space-md)}.menu-button-container .navigation-landmark-button-text{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;color:var(--ic-brand-text-color)}.menu-button-container .navigation-landmark-button-text:dir(rtl){right:-9999px}.search-actions-container{display:flex}.menu-buttons-slot{display:flex;flex-direction:column}.navigation-landmark-text{position:absolute;width:var(--ic-space-1px);height:var(--ic-space-1px);padding:0;margin:calc(-1 * var(--ic-space-1px));overflow:hidden}.navigation-item-list{display:flex;list-style:none;height:2.75rem}.navigation-item-list::-webkit-scrollbar{display:none}:host ic-section-container{padding-bottom:0 !important;padding-top:0 !important}@media screen and (min-width: 993px){.app-details-container{margin-right:var(--ic-space-lg)}}@media screen and (max-width: 1200px){:host .nav-panel-container{padding:0 var(--ic-space-md)}}:host(.mobile-mode) .app-status,:host(.mobile-mode) .app-version{display:none}:host(.mobile-mode) .title-link{margin-right:var(--ic-space-xs)}:host(.mobile-mode) .search-menu-container{max-width:10rem}:host(.mobile-mode) .search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-border-keyline-darken);height:4rem;padding-left:var(--ic-space-md);padding-right:var(--ic-space-md);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin))}@media screen and (max-width: 576px){:host .title-link{margin-right:var(--ic-space-xxxs);word-break:break-word;-webkit-hyphens:none;hyphens:none}.top-panel-container{min-height:2.5rem}.search-bar-container{margin-top:0;height:3.5rem;padding-left:var(--ic-space-xs);padding-right:var(--ic-space-xs)}.menu-button-container{margin-left:var(--ic-space-sm)}slot[name="app-icon"]::slotted(*){width:1.5em;height:1.5em}slot[name="toggle-icon"] svg{width:1.5em;height:1.5em}}@media (forced-colors: active){:host .top-navigation{border-bottom:var(--ic-border-hc)}.app-status,.app-version{border:var(--ic-border-hc)}slot[name="app-icon"]::slotted(*){fill:currentcolor}slot[name="toggle-icon"] svg{fill:currentcolor}}';const g=u;const y=class{constructor(e){t(this,e);this.icNavigationMenuClosed=i(this,"icNavigationMenuClosed",7);this.icNavigationMenuOpened=i(this,"icNavigationMenuOpened",7);this.icTopNavResized=i(this,"icTopNavResized",7);this.hasAppIcon=false;this.hasAppTitleSlot=false;this.hasIconButtons=false;this.hasNavigation=false;this.hasSearchSlotContent=false;this.resizeObserver=null;this.searchBar=null;this.deviceSize=s.XL;this.foregroundColor=r();this.hasFullWidthSearchBar=false;this.mobileSearchBarVisible=false;this.mobileSearchHiddenOnBlur=false;this.navMenuVisible=false;this.searchButtonClick=false;this.searchValue="";this.contentAligned="full-width";this.customMobileBreakpoint=s.L;this.href="/";this.inline=false;this.shortAppTitle="";this.status="";this.theme="inherit";this.version="";this.checkSlots=()=>{this.hasAppIcon=c(this.el,"app-icon");this.hasAppTitleSlot=c(this.el,"app-title");this.hasNavigation=c(this.el,"navigation");this.hasIconButtons=c(this.el,"buttons");this.hasSearchSlotContent=c(this.el,"search");if(this.hasAppIcon){const t=this.el.querySelector('[slot="app-icon"]');if(t&&t.tagName==="A")t.tabIndex=-1}};this.initialiseSearchBar=()=>{if(!this.hasSearchSlotContent)return;const t=l(this.el,"search");if((t===null||t===void 0?void 0:t.tagName)==="IC-SEARCH-BAR"){this.searchBar=t}else if((t===null||t===void 0?void 0:t.tagName)==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}};this.toggleSearchBar=()=>{var t;this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(!this.searchBar)return;(t=this.mobileSearchButtonEl)===null||t===void 0?void 0:t.setAttribute("aria-label",`${this.mobileSearchBarVisible?"Hide":"Show"} search`);this.hasFullWidthSearchBar=this.mobileSearchBarVisible;this.searchBar.fullWidth=this.mobileSearchBarVisible;if(this.mobileSearchBarVisible){setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.menuButtonClick=()=>{this.showNavMenu(true)};this.showNavMenu=t=>{this.navMenuVisible=t;(t?this.icNavigationMenuOpened:this.icNavigationMenuClosed).emit();document.body.style.height=t?"100%":"auto";document.body.style.overflow=t?"hidden":"auto"};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserverCallback=t=>{if(t===this.deviceSize)return;this.deviceSize=t;if(t>this.customMobileBreakpoint){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.icTopNavResized.emit({size:t});if(this.searchBar&&document.activeElement===this.searchBar){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback(d())}));this.resizeObserver.observe(this.el)}}watchPropHandler(t,i){h(i,t,this.initialiseSearchBar)}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}componentWillLoad(){this.checkSlots();this.deviceSize=d();this.initialiseSearchBar()}componentDidLoad(){p(this.runResizeObserver);if(!this.hasAppTitleSlot){b([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}}componentWillRender(){this.checkSlots()}navBarMenuCloseHandler(){var t;this.showNavMenu(false);(t=this.menuButtonEl)===null||t===void 0?void 0:t.setFocus()}searchInputBlurHandler({detail:t}){if(t!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.value}}searchValueChangeHandler({detail:t}){this.searchValue=t.value}brandChangeHandler({detail:t}){this.foregroundColor=t.mode}render(){const{appTitle:t,contentAligned:i,customMobileBreakpoint:n,deviceSize:r,el:l,foregroundColor:d,hasAppIcon:h,hasAppTitleSlot:p,hasFullWidthSearchBar:b,hasIconButtons:u,hasNavigation:g,hasSearchSlotContent:y,href:x,inline:k,menuButtonClick:w,mobileSearchBarVisible:z,navMenuVisible:H,searchButtonClickHandler:M,searchButtonMouseDownHandler:C,shortAppTitle:B,status:S,version:T,theme:j}=this;const A=S!=="";const N=T!=="";const $=g||u||A||N;const I=r<=s.S;const R=I?"medium":"large";const V=t!==""&&f(t);const L=r<=n;const O=L?I?"subtitle-small":"h4":"h3";const D=`${z?"Hide":"Show"} search`;const F=I?"small":"medium";const W=c(l,"short-app-title");const q=p?"div":"a";const P=q=="a"&&{href:x};return e(o,{key:"ade1da5d58211501cd1d6747c46d105c49ef8e98",class:{"fullwidth-searchbar":b,"mobile-mode":L,[v.Dark]:d===v.Dark,[`ic-theme-${j}`]:j!=="inherit"}},e("div",{key:"c0a641f02b5c568bcf2e75dd743f42bcacfa3df6",class:"top-navigation"},e("ic-section-container",{key:"f31505caa30741b6ae5a7091d01735c6b0b2eb07",aligned:i,"full-height":true},e("header",{key:"6ab710016c32c632fefc7827114bba07cff300b1",role:"banner"},e("div",{key:"a5b18754252754ecf8f577a113a5e7ffe6214efd",class:"top-panel-container"},e("div",{key:"473ebdef80637e47a30bf1f2570d9698ef819766",class:"app-details-container"},(V||p)&&e(q,Object.assign({key:"8082824e0d859123195ed0cc076858e861ed6f83",class:"title-link"},P),h&&e("div",{key:"4e6846d703b47491d7867d993fc91c680bb7f965",class:"app-icon-container"},e("slot",{key:"5755567877527b6c4dea32d246295f13344a1116",name:"app-icon"})),I&&(!m(B)||W)?e("ic-typography",{variant:"subtitle-small","aria-label":(!p||!W)&&`${t} (${B})`},e("h1",null,W?e("slot",{name:"short-app-title"}):B)):e("ic-typography",{variant:O},e("h1",{class:"title-wrap"},p?e("slot",{name:"app-title"}):t))),A&&e("div",{key:"0d1119c72ec12921b9d8ac4c753549b5266a0a77",class:"app-status"},e("ic-typography",{key:"0159177ab7abdf8ffacbc54fe2a00db8b51f4034","aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},S)),N&&e("div",{key:"f83651366bf13750e9c637643290d01d9158cbb3",class:"app-version"},e("ic-typography",{key:"61d5ddb22f858319246f352ea9db8cf2a380dbb7",variant:"label",class:"app-version-text","aria-label":"app version"},T))),(y||$)&&e("div",{key:"38c8b6032287ae554d95affd0343d8e1a06e9672",class:"search-menu-container"},e("div",{key:"177f304cb5d52052c1595d90a313187f5faf7fb8",class:"search-actions-container"},!L?e(a,null,e("slot",{name:"search"}),u&&e("div",{class:"icon-buttons-container"},e("slot",{name:"buttons"}))):e(a,null,y&&e("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:C,variant:"icon-tertiary",monochrome:true,size:R,"aria-label":D,theme:d,onClick:M},e("slot",{name:"toggle-icon"},e("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})))),$&&e("div",{class:"menu-button-container"},e("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),e("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":`${H}`},e("ic-button",{id:"menu-button",ref:t=>this.menuButtonEl=t,theme:d,variant:"secondary",monochrome:true,"aria-expanded":"false","aria-haspopup":"true","aria-label":`Open ${g?"navigation":"app"} menu`,size:F,onClick:w},"Menu",e("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"left-icon"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"}))))))))),z&&e("div",{key:"2573f4f3d0c07b9a8189739e71b1280ee10db8b7",class:"search-bar-container"},e("slot",{key:"4ec2d201033b3f084a372a781d11a9171b7357db",name:"search"})),g&&!L&&e("div",{key:"2ed8494ed944a24944535339faaf87ff50bc2666",class:"navigation-tabs"},e("span",{key:"8d4749293defd91560f3ed064a40b37ef7bef3f2",id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main pages"),e("nav",{key:"2f026275dcebbb493ab8dd2d337dc07e85fddd47","aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},e("ic-horizontal-scroll",{key:"5299073b2ce1df34d3ab70e0ede5eaf4d122e1ae",monochrome:true,appearance:d},e("ul",{key:"1bf9392b6e25f033f9c4d3ba6efb0d15af07db16",class:"navigation-item-list",tabindex:"-1"},e("slot",{key:"a8ef11edfbf5535d706b5d6f33af40474303f312",name:"navigation"})))))))),H&&e("ic-navigation-menu",{key:"8e11a83a983df46afb2805b0ed89451ad85ab247",version:T,status:S,class:{inline:k}},u&&e("div",{key:"80fc236836f94cfb1ff6c7e7063e223a6c0bec43",class:"menu-buttons-slot",slot:"buttons"},e("slot",{key:"32a3522be214d86952657179b94d88efc7bcccf2",name:"buttons"})),e("ul",{key:"e8ba927b4a442016016deec34bd13501fac2e4f1",slot:"navigation"},e("slot",{key:"8373dc199994f19287897c6a3b3c7309c07a7388",name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};y.style=g;export{y as ic_top_navigation};
-//# sourceMappingURL=p-2026f4fa.entry.js.map
+import{r as t,c as i,h as a,F as e,H as o,g as n}from"./p-8e4e97b4.js";import{D as s,g as r,i as c,N as l,f as d,c as h,h as p,o as b,L as m,I as v,e as u}from"./p-a5658054.js";import"./p-bddf799a.js";const f='/*! 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;color:var(--ic-top-navigation-text);width:100%;position:relative;--ic-typography-color:var(--ic-top-navigation-text);--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color);--navigation-link-colour:var(--ic-top-navigation-text);--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-light);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-lighten-20)}:host(.dark){--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-dark);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-darken-10);--ic-top-navigation-title-hover:var(--ic-action-dark-bg-hover);--ic-top-navigation-title-pressed:var(--ic-action-dark-bg-pressed)}:host(.dark) ::slotted(ic-navigation-button){--ic-button-icon-monochrome:var(--ic-color-text-primary-light)}::slotted(ic-navigation-button){--ic-button-icon-monochrome:white}:host .top-navigation{background-color:var(--ic-top-navigation-background);height:-moz-max-content;height:max-content}:host(.fullwidth-searchbar) slot[name="search"]::slotted(form){width:100%}:host .title-link{display:inline-flex;align-items:center;text-decoration:none;padding:var(--ic-space-xxs);transition:var(--ic-easing-transition-fast)}:host .title-link,:host .title-link:visited,:host .title-link:active,:host .title-link ::slotted(a),:host .title-link:visited ::slotted(a),:host .title-link:active ::slotted(a){color:var(--ic-top-navigation-icon-and-label);text-decoration:none;outline:none;--ic-typography-color:var(--ic-top-navigation-icon-and-label)}:host .title-link:hover:not(:focus){background-color:var(--ic-top-navigation-title-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-top-navigation-title-pressed)}:host .title-link:hover{border-radius:var(--ic-border-radius)}:host .menu-button-container{--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color)}:host .title-link:focus,:host .title-link:focus-within{border-radius:var(--ic-border-radius);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}:host .title-link ic-typography{font-weight:600}:host .nav-panel-container{border-top:var(--ic-space-1px) solid var(--ic-top-navigation-keyline);padding:0 var(--ic-space-lg);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin));display:flex}:host(.dark) .nav-panel-container{border-top:var(--ic-border-keyline-darken)}.top-panel-container{display:flex;padding-top:0.5rem;padding-bottom:0.5rem}.navigation-tabs{margin-top:calc(-1 * var(--ic-space-1px))}.app-details-container{display:flex;align-items:center;flex:1 1 auto;margin-right:var(--ic-space-md)}.app-icon-container{display:flex;padding-right:var(--ic-space-xs)}.icon-buttons-container{display:flex;margin-left:var(--ic-space-md)}.icon-buttons-container ::slotted(nav){display:flex}.title-wrap{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}:host .app-status{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag);color:var(--ic-top-navigation-status-tag-text);--ic-typography-color:var(--ic-top-navigation-status-tag-text);padding:var(--ic-space-xxs) var(--ic-space-lg);margin-left:var(--ic-space-md);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag-secondary);color:var(--ic-top-navigation-status-tag);padding:var(--ic-space-xxs) var(--ic-space-sm);margin-left:var(--ic-space-xs);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content;--ic-typography-color:var(--ic-top-navigation-status-tag)}slot[name="app-icon"]::slotted(*){fill:var(--ic-top-navigation-logo);width:2em;height:2em;cursor:pointer}slot[name="toggle-icon"] svg{fill:var(--ic-top-navigation-icon)}.search-menu-container{justify-content:right;display:flex;align-items:center}.menu-button-container{margin-left:var(--ic-space-md)}.menu-button-container .navigation-landmark-button-text{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;color:var(--ic-brand-text-color)}.menu-button-container .navigation-landmark-button-text:dir(rtl){right:-9999px}.search-actions-container{display:flex}.menu-buttons-slot{display:flex;flex-direction:column}.navigation-landmark-text{position:absolute;width:var(--ic-space-1px);height:var(--ic-space-1px);padding:0;margin:calc(-1 * var(--ic-space-1px));overflow:hidden}.navigation-item-list{display:flex;list-style:none;height:2.75rem}.navigation-item-list::-webkit-scrollbar{display:none}:host ic-section-container{padding-bottom:0 !important;padding-top:0 !important}@media screen and (min-width: 993px){.app-details-container{margin-right:var(--ic-space-lg)}}@media screen and (max-width: 1200px){:host .nav-panel-container{padding:0 var(--ic-space-md)}}:host(.mobile-mode) .app-status,:host(.mobile-mode) .app-version{display:none}:host(.mobile-mode) .title-link{margin-right:var(--ic-space-xs)}:host(.mobile-mode) .search-menu-container{max-width:10rem}:host(.mobile-mode) .search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-border-keyline-darken);height:4rem;padding-left:var(--ic-space-md);padding-right:var(--ic-space-md);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin))}@media screen and (max-width: 576px){:host .title-link{margin-right:var(--ic-space-xxxs);word-break:break-word;-webkit-hyphens:none;hyphens:none}.top-panel-container{min-height:2.5rem}.search-bar-container{margin-top:0;height:3.5rem;padding-left:var(--ic-space-xs);padding-right:var(--ic-space-xs)}.menu-button-container{margin-left:var(--ic-space-sm)}slot[name="app-icon"]::slotted(*){width:1.5em;height:1.5em}slot[name="toggle-icon"] svg{width:1.5em;height:1.5em}}@media (forced-colors: active){:host .top-navigation{border-bottom:var(--ic-border-hc)}.app-status,.app-version{border:var(--ic-border-hc)}slot[name="app-icon"]::slotted(*){fill:currentcolor}slot[name="toggle-icon"] svg{fill:currentcolor}}';const g=f;const y=class{constructor(a){t(this,a);this.icNavigationMenuClosed=i(this,"icNavigationMenuClosed",7);this.icNavigationMenuOpened=i(this,"icNavigationMenuOpened",7);this.icTopNavResized=i(this,"icTopNavResized",7);this.hasAppIcon=false;this.hasAppTitleSlot=false;this.hasIconButtons=false;this.hasNavigation=false;this.hasSearchSlotContent=false;this.resizeObserver=null;this.searchBar=null;this.deviceSize=s.XL;this.foregroundColor=r();this.hasFullWidthSearchBar=false;this.mobileSearchBarVisible=false;this.mobileSearchHiddenOnBlur=false;this.navMenuVisible=false;this.searchButtonClick=false;this.searchValue="";this.contentAligned="full-width";this.customMobileBreakpoint=s.L;this.href="/";this.inline=false;this.shortAppTitle="";this.status="";this.theme="inherit";this.version="";this.checkSlots=()=>{this.hasAppIcon=c(this.el,"app-icon");this.hasAppTitleSlot=c(this.el,"app-title");this.hasNavigation=c(this.el,"navigation");this.hasIconButtons=c(this.el,"buttons");this.hasSearchSlotContent=c(this.el,"search");if(this.hasAppIcon){const t=this.el.querySelector('[slot="app-icon"]');if(t&&t.tagName==="A")t.tabIndex=-1}};this.initialiseSearchBar=()=>{if(!this.hasSearchSlotContent)return;const t=l(this.el,"search");if((t===null||t===void 0?void 0:t.tagName)==="IC-SEARCH-BAR"){this.searchBar=t}else if((t===null||t===void 0?void 0:t.tagName)==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}};this.toggleSearchBar=()=>{var t;this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(!this.searchBar)return;(t=this.mobileSearchButtonEl)===null||t===void 0?void 0:t.setAttribute("aria-label",`${this.mobileSearchBarVisible?"Hide":"Show"} search`);this.hasFullWidthSearchBar=this.mobileSearchBarVisible;this.searchBar.fullWidth=this.mobileSearchBarVisible;if(this.mobileSearchBarVisible){setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.menuButtonClick=()=>{this.showNavMenu(true)};this.showNavMenu=t=>{this.navMenuVisible=t;(t?this.icNavigationMenuOpened:this.icNavigationMenuClosed).emit();document.body.style.height=t?"100%":"auto";document.body.style.overflow=t?"hidden":"auto"};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserverCallback=t=>{if(t===this.deviceSize)return;this.deviceSize=t;if(t>this.customMobileBreakpoint){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.icTopNavResized.emit({size:t});if(this.searchBar&&document.activeElement===this.searchBar){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback(d())}));this.resizeObserver.observe(this.el)}}watchPropHandler(t,i){h(i,t,this.initialiseSearchBar)}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}componentWillLoad(){this.checkSlots();this.deviceSize=d();this.initialiseSearchBar()}componentDidLoad(){p(this.runResizeObserver);if(!this.hasAppTitleSlot){b([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}}componentWillRender(){this.checkSlots()}navBarMenuCloseHandler(){var t;this.showNavMenu(false);(t=this.menuButtonEl)===null||t===void 0?void 0:t.setFocus()}searchInputBlurHandler({detail:t}){if(t!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.value}}searchValueChangeHandler({detail:t}){this.searchValue=t.value}brandChangeHandler({detail:t}){this.foregroundColor=t.mode}render(){const{appTitle:t,contentAligned:i,customMobileBreakpoint:n,deviceSize:r,el:l,foregroundColor:d,hasAppIcon:h,hasAppTitleSlot:p,hasFullWidthSearchBar:b,hasIconButtons:f,hasNavigation:g,hasSearchSlotContent:y,href:x,inline:k,menuButtonClick:w,mobileSearchBarVisible:z,navMenuVisible:H,searchButtonClickHandler:M,searchButtonMouseDownHandler:C,shortAppTitle:B,status:S,version:T,theme:j}=this;const A=S!=="";const N=T!=="";const $=g||f||A||N;const I=r<=s.S;const R=I?"medium":"large";const V=t!==""&&u(t);const L=r<=n;const O=L?I?"subtitle-small":"h4":"h3";const D=`${z?"Hide":"Show"} search`;const F=I?"small":"medium";const W=c(l,"short-app-title");const q=p?"div":"a";const P=q=="a"&&{href:x};return a(o,{key:"ade1da5d58211501cd1d6747c46d105c49ef8e98",class:{"fullwidth-searchbar":b,"mobile-mode":L,[v.Dark]:d===v.Dark,[`ic-theme-${j}`]:j!=="inherit"}},a("div",{key:"c0a641f02b5c568bcf2e75dd743f42bcacfa3df6",class:"top-navigation"},a("ic-section-container",{key:"f31505caa30741b6ae5a7091d01735c6b0b2eb07",aligned:i,"full-height":true},a("header",{key:"6ab710016c32c632fefc7827114bba07cff300b1",role:"banner"},a("div",{key:"a5b18754252754ecf8f577a113a5e7ffe6214efd",class:"top-panel-container"},a("div",{key:"473ebdef80637e47a30bf1f2570d9698ef819766",class:"app-details-container"},(V||p)&&a(q,Object.assign({key:"8082824e0d859123195ed0cc076858e861ed6f83",class:"title-link"},P),h&&a("div",{key:"4e6846d703b47491d7867d993fc91c680bb7f965",class:"app-icon-container"},a("slot",{key:"5755567877527b6c4dea32d246295f13344a1116",name:"app-icon"})),I&&(!m(B)||W)?a("ic-typography",{variant:"subtitle-small","aria-label":(!p||!W)&&`${t} (${B})`},a("h1",null,W?a("slot",{name:"short-app-title"}):B)):a("ic-typography",{variant:O},a("h1",{class:"title-wrap"},p?a("slot",{name:"app-title"}):t))),A&&a("div",{key:"0d1119c72ec12921b9d8ac4c753549b5266a0a77",class:"app-status"},a("ic-typography",{key:"0159177ab7abdf8ffacbc54fe2a00db8b51f4034","aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},S)),N&&a("div",{key:"f83651366bf13750e9c637643290d01d9158cbb3",class:"app-version"},a("ic-typography",{key:"61d5ddb22f858319246f352ea9db8cf2a380dbb7",variant:"label",class:"app-version-text","aria-label":"app version"},T))),(y||$)&&a("div",{key:"38c8b6032287ae554d95affd0343d8e1a06e9672",class:"search-menu-container"},a("div",{key:"177f304cb5d52052c1595d90a313187f5faf7fb8",class:"search-actions-container"},!L?a(e,null,a("slot",{name:"search"}),f&&a("div",{class:"icon-buttons-container"},a("slot",{name:"buttons"}))):a(e,null,y&&a("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:C,variant:"icon-tertiary",monochrome:true,size:R,"aria-label":D,theme:d,onClick:M},a("slot",{name:"toggle-icon"},a("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},a("path",{d:"M0 0h24v24H0V0z",fill:"none"}),a("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})))),$&&a("div",{class:"menu-button-container"},a("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),a("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":`${H}`},a("ic-button",{id:"menu-button",ref:t=>this.menuButtonEl=t,theme:d,variant:"secondary",monochrome:true,"aria-expanded":"false","aria-haspopup":"true","aria-label":`Open ${g?"navigation":"app"} menu`,size:F,onClick:w},"Menu",a("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"left-icon"},a("path",{d:"M0 0h24v24H0V0z",fill:"none"}),a("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"}))))))))),z&&a("div",{key:"2573f4f3d0c07b9a8189739e71b1280ee10db8b7",class:"search-bar-container"},a("slot",{key:"4ec2d201033b3f084a372a781d11a9171b7357db",name:"search"})),g&&!L&&a("div",{key:"2ed8494ed944a24944535339faaf87ff50bc2666",class:"navigation-tabs"},a("span",{key:"8d4749293defd91560f3ed064a40b37ef7bef3f2",id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main pages"),a("nav",{key:"2f026275dcebbb493ab8dd2d337dc07e85fddd47","aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},a("ic-horizontal-scroll",{key:"e33cbc8cd546a0fb563b8bdde108da0c2e80ef66",monochrome:true,appearance:d},a("ul",{key:"7512b3b85f91075faaaeccd96ebac66e068a849e",class:"navigation-item-list",tabindex:"-1"},a("slot",{key:"e61779a3dbae4589b88209d8a93f30bda5f039b4",name:"navigation"})))))))),H&&a("ic-navigation-menu",{key:"eb34ba01d4c4bb293e158f2fde8d01450fd74458",version:T,status:S,class:{inline:k}},f&&a("div",{key:"996eda82c263a6d31a9ce7ec7aa56f529fe2fae9",class:"menu-buttons-slot",slot:"buttons"},a("slot",{key:"ef23428fa633c02499144aff67d86dd5da8288e5",name:"buttons"})),a("ul",{key:"1e1fc74c7d084bcc7890cd8449f59112b8b013d9",slot:"navigation"},a("slot",{key:"7cd944be78c406c52085b9cd8d9f515007716103",name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};y.style=g;export{y as ic_top_navigation};
+//# sourceMappingURL=p-52fa3eec.entry.js.map

package/dist/core/{p-2026f4fa.entry.js.map → p-52fa3eec.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["icTopNavigationCss","IcTopNavigationStyle0","TopNavigation","constructor","hostRef","this","hasAppIcon","hasAppTitleSlot","hasIconButtons","hasNavigation","hasSearchSlotContent","resizeObserver","searchBar","deviceSize","DEVICE_SIZES","XL","foregroundColor","getBrandForegroundAppearance","hasFullWidthSearchBar","mobileSearchBarVisible","mobileSearchHiddenOnBlur","navMenuVisible","searchButtonClick","searchValue","contentAligned","customMobileBreakpoint","L","href","inline","shortAppTitle","status","theme","version","checkSlots","isSlotUsed","el","slottedAppIcon","querySelector","tagName","tabIndex","initialiseSearchBar","slot","getSlot","hideLabel","toggleSearchBar","_a","mobileSearchButtonEl","setAttribute","fullWidth","setTimeout","focus","menuButtonClick","showNavMenu","show","icNavigationMenuOpened","icNavigationMenuClosed","emit","document","body","style","height","overflow","searchButtonMouseDownHandler","searchButtonClickHandler","resizeObserverCallback","currSize","icTopNavResized","size","activeElement","removeAttribute","runResizeObserver","ResizeObserver","getCurrentDeviceSize","observe","watchPropHandler","newValue","oldValue","onComponentPropUndefinedChange","disconnectedCallback","disconnect","componentWillLoad","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","appTitle","propName","componentWillRender","navBarMenuCloseHandler","menuButtonEl","setFocus","searchInputBlurHandler","detail","value","searchValueChangeHandler","brandChangeHandler","mode","render","hasStatus","hasVersion","hasMenuContent","isSmallDeviceSize","S","searchButtonSize","hasTitle","isPropDefined","overMobileBreakpoint","appTitleVariant","mobileSearchButtonTitle","menuSize","shortAppTitleSlot","Component","attrs","h","Host","key","class","IcBrandForegroundEnum","Dark","aligned","role","Object","assign","name","isEmptyString","variant","Fragment","id","ref","onMouseDown","monochrome","onClick","xmlns","viewBox","fill","d","width","appearance","tabindex"],"sources":["src/components/ic-top-navigation/ic-top-navigation.css?tag=ic-top-navigation&encapsulation=shadow","src/components/ic-top-navigation/ic-top-navigation.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  color: var(--ic-top-navigation-text);\n  width: 100%;\n  position: relative;\n\n  --ic-typography-color: var(--ic-top-navigation-text);\n  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);\n  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);\n  --navigation-link-colour: var(--ic-top-navigation-text);\n  --ic-top-navigation-status-tag-text: var(--ic-color-text-primary-light);\n  --ic-top-navigation-status-tag-secondary: var(--ic-state-layer-lighten-20);\n}\n\n:host(.dark) {\n  --ic-top-navigation-status-tag-text: var(--ic-color-text-primary-dark);\n  --ic-top-navigation-status-tag-secondary: var(--ic-state-layer-darken-10);\n  --ic-top-navigation-title-hover: var(--ic-action-dark-bg-hover);\n  --ic-top-navigation-title-pressed: var(--ic-action-dark-bg-pressed);\n}\n\n:host(.dark) ::slotted(ic-navigation-button) {\n  --ic-button-icon-monochrome: var(--ic-color-text-primary-light);\n}\n\n::slotted(ic-navigation-button) {\n  --ic-button-icon-monochrome: white;\n}\n\n:host .top-navigation {\n  background-color: var(--ic-top-navigation-background);\n  height: max-content;\n}\n\n:host(.fullwidth-searchbar) slot[name=\"search\"]::slotted(form) {\n  width: 100%;\n}\n\n:host .title-link {\n  display: inline-flex;\n  align-items: center;\n  text-decoration: none;\n  padding: var(--ic-space-xxs);\n  transition: var(--ic-easing-transition-fast);\n}\n\n:host .title-link,\n:host .title-link:visited,\n:host .title-link:active,\n:host .title-link ::slotted(a),\n:host .title-link:visited ::slotted(a),\n:host .title-link:active ::slotted(a) {\n  color: var(--ic-top-navigation-icon-and-label);\n  text-decoration: none;\n  outline: none;\n\n  --ic-typography-color: var(--ic-top-navigation-icon-and-label);\n}\n\n:host .title-link:hover:not(:focus) {\n  background-color: var(--ic-top-navigation-title-hover);\n}\n\n:host .title-link:active:not(:focus) {\n  background-color: var(--ic-top-navigation-title-pressed);\n}\n\n:host .title-link:hover {\n  border-radius: var(--ic-border-radius);\n}\n\n:host .menu-button-container {\n  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);\n  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);\n}\n\n:host .title-link:focus,\n:host .title-link:focus-within {\n  border-radius: var(--ic-border-radius);\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host .title-link ic-typography {\n  font-weight: 600;\n}\n\n:host .nav-panel-container {\n  border-top: var(--ic-space-1px) solid var(--ic-top-navigation-keyline);\n  padding: 0 var(--ic-space-lg);\n  margin-left: calc(-1 * var(--section-container-margin));\n  margin-right: calc(-1 * var(--section-container-margin));\n  display: flex;\n}\n\n:host(.dark) .nav-panel-container {\n  border-top: var(--ic-border-keyline-darken);\n}\n\n.top-panel-container {\n  display: flex;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.navigation-tabs {\n  margin-top: calc(-1 * var(--ic-space-1px));\n}\n\n.app-details-container {\n  display: flex;\n  align-items: center;\n  flex: 1 1 auto;\n  margin-right: var(--ic-space-md);\n}\n\n.app-icon-container {\n  display: flex;\n  padding-right: var(--ic-space-xs);\n}\n\n.icon-buttons-container {\n  display: flex;\n  margin-left: var(--ic-space-md);\n}\n\n.icon-buttons-container ::slotted(nav) {\n  display: flex;\n}\n\n.title-wrap {\n  overflow-wrap: break-word;\n  word-wrap: break-word;\n  -ms-word-break: break-all;\n  word-break: break-word;\n  hyphens: auto;\n}\n\n:host .app-status {\n  border-radius: var(--ic-space-md);\n  background-color: var(--ic-top-navigation-status-tag);\n  color: var(--ic-top-navigation-status-tag-text);\n\n  --ic-typography-color: var(--ic-top-navigation-status-tag-text);\n\n  padding: var(--ic-space-xxs) var(--ic-space-lg);\n  margin-left: var(--ic-space-md);\n  flex: 1 1 0;\n  max-width: fit-content;\n}\n\n:host .app-version {\n  border-radius: var(--ic-space-md);\n  background-color: var(--ic-top-navigation-status-tag-secondary);\n  color: var(--ic-top-navigation-status-tag);\n  padding: var(--ic-space-xxs) var(--ic-space-sm);\n  margin-left: var(--ic-space-xs);\n  flex: 1 1 0;\n  max-width: fit-content;\n\n  --ic-typography-color: var(--ic-top-navigation-status-tag);\n}\n\nslot[name=\"app-icon\"]::slotted(*) {\n  fill: var(--ic-top-navigation-logo);\n  width: 2em;\n  height: 2em;\n  cursor: pointer;\n}\n\nslot[name=\"toggle-icon\"] svg {\n  fill: var(--ic-top-navigation-icon);\n}\n\n.search-menu-container {\n  justify-content: right;\n  display: flex;\n  align-items: center;\n}\n\n.menu-button-container {\n  margin-left: var(--ic-space-md);\n}\n\n.menu-button-container .navigation-landmark-button-text {\n  position: absolute;\n  left: -9999px;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  color: var(--ic-brand-text-color);\n}\n\n.menu-button-container .navigation-landmark-button-text:dir(rtl) {\n  right: -9999px;\n}\n\n.search-actions-container {\n  display: flex;\n}\n\n.menu-buttons-slot {\n  display: flex;\n  flex-direction: column;\n}\n\n.navigation-landmark-text {\n  position: absolute;\n  width: var(--ic-space-1px);\n  height: var(--ic-space-1px);\n  padding: 0;\n  margin: calc(-1 * var(--ic-space-1px));\n  overflow: hidden;\n}\n\n.navigation-item-list {\n  display: flex;\n  list-style: none;\n  height: 2.75rem;\n}\n\n.navigation-item-list::-webkit-scrollbar {\n  display: none;\n}\n\n:host ic-section-container {\n  padding-bottom: 0 !important;\n  padding-top: 0 !important;\n}\n\n@media screen and (min-width: 993px) {\n  .app-details-container {\n    margin-right: var(--ic-space-lg);\n  }\n}\n\n/* large */\n@media screen and (max-width: 1200px) {\n  :host .nav-panel-container {\n    padding: 0 var(--ic-space-md);\n  }\n}\n\n/** Mobile styling **/\n:host(.mobile-mode) .app-status,\n:host(.mobile-mode) .app-version {\n  display: none;\n}\n\n:host(.mobile-mode) .title-link {\n  margin-right: var(--ic-space-xs);\n}\n\n:host(.mobile-mode) .search-menu-container {\n  max-width: 10rem;\n}\n\n:host(.mobile-mode) .search-bar-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-top: var(--ic-border-keyline-darken);\n  height: 4rem;\n  padding-left: var(--ic-space-md);\n  padding-right: var(--ic-space-md);\n  margin-left: calc(-1 * var(--section-container-margin));\n  margin-right: calc(-1 * var(--section-container-margin));\n}\n\n/* x small */\n@media screen and (max-width: 576px) {\n  :host .title-link {\n    margin-right: var(--ic-space-xxxs);\n    word-break: break-word;\n    hyphens: none;\n  }\n\n  .top-panel-container {\n    min-height: 2.5rem;\n  }\n\n  .search-bar-container {\n    margin-top: 0;\n    height: 3.5rem;\n    padding-left: var(--ic-space-xs);\n    padding-right: var(--ic-space-xs);\n  }\n\n  .menu-button-container {\n    margin-left: var(--ic-space-sm);\n  }\n\n  slot[name=\"app-icon\"]::slotted(*) {\n    width: 1.5em;\n    height: 1.5em;\n  }\n\n  slot[name=\"toggle-icon\"] svg {\n    width: 1.5em;\n    height: 1.5em;\n  }\n}\n\n@media (forced-colors: active) {\n  :host .top-navigation {\n    border-bottom: var(--ic-border-hc);\n  }\n\n  .app-status,\n  .app-version {\n    border: var(--ic-border-hc);\n  }\n\n  slot[name=\"app-icon\"]::slotted(*) {\n    fill: currentcolor;\n  }\n\n  slot[name=\"toggle-icon\"] svg {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Listen,\n  Event,\n  EventEmitter,\n  Watch,\n  Fragment,\n} from \"@stencil/core\";\n\nimport {\n  IcTypographyVariants,\n  IcAlignment,\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n  IcBrand,\n  IcDeviceSizes,\n  IcValueEventDetail,\n  IcThemeMode,\n} from \"../../utils/types\";\nimport {\n  checkResizeObserver,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getBrandForegroundAppearance,\n  getSlot,\n  onComponentPropUndefinedChange,\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  isEmptyString,\n  isPropDefined,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"../ic-search-bar/ic-search-bar.types\";\n\n/**\n * @slot app-icon - Content will be rendered to left of app title. Anything that is slotted here will be hidden from screen readers.\n * @slot app-title - Handle routing by nesting a route in the app title.\n * @slot short-app-title - Handle routing by nesting a route in the short app title (to be displayed in place of app title on small screen sizes).\n * @slot search - Content will be rendered in search area to left of buttons.\n * @slot toggle-icon - Icon to be displayed on the button to toggle search slot content on smaller devices\n * @slot navigation - Content will be rendered in navigation panel.\n * @slot buttons - Content will be rendered to right of search bar.\n */\n@Component({\n  tag: \"ic-top-navigation\",\n  styleUrl: \"ic-top-navigation.css\",\n  shadow: true,\n})\nexport class TopNavigation {\n  private hasAppIcon = false;\n  private hasAppTitleSlot = false;\n  private hasIconButtons = false;\n  private hasNavigation = false;\n  private hasSearchSlotContent = false;\n  private mobileSearchButtonEl?: HTMLIcButtonElement;\n  private resizeObserver: ResizeObserver | null = null;\n  private searchBar: HTMLIcSearchBarElement | null = null;\n  private menuButtonEl?: HTMLIcButtonElement;\n\n  @Element() el: HTMLIcTopNavigationElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n  @State() hasFullWidthSearchBar = false;\n  @State() mobileSearchBarVisible = false;\n  @State() mobileSearchHiddenOnBlur = false;\n  @State() navMenuVisible = false;\n  @State() searchButtonClick = false;\n  @State() searchValue = \"\";\n\n  /**\n   * The alignment of the top navigation content.\n   */\n  @Prop() contentAligned: IcAlignment = \"full-width\";\n  /**\n   * Can set a custom breakpoint for the top navigation to switch to mobile mode.\n   * Must be one of our specified breakpoints in px: `0`, `576`, `768`, `992`, `1200`.\n   */\n  @Prop() customMobileBreakpoint: IcDeviceSizes = DEVICE_SIZES.L;\n  /**\n   *  The URL to navigate to when the app title is clicked.\n   */\n  @Prop() href = \"/\";\n\n  /**\n   * If `true`, the flyout navigation menu on small devices will be contained by the parent element.\n   */\n  @Prop() inline = false;\n\n  /**\n   * The short title of the app to be displayed at small screen sizes in place of the app title.\n   */\n  @Prop() shortAppTitle = \"\";\n\n  /**\n   * The status info to be displayed.\n   */\n  @Prop() status = \"\";\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n\n  /**\n   * The version info to be displayed.\n   */\n  @Prop() version = \"\";\n\n  /**\n   * The app title to be displayed. This is required, unless a slotted app title link is used.\n   */\n  @Prop() appTitle?: string;\n  @Watch(\"appTitle\")\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    //this watch can be removed once Gatsby hydration issue is resolved\n    onComponentPropUndefinedChange(\n      oldValue,\n      newValue,\n      this.initialiseSearchBar\n    );\n  }\n\n  /**\n   * @internal - Emitted when the menu is closed.\n   */\n  @Event() icNavigationMenuClosed: EventEmitter<void>;\n\n  /**\n   * @internal - Emitted when the menu is opened.\n   */\n  @Event() icNavigationMenuOpened: EventEmitter<void>;\n\n  /**\n   * Emitted when the top navigation is resized.\n   */\n  @Event() icTopNavResized: EventEmitter<{ size: number }>;\n\n  disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    this.checkSlots();\n    this.deviceSize = getCurrentDeviceSize();\n    this.initialiseSearchBar();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n    if (!this.hasAppTitleSlot) {\n      onComponentRequiredPropUndefined(\n        [{ prop: this.appTitle, propName: \"app-title\" }],\n        \"Top Navigation\"\n      );\n    }\n  }\n\n  componentWillRender(): void {\n    this.checkSlots();\n  }\n\n  @Listen(\"icNavigationMenuClose\", {})\n  navBarMenuCloseHandler(): void {\n    this.showNavMenu(false);\n    this.menuButtonEl?.setFocus();\n  }\n\n  @Listen(\"icSearchBarBlur\", {})\n  searchInputBlurHandler({\n    detail,\n  }: CustomEvent<IcSearchBarBlurEventDetail>): void {\n    if (detail !== null) {\n      if (this.mobileSearchBarVisible && !this.searchButtonClick) {\n        //don't hide if blur was triggered by click on search button - let the click handler toggle the state\n        this.toggleSearchBar();\n      }\n      this.searchValue = detail.value as string;\n    }\n  }\n\n  @Listen(\"icChange\", {})\n  searchValueChangeHandler({ detail }: CustomEvent<IcValueEventDetail>): void {\n    this.searchValue = detail.value;\n  }\n\n  @Listen(\"brandChange\", { target: \"document\" })\n  brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n    this.foregroundColor = detail.mode;\n  }\n\n  private checkSlots = () => {\n    this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n    this.hasAppTitleSlot = isSlotUsed(this.el, \"app-title\");\n    this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n    this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n    this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n\n    if (this.hasAppIcon) {\n      const slottedAppIcon =\n        this.el.querySelector<HTMLElement>('[slot=\"app-icon\"]');\n      if (slottedAppIcon && slottedAppIcon.tagName === \"A\")\n        slottedAppIcon.tabIndex = -1;\n    }\n  };\n\n  private initialiseSearchBar = () => {\n    if (!this.hasSearchSlotContent) return;\n\n    const slot = getSlot(this.el, \"search\");\n    if (slot?.tagName === \"IC-SEARCH-BAR\") {\n      this.searchBar = slot as HTMLIcSearchBarElement;\n    } else if (slot?.tagName === \"FORM\") {\n      this.searchBar = slot.querySelector(\"ic-search-bar\");\n    }\n\n    if (this.searchBar !== null) {\n      this.searchBar.hideLabel = true;\n    }\n  };\n\n  private toggleSearchBar = () => {\n    this.mobileSearchBarVisible = !this.mobileSearchBarVisible;\n\n    if (!this.searchBar) return;\n\n    this.mobileSearchButtonEl?.setAttribute(\n      \"aria-label\",\n      `${this.mobileSearchBarVisible ? \"Hide\" : \"Show\"} search`\n    );\n    this.hasFullWidthSearchBar = this.mobileSearchBarVisible;\n    this.searchBar.fullWidth = this.mobileSearchBarVisible;\n    if (this.mobileSearchBarVisible) {\n      setTimeout(() => {\n        this.searchBar?.focus();\n      }, 100);\n    }\n  };\n\n  private menuButtonClick = () => {\n    this.showNavMenu(true);\n  };\n\n  private showNavMenu = (show: boolean) => {\n    this.navMenuVisible = show;\n    (show ? this.icNavigationMenuOpened : this.icNavigationMenuClosed).emit();\n    document.body.style.height = show ? \"100%\" : \"auto\";\n    document.body.style.overflow = show ? \"hidden\" : \"auto\";\n  };\n\n  private searchButtonMouseDownHandler = () => {\n    this.searchButtonClick = true;\n  };\n\n  private searchButtonClickHandler = () => {\n    this.toggleSearchBar();\n    this.searchButtonClick = false;\n  };\n\n  private resizeObserverCallback = (currSize: number) => {\n    if (currSize === this.deviceSize) return;\n\n    this.deviceSize = currSize;\n    if (currSize > this.customMobileBreakpoint) {\n      this.showNavMenu(false);\n      if (this.mobileSearchBarVisible) {\n        this.toggleSearchBar();\n      }\n    }\n    this.icTopNavResized.emit({\n      size: currSize,\n    });\n    if (this.searchBar && document.activeElement === this.searchBar) {\n      this.searchBar.setAttribute(\"hidden\", \"true\");\n      //remove attribute again as this trigger a redraw & applies css\n      this.searchBar.removeAttribute(\"hidden\");\n      setTimeout(() => {\n        this.searchBar?.focus();\n      }, 100);\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback(getCurrentDeviceSize());\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  render() {\n    const {\n      appTitle,\n      contentAligned,\n      customMobileBreakpoint,\n      deviceSize,\n      el,\n      foregroundColor,\n      hasAppIcon,\n      hasAppTitleSlot,\n      hasFullWidthSearchBar,\n      hasIconButtons,\n      hasNavigation,\n      hasSearchSlotContent,\n      href,\n      inline,\n      menuButtonClick,\n      mobileSearchBarVisible,\n      navMenuVisible,\n      searchButtonClickHandler,\n      searchButtonMouseDownHandler,\n      shortAppTitle,\n      status,\n      version,\n      theme,\n    } = this;\n\n    const hasStatus = status !== \"\";\n    const hasVersion = version !== \"\";\n    const hasMenuContent =\n      hasNavigation || hasIconButtons || hasStatus || hasVersion;\n\n    const isSmallDeviceSize = deviceSize <= DEVICE_SIZES.S;\n\n    const searchButtonSize = isSmallDeviceSize ? \"medium\" : \"large\";\n    const hasTitle = appTitle !== \"\" && isPropDefined(appTitle);\n    const overMobileBreakpoint = deviceSize <= customMobileBreakpoint;\n\n    const appTitleVariant: IcTypographyVariants = overMobileBreakpoint\n      ? isSmallDeviceSize\n        ? \"subtitle-small\"\n        : \"h4\"\n      : \"h3\";\n\n    const mobileSearchButtonTitle = `${\n      mobileSearchBarVisible ? \"Hide\" : \"Show\"\n    } search`;\n    const menuSize = isSmallDeviceSize ? \"small\" : \"medium\";\n\n    const shortAppTitleSlot = isSlotUsed(el, \"short-app-title\");\n    const Component = hasAppTitleSlot ? \"div\" : \"a\";\n    const attrs = Component == \"a\" && {\n      href: href,\n    };\n\n    return (\n      <Host\n        class={{\n          \"fullwidth-searchbar\": hasFullWidthSearchBar,\n          \"mobile-mode\": overMobileBreakpoint,\n          [IcBrandForegroundEnum.Dark]:\n            foregroundColor === IcBrandForegroundEnum.Dark,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div class=\"top-navigation\">\n          <ic-section-container aligned={contentAligned} full-height>\n            <header role=\"banner\">\n              <div class=\"top-panel-container\">\n                <div class=\"app-details-container\">\n                  {(hasTitle || hasAppTitleSlot) && (\n                    <Component class=\"title-link\" {...attrs}>\n                      {hasAppIcon && (\n                        <div class=\"app-icon-container\">\n                          <slot name=\"app-icon\" />\n                        </div>\n                      )}\n                      {isSmallDeviceSize &&\n                      (!isEmptyString(shortAppTitle) || shortAppTitleSlot) ? (\n                        <ic-typography\n                          variant=\"subtitle-small\"\n                          aria-label={\n                            (!hasAppTitleSlot || !shortAppTitleSlot) &&\n                            `${appTitle} (${shortAppTitle})`\n                          }\n                        >\n                          <h1>\n                            {shortAppTitleSlot ? (\n                              <slot name=\"short-app-title\"></slot>\n                            ) : (\n                              shortAppTitle\n                            )}\n                          </h1>\n                        </ic-typography>\n                      ) : (\n                        <ic-typography variant={appTitleVariant}>\n                          <h1 class=\"title-wrap\">\n                            {hasAppTitleSlot ? (\n                              <slot name=\"app-title\"></slot>\n                            ) : (\n                              appTitle\n                            )}\n                          </h1>\n                        </ic-typography>\n                      )}\n                    </Component>\n                  )}\n                  {hasStatus && (\n                    <div class=\"app-status\">\n                      <ic-typography\n                        aria-label=\"app tag\"\n                        variant=\"label-uppercase\"\n                        class=\"app-status-text\"\n                      >\n                        {status}\n                      </ic-typography>\n                    </div>\n                  )}\n                  {hasVersion && (\n                    <div class=\"app-version\">\n                      <ic-typography\n                        variant=\"label\"\n                        class=\"app-version-text\"\n                        aria-label=\"app version\"\n                      >\n                        {version}\n                      </ic-typography>\n                    </div>\n                  )}\n                </div>\n\n                {(hasSearchSlotContent || hasMenuContent) && (\n                  <div class=\"search-menu-container\">\n                    <div class=\"search-actions-container\">\n                      {!overMobileBreakpoint ? (\n                        <Fragment>\n                          <slot name=\"search\"></slot>\n                          {hasIconButtons && (\n                            <div class=\"icon-buttons-container\">\n                              <slot name=\"buttons\"></slot>\n                            </div>\n                          )}\n                        </Fragment>\n                      ) : (\n                        <Fragment>\n                          {hasSearchSlotContent && (\n                            <ic-button\n                              id=\"search-toggle-button\"\n                              ref={(el) => (this.mobileSearchButtonEl = el)}\n                              onMouseDown={searchButtonMouseDownHandler}\n                              variant=\"icon-tertiary\"\n                              monochrome\n                              size={searchButtonSize}\n                              aria-label={mobileSearchButtonTitle}\n                              theme={foregroundColor as IcThemeMode}\n                              onClick={searchButtonClickHandler}\n                            >\n                              <slot name=\"toggle-icon\">\n                                <svg\n                                  xmlns=\"http://www.w3.org/2000/svg\"\n                                  viewBox=\"0 0 24 24\"\n                                  fill=\"#ffffff\"\n                                >\n                                  <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                                  <path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n                                </svg>\n                              </slot>\n                            </ic-button>\n                          )}\n                          {hasMenuContent && (\n                            <div class=\"menu-button-container\">\n                              <span\n                                id=\"navigation-landmark-button-text\"\n                                class=\"navigation-landmark-button-text\"\n                                aria-hidden=\"true\"\n                              >\n                                Main navigation button\n                              </span>\n                              <nav\n                                aria-labelledby=\"navigation-landmark-button-text\"\n                                aria-hidden={`${navMenuVisible}`}\n                              >\n                                <ic-button\n                                  id=\"menu-button\"\n                                  ref={(el) => (this.menuButtonEl = el)}\n                                  theme={foregroundColor as IcThemeMode}\n                                  variant=\"secondary\"\n                                  monochrome\n                                  aria-expanded=\"false\"\n                                  aria-haspopup=\"true\"\n                                  aria-label={`Open ${\n                                    hasNavigation ? \"navigation\" : \"app\"\n                                  } menu`}\n                                  size={menuSize}\n                                  onClick={menuButtonClick}\n                                >\n                                  Menu\n                                  <svg\n                                    xmlns=\"http://www.w3.org/2000/svg\"\n                                    height=\"24px\"\n                                    viewBox=\"0 0 24 24\"\n                                    width=\"24px\"\n                                    fill=\"#ffffff\"\n                                    slot=\"left-icon\"\n                                  >\n                                    <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                                    <path d=\"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\" />\n                                  </svg>\n                                </ic-button>\n                              </nav>\n                            </div>\n                          )}\n                        </Fragment>\n                      )}\n                    </div>\n                  </div>\n                )}\n              </div>\n\n              {mobileSearchBarVisible && (\n                <div class=\"search-bar-container\">\n                  <slot name=\"search\"></slot>\n                </div>\n              )}\n\n              {hasNavigation && !overMobileBreakpoint && (\n                <div class=\"navigation-tabs\">\n                  <span\n                    id=\"navigation-landmark-text\"\n                    class=\"navigation-landmark-text\"\n                    aria-hidden=\"true\"\n                  >\n                    Main pages\n                  </span>\n                  <nav\n                    aria-labelledby=\"navigation-landmark-text\"\n                    class=\"nav-panel-container\"\n                  >\n                    <ic-horizontal-scroll\n                      monochrome\n                      appearance={foregroundColor}\n                    >\n                      <ul class=\"navigation-item-list\" tabindex=\"-1\">\n                        <slot name=\"navigation\"></slot>\n                      </ul>\n                    </ic-horizontal-scroll>\n                  </nav>\n                </div>\n              )}\n            </header>\n          </ic-section-container>\n        </div>\n        {navMenuVisible && (\n          <ic-navigation-menu\n            version={version}\n            status={status}\n            class={{\n              inline,\n            }}\n          >\n            {hasIconButtons && (\n              <div class=\"menu-buttons-slot\" slot=\"buttons\">\n                <slot name=\"buttons\"></slot>\n              </div>\n            )}\n            <ul slot=\"navigation\">\n              <slot name=\"navigation\"></slot>\n            </ul>\n          </ic-navigation-menu>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["icTopNavigationCss","IcTopNavigationStyle0","TopNavigation","constructor","hostRef","this","hasAppIcon","hasAppTitleSlot","hasIconButtons","hasNavigation","hasSearchSlotContent","resizeObserver","searchBar","deviceSize","DEVICE_SIZES","XL","foregroundColor","getBrandForegroundAppearance","hasFullWidthSearchBar","mobileSearchBarVisible","mobileSearchHiddenOnBlur","navMenuVisible","searchButtonClick","searchValue","contentAligned","customMobileBreakpoint","L","href","inline","shortAppTitle","status","theme","version","checkSlots","isSlotUsed","el","slottedAppIcon","querySelector","tagName","tabIndex","initialiseSearchBar","slot","getSlot","hideLabel","toggleSearchBar","_a","mobileSearchButtonEl","setAttribute","fullWidth","setTimeout","focus","menuButtonClick","showNavMenu","show","icNavigationMenuOpened","icNavigationMenuClosed","emit","document","body","style","height","overflow","searchButtonMouseDownHandler","searchButtonClickHandler","resizeObserverCallback","currSize","icTopNavResized","size","activeElement","removeAttribute","runResizeObserver","ResizeObserver","getCurrentDeviceSize","observe","watchPropHandler","newValue","oldValue","onComponentPropUndefinedChange","disconnectedCallback","disconnect","componentWillLoad","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","appTitle","propName","componentWillRender","navBarMenuCloseHandler","menuButtonEl","setFocus","searchInputBlurHandler","detail","value","searchValueChangeHandler","brandChangeHandler","mode","render","hasStatus","hasVersion","hasMenuContent","isSmallDeviceSize","S","searchButtonSize","hasTitle","isPropDefined","overMobileBreakpoint","appTitleVariant","mobileSearchButtonTitle","menuSize","shortAppTitleSlot","Component","attrs","h","Host","key","class","IcBrandForegroundEnum","Dark","aligned","role","Object","assign","name","isEmptyString","variant","Fragment","id","ref","onMouseDown","monochrome","onClick","xmlns","viewBox","fill","d","width","appearance","tabindex"],"sources":["src/components/ic-top-navigation/ic-top-navigation.css?tag=ic-top-navigation&encapsulation=shadow","src/components/ic-top-navigation/ic-top-navigation.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  color: var(--ic-top-navigation-text);\n  width: 100%;\n  position: relative;\n\n  --ic-typography-color: var(--ic-top-navigation-text);\n  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);\n  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);\n  --navigation-link-colour: var(--ic-top-navigation-text);\n  --ic-top-navigation-status-tag-text: var(--ic-color-text-primary-light);\n  --ic-top-navigation-status-tag-secondary: var(--ic-state-layer-lighten-20);\n}\n\n:host(.dark) {\n  --ic-top-navigation-status-tag-text: var(--ic-color-text-primary-dark);\n  --ic-top-navigation-status-tag-secondary: var(--ic-state-layer-darken-10);\n  --ic-top-navigation-title-hover: var(--ic-action-dark-bg-hover);\n  --ic-top-navigation-title-pressed: var(--ic-action-dark-bg-pressed);\n}\n\n:host(.dark) ::slotted(ic-navigation-button) {\n  --ic-button-icon-monochrome: var(--ic-color-text-primary-light);\n}\n\n::slotted(ic-navigation-button) {\n  --ic-button-icon-monochrome: white;\n}\n\n:host .top-navigation {\n  background-color: var(--ic-top-navigation-background);\n  height: max-content;\n}\n\n:host(.fullwidth-searchbar) slot[name=\"search\"]::slotted(form) {\n  width: 100%;\n}\n\n:host .title-link {\n  display: inline-flex;\n  align-items: center;\n  text-decoration: none;\n  padding: var(--ic-space-xxs);\n  transition: var(--ic-easing-transition-fast);\n}\n\n:host .title-link,\n:host .title-link:visited,\n:host .title-link:active,\n:host .title-link ::slotted(a),\n:host .title-link:visited ::slotted(a),\n:host .title-link:active ::slotted(a) {\n  color: var(--ic-top-navigation-icon-and-label);\n  text-decoration: none;\n  outline: none;\n\n  --ic-typography-color: var(--ic-top-navigation-icon-and-label);\n}\n\n:host .title-link:hover:not(:focus) {\n  background-color: var(--ic-top-navigation-title-hover);\n}\n\n:host .title-link:active:not(:focus) {\n  background-color: var(--ic-top-navigation-title-pressed);\n}\n\n:host .title-link:hover {\n  border-radius: var(--ic-border-radius);\n}\n\n:host .menu-button-container {\n  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);\n  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);\n}\n\n:host .title-link:focus,\n:host .title-link:focus-within {\n  border-radius: var(--ic-border-radius);\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host .title-link ic-typography {\n  font-weight: 600;\n}\n\n:host .nav-panel-container {\n  border-top: var(--ic-space-1px) solid var(--ic-top-navigation-keyline);\n  padding: 0 var(--ic-space-lg);\n  margin-left: calc(-1 * var(--section-container-margin));\n  margin-right: calc(-1 * var(--section-container-margin));\n  display: flex;\n}\n\n:host(.dark) .nav-panel-container {\n  border-top: var(--ic-border-keyline-darken);\n}\n\n.top-panel-container {\n  display: flex;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.navigation-tabs {\n  margin-top: calc(-1 * var(--ic-space-1px));\n}\n\n.app-details-container {\n  display: flex;\n  align-items: center;\n  flex: 1 1 auto;\n  margin-right: var(--ic-space-md);\n}\n\n.app-icon-container {\n  display: flex;\n  padding-right: var(--ic-space-xs);\n}\n\n.icon-buttons-container {\n  display: flex;\n  margin-left: var(--ic-space-md);\n}\n\n.icon-buttons-container ::slotted(nav) {\n  display: flex;\n}\n\n.title-wrap {\n  overflow-wrap: break-word;\n  word-wrap: break-word;\n  -ms-word-break: break-all;\n  word-break: break-word;\n  hyphens: auto;\n}\n\n:host .app-status {\n  border-radius: var(--ic-space-md);\n  background-color: var(--ic-top-navigation-status-tag);\n  color: var(--ic-top-navigation-status-tag-text);\n\n  --ic-typography-color: var(--ic-top-navigation-status-tag-text);\n\n  padding: var(--ic-space-xxs) var(--ic-space-lg);\n  margin-left: var(--ic-space-md);\n  flex: 1 1 0;\n  max-width: fit-content;\n}\n\n:host .app-version {\n  border-radius: var(--ic-space-md);\n  background-color: var(--ic-top-navigation-status-tag-secondary);\n  color: var(--ic-top-navigation-status-tag);\n  padding: var(--ic-space-xxs) var(--ic-space-sm);\n  margin-left: var(--ic-space-xs);\n  flex: 1 1 0;\n  max-width: fit-content;\n\n  --ic-typography-color: var(--ic-top-navigation-status-tag);\n}\n\nslot[name=\"app-icon\"]::slotted(*) {\n  fill: var(--ic-top-navigation-logo);\n  width: 2em;\n  height: 2em;\n  cursor: pointer;\n}\n\nslot[name=\"toggle-icon\"] svg {\n  fill: var(--ic-top-navigation-icon);\n}\n\n.search-menu-container {\n  justify-content: right;\n  display: flex;\n  align-items: center;\n}\n\n.menu-button-container {\n  margin-left: var(--ic-space-md);\n}\n\n.menu-button-container .navigation-landmark-button-text {\n  position: absolute;\n  left: -9999px;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  color: var(--ic-brand-text-color);\n}\n\n.menu-button-container .navigation-landmark-button-text:dir(rtl) {\n  right: -9999px;\n}\n\n.search-actions-container {\n  display: flex;\n}\n\n.menu-buttons-slot {\n  display: flex;\n  flex-direction: column;\n}\n\n.navigation-landmark-text {\n  position: absolute;\n  width: var(--ic-space-1px);\n  height: var(--ic-space-1px);\n  padding: 0;\n  margin: calc(-1 * var(--ic-space-1px));\n  overflow: hidden;\n}\n\n.navigation-item-list {\n  display: flex;\n  list-style: none;\n  height: 2.75rem;\n}\n\n.navigation-item-list::-webkit-scrollbar {\n  display: none;\n}\n\n:host ic-section-container {\n  padding-bottom: 0 !important;\n  padding-top: 0 !important;\n}\n\n@media screen and (min-width: 993px) {\n  .app-details-container {\n    margin-right: var(--ic-space-lg);\n  }\n}\n\n/* large */\n@media screen and (max-width: 1200px) {\n  :host .nav-panel-container {\n    padding: 0 var(--ic-space-md);\n  }\n}\n\n/** Mobile styling **/\n:host(.mobile-mode) .app-status,\n:host(.mobile-mode) .app-version {\n  display: none;\n}\n\n:host(.mobile-mode) .title-link {\n  margin-right: var(--ic-space-xs);\n}\n\n:host(.mobile-mode) .search-menu-container {\n  max-width: 10rem;\n}\n\n:host(.mobile-mode) .search-bar-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-top: var(--ic-border-keyline-darken);\n  height: 4rem;\n  padding-left: var(--ic-space-md);\n  padding-right: var(--ic-space-md);\n  margin-left: calc(-1 * var(--section-container-margin));\n  margin-right: calc(-1 * var(--section-container-margin));\n}\n\n/* x small */\n@media screen and (max-width: 576px) {\n  :host .title-link {\n    margin-right: var(--ic-space-xxxs);\n    word-break: break-word;\n    hyphens: none;\n  }\n\n  .top-panel-container {\n    min-height: 2.5rem;\n  }\n\n  .search-bar-container {\n    margin-top: 0;\n    height: 3.5rem;\n    padding-left: var(--ic-space-xs);\n    padding-right: var(--ic-space-xs);\n  }\n\n  .menu-button-container {\n    margin-left: var(--ic-space-sm);\n  }\n\n  slot[name=\"app-icon\"]::slotted(*) {\n    width: 1.5em;\n    height: 1.5em;\n  }\n\n  slot[name=\"toggle-icon\"] svg {\n    width: 1.5em;\n    height: 1.5em;\n  }\n}\n\n@media (forced-colors: active) {\n  :host .top-navigation {\n    border-bottom: var(--ic-border-hc);\n  }\n\n  .app-status,\n  .app-version {\n    border: var(--ic-border-hc);\n  }\n\n  slot[name=\"app-icon\"]::slotted(*) {\n    fill: currentcolor;\n  }\n\n  slot[name=\"toggle-icon\"] svg {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Listen,\n  Event,\n  EventEmitter,\n  Watch,\n  Fragment,\n} from \"@stencil/core\";\n\nimport {\n  IcTypographyVariants,\n  IcAlignment,\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n  IcBrand,\n  IcDeviceSizes,\n  IcValueEventDetail,\n  IcThemeMode,\n} from \"../../utils/types\";\nimport {\n  checkResizeObserver,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getBrandForegroundAppearance,\n  getSlot,\n  onComponentPropUndefinedChange,\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  isEmptyString,\n  isPropDefined,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"../ic-search-bar/ic-search-bar.types\";\n\n/**\n * @slot app-icon - Content will be rendered to left of app title. Anything that is slotted here will be hidden from screen readers.\n * @slot app-title - Handle routing by nesting a route in the app title.\n * @slot short-app-title - Handle routing by nesting a route in the short app title (to be displayed in place of app title on small screen sizes).\n * @slot search - Content will be rendered in search area to left of buttons.\n * @slot toggle-icon - Icon to be displayed on the button to toggle search slot content on smaller devices\n * @slot navigation - Content will be rendered in navigation panel.\n * @slot buttons - Content will be rendered to right of search bar.\n */\n@Component({\n  tag: \"ic-top-navigation\",\n  styleUrl: \"ic-top-navigation.css\",\n  shadow: true,\n})\nexport class TopNavigation {\n  private hasAppIcon = false;\n  private hasAppTitleSlot = false;\n  private hasIconButtons = false;\n  private hasNavigation = false;\n  private hasSearchSlotContent = false;\n  private mobileSearchButtonEl?: HTMLIcButtonElement;\n  private resizeObserver: ResizeObserver | null = null;\n  private searchBar: HTMLIcSearchBarElement | null = null;\n  private menuButtonEl?: HTMLIcButtonElement;\n\n  @Element() el: HTMLIcTopNavigationElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n  @State() hasFullWidthSearchBar = false;\n  @State() mobileSearchBarVisible = false;\n  @State() mobileSearchHiddenOnBlur = false;\n  @State() navMenuVisible = false;\n  @State() searchButtonClick = false;\n  @State() searchValue = \"\";\n\n  /**\n   * The alignment of the top navigation content.\n   */\n  @Prop() contentAligned: IcAlignment = \"full-width\";\n  /**\n   * Can set a custom breakpoint for the top navigation to switch to mobile mode.\n   * Must be one of our specified breakpoints in px: `0`, `576`, `768`, `992`, `1200`.\n   */\n  @Prop() customMobileBreakpoint: IcDeviceSizes = DEVICE_SIZES.L;\n  /**\n   *  The URL to navigate to when the app title is clicked.\n   */\n  @Prop() href = \"/\";\n\n  /**\n   * If `true`, the flyout navigation menu on small devices will be contained by the parent element.\n   */\n  @Prop() inline = false;\n\n  /**\n   * The short title of the app to be displayed at small screen sizes in place of the app title.\n   */\n  @Prop() shortAppTitle = \"\";\n\n  /**\n   * The status info to be displayed.\n   */\n  @Prop() status = \"\";\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n\n  /**\n   * The version info to be displayed.\n   */\n  @Prop() version = \"\";\n\n  /**\n   * The app title to be displayed. This is required, unless a slotted app title link is used.\n   */\n  @Prop() appTitle?: string;\n  @Watch(\"appTitle\")\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    //this watch can be removed once Gatsby hydration issue is resolved\n    onComponentPropUndefinedChange(\n      oldValue,\n      newValue,\n      this.initialiseSearchBar\n    );\n  }\n\n  /**\n   * @internal - Emitted when the menu is closed.\n   */\n  @Event() icNavigationMenuClosed: EventEmitter<void>;\n\n  /**\n   * @internal - Emitted when the menu is opened.\n   */\n  @Event() icNavigationMenuOpened: EventEmitter<void>;\n\n  /**\n   * Emitted when the top navigation is resized.\n   */\n  @Event() icTopNavResized: EventEmitter<{ size: number }>;\n\n  disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    this.checkSlots();\n    this.deviceSize = getCurrentDeviceSize();\n    this.initialiseSearchBar();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n    if (!this.hasAppTitleSlot) {\n      onComponentRequiredPropUndefined(\n        [{ prop: this.appTitle, propName: \"app-title\" }],\n        \"Top Navigation\"\n      );\n    }\n  }\n\n  componentWillRender(): void {\n    this.checkSlots();\n  }\n\n  @Listen(\"icNavigationMenuClose\", {})\n  navBarMenuCloseHandler(): void {\n    this.showNavMenu(false);\n    this.menuButtonEl?.setFocus();\n  }\n\n  @Listen(\"icSearchBarBlur\", {})\n  searchInputBlurHandler({\n    detail,\n  }: CustomEvent<IcSearchBarBlurEventDetail>): void {\n    if (detail !== null) {\n      if (this.mobileSearchBarVisible && !this.searchButtonClick) {\n        //don't hide if blur was triggered by click on search button - let the click handler toggle the state\n        this.toggleSearchBar();\n      }\n      this.searchValue = detail.value as string;\n    }\n  }\n\n  @Listen(\"icChange\", {})\n  searchValueChangeHandler({ detail }: CustomEvent<IcValueEventDetail>): void {\n    this.searchValue = detail.value;\n  }\n\n  @Listen(\"brandChange\", { target: \"document\" })\n  brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n    this.foregroundColor = detail.mode;\n  }\n\n  private checkSlots = () => {\n    this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n    this.hasAppTitleSlot = isSlotUsed(this.el, \"app-title\");\n    this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n    this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n    this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n\n    if (this.hasAppIcon) {\n      const slottedAppIcon =\n        this.el.querySelector<HTMLElement>('[slot=\"app-icon\"]');\n      if (slottedAppIcon && slottedAppIcon.tagName === \"A\")\n        slottedAppIcon.tabIndex = -1;\n    }\n  };\n\n  private initialiseSearchBar = () => {\n    if (!this.hasSearchSlotContent) return;\n\n    const slot = getSlot(this.el, \"search\");\n    if (slot?.tagName === \"IC-SEARCH-BAR\") {\n      this.searchBar = slot as HTMLIcSearchBarElement;\n    } else if (slot?.tagName === \"FORM\") {\n      this.searchBar = slot.querySelector(\"ic-search-bar\");\n    }\n\n    if (this.searchBar !== null) {\n      this.searchBar.hideLabel = true;\n    }\n  };\n\n  private toggleSearchBar = () => {\n    this.mobileSearchBarVisible = !this.mobileSearchBarVisible;\n\n    if (!this.searchBar) return;\n\n    this.mobileSearchButtonEl?.setAttribute(\n      \"aria-label\",\n      `${this.mobileSearchBarVisible ? \"Hide\" : \"Show\"} search`\n    );\n    this.hasFullWidthSearchBar = this.mobileSearchBarVisible;\n    this.searchBar.fullWidth = this.mobileSearchBarVisible;\n    if (this.mobileSearchBarVisible) {\n      setTimeout(() => {\n        this.searchBar?.focus();\n      }, 100);\n    }\n  };\n\n  private menuButtonClick = () => {\n    this.showNavMenu(true);\n  };\n\n  private showNavMenu = (show: boolean) => {\n    this.navMenuVisible = show;\n    (show ? this.icNavigationMenuOpened : this.icNavigationMenuClosed).emit();\n    document.body.style.height = show ? \"100%\" : \"auto\";\n    document.body.style.overflow = show ? \"hidden\" : \"auto\";\n  };\n\n  private searchButtonMouseDownHandler = () => {\n    this.searchButtonClick = true;\n  };\n\n  private searchButtonClickHandler = () => {\n    this.toggleSearchBar();\n    this.searchButtonClick = false;\n  };\n\n  private resizeObserverCallback = (currSize: number) => {\n    if (currSize === this.deviceSize) return;\n\n    this.deviceSize = currSize;\n    if (currSize > this.customMobileBreakpoint) {\n      this.showNavMenu(false);\n      if (this.mobileSearchBarVisible) {\n        this.toggleSearchBar();\n      }\n    }\n    this.icTopNavResized.emit({\n      size: currSize,\n    });\n    if (this.searchBar && document.activeElement === this.searchBar) {\n      this.searchBar.setAttribute(\"hidden\", \"true\");\n      //remove attribute again as this trigger a redraw & applies css\n      this.searchBar.removeAttribute(\"hidden\");\n      setTimeout(() => {\n        this.searchBar?.focus();\n      }, 100);\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback(getCurrentDeviceSize());\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  render() {\n    const {\n      appTitle,\n      contentAligned,\n      customMobileBreakpoint,\n      deviceSize,\n      el,\n      foregroundColor,\n      hasAppIcon,\n      hasAppTitleSlot,\n      hasFullWidthSearchBar,\n      hasIconButtons,\n      hasNavigation,\n      hasSearchSlotContent,\n      href,\n      inline,\n      menuButtonClick,\n      mobileSearchBarVisible,\n      navMenuVisible,\n      searchButtonClickHandler,\n      searchButtonMouseDownHandler,\n      shortAppTitle,\n      status,\n      version,\n      theme,\n    } = this;\n\n    const hasStatus = status !== \"\";\n    const hasVersion = version !== \"\";\n    const hasMenuContent =\n      hasNavigation || hasIconButtons || hasStatus || hasVersion;\n\n    const isSmallDeviceSize = deviceSize <= DEVICE_SIZES.S;\n\n    const searchButtonSize = isSmallDeviceSize ? \"medium\" : \"large\";\n    const hasTitle = appTitle !== \"\" && isPropDefined(appTitle);\n    const overMobileBreakpoint = deviceSize <= customMobileBreakpoint;\n\n    const appTitleVariant: IcTypographyVariants = overMobileBreakpoint\n      ? isSmallDeviceSize\n        ? \"subtitle-small\"\n        : \"h4\"\n      : \"h3\";\n\n    const mobileSearchButtonTitle = `${\n      mobileSearchBarVisible ? \"Hide\" : \"Show\"\n    } search`;\n    const menuSize = isSmallDeviceSize ? \"small\" : \"medium\";\n\n    const shortAppTitleSlot = isSlotUsed(el, \"short-app-title\");\n    const Component = hasAppTitleSlot ? \"div\" : \"a\";\n    const attrs = Component == \"a\" && {\n      href: href,\n    };\n\n    return (\n      <Host\n        class={{\n          \"fullwidth-searchbar\": hasFullWidthSearchBar,\n          \"mobile-mode\": overMobileBreakpoint,\n          [IcBrandForegroundEnum.Dark]:\n            foregroundColor === IcBrandForegroundEnum.Dark,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div class=\"top-navigation\">\n          <ic-section-container aligned={contentAligned} full-height>\n            <header role=\"banner\">\n              <div class=\"top-panel-container\">\n                <div class=\"app-details-container\">\n                  {(hasTitle || hasAppTitleSlot) && (\n                    <Component class=\"title-link\" {...attrs}>\n                      {hasAppIcon && (\n                        <div class=\"app-icon-container\">\n                          <slot name=\"app-icon\" />\n                        </div>\n                      )}\n                      {isSmallDeviceSize &&\n                      (!isEmptyString(shortAppTitle) || shortAppTitleSlot) ? (\n                        <ic-typography\n                          variant=\"subtitle-small\"\n                          aria-label={\n                            (!hasAppTitleSlot || !shortAppTitleSlot) &&\n                            `${appTitle} (${shortAppTitle})`\n                          }\n                        >\n                          <h1>\n                            {shortAppTitleSlot ? (\n                              <slot name=\"short-app-title\"></slot>\n                            ) : (\n                              shortAppTitle\n                            )}\n                          </h1>\n                        </ic-typography>\n                      ) : (\n                        <ic-typography variant={appTitleVariant}>\n                          <h1 class=\"title-wrap\">\n                            {hasAppTitleSlot ? (\n                              <slot name=\"app-title\"></slot>\n                            ) : (\n                              appTitle\n                            )}\n                          </h1>\n                        </ic-typography>\n                      )}\n                    </Component>\n                  )}\n                  {hasStatus && (\n                    <div class=\"app-status\">\n                      <ic-typography\n                        aria-label=\"app tag\"\n                        variant=\"label-uppercase\"\n                        class=\"app-status-text\"\n                      >\n                        {status}\n                      </ic-typography>\n                    </div>\n                  )}\n                  {hasVersion && (\n                    <div class=\"app-version\">\n                      <ic-typography\n                        variant=\"label\"\n                        class=\"app-version-text\"\n                        aria-label=\"app version\"\n                      >\n                        {version}\n                      </ic-typography>\n                    </div>\n                  )}\n                </div>\n\n                {(hasSearchSlotContent || hasMenuContent) && (\n                  <div class=\"search-menu-container\">\n                    <div class=\"search-actions-container\">\n                      {!overMobileBreakpoint ? (\n                        <Fragment>\n                          <slot name=\"search\"></slot>\n                          {hasIconButtons && (\n                            <div class=\"icon-buttons-container\">\n                              <slot name=\"buttons\"></slot>\n                            </div>\n                          )}\n                        </Fragment>\n                      ) : (\n                        <Fragment>\n                          {hasSearchSlotContent && (\n                            <ic-button\n                              id=\"search-toggle-button\"\n                              ref={(el) => (this.mobileSearchButtonEl = el)}\n                              onMouseDown={searchButtonMouseDownHandler}\n                              variant=\"icon-tertiary\"\n                              monochrome\n                              size={searchButtonSize}\n                              aria-label={mobileSearchButtonTitle}\n                              theme={foregroundColor as IcThemeMode}\n                              onClick={searchButtonClickHandler}\n                            >\n                              <slot name=\"toggle-icon\">\n                                <svg\n                                  xmlns=\"http://www.w3.org/2000/svg\"\n                                  viewBox=\"0 0 24 24\"\n                                  fill=\"#ffffff\"\n                                >\n                                  <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                                  <path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n                                </svg>\n                              </slot>\n                            </ic-button>\n                          )}\n                          {hasMenuContent && (\n                            <div class=\"menu-button-container\">\n                              <span\n                                id=\"navigation-landmark-button-text\"\n                                class=\"navigation-landmark-button-text\"\n                                aria-hidden=\"true\"\n                              >\n                                Main navigation button\n                              </span>\n                              <nav\n                                aria-labelledby=\"navigation-landmark-button-text\"\n                                aria-hidden={`${navMenuVisible}`}\n                              >\n                                <ic-button\n                                  id=\"menu-button\"\n                                  ref={(el) => (this.menuButtonEl = el)}\n                                  theme={foregroundColor as IcThemeMode}\n                                  variant=\"secondary\"\n                                  monochrome\n                                  aria-expanded=\"false\"\n                                  aria-haspopup=\"true\"\n                                  aria-label={`Open ${\n                                    hasNavigation ? \"navigation\" : \"app\"\n                                  } menu`}\n                                  size={menuSize}\n                                  onClick={menuButtonClick}\n                                >\n                                  Menu\n                                  <svg\n                                    xmlns=\"http://www.w3.org/2000/svg\"\n                                    height=\"24px\"\n                                    viewBox=\"0 0 24 24\"\n                                    width=\"24px\"\n                                    fill=\"#ffffff\"\n                                    slot=\"left-icon\"\n                                  >\n                                    <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                                    <path d=\"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\" />\n                                  </svg>\n                                </ic-button>\n                              </nav>\n                            </div>\n                          )}\n                        </Fragment>\n                      )}\n                    </div>\n                  </div>\n                )}\n              </div>\n\n              {mobileSearchBarVisible && (\n                <div class=\"search-bar-container\">\n                  <slot name=\"search\"></slot>\n                </div>\n              )}\n\n              {hasNavigation && !overMobileBreakpoint && (\n                <div class=\"navigation-tabs\">\n                  <span\n                    id=\"navigation-landmark-text\"\n                    class=\"navigation-landmark-text\"\n                    aria-hidden=\"true\"\n                  >\n                    Main pages\n                  </span>\n                  <nav\n                    aria-labelledby=\"navigation-landmark-text\"\n                    class=\"nav-panel-container\"\n                  >\n                    <ic-horizontal-scroll\n                      // eslint-disable-next-line\n                      // @ts-ignore\n                      monochrome\n                      appearance={foregroundColor}\n                    >\n                      <ul class=\"navigation-item-list\" tabindex=\"-1\">\n                        <slot name=\"navigation\"></slot>\n                      </ul>\n                    </ic-horizontal-scroll>\n                  </nav>\n                </div>\n              )}\n            </header>\n          </ic-section-container>\n        </div>\n        {navMenuVisible && (\n          <ic-navigation-menu\n            version={version}\n            status={status}\n            class={{\n              inline,\n            }}\n          >\n            {hasIconButtons && (\n              <div class=\"menu-buttons-slot\" slot=\"buttons\">\n                <slot name=\"buttons\"></slot>\n              </div>\n            )}\n            <ul slot=\"navigation\">\n              <slot name=\"navigation\"></slot>\n            </ul>\n          </ic-navigation-menu>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}