@ukic/canary-web-components 2.0.0-canary.3 → 2.0.0-canary.4

package/dist/core/p-4ec6d80b.entry.js

@@ -1,2 +0,0 @@
-import{r as s,h as t,g as i}from"./p-03935e89.js";const e=class{constructor(t){s(this,t);this.pendingVisibility=[]}handleDismissedToast(){var s;if(this.pendingVisibility.length>0){this.pendingVisibility[0].setVisible().then((s=>this.previouslyFocused=s));this.pendingVisibility.shift()}else{if(this.previouslyFocused&&"setFocus"in this.previouslyFocused){this.previouslyFocused.setFocus()}else(s=this.previouslyFocused)===null||s===void 0?void 0:s.focus()}}async setVisible(s){const t=Array.from(document.querySelectorAll("ic-toast")).filter((s=>window.getComputedStyle(s).display!=="none"));if(t.indexOf(s)===-1&&t.length<=0){s.setVisible().then((s=>this.previouslyFocused=s))}if(t.length>0)this.pendingVisibility.push(s)}render(){return t("slot",null)}get el(){return i(this)}};export{e as ic_toast_region};
-//# sourceMappingURL=p-4ec6d80b.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["ToastRegion","constructor","hostRef","this","pendingVisibility","handleDismissedToast","length","setVisible","then","res","previouslyFocused","shift","setFocus","_a","focus","toast","visibleToasts","Array","from","document","querySelectorAll","filter","el","window","getComputedStyle","display","indexOf","push","render","h"],"sources":["src/components/ic-toast-region/ic-toast-region.tsx"],"sourcesContent":["import { Component, Element, h, Listen, Method } from \"@stencil/core\";\nimport { IcFocusableComponents } from \"../../utils/types\";\n\n@Component({ tag: \"ic-toast-region\" })\nexport class ToastRegion {\n  private pendingVisibility: HTMLIcToastElement[] = [];\n  private previouslyFocused: HTMLElement;\n\n  @Element() el: HTMLIcToastRegionElement;\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleDismissedToast(): void {\n    if (this.pendingVisibility.length > 0) {\n      this.pendingVisibility[0]\n        .setVisible()\n        .then((res) => (this.previouslyFocused = res));\n      this.pendingVisibility.shift();\n    } else {\n      if (this.previouslyFocused && \"setFocus\" in this.previouslyFocused) {\n        (this.previouslyFocused as IcFocusableComponents).setFocus();\n      } else this.previouslyFocused?.focus();\n    }\n  }\n\n  /**\n   * Handles setting the visibility of various toasts based on what is already visible\n   * @param toast The toast element being requested to display\n   */\n  @Method()\n  async setVisible(toast: HTMLIcToastElement): Promise<void> {\n    const visibleToasts = Array.from(\n      document.querySelectorAll(\"ic-toast\")\n    ).filter((el) => window.getComputedStyle(el).display !== \"none\");\n    if (visibleToasts.indexOf(toast) === -1 && visibleToasts.length <= 0) {\n      toast.setVisible().then((res) => (this.previouslyFocused = res));\n    }\n    if (visibleToasts.length > 0) this.pendingVisibility.push(toast);\n  }\n\n  render() {\n    return <slot></slot>;\n  }\n}\n"],"mappings":"wDAIaA,EAAW,MADxB,WAAAC,CAAAC,G,UAEUC,KAAAC,kBAA0C,E,CAMlD,oBAAAC,G,MACE,GAAIF,KAAKC,kBAAkBE,OAAS,EAAG,CACrCH,KAAKC,kBAAkB,GACpBG,aACAC,MAAMC,GAASN,KAAKO,kBAAoBD,IAC3CN,KAAKC,kBAAkBO,O,KAClB,CACL,GAAIR,KAAKO,mBAAqB,aAAcP,KAAKO,kBAAmB,CACjEP,KAAKO,kBAA4CE,U,MAC7CC,EAAAV,KAAKO,qBAAiB,MAAAG,SAAA,SAAAA,EAAEC,O,EASnC,gBAAMP,CAAWQ,GACf,MAAMC,EAAgBC,MAAMC,KAC1BC,SAASC,iBAAiB,aAC1BC,QAAQC,GAAOC,OAAOC,iBAAiBF,GAAIG,UAAY,SACzD,GAAIT,EAAcU,QAAQX,MAAY,GAAKC,EAAcV,QAAU,EAAG,CACpES,EAAMR,aAAaC,MAAMC,GAASN,KAAKO,kBAAoBD,G,CAE7D,GAAIO,EAAcV,OAAS,EAAGH,KAAKC,kBAAkBuB,KAAKZ,E,CAG5D,MAAAa,GACE,OAAOC,EAAA,Y"}

package/dist/core/p-517968cb.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icSkeletonCss","Skeleton","componentWillLoad","this","el","style","height","width","default","heightOnly","widthOnly","render","variant","light","hasChild","firstElementChild","defaultSkeletonStyle","heightSetStyle","widthSetStyle","h","Host","class"],"sources":["src/components/ic-skeleton/ic-skeleton.css?tag=ic-skeleton&encapsulation=shadow","src/components/ic-skeleton/ic-skeleton.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n@keyframes loading {\n  0% {\n    background-color: var(--ic-architectural-100);\n  }\n\n  50% {\n    background-color: var(--ic-architectural-200);\n  }\n\n  100% {\n    background-color: var(--ic-architectural-100);\n  }\n}\n\n@keyframes loading-light {\n  0% {\n    background-color: var(--ic-architectural-600);\n  }\n\n  50% {\n    background-color: var(--ic-architectural-400);\n  }\n\n  100% {\n    background-color: var(--ic-architectural-600);\n  }\n}\n\n:host {\n  display: inline-block;\n}\n\n:host(.skeleton) {\n  background-color: var(--ic-architectural-100);\n  border-radius: var(--ic-border-radius);\n  animation: loading 1200ms infinite;\n  display: inline-block;\n}\n\n:host(.skeleton) > * {\n  opacity: 0;\n  visibility: hidden;\n}\n\n:host(.circle) {\n  border-radius: 50%;\n}\n\n:host(.light) {\n  background-color: var(--ic-architectural-600);\n  animation: loading-light 1200ms infinite;\n}\n\n@media (forced-colors: active) {\n  :host(.skeleton) {\n    -ms-high-contrast-adjust: none;\n    forced-color-adjust: none;\n    background: currentcolor;\n  }\n}\n","import { Component, Element, Host, Prop, h, State } from \"@stencil/core\";\nimport { IcSkeletonVariants } from \"./ic-skeleton.types\";\n\n@Component({\n  tag: \"ic-skeleton\",\n  styleUrl: \"ic-skeleton.css\",\n  shadow: true,\n})\nexport class Skeleton {\n  @Element() el: HTMLIcSkeletonElement;\n\n  @State() default: boolean;\n  @State() hasChild: boolean;\n  @State() heightOnly: boolean;\n  @State() widthOnly: boolean;\n\n  /**\n   * If `true`, the skeleton will be set to the light variant.\n   */\n  @Prop() light?: boolean = false;\n\n  /**\n   * The variant of the skeleton that will be displayed.\n   */\n  @Prop() variant?: IcSkeletonVariants = \"rectangle\";\n\n  componentWillLoad(): void {\n    if (this.el.style.height === \"\" && this.el.style.width === \"\") {\n      this.default = true;\n    } else if (!(this.el.style.height === \"\") && this.el.style.width === \"\") {\n      this.heightOnly = true;\n    } else if (!(this.el.style.width === \"\") && this.el.style.height === \"\") {\n      this.widthOnly = true;\n    }\n  }\n\n  render() {\n    const { variant, light } = this;\n\n    this.hasChild = !!this.el.firstElementChild;\n\n    const defaultSkeletonStyle = {\n      height: variant == \"text\" ? \"1em\" : variant == \"circle\" ? \"25px\" : \"93px\",\n      width: variant == \"circle\" ? \"25px\" : \"260px\",\n    };\n\n    const heightSetStyle = {\n      height: this.el.style.height,\n      width: variant == \"circle\" ? \"25px\" : \"260px\",\n    };\n\n    const widthSetStyle = {\n      height: variant == \"text\" ? \"1em\" : variant == \"circle\" ? \"25px\" : \"93px\",\n      width: this.el.style.width,\n    };\n\n    return (\n      <Host\n        class={{\n          [\"skeleton\"]: true,\n          [\"circle\"]: variant == \"circle\",\n          [\"light\"]: light,\n        }}\n        style={\n          (!this.hasChild && this.default && defaultSkeletonStyle) ||\n          (this.heightOnly && heightSetStyle) ||\n          (this.widthOnly && widthSetStyle)\n        }\n        aria-disabled=\"true\"\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,iqG,MCQTC,EAAQ,M,sIAWO,M,aAKa,W,CAEvC,iBAAAC,GACE,GAAIC,KAAKC,GAAGC,MAAMC,SAAW,IAAMH,KAAKC,GAAGC,MAAME,QAAU,GAAI,CAC7DJ,KAAKK,QAAU,I,MACV,KAAML,KAAKC,GAAGC,MAAMC,SAAW,KAAOH,KAAKC,GAAGC,MAAME,QAAU,GAAI,CACvEJ,KAAKM,WAAa,I,MACb,KAAMN,KAAKC,GAAGC,MAAME,QAAU,KAAOJ,KAAKC,GAAGC,MAAMC,SAAW,GAAI,CACvEH,KAAKO,UAAY,I,EAIrB,MAAAC,GACE,MAAMC,QAAEA,EAAOC,MAAEA,GAAUV,KAE3BA,KAAKW,WAAaX,KAAKC,GAAGW,kBAE1B,MAAMC,EAAuB,CAC3BV,OAAQM,GAAW,OAAS,MAAQA,GAAW,SAAW,OAAS,OACnEL,MAAOK,GAAW,SAAW,OAAS,SAGxC,MAAMK,EAAiB,CACrBX,OAAQH,KAAKC,GAAGC,MAAMC,OACtBC,MAAOK,GAAW,SAAW,OAAS,SAGxC,MAAMM,EAAgB,CACpBZ,OAAQM,GAAW,OAAS,MAAQA,GAAW,SAAW,OAAS,OACnEL,MAAOJ,KAAKC,GAAGC,MAAME,OAGvB,OACEY,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,YAAa,KACd,CAAC,UAAWT,GAAW,SACvB,CAAC,SAAUC,GAEbR,OACIF,KAAKW,UAAYX,KAAKK,SAAWQ,GAClCb,KAAKM,YAAcQ,GACnBd,KAAKO,WAAaQ,EAAc,gBAErB,QAEdC,EAAA,a"}

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

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,H as o,g as a}from"./p-03935e89.js";import{I as s}from"./p-613aa265.js";import{r}from"./p-ba27b1e2.js";const n='/*! 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{--indicator-initial-color:rgba(23 89 188 / 0%);--indicator-color:var(--ic-action-default);--focus-indicator:var(--ic-border-focus);--label-color:var(--ic-color-primary-text);--background-color-hover:var(--ic-action-default-bg-hover);--background-color-active:var(--ic-action-default-bg-active);display:flex;align-items:center;border-radius:0;color:var(--label-color);height:2.5rem;padding:0 var(--ic-space-md);cursor:pointer;position:relative;border-bottom:var(--ic-space-xxs) solid var(--indicator-initial-color);gap:var(--ic-space-xs);transition:all var(--ic-easing-transition-fast)}:host(:focus){box-shadow:var(--focus-indicator);border-radius:var(--ic-border-radius)}:host(:focus-visible){outline:var(--ic-hc-focus-outline)}:host(:hover){background-color:var(--background-color-hover)}:host(:active){background-color:var(--background-color-active)}:host(.ic-tab-light){--indicator-initial-color:rgb(255 255 255 / 0%);--indicator-color:rgb(255 255 255 / 100%);--focus-indicator:var(--ic-border-focus);--label-color:white;--background-color-hover:var(--ic-action-dark-bg-hover);--background-color-active:var(--ic-action-dark-bg-active)}:host(.selected){border-bottom:var(--ic-space-xxs) solid var(--indicator-color)}:host(.disabled){pointer-events:none;color:var(--ic-architectural-300)}:host(.selected.with-transition){transition:all var(--ic-easing-transition-slow),\n    border-color var(--ic-transition-duration-slow)}.ic-tab-label{pointer-events:none}::slotted(svg){fill:currentcolor}@media (forced-colors: active){:host{border-bottom:var(--ic-space-xxs) solid canvas}:host(.disabled){color:GrayText}}';const c=class{constructor(i){t(this,i);this.tabClick=e(this,"tabClick",7);this.tabCreated=e(this,"tabCreated",7);this.tabEnabled=e(this,"tabEnabled",7);this.tabFocus=e(this,"tabFocus",7);this.tabRemoved=e(this,"tabRemoved",7);this.focusFromClick=false;this.isInitialRender=true;this.handleClick=()=>{this.tabClick.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition});if(this.focusFromClick){this.tabFocus.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition});this.focusFromClick=false}};this.handleFocus=()=>{if(!this.focusFromClick){this.focusTabId=this.tabId;this.tabFocus.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition})}};this.handleMouseDown=()=>{this.focusFromClick=true};this.appearance="dark";this.contextId="default";this.disabled=false;this.selected=false;this.tabId=undefined;this.tabPosition=undefined}disabledWatchHandler(){this.tabEnabled.emit()}connectedCallback(){this.tabCreated.emit(this.host)}disconnectedCallback(){const t=document.querySelector(`ic-tab-context[context-id=${this.contextId}]`);if(t){t.tabRemovedHandler(!!this.focusTabId)}}componentWillLoad(){r(this.disabled,this.host)}componentDidUpdate(){this.isInitialRender=false}async setFocus(){if(this.host){this.host.focus()}}render(){const{disabled:t,selected:e,appearance:a}=this;return i(o,{class:{["with-transition"]:!this.isInitialRender,["ic-tab-light"]:a===s.Light,["selected"]:e,["disabled"]:t},role:"tab","aria-selected":e?"true":"false",onClick:this.handleClick,onFocus:this.handleFocus,onMouseDown:this.handleMouseDown,"aria-disabled":t?"true":"false",tabindex:this.selected?0:-1},this.host.querySelector('[slot="icon"]')&&i("slot",{name:"icon"}),i("ic-typography",{class:"ic-tab-label",variant:"label"},i("span",null,i("slot",null))))}get host(){return a(this)}static get watchers(){return{disabled:["disabledWatchHandler"]}}};c.style=n;export{c as ic_tab};
-//# sourceMappingURL=p-55127131.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["icTabCss","Tab","this","focusFromClick","isInitialRender","handleClick","tabClick","emit","tabId","contextId","position","tabPosition","tabFocus","handleFocus","focusTabId","handleMouseDown","disabledWatchHandler","tabEnabled","connectedCallback","tabCreated","host","disconnectedCallback","tabContext","document","querySelector","tabRemovedHandler","componentWillLoad","removeDisabledFalse","disabled","componentDidUpdate","setFocus","focus","render","selected","appearance","h","Host","class","IcThemeForegroundEnum","Light","role","onClick","onFocus","onMouseDown","tabindex","name","variant"],"sources":["src/components/ic-tab/ic-tab.css?tag=ic-tab&encapsulation=shadow","src/components/ic-tab/ic-tab.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  --indicator-initial-color: rgba(23 89 188 / 0%);\n  --indicator-color: var(--ic-action-default);\n  --focus-indicator: var(--ic-border-focus);\n  --label-color: var(--ic-color-primary-text);\n  --background-color-hover: var(--ic-action-default-bg-hover);\n  --background-color-active: var(--ic-action-default-bg-active);\n\n  display: flex;\n  align-items: center;\n  border-radius: 0;\n  color: var(--label-color);\n  height: 2.5rem;\n  padding: 0 var(--ic-space-md);\n  cursor: pointer;\n  position: relative;\n  border-bottom: var(--ic-space-xxs) solid var(--indicator-initial-color);\n  gap: var(--ic-space-xs);\n  transition: all var(--ic-easing-transition-fast);\n}\n\n:host(:focus) {\n  box-shadow: var(--focus-indicator);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(:hover) {\n  background-color: var(--background-color-hover);\n}\n\n:host(:active) {\n  background-color: var(--background-color-active);\n}\n\n:host(.ic-tab-light) {\n  --indicator-initial-color: rgb(255 255 255 / 0%);\n  --indicator-color: rgb(255 255 255 / 100%);\n  --focus-indicator: var(--ic-border-focus);\n  --label-color: white;\n  --background-color-hover: var(--ic-action-dark-bg-hover);\n  --background-color-active: var(--ic-action-dark-bg-active);\n}\n\n:host(.selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--indicator-color);\n}\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--ic-architectural-300);\n}\n\n:host(.selected.with-transition) {\n  transition: all var(--ic-easing-transition-slow),\n    border-color var(--ic-transition-duration-slow);\n}\n\n.ic-tab-label {\n  pointer-events: none;\n}\n\n::slotted(svg) {\n  fill: currentcolor;\n}\n\n@media (forced-colors: active) {\n  :host {\n    border-bottom: var(--ic-space-xxs) solid canvas;\n  }\n\n  :host(.disabled) {\n    color: GrayText;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n  Method,\n  Watch,\n} from \"@stencil/core\";\n\nimport { IcTabClickEventDetail } from \"./ic-tab.types\";\nimport {\n  IcThemeForegroundNoDefault,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { removeDisabledFalse } from \"../../utils/helpers\";\n\n/**\n * @slot icon - Content will be rendered next to the tab label.\n */\n@Component({\n  tag: \"ic-tab\",\n  styleUrl: \"ic-tab.css\",\n  shadow: true,\n})\nexport class Tab {\n  private focusFromClick: boolean = false;\n  private focusTabId: string;\n  private isInitialRender: boolean = true;\n\n  @Element() host: HTMLIcTabElement;\n\n  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */\n  @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n  /** @internal The unique context needed if using multiple tabs inside one another i.e. rendering another tabs inside a tab panel. */\n  @Prop({ reflect: true }) contextId?: string = \"default\";\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /** @internal If `true`, the tab will display with a selected indicator and tabIndex will be set. */\n  @Prop({ reflect: true }) selected?: boolean = false;\n\n  /** @internal The shared ID between panel and tab. */\n  @Prop({ reflect: true }) tabId?: string;\n\n  /** @internal The position of the tab inside the tabs array in context. */\n  @Prop() tabPosition?: number;\n\n  @Watch(\"disabled\")\n  disabledWatchHandler(): void {\n    this.tabEnabled.emit();\n  }\n\n  /**\n   * @internal Emitted when a tab is selected.\n   */\n  @Event() tabClick: EventEmitter<IcTabClickEventDetail>;\n\n  /**\n   * @internal Emitted when a tab is dynamically created.\n   */\n  @Event() tabCreated: EventEmitter<HTMLIcTabElement>;\n\n  /**\n   * @internal Emitted when a tab's disabled prop changes\n   */\n  @Event() tabEnabled: EventEmitter<void>;\n\n  /**\n   * @internal Emitted when a tab is focussed.\n   */\n  @Event() tabFocus: EventEmitter<IcTabClickEventDetail>;\n\n  /**\n   * @internal Emitted when a tab is unmounted.\n   */\n  @Event() tabRemoved: EventEmitter<void>;\n\n  connectedCallback(): void {\n    this.tabCreated.emit(this.host);\n  }\n\n  disconnectedCallback(): void {\n    const tabContext = document.querySelector(\n      `ic-tab-context[context-id=${this.contextId}]`\n    ) as HTMLIcTabContextElement;\n    if (tabContext) {\n      tabContext.tabRemovedHandler(!!this.focusTabId);\n    }\n  }\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.host);\n  }\n\n  componentDidUpdate(): void {\n    this.isInitialRender = false;\n  }\n\n  /**\n   * Sets focus on the tab.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.host) {\n      this.host.focus();\n    }\n  }\n\n  private handleClick = () => {\n    this.tabClick.emit({\n      tabId: this.tabId,\n      contextId: this.contextId,\n      position: this.tabPosition,\n    });\n    if (this.focusFromClick) {\n      this.tabFocus.emit({\n        tabId: this.tabId,\n        contextId: this.contextId,\n        position: this.tabPosition,\n      });\n      this.focusFromClick = false;\n    }\n  };\n\n  private handleFocus = () => {\n    if (!this.focusFromClick) {\n      this.focusTabId = this.tabId;\n\n      this.tabFocus.emit({\n        tabId: this.tabId,\n        contextId: this.contextId,\n        position: this.tabPosition,\n      });\n    }\n  };\n\n  private handleMouseDown = () => {\n    //set flag so that focus gets handled after click\n    //there is a timing issue where a long click only causes focus to happen & not the click\n    //the focus does need to be a seperate event though to handle focus from keyboard\n    this.focusFromClick = true;\n  };\n\n  render() {\n    const { disabled, selected, appearance } = this;\n    return (\n      <Host\n        class={{\n          [\"with-transition\"]: !this.isInitialRender,\n          [\"ic-tab-light\"]: appearance === IcThemeForegroundEnum.Light,\n          [\"selected\"]: selected,\n          [\"disabled\"]: disabled,\n        }}\n        role=\"tab\"\n        aria-selected={selected ? \"true\" : \"false\"}\n        onClick={this.handleClick}\n        onFocus={this.handleFocus}\n        onMouseDown={this.handleMouseDown}\n        aria-disabled={disabled ? \"true\" : \"false\"}\n        tabindex={this.selected ? 0 : -1}\n      >\n        {this.host.querySelector('[slot=\"icon\"]') && <slot name=\"icon\"></slot>}\n        <ic-typography class=\"ic-tab-label\" variant=\"label\">\n          <span>\n            <slot></slot>\n          </span>\n        </ic-typography>\n      </Host>\n    );\n  }\n}\n"],"mappings":"mIAAA,MAAMA,EAAW,k7H,MC2BJC,EAAG,M,oNACNC,KAAAC,eAA0B,MAE1BD,KAAAE,gBAA2B,KAqF3BF,KAAAG,YAAc,KACpBH,KAAKI,SAASC,KAAK,CACjBC,MAAON,KAAKM,MACZC,UAAWP,KAAKO,UAChBC,SAAUR,KAAKS,cAEjB,GAAIT,KAAKC,eAAgB,CACvBD,KAAKU,SAASL,KAAK,CACjBC,MAAON,KAAKM,MACZC,UAAWP,KAAKO,UAChBC,SAAUR,KAAKS,cAEjBT,KAAKC,eAAiB,K,GAIlBD,KAAAW,YAAc,KACpB,IAAKX,KAAKC,eAAgB,CACxBD,KAAKY,WAAaZ,KAAKM,MAEvBN,KAAKU,SAASL,KAAK,CACjBC,MAAON,KAAKM,MACZC,UAAWP,KAAKO,UAChBC,SAAUR,KAAKS,a,GAKbT,KAAAa,gBAAkB,KAIxBb,KAAKC,eAAiB,IAAI,E,gBAhHsB,O,eAGJ,U,cAKjB,M,cAGiB,M,gDAS9C,oBAAAa,GACEd,KAAKe,WAAWV,M,CA4BlB,iBAAAW,GACEhB,KAAKiB,WAAWZ,KAAKL,KAAKkB,K,CAG5B,oBAAAC,GACE,MAAMC,EAAaC,SAASC,cAC1B,6BAA6BtB,KAAKO,cAEpC,GAAIa,EAAY,CACdA,EAAWG,oBAAoBvB,KAAKY,W,EAIxC,iBAAAY,GACEC,EAAoBzB,KAAK0B,SAAU1B,KAAKkB,K,CAG1C,kBAAAS,GACE3B,KAAKE,gBAAkB,K,CAOzB,cAAM0B,GACJ,GAAI5B,KAAKkB,KAAM,CACblB,KAAKkB,KAAKW,O,EAuCd,MAAAC,GACE,MAAMJ,SAAEA,EAAQK,SAAEA,EAAQC,WAAEA,GAAehC,KAC3C,OACEiC,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,oBAAqBnC,KAAKE,gBAC3B,CAAC,gBAAiB8B,IAAeI,EAAsBC,MACvD,CAAC,YAAaN,EACd,CAAC,YAAaL,GAEhBY,KAAK,MAAK,gBACKP,EAAW,OAAS,QACnCQ,QAASvC,KAAKG,YACdqC,QAASxC,KAAKW,YACd8B,YAAazC,KAAKa,gBAAe,gBAClBa,EAAW,OAAS,QACnCgB,SAAU1C,KAAK+B,SAAW,GAAK,GAE9B/B,KAAKkB,KAAKI,cAAc,kBAAoBW,EAAA,QAAMU,KAAK,SACxDV,EAAA,iBAAeE,MAAM,eAAeS,QAAQ,SAC1CX,EAAA,YACEA,EAAA,e"}

package/dist/core/p-5536d26c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icClassificationBannerCss","classificationText","default","official","secret","ClassificationBanner","render","classification","inline","country","upTo","additionalSelectors","this","h","Host","class","variant"],"sources":["src/components/ic-classification-banner/ic-classification-banner.css?tag=ic-classification-banner&encapsulation=shadow","src/components/ic-classification-banner/ic-classification-banner.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-classification-banner: z-index of classification banner\n */\n\n:host {\n  position: fixed;\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  height: var(--ic-space-lg);\n  z-index: var(--ic-z-index-classification-banner);\n}\n\n:host(.inline) {\n  position: static;\n  left: auto;\n  bottom: auto;\n}\n\n.classification-banner {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  padding: var(--ic-space-xxxs) var(--ic-space-md);\n}\n\n.default {\n  background-color: var(--ic-classification-not-set);\n  color: var(--ic-classification-not-set-foreground);\n}\n\n.official,\n.official-sensitive {\n  background-color: var(--ic-classification-official);\n  color: var(--ic-classification-official-foreground);\n}\n\n.secret {\n  background-color: var(--ic-classification-secret);\n  color: var(--ic-classification-secret-foreground);\n}\n\n.top-secret {\n  background-color: var(--ic-classification-top-secret);\n  color: var(--ic-classification-top-secret-foreground);\n}\n\n.offscreen {\n  position: absolute;\n  left: -9999px;\n  background-color: #fff;\n  color: #000;\n  text-transform: none;\n}\n\n@media (forced-colors: active) {\n  .classification-banner {\n    border: var(--ic-hc-border);\n  }\n}\n","import { Component, Prop, h, Host } from \"@stencil/core\";\nimport { IcProtectiveMarkings } from \"./ic-classification-banner.types\";\n\nconst classificationText = {\n  default: \"protective marking not set\",\n  official: \"official\",\n  \"official-sensitive\": \"official sensitive\",\n  secret: \"secret\",\n  \"top-secret\": \"top secret\",\n};\n\n@Component({\n  tag: \"ic-classification-banner\",\n  styleUrl: \"ic-classification-banner.css\",\n  shadow: true,\n})\nexport class ClassificationBanner {\n  /**\n   * The additional information that will be displayed after the classification.\n   */\n  @Prop() additionalSelectors?: string = \"\";\n  /**\n   * The classification level to be displayed - also determines the banner and text colour.\n   */\n  @Prop() classification?: IcProtectiveMarkings = \"default\";\n  /**\n   * The optional text that will be displayed before classification to specify relevant country/countries.\n   */\n  @Prop() country?: string = \"uk\";\n  /**\n   * If `true`, the banner will appear inline with the page, instead of sticking to the bottom of the page.\n   */\n  @Prop() inline?: boolean = false;\n  /**\n   * If `true`, \"Up to\" will be displayed before the classification and country.\n   */\n  @Prop() upTo?: boolean = false;\n\n  render() {\n    const { classification, inline, country, upTo, additionalSelectors } = this;\n\n    return (\n      <Host class={{ [\"inline\"]: inline }}>\n        <banner\n          aria-label=\"Protective marking\"\n          class={{\n            [\"classification-banner\"]: true,\n            [`${classification}`]: classification,\n          }}\n        >\n          {classification !== \"default\" ? (\n            <span class=\"offscreen\">\n              The protective marking of this page is:{\" \"}\n            </span>\n          ) : null}\n          <ic-typography variant=\"caption-uppercase\">\n            {classification === \"default\"\n              ? classificationText[classification]\n              : `${upTo ? \"up to\" : \"\"} \n               ${country !== \"\" ? country : \"\"} \n               ${classificationText[classification]} \n               ${additionalSelectors !== \"\" ? additionalSelectors : \"\"}`}\n          </ic-typography>\n        </banner>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAA4B,syGCGlC,MAAMC,EAAqB,CACzBC,QAAS,6BACTC,SAAU,WACV,qBAAsB,qBACtBC,OAAQ,SACR,aAAc,c,MAQHC,EAAoB,M,kDAIQ,G,oBAIS,U,aAIrB,K,YAIA,M,UAIF,K,CAEzB,MAAAC,GACE,MAAMC,eAAEA,EAAcC,OAAEA,EAAMC,QAAEA,EAAOC,KAAEA,EAAIC,oBAAEA,GAAwBC,KAEvE,OACEC,EAACC,EAAI,CAACC,MAAO,CAAE,CAAC,UAAWP,IACzBK,EAAA,uBACa,qBACXE,MAAO,CACL,CAAC,yBAA0B,KAC3B,CAAC,GAAGR,KAAmBA,IAGxBA,IAAmB,UAClBM,EAAA,QAAME,MAAM,aAAW,0CACmB,KAExC,KACJF,EAAA,iBAAeG,QAAQ,qBACpBT,IAAmB,UAChBN,EAAmBM,GACnB,GAAGG,EAAO,QAAU,uBACnBD,IAAY,GAAKA,EAAU,uBAC3BR,EAAmBM,uBACnBI,IAAwB,GAAKA,EAAsB,O"}

package/dist/core/p-5b39831f.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as a,H as i,g as e}from"./p-03935e89.js";import{a as s,i as o}from"./p-ba27b1e2.js";import"./p-613aa265.js";const r=":host{gap:var(--ic-space-xs);padding:var(--ic-space-xs)}:host,.action-area{display:flex;flex-direction:column}.action-area{gap:var(--ic-space-md)}:host ::slotted(svg),:host ::slotted(img){border-radius:var(--ic-space-xxs)}:host(.right),:host(.right) .action-area{align-items:flex-end;text-align:right}:host(.center),:host(.center) .action-area{align-items:center;text-align:center}:host(.image-default) ::slotted(svg),:host(.image-default) ::slotted(img){height:calc(3 * var(--ic-space-lg)) !important;width:calc(3 * var(--ic-space-lg)) !important}:host(.image-small) ::slotted(svg),:host(.image-small) ::slotted(img){height:var(--ic-space-xxl) !important;width:var(--ic-space-xxl) !important}:host(.image-large) ::slotted(svg),:host(.image-large) ::slotted(img){height:calc(4 * var(--ic-space-xl)) !important;width:calc(4 * var(--ic-space-xl)) !important}";const c=class{constructor(a){t(this,a);this.aligned="left";this.body=undefined;this.bodyMaxLines=undefined;this.heading=undefined;this.imageSize="default";this.subheading=undefined}componentDidLoad(){s([{prop:this.heading,propName:"heading"}],"Empty State")}render(){const{aligned:t,body:e,bodyMaxLines:s,heading:r,imageSize:c,subheading:n}=this;return a(i,{class:{[`${t}`]:true,[`image-${c}`]:o(this.el,"image")}},o(this.el,"image")&&a("slot",{name:"image"}),a("div",null,a("ic-typography",{variant:"h4"},r),n&&a("ic-typography",{variant:"subtitle-small"},n),e&&a("ic-typography",{maxLines:s},e)),o(this.el,"actions")&&a("div",{class:"action-area"},a("slot",{name:"actions"})))}get el(){return e(this)}};c.style=r;export{c as ic_empty_state};
-//# sourceMappingURL=p-5b39831f.entry.js.map

package/dist/core/p-5b39831f.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icEmptyStateCss","EmptyState","componentDidLoad","onComponentRequiredPropUndefined","prop","this","heading","propName","render","aligned","body","bodyMaxLines","imageSize","subheading","h","Host","class","isSlotUsed","el","name","variant","maxLines"],"sources":["src/components/ic-empty-state/ic-empty-state.css?tag=ic-empty-state&encapsulation=shadow","src/components/ic-empty-state/ic-empty-state.tsx"],"sourcesContent":[":host {\n  gap: var(--ic-space-xs);\n  padding: var(--ic-space-xs);\n}\n\n:host,\n.action-area {\n  display: flex;\n  flex-direction: column;\n}\n\n.action-area {\n  gap: var(--ic-space-md);\n}\n\n:host ::slotted(svg),\n:host ::slotted(img) {\n  border-radius: var(--ic-space-xxs);\n}\n\n:host(.right),\n:host(.right) .action-area {\n  align-items: flex-end;\n  text-align: right;\n}\n\n:host(.center),\n:host(.center) .action-area {\n  align-items: center;\n  text-align: center;\n}\n\n:host(.image-default) ::slotted(svg),\n:host(.image-default) ::slotted(img) {\n  height: calc(3 * var(--ic-space-lg)) !important;\n  width: calc(3 * var(--ic-space-lg)) !important;\n}\n\n:host(.image-small) ::slotted(svg),\n:host(.image-small) ::slotted(img) {\n  height: var(--ic-space-xxl) !important;\n  width: var(--ic-space-xxl) !important;\n}\n\n:host(.image-large) ::slotted(svg),\n:host(.image-large) ::slotted(img) {\n  height: calc(4 * var(--ic-space-xl)) !important;\n  width: calc(4 * var(--ic-space-xl)) !important;\n}\n","import { h, Component, Host, Prop, Element } from \"@stencil/core\";\n\nimport { IcEmptyStateAlignment } from \"./ic-empty-state.types\";\nimport {\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcSizes } from \"../../utils/types\";\n\n/**\n * @slot image - Content is placed at the top above all other content.\n * @slot actions - Content is placed at the bottom below all other content.\n */\n@Component({\n  tag: \"ic-empty-state\",\n  styleUrl: \"ic-empty-state.css\",\n  shadow: true,\n})\nexport class EmptyState {\n  @Element() el: HTMLIcEmptyStateElement;\n\n  /**\n   * The alignment of the empty state container.\n   */\n  @Prop() aligned?: IcEmptyStateAlignment = \"left\";\n\n  /**\n   * The body text rendered in the empty state container.\n   */\n  @Prop() body?: string;\n\n  /**\n   * The number of lines of body text to display before truncating.\n   */\n  @Prop() bodyMaxLines?: number;\n\n  /**\n   * The title rendered in the empty state container.\n   */\n  @Prop() heading!: string;\n\n  /**\n   * The size of the image or icon used in the image slot.\n   */\n  @Prop() imageSize?: IcSizes = \"default\";\n\n  /**\n   * The subtitle rendered in the empty state container.\n   */\n  @Prop() subheading?: string;\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.heading, propName: \"heading\" }],\n      \"Empty State\"\n    );\n  }\n\n  render() {\n    const { aligned, body, bodyMaxLines, heading, imageSize, subheading } =\n      this;\n    return (\n      <Host\n        class={{\n          [`${aligned}`]: true,\n          [`image-${imageSize}`]: isSlotUsed(this.el, \"image\"),\n        }}\n      >\n        {isSlotUsed(this.el, \"image\") && <slot name=\"image\"></slot>}\n        <div>\n          <ic-typography variant=\"h4\">{heading}</ic-typography>\n          {subheading && (\n            <ic-typography variant=\"subtitle-small\">{subheading}</ic-typography>\n          )}\n          {body && (\n            <ic-typography maxLines={bodyMaxLines}>{body}</ic-typography>\n          )}\n        </div>\n        {isSlotUsed(this.el, \"actions\") && (\n          <div class=\"action-area\">\n            <slot name=\"actions\" />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"4HAAA,MAAMA,EAAkB,21B,MCkBXC,EAAU,M,sCAMqB,O,sFAoBZ,U,0BAO9B,gBAAAC,GACEC,EACE,CAAC,CAAEC,KAAMC,KAAKC,QAASC,SAAU,YACjC,c,CAIJ,MAAAC,GACE,MAAMC,QAAEA,EAAOC,KAAEA,EAAIC,aAAEA,EAAYL,QAAEA,EAAOM,UAAEA,EAASC,WAAEA,GACvDR,KACF,OACES,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,GAAGP,KAAY,KAChB,CAAC,SAASG,KAAcK,EAAWZ,KAAKa,GAAI,WAG7CD,EAAWZ,KAAKa,GAAI,UAAYJ,EAAA,QAAMK,KAAK,UAC5CL,EAAA,WACEA,EAAA,iBAAeM,QAAQ,MAAMd,GAC5BO,GACCC,EAAA,iBAAeM,QAAQ,kBAAkBP,GAE1CH,GACCI,EAAA,iBAAeO,SAAUV,GAAeD,IAG3CO,EAAWZ,KAAKa,GAAI,YACnBJ,EAAA,OAAKE,MAAM,eACTF,EAAA,QAAMK,KAAK,a"}

package/dist/core/p-613aa265.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["IcInformationStatus","IcThemeForegroundEnum"],"sources":["src/utils/types.ts"],"sourcesContent":["export type IcFocusableComponents =\n  | HTMLIcBreadcrumbElement\n  | HTMLIcButtonElement\n  | HTMLIcCardElement\n  | HTMLIcCheckboxElement\n  | HTMLIcChipElement\n  | HTMLIcLinkElement\n  | HTMLIcNavigationButtonElement\n  | HTMLIcNavigationGroupElement\n  | HTMLIcNavigationItemElement\n  | HTMLIcRadioOptionElement\n  | HTMLIcSearchBarElement\n  | HTMLIcSelectElement\n  | HTMLIcSwitchElement\n  | HTMLIcTabElement\n  | HTMLIcTextFieldElement;\n\nexport type IcStatusVariants =\n  | \"neutral\"\n  | \"info\"\n  | \"warning\"\n  | \"error\"\n  | \"success\";\n\nexport enum IcInformationStatus {\n  Warning = \"warning\",\n  Error = \"error\",\n  Success = \"success\",\n}\n\nexport type IcInformationStatusOrEmpty = \"warning\" | \"error\" | \"success\" | \"\";\n\nexport type IcNavType = \"side\" | \"top\" | \"page-header\";\n\n// From: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete\nexport type IcAutocompleteTypes =\n  | \"on\"\n  | \"off\"\n  | \"name\"\n  | \"honorific-prefix\"\n  | \"given-name\"\n  | \"additional-name\"\n  | \"family-name\"\n  | \"honorific-suffix\"\n  | \"nickname\"\n  | \"email\"\n  | \"username\"\n  | \"new-password\"\n  | \"current-password\"\n  | \"one-time-code\"\n  | \"organization-title\"\n  | \"organization\"\n  | \"street-address\"\n  | \"address-line1\"\n  | \"address-line2\"\n  | \"address-line3\"\n  | \"address-level4\"\n  | \"address-level3\"\n  | \"address-level2\"\n  | \"address-level1\"\n  | \"country\"\n  | \"country-name\"\n  | \"postal-code\"\n  | \"cc-name\"\n  | \"cc-given-name\"\n  | \"cc-additional-name\"\n  | \"cc-family-name\"\n  | \"cc-family-name\"\n  | \"cc-number\"\n  | \"cc-exp\"\n  | \"cc-exp-month\"\n  | \"cc-exp-year\"\n  | \"cc-csc\"\n  | \"cc-type\"\n  | \"transaction-currency\"\n  | \"transaction-amount\"\n  | \"language\"\n  | \"bday\"\n  | \"bday-day\"\n  | \"bday-month\"\n  | \"bday-year\"\n  | \"sex\"\n  | \"tel\"\n  | \"tel-country-code\"\n  | \"tel-national\"\n  | \"tel-area-code\"\n  | \"tel-local\"\n  | \"tel-extension\"\n  | \"impp\"\n  | \"url\"\n  | \"photo\";\n\nexport type IcAlignment = \"left\" | \"center\" | \"full-width\";\n\nexport enum IcThemeForegroundEnum {\n  Default = \"default\",\n  Dark = \"dark\",\n  Light = \"light\",\n}\n\nexport type IcThemeForeground = \"default\" | \"dark\" | \"light\";\n\nexport type IcThemeForegroundNoDefault = \"dark\" | \"light\";\n\nexport type IcTheme = {\n  mode: IcThemeForeground;\n  color: IcColorRGB;\n};\n\nexport type IcAdditionalFieldTypes = \"static\" | \"dynamic\";\n\nexport type IcColorRGB = {\n  r: number;\n  g: number;\n  b: number;\n};\n\nexport type IcColorRGBA = IcColorRGB & {\n  a: number;\n};\n\nexport type IcActivationTypes = \"automatic\" | \"manual\";\n\nexport type IcAutocorrectStates = \"on\" | \"off\";\n\nexport type IcNavParentDetails = {\n  navType: IcNavType | \"\";\n  parent: HTMLElement;\n};\n\nexport type IcTypographyVariants =\n  | \"h1\"\n  | \"h2\"\n  | \"h3\"\n  | \"h4\"\n  | \"subtitle-large\"\n  | \"subtitle-small\"\n  | \"body\"\n  | \"label\"\n  | \"label-uppercase\"\n  | \"caption\"\n  | \"caption-uppercase\"\n  | \"code-large\"\n  | \"code-small\"\n  | \"code-extra-small\";\n\n/**\n * @interface IcMenuOption\n * @field {string} A label field to options. Defaults to \"label\", but can have any custom name.\n * @field {string} A value field to options. Defaults to \"value\", but can have any custom name.\n */\nexport interface IcMenuOption {\n  description?: string;\n  disabled?: boolean;\n  recommended?: boolean;\n  children?: IcMenuOption[];\n  loading?: boolean;\n  timedOut?: boolean;\n  [key: string]: any;\n  element?: {\n    component: any;\n    ariaLabel: string;\n  };\n  icon?: any;\n}\n\nexport type IcSearchMatchPositions = \"start\" | \"anywhere\";\n\nexport type IcCallbackFunctionNoReturn = (...args: unknown[]) => void;\n\nexport type IcRequiredPropsTypes =\n  | string\n  | boolean\n  | number\n  | HTMLElement\n  | IcMenuOption[];\n\nexport type IcPropObject = { prop: IcRequiredPropsTypes; propName: string };\n\nexport type IcRelatedTarget = EventTarget | undefined;\n\nexport type IcOrientation = \"horizontal\" | \"vertical\";\n\nexport type IcSizes = \"default\" | \"large\" | \"small\";\n\nexport interface IcValueEventDetail {\n  value: string;\n  keyPressed?: string;\n}\nexport interface IcBlurEventDetail {\n  relatedTarget: IcRelatedTarget;\n}\n"],"mappings":"IAwBYA,GAAZ,SAAYA,GACVA,EAAA,qBACAA,EAAA,iBACAA,EAAA,oBACD,EAJD,CAAYA,MAAmB,K,IAsEnBC,GAAZ,SAAYA,GACVA,EAAA,qBACAA,EAAA,eACAA,EAAA,gBACD,EAJD,CAAYA,MAAqB,Y"}

package/dist/core/p-649442b9.entry.js

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

package/dist/core/p-649442b9.entry.js.map

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

package/dist/core/p-65a1ff78.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as r,H as t,g as s}from"./p-03935e89.js";import{C as i}from"./p-3b185c32.js";import{i as a}from"./p-ba27b1e2.js";import"./p-613aa265.js";const c=`<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" fill="currentColor"/>\n</svg>\n`;const o=':host{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}:host .breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}:host .chevron{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host .chevron svg{color:var(--ic-architectural-400)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-hyperlink)}:host(.back){display:flex;align-items:center}:host(.back) .chevron{display:none}ic-link{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current="page"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper){margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb){border:none;background-color:transparent;color:var(--ic-hyperlink);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}@media (forced-colors: active){.back-icon svg{color:currentcolor}}@supports (text-decoration-thickness: 25%){ic-link{--breadcrumb-link-display:flex}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const n=class{constructor(t){e(this,t);this.renderDefaultBreadcrumb=(e,t,s,i)=>{const o=t!==null&&t!==undefined&&t!=="";if(e&&o){return r("span",{class:{"current-page-container":e}},a(this.el,"icon")&&r("slot",{name:"icon"}),t)}return r("ic-link",{href:i,class:"breadcrumb-link","aria-describedby":this.showBackIcon&&s&&s},this.showBackIcon&&r("div",{class:"back-icon",innerHTML:c}),a(this.el,"icon")&&r("slot",{name:"icon"}),t)};this.setSlottedCurrentPageClass=()=>{const e=this.el.querySelector("ic-link");const r="current-page";if(e){e.classList.remove(r);if(this.current){const t=e.classList.contains(r);if(!t){e.classList.add("breadcrumb-link",r)}}}};this.current=false;this.href=undefined;this.pageTitle=undefined;this.showBackIcon=false}componentWillRender(){this.setSlottedCurrentPageClass()}async setFocus(){if(this.el.shadowRoot.querySelector("ic-link")){this.el.shadowRoot.querySelector("ic-link").focus()}}render(){const{current:e,href:s,pageTitle:a}=this;const c=`${a&&a.toLowerCase().replace(" ","-")}-describedby`;const o=a!==null&&a!==undefined&&a!=="";const n=s!==null&&s!==undefined&&s!=="";return r(t,{class:{back:this.showBackIcon},"aria-current":e&&"page",role:"listitem"},r("div",{class:"breadcrumb"},r("span",{innerHTML:i,class:"chevron","aria-hidden":"true"}),this.showBackIcon&&c&&r("span",{id:c,class:"hide"},`Back to ${a}`),o&&n?this.renderDefaultBreadcrumb(e,a,c,s):r("slot",null)))}static get delegatesFocus(){return true}get el(){return s(this)}};n.style=o;export{n as ic_breadcrumb};
-//# sourceMappingURL=p-65a1ff78.entry.js.map

package/dist/core/p-65a1ff78.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icBreadcrumbCss","Breadcrumb","this","renderDefaultBreadcrumb","current","pageTitle","describedById","href","hasPageTitle","undefined","h","class","isSlotUsed","el","name","showBackIcon","innerHTML","backIcon","setSlottedCurrentPageClass","icLink","querySelector","currentPage","classList","remove","hasCurrentPageClass","contains","add","componentWillRender","setFocus","shadowRoot","focus","render","toLowerCase","replace","hasHref","Host","back","role","chevronIcon","id"],"sources":["src/components/ic-breadcrumb/ic-breadcrumb.css?tag=ic-breadcrumb&encapsulation=shadow","src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"sourcesContent":[":host {\n  display: block;\n  margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n:host .breadcrumb {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  gap: var(--ic-space-xs);\n  min-height: var(--ic-space-lg);\n}\n\n:host .chevron {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n:host .chevron svg {\n  color: var(--ic-architectural-400);\n}\n\n:host(:first-child) .chevron {\n  display: none;\n}\n\n.back-icon svg {\n  color: var(--ic-hyperlink);\n}\n\n:host(.back) {\n  display: flex;\n  align-items: center;\n}\n\n:host(.back) .chevron {\n  display: none;\n}\n\nic-link {\n  --breadcrumb-link-display: inline-flex;\n  --breadcrumb-link-align-items: center;\n  --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) {\n  margin-right: var(--ic-space-xs) !important;\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {\n  border: none;\n  background-color: transparent;\n  color: var(--ic-hyperlink);\n  text-decoration: underline;\n  font-weight: var(--ic-font-weight-bold);\n  cursor: pointer;\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n  outline: var(--ic-hc-focus-outline);\n  border-bottom: 0.25rem solid !important;\n  margin-bottom: -0.25rem !important;\n  text-decoration: none;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n  display: none;\n}\n\n@media (forced-colors: active) {\n  .back-icon svg {\n    color: currentcolor;\n  }\n}\n\n@supports (text-decoration-thickness: 25%) {\n  ic-link {\n    --breadcrumb-link-display: flex;\n  }\n\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n    text-decoration-line: underline;\n    text-decoration-thickness: 25%;\n    text-underline-offset: 25%;\n    border-bottom: 0 !important;\n    margin-bottom: 0 !important;\n  }\n}\n","import { Component, Host, Prop, h, Element, Method } from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n */\n@Component({\n  tag: \"ic-breadcrumb\",\n  styleUrl: \"ic-breadcrumb.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Breadcrumb {\n  @Element() el: HTMLIcBreadcrumbElement;\n\n  /**\n   * If `true`, aria-current will be set on the breadcrumb.\n   */\n  @Prop() current?: boolean = false;\n\n  /**\n   * The URL that the breadcrumb link points to.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The title of the breadcrumb.\n   */\n  @Prop() pageTitle!: string;\n\n  /**\n   * @internal If `true`, back icon will be displayed.\n   */\n  @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n  componentWillRender(): void {\n    this.setSlottedCurrentPageClass();\n  }\n\n  /**\n   * Sets focus on the breadcrumb.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el.shadowRoot.querySelector(\"ic-link\")) {\n      this.el.shadowRoot.querySelector(\"ic-link\").focus();\n    }\n  }\n\n  private renderDefaultBreadcrumb = (\n    current: boolean,\n    pageTitle: string,\n    describedById: string,\n    href: string\n  ): IcBreadcrumbDefault => {\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n\n    if (current && hasPageTitle) {\n      return (\n        <span\n          class={{\n            \"current-page-container\": current,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n          {pageTitle}\n        </span>\n      );\n    }\n\n    return (\n      <ic-link\n        href={href}\n        class=\"breadcrumb-link\"\n        aria-describedby={this.showBackIcon && describedById && describedById}\n      >\n        {this.showBackIcon && (\n          <div class=\"back-icon\" innerHTML={backIcon}></div>\n        )}\n        {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n        {pageTitle}\n      </ic-link>\n    );\n  };\n\n  private setSlottedCurrentPageClass = () => {\n    const icLink = this.el.querySelector(\"ic-link\");\n    const currentPage = \"current-page\";\n    if (icLink) {\n      icLink.classList.remove(currentPage);\n      if (this.current) {\n        const hasCurrentPageClass = icLink.classList.contains(currentPage);\n        if (!hasCurrentPageClass) {\n          icLink.classList.add(\"breadcrumb-link\", currentPage);\n        }\n      }\n    }\n  };\n\n  render() {\n    const { current, href, pageTitle } = this;\n    const describedById = `${\n      pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n    }-describedby`;\n\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n    const hasHref = href !== null && href !== undefined && href !== \"\";\n\n    return (\n      <Host\n        class={{\n          back: this.showBackIcon,\n        }}\n        aria-current={current && \"page\"}\n        role=\"listitem\"\n      >\n        <div class=\"breadcrumb\">\n          <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n          {this.showBackIcon && describedById && (\n            <span\n              id={describedById}\n              class=\"hide\"\n            >{`Back to ${pageTitle}`}</span>\n          )}\n          {hasPageTitle && hasHref ? (\n            this.renderDefaultBreadcrumb(\n              current,\n              pageTitle,\n              describedById,\n              href\n            )\n          ) : (\n            <slot />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yVAAA,MAAMA,EAAkB,i1D,MCiBXC,EAAU,M,yBAqCbC,KAAAC,wBAA0B,CAChCC,EACAC,EACAC,EACAC,KAEA,MAAMC,EACJH,IAAc,MAAQA,IAAcI,WAAaJ,IAAc,GAEjE,GAAID,GAAWI,EAAc,CAC3B,OACEE,EAAA,QACEC,MAAO,CACL,yBAA0BP,IAG3BQ,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,E,CAKP,OACEK,EAAA,WACEH,KAAMA,EACNI,MAAM,kBAAiB,mBACLT,KAAKa,cAAgBT,GAAiBA,GAEvDJ,KAAKa,cACJL,EAAA,OAAKC,MAAM,YAAYK,UAAWC,IAEnCL,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,EACO,EAINH,KAAAgB,2BAA6B,KACnC,MAAMC,EAASjB,KAAKW,GAAGO,cAAc,WACrC,MAAMC,EAAc,eACpB,GAAIF,EAAQ,CACVA,EAAOG,UAAUC,OAAOF,GACxB,GAAInB,KAAKE,QAAS,CAChB,MAAMoB,EAAsBL,EAAOG,UAAUG,SAASJ,GACtD,IAAKG,EAAqB,CACxBL,EAAOG,UAAUI,IAAI,kBAAmBL,E,kBA5EpB,M,+DAeqB,K,CAEjD,mBAAAM,GACEzB,KAAKgB,4B,CAOP,cAAMU,GACJ,GAAI1B,KAAKW,GAAGgB,WAAWT,cAAc,WAAY,CAC/ClB,KAAKW,GAAGgB,WAAWT,cAAc,WAAWU,O,EAuDhD,MAAAC,GACE,MAAM3B,QAAEA,EAAOG,KAAEA,EAAIF,UAAEA,GAAcH,KACrC,MAAMI,EAAgB,GACpBD,GAAaA,EAAU2B,cAAcC,QAAQ,IAAK,mBAGpD,MAAMzB,EACJH,IAAc,MAAQA,IAAcI,WAAaJ,IAAc,GACjE,MAAM6B,EAAU3B,IAAS,MAAQA,IAASE,WAAaF,IAAS,GAEhE,OACEG,EAACyB,EAAI,CACHxB,MAAO,CACLyB,KAAMlC,KAAKa,cACZ,eACaX,GAAW,OACzBiC,KAAK,YAEL3B,EAAA,OAAKC,MAAM,cACTD,EAAA,QAAMM,UAAWsB,EAAa3B,MAAM,UAAS,cAAa,SACzDT,KAAKa,cAAgBT,GACpBI,EAAA,QACE6B,GAAIjC,EACJK,MAAM,QACN,WAAWN,KAEdG,GAAgB0B,EACfhC,KAAKC,wBACHC,EACAC,EACAC,EACAC,GAGFG,EAAA,c"}

package/dist/core/p-6622567a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icSectionContainerCss","SectionContainer","render","aligned","fullHeight","this","h","Host","class"],"sources":["src/components/ic-section-container/ic-section-container.css?tag=ic-section-container&encapsulation=shadow","src/components/ic-section-container/ic-section-container.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n@media only screen and (max-width: 576px) {\n  :host {\n    --section-container-margin: var(--ic-space-xs);\n    --section-container-max-width: var(--ic-breakpoint-sm);\n  }\n}\n\n@media only screen and (min-width: 577px) {\n  :host {\n    --section-container-margin: var(--ic-space-md);\n    --section-container-max-width: var(--ic-breakpoint-md);\n  }\n}\n\n@media only screen and (min-width: 769px) {\n  :host {\n    --section-container-margin: var(--ic-space-md);\n    --section-container-max-width: var(--ic-breakpoint-lg);\n  }\n}\n\n@media only screen and (min-width: 993px) {\n  :host {\n    --section-container-margin: var(--ic-space-md);\n    --section-container-max-width: var(--ic-breakpoint-xl);\n  }\n}\n\n@media only screen and (min-width: 1201px) {\n  :host {\n    --section-container-margin: var(--ic-space-lg);\n    --section-container-max-width: var(--ic-breakpoint-xl);\n  }\n}\n\n:host {\n  display: block;\n  padding-top: var(--ic-space-md);\n  padding-bottom: var(--ic-space-md);\n  box-sizing: border-box;\n}\n\n:host(.aligned-center) {\n  max-width: var(--section-container-max-width);\n  margin-left: auto;\n  margin-right: auto;\n  padding-left: var(--section-container-margin);\n  padding-right: var(--section-container-margin);\n}\n\n:host(.aligned-left) {\n  max-width: var(--section-container-max-width);\n  margin-left: var(--section-container-margin);\n  margin-right: auto;\n  padding-right: var(--section-container-margin);\n}\n\n:host(.aligned-full-width) {\n  margin-left: var(--section-container-margin);\n  margin-right: var(--section-container-margin);\n}\n\n:host(.vertical-padding) {\n  padding-top: var(--ic-space-md);\n  padding-bottom: var(--ic-space-md);\n}\n\n:host(.no-vertical-padding) {\n  padding-top: 0;\n  padding-bottom: 0;\n}\n","import { Component, Prop, Host, h } from \"@stencil/core\";\nimport { IcAlignment } from \"../../utils/types\";\n\n@Component({\n  tag: \"ic-section-container\",\n  styleUrl: \"ic-section-container.css\",\n  shadow: true,\n})\nexport class SectionContainer {\n  /**\n   * The alignment of the container.\n   */\n  @Prop() aligned?: IcAlignment = \"left\";\n\n  /**\n   * If `true`, the standard vertical padding from the container will be removed.\n   */\n  @Prop() fullHeight?: boolean = false;\n\n  render() {\n    const { aligned, fullHeight } = this;\n    return (\n      <Host\n        class={{\n          [\"aligned-left\"]: aligned === \"left\",\n          [\"aligned-center\"]: aligned === \"center\",\n          [\"aligned-full-width\"]: aligned === \"full-width\",\n          [\"no-vertical-padding\"]: fullHeight,\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAwB,kzH,MCQjBC,EAAgB,M,sCAIK,O,gBAKD,K,CAE/B,MAAAC,GACE,MAAMC,QAAEA,EAAOC,WAAEA,GAAeC,KAChC,OACEC,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,gBAAiBL,IAAY,OAC9B,CAAC,kBAAmBA,IAAY,SAChC,CAAC,sBAAuBA,IAAY,aACpC,CAAC,uBAAwBC,IAG3BE,EAAA,a"}

package/dist/core/p-689a5bb3.entry.js

@@ -1,2 +0,0 @@
-import{r as i,h as t,H as e,g as o}from"./p-03935e89.js";import{D as n,l as s,g as a,q as r}from"./p-ba27b1e2.js";import{C as d}from"./p-3b185c32.js";import"./p-613aa265.js";const h='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}:host(.in-side-menu){border-bottom:var(--ic-space-1px) solid var(--ic-architectural-200);padding:var(--ic-space-md) 0}:host .navigation-group{height:100%;width:-moz-fit-content;width:fit-content;color:var(--ic-theme-text);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md);transition:var(--ic-easing-transition-slow);position:relative;background:none;border:none}:host(.in-side-menu) .navigation-group{height:2.5rem;width:100%;text-align:left}:host(.in-side-menu) .navigation-group .ic-typography-label{width:11.875rem}:host(.in-side-menu) .navigation-group-side-menu{color:var(--ic-action-default);justify-content:flex-start;padding:0 var(--ic-space-md) 0 var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-collapsed,:host(.in-side-menu) .navigation-group-side-menu-expanded{color:var(--ic-action-default);justify-content:flex-start;padding-left:var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-expanded{margin-bottom:var(--ic-space-xs)}:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,:host(.in-side-menu) .navigation-group-side-menu-expanded::after{border-style:solid;border-width:0.125em 0.125em 0 0;content:"";display:inline-block;height:0.45em;left:0.75em;position:relative;top:-0.1em;transform:rotate(135deg);vertical-align:top;width:0.45em}:host(.in-side-menu) .navigation-group-side-menu-expanded::after{top:0.15em;transform:rotate(-45deg)}:host .navigation-group:hover,:host .navigation-group:active,:host .selected{background-color:var(--ic-architectural-20);color:var(--ic-color-primary-text);outline:none;cursor:pointer}:host(:not(.in-side-menu)) .navigation-group:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);z-index:var(--ic-z-index-navigation-item);transition:box-shadow var(--ic-easing-transition-fast)}:host(.in-side-menu) .navigation-group-side-menu:hover,:host(.in-side-menu) .navigation-group-side-menu:active,:host(.in-side-menu) .navigation-group-side-menu:focus{background-color:var(--ic-architectural-20);color:var(--ic-action-default);cursor:auto;box-shadow:none;outline:none}:host(.in-side-menu) .navigation-group-side-menu:focus{outline:var(--ic-hc-focus-outline)}:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus){background-color:var(--ic-action-dark-bg-hover);color:var(--ic-action-default);cursor:pointer}:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus){background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-default)}:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus{color:var(--ic-action-default);box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline)}:host .navigation-group-dropdown{background-color:var(--ic-architectural-20);border-bottom:var(--ic-border-default);position:absolute;left:0;right:0;padding:var(--ic-space-xs) var(--ic-space-md);box-shadow:0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);z-index:calc(var(--ic-z-index-navigation-item) - 1)}:host .navigation-group-dropdown-items-list{list-style:none;display:flex;flex-flow:column wrap;align-content:flex-start;padding-left:var(--ic-space-md);max-height:16.5rem}:host .chevron-toggle-icon-wrapper{display:flex;align-items:center}:host .chevron-toggle-icon-wrapper svg{transform:rotate(90deg);height:var(--ic-space-lg);width:var(--ic-space-lg)}:host .chevron-toggle-icon-closed svg{transform:rotate(-90deg)}:host(.expanded) .grouped-links-wrapper{height:var(--navigation-child-items-height, auto) !important;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .link,:host(.navigation-group-side-nav) ::slotted(a){height:var(--navigation-child-items-height, auto)}:host(.collapsed) .grouped-links-wrapper{height:0;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.navigation-group-side-nav) .navigation-group{height:var(--navigation-group-height);width:var(--navigation-group-width);justify-content:var(--navigation-group-justify-content);padding-right:var(--navigation-group-expand-toggle-padding)}:host(.navigation-group-side-nav) .navigation-group:hover,:host(.navigation-group-side-nav) .navigation-group:active,:host(.navigation-group-side-nav) .selected{background-color:var(--navigation-group-hover);color:var(--navigation-group-text-hover)}:host(.navigation-group-side-nav) .navigation-group:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background:none}:host(.navigation-group-side-nav) .ic-typography-caption{position:var(--navigation-group-title-position);left:var(--navigation-group-title-position-left);white-space:nowrap}';const l=class{constructor(e){i(this,e);this.allGroupedNavigationItems=[];this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS=50;this.IC_NAVIGATION_ITEM="ic-navigation-item";this.mouseGate=false;this.nodeName="IC-NAVIGATION-GROUP";this.sideNavExpandHandler=i=>{this.isSideNavExpanded=i.detail.sideNavExpanded;if(this.isCollapsedLabelVariant===undefined){this.isCollapsedLabelVariant=!!i.target.getAttribute("collapsed-icon-labels")}if(this.isCollapsedLabelVariant&&!this.isSideNavExpanded){this.collapsedIconLabelsNavigationItemsHeight=this.getNavigationChildItemsHeight()}setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)};this.topNavResizedHandler=i=>{const t=i.detail.size;if(t!==this.deviceSize){this.deviceSize=t;this.inTopNavSideMenu=t<=n.L}};this.setGroupedNavItemTabIndex=i=>{this.el.querySelectorAll(this.IC_NAVIGATION_ITEM).forEach((t=>{const e=t.shadowRoot.querySelector("a")||t.querySelector("a");if(e){e.setAttribute("tabindex",i)}}))};this.toggleGroupedLinkWrapperHeight=(i,t)=>{if(i){if(t){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`);this.setGroupedNavItemTabIndex("0")}else{i.setAttribute("style",`--navigation-child-items-height: 0`);this.setGroupedNavItemTabIndex("-1")}}};this.toggleExpanded=()=>{this.expanded=!this.expanded;const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");this.toggleGroupedLinkWrapperHeight(i,this.expanded)};this.handleClick=i=>{if(this.navigationType==="top"&&i.detail){this.toggleDropdown()}else{this.toggleExpanded()}};this.handleBlur=i=>{const t=i.relatedTarget;if(!this.el.contains(t)){this.hideDropdown()}};this.handleTopNavKeydown=i=>{if(i.key===" "||i.key==="Enter"){this.toggleDropdown()}else if(!this.inTopNavSideMenu&&i.key==="Escape"){this.hideDropdown()}};this.handleKeydown=i=>{if(i.key==="Enter"||i.key===" "||i.key==="Escape"){switch(this.navigationType){case"top":this.handleTopNavKeydown(i);break;case"side":this.toggleExpanded();i.preventDefault();break;default:this.toggleExpanded();break}}};this.handleMouseLeave=i=>{const t=i.relatedTarget;this.mouseGate=false;if(!this.el.contains(t)&&t!==this.dropdown&&document.activeElement!==this.el&&!this.el.contains(document.activeElement)&&t.nodeName===this.nodeName&&this.dropdownOpen===true){this.mouseGate=true;this.hideDropdown()}else if(!this.el.contains(t)&&t!==this.dropdown&&!this.el.contains(document.activeElement)){this.mouseGate=false;setTimeout((()=>{this.dropdownOpen?this.hideDropdown():null}),500)}};this.handleMouseEnter=i=>{const t=i.relatedTarget;document.addEventListener("keydown",this.handleKeydown);if(t.nodeName===this.nodeName&&this.mouseGate===true){this.showDropdown()}else if(this.dropdownOpen===false&&t!==null&&this.mouseGate===false){this.mouseGate=true;setTimeout((()=>{this.mouseGate&&this.showDropdown()}),500)}};this.renderDropdownGroupedLinks=()=>t("div",{class:{["navigation-group-dropdown"]:!this.inTopNavSideMenu,["navigation-group-dropdown-side-menu"]:this.inTopNavSideMenu,["selected"]:this.dropdownOpen&&!this.inTopNavSideMenu},onMouseLeave:!this.inTopNavSideMenu?this.handleMouseLeave:null,ref:i=>this.dropdown=i},t("nav",{class:{["navigation-group-dropdown-items"]:!this.inTopNavSideMenu}},t("ul",null,t("slot",null))));this.renderGroupedLinks=()=>t("ul",{class:"grouped-links-wrapper"},t("slot",null));this.getNavigationChildItemsHeight=()=>{let i=0;this.allGroupedNavigationItems.forEach((t=>{i+=t.clientHeight}));return`${i}px`};this.setInitialGroupedLinksWrapperHeight=()=>{const i=this.el.shadowRoot.querySelector(".grouped-links-wrapper");if(i&&this.expanded&&!this.isSideNavExpanded&&this.isCollapsedLabelVariant){i.setAttribute("style",`--navigation-child-items-height: ${this.collapsedIconLabelsNavigationItemsHeight}px`)}else if(i&&this.expanded){i.setAttribute("style",`--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`)}};this.renderNavigationItems=()=>{if(this.dropdownOpen||this.inTopNavSideMenu&&!this.expandable){return this.renderDropdownGroupedLinks()}if(this.navigationType!=="top"){return this.renderGroupedLinks()}return null};this.deviceSize=n.XL;this.dropdownOpen=false;this.expanded=true;this.focusStyle=s();this.inTopNavSideMenu=false;this.navigationType=undefined;this.parentEl=undefined;this.expandable=false;this.label=undefined}disconnectedCallback(){if(this.navigationType==="side"){this.parentEl.removeEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.removeEventListener("topNavResized",this.topNavResizedHandler)}}componentWillLoad(){this.deviceSize=a();const i=r(this.el);this.navigationType=i.navType;this.parentEl=i.parent;if(this.deviceSize<=n.L&&this.navigationType==="top"){this.inTopNavSideMenu=true}if(this.navigationType==="side"){this.parentEl.addEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.addEventListener("topNavResized",this.topNavResizedHandler)}}componentDidLoad(){this.allGroupedNavigationItems=Array.from(this.el.querySelectorAll(this.IC_NAVIGATION_ITEM));setTimeout((()=>this.setInitialGroupedLinksWrapperHeight()),this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS)}childBlurHandler(){this.hideDropdown()}navItemClickHandler(){this.hideDropdown()}themeChangeHandler(i){const t=i.detail;this.focusStyle=t.mode}async setFocus(){if(this.groupEl){this.groupEl.focus()}}toggleDropdown(){this.dropdownOpen=!this.dropdownOpen}showDropdown(){if(!this.dropdownOpen){this.toggleDropdown()}}hideDropdown(){document.removeEventListener("keydown",this.handleKeydown);if(this.dropdownOpen){this.toggleDropdown()}}render(){const{label:i,dropdownOpen:o,inTopNavSideMenu:n,expandable:s}=this;const a=!n||s?"button":"div";return t(e,{class:{["in-side-menu"]:n,expanded:this.expanded,collapsed:!this.expanded,["navigation-group-side-nav"]:this.navigationType==="side"},role:"listitem"},t(a,{onMouseEnter:!n&&this.navigationType==="top"&&this.handleMouseEnter,onMouseLeave:this.navigationType==="top"&&this.handleMouseLeave,tabindex:n&&!s?"-1":"0",onBlur:this.handleBlur,onClick:s?this.handleClick:null,onKeyDown:this.handleKeydown,class:{["navigation-group"]:true,[this.focusStyle]:!n,["navigation-group-side-menu"]:n&&!s,["navigation-group-side-menu-collapsed"]:n&&s&&!o,["navigation-group-side-menu-expanded"]:n&&s&&o,["selected"]:o&&!n},ref:i=>this.groupEl=i,"aria-expanded":o||this.expanded?"true":"false","aria-haspopup":!n&&this.navigationType==="top"?"true":"false"},t("ic-typography",{variant:this.navigationType==="side"?"caption":"label"},i),this.navigationType==="side"&&s&&t("div",{class:{"chevron-toggle-icon-wrapper":true,"chevron-toggle-icon-closed":this.expanded},innerHTML:d})),this.renderNavigationItems())}static get delegatesFocus(){return true}get el(){return o(this)}};l.style=h;export{l as ic_navigation_group};
-//# sourceMappingURL=p-689a5bb3.entry.js.map

package/dist/core/p-689a5bb3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icNavigationGroupCss","NavigationGroup","this","allGroupedNavigationItems","DYNAMIC_GROUPED_LINKS_HEIGHT_MS","IC_NAVIGATION_ITEM","mouseGate","nodeName","sideNavExpandHandler","event","isSideNavExpanded","detail","sideNavExpanded","isCollapsedLabelVariant","undefined","target","getAttribute","collapsedIconLabelsNavigationItemsHeight","getNavigationChildItemsHeight","setTimeout","setInitialGroupedLinksWrapperHeight","topNavResizedHandler","ev","newSize","size","deviceSize","inTopNavSideMenu","DEVICE_SIZES","L","setGroupedNavItemTabIndex","tabIndexValue","el","querySelectorAll","forEach","navigationItem","navItem","shadowRoot","querySelector","setAttribute","toggleGroupedLinkWrapperHeight","wrapper","expanded","toggleExpanded","linkWrapper","handleClick","navigationType","toggleDropdown","handleBlur","relatedTarget","contains","hideDropdown","handleTopNavKeydown","key","handleKeydown","preventDefault","handleMouseLeave","relTarget","dropdown","document","activeElement","dropdownOpen","handleMouseEnter","addEventListener","showDropdown","renderDropdownGroupedLinks","h","class","onMouseLeave","ref","renderGroupedLinks","navigationChildItemsHeight","clientHeight","renderNavigationItems","expandable","XL","getThemeForegroundColor","disconnectedCallback","parentEl","removeEventListener","componentWillLoad","getCurrentDeviceSize","navParentDetails","getNavItemParentDetails","navType","parent","componentDidLoad","Array","from","childBlurHandler","navItemClickHandler","themeChangeHandler","theme","focusStyle","mode","setFocus","groupEl","focus","render","label","NavigationGroupElement","Host","collapsed","role","onMouseEnter","tabindex","onBlur","onClick","onKeyDown","variant","innerHTML","chevronIcon"],"sources":["src/components/ic-navigation-group/ic-navigation-group.css?tag=ic-navigation-group&encapsulation=shadow","src/components/ic-navigation-group/ic-navigation-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-navigation-item: z-index of navigation group item\n */\n\n:host {\n  display: block;\n}\n\n:host(.in-side-menu) {\n  border-bottom: var(--ic-space-1px) solid var(--ic-architectural-200);\n  padding: var(--ic-space-md) 0;\n}\n\n:host .navigation-group {\n  height: 100%;\n  width: fit-content;\n  color: var(--ic-theme-text);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 var(--ic-space-md);\n  transition: var(--ic-easing-transition-slow);\n  position: relative;\n  background: none;\n  border: none;\n}\n\n:host(.in-side-menu) .navigation-group {\n  height: 2.5rem;\n  width: 100%;\n  text-align: left;\n}\n\n:host(.in-side-menu) .navigation-group .ic-typography-label {\n  width: 11.875rem;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu {\n  color: var(--ic-action-default);\n  justify-content: flex-start;\n  padding: 0 var(--ic-space-md) 0 var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed,\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n  color: var(--ic-action-default);\n  justify-content: flex-start;\n  padding-left: var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n  margin-bottom: var(--ic-space-xs);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n  border-style: solid;\n  border-width: 0.125em 0.125em 0 0;\n  content: \"\";\n  display: inline-block;\n  height: 0.45em;\n  left: 0.75em;\n  position: relative;\n  top: -0.1em;\n  transform: rotate(135deg);\n  vertical-align: top;\n  width: 0.45em;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n  top: 0.15em;\n  transform: rotate(-45deg);\n}\n\n:host .navigation-group:hover,\n:host .navigation-group:active,\n:host .selected {\n  background-color: var(--ic-architectural-20);\n  color: var(--ic-color-primary-text);\n  outline: none;\n  cursor: pointer;\n}\n\n:host(:not(.in-side-menu)) .navigation-group:focus {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  outline: var(--ic-hc-focus-outline);\n  z-index: var(--ic-z-index-navigation-item);\n  transition: box-shadow var(--ic-easing-transition-fast);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:hover,\n:host(.in-side-menu) .navigation-group-side-menu:active,\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n  background-color: var(--ic-architectural-20);\n  color: var(--ic-action-default);\n  cursor: auto;\n  box-shadow: none;\n  outline: none;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover);\n  color: var(--ic-action-default);\n  cursor: pointer;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus) {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-action-default);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus {\n  color: var(--ic-action-default);\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host .navigation-group-dropdown {\n  background-color: var(--ic-architectural-20);\n  border-bottom: var(--ic-border-default);\n  position: absolute;\n  left: 0;\n  right: 0;\n  padding: var(--ic-space-xs) var(--ic-space-md);\n  box-shadow: 0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);\n  z-index: calc(var(--ic-z-index-navigation-item) - 1);\n}\n\n:host .navigation-group-dropdown-items-list {\n  list-style: none;\n  display: flex;\n  flex-flow: column wrap;\n  align-content: flex-start;\n  padding-left: var(--ic-space-md);\n  max-height: 16.5rem;\n}\n\n:host .chevron-toggle-icon-wrapper {\n  display: flex;\n  align-items: center;\n}\n\n:host .chevron-toggle-icon-wrapper svg {\n  transform: rotate(90deg);\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n}\n\n:host .chevron-toggle-icon-closed svg {\n  transform: rotate(-90deg);\n}\n\n:host(.expanded) .grouped-links-wrapper {\n  height: var(--navigation-child-items-height, auto) !important;\n  transition: var(--ic-easing-transition-slow);\n  overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .link,\n:host(.navigation-group-side-nav) ::slotted(a) {\n  height: var(--navigation-child-items-height, auto);\n}\n\n:host(.collapsed) .grouped-links-wrapper {\n  height: 0;\n  transition: var(--ic-easing-transition-slow);\n  overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .navigation-group {\n  height: var(--navigation-group-height);\n  width: var(--navigation-group-width);\n  justify-content: var(--navigation-group-justify-content);\n  padding-right: var(--navigation-group-expand-toggle-padding);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:hover,\n:host(.navigation-group-side-nav) .navigation-group:active,\n:host(.navigation-group-side-nav) .selected {\n  background-color: var(--navigation-group-hover);\n  color: var(--navigation-group-text-hover);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:focus {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n  background: none;\n}\n\n:host(.navigation-group-side-nav) .ic-typography-caption {\n  position: var(--navigation-group-title-position);\n  left: var(--navigation-group-title-position-left);\n  white-space: nowrap;\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  State,\n  Listen,\n  h,\n  Method,\n} from \"@stencil/core\";\n\nimport {\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  getNavItemParentDetails,\n} from \"../../utils/helpers\";\nimport { IcNavType, IcTheme } from \"../../utils/types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\n@Component({\n  tag: \"ic-navigation-group\",\n  styleUrl: \"ic-navigation-group.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class NavigationGroup {\n  private allGroupedNavigationItems: HTMLIcNavigationItemElement[] = [];\n  private collapsedIconLabelsNavigationItemsHeight: string;\n  private dropdown: HTMLElement;\n  private DYNAMIC_GROUPED_LINKS_HEIGHT_MS = 50;\n  private groupEl: HTMLElement;\n  private IC_NAVIGATION_ITEM = \"ic-navigation-item\";\n  private isCollapsedLabelVariant: boolean;\n  private isSideNavExpanded: boolean;\n  private mouseGate: boolean = false;\n  private nodeName = \"IC-NAVIGATION-GROUP\";\n\n  @Element() el: HTMLIcNavigationGroupElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() dropdownOpen: boolean = false;\n  @State() expanded: boolean = true;\n  @State() focusStyle = getThemeForegroundColor();\n  @State() inTopNavSideMenu: boolean = false;\n  @State() navigationType: IcNavType | \"\";\n  @State() parentEl: HTMLElement;\n\n  /**\n   *  If `true`, the group will be expandable in the side menu.\n   */\n  @Prop() expandable: boolean = false;\n\n  /**\n   * The label to display on the group.\n   */\n  @Prop() label: string;\n\n  disconnectedCallback(): void {\n    if (this.navigationType === \"side\") {\n      this.parentEl.removeEventListener(\n        \"sideNavExpanded\",\n        this.sideNavExpandHandler\n      );\n    } else if (this.navigationType === \"top\") {\n      this.parentEl.removeEventListener(\n        \"topNavResized\",\n        this.topNavResizedHandler\n      );\n    }\n  }\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n    const navParentDetails = getNavItemParentDetails(this.el);\n    this.navigationType = navParentDetails.navType;\n    this.parentEl = navParentDetails.parent;\n    if (this.deviceSize <= DEVICE_SIZES.L && this.navigationType === \"top\") {\n      this.inTopNavSideMenu = true;\n    }\n\n    if (this.navigationType === \"side\") {\n      this.parentEl.addEventListener(\n        \"sideNavExpanded\",\n        this.sideNavExpandHandler\n      );\n    } else if (this.navigationType === \"top\") {\n      this.parentEl.addEventListener(\n        \"topNavResized\",\n        this.topNavResizedHandler\n      );\n    }\n  }\n\n  componentDidLoad(): void {\n    this.allGroupedNavigationItems = Array.from(\n      this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n    );\n\n    /**\n     * debounce is required as the incorrect height was retrieved instantly after\n     * componentDidLoad is invoked.\n     */\n    setTimeout(\n      () => this.setInitialGroupedLinksWrapperHeight(),\n      this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n    );\n  }\n\n  @Listen(\"childBlur\")\n  childBlurHandler(): void {\n    this.hideDropdown();\n  }\n\n  @Listen(\"navItemClicked\")\n  navItemClickHandler(): void {\n    this.hideDropdown();\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.focusStyle = theme.mode;\n  }\n\n  /**\n   * Sets focus on the nav item.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.groupEl) {\n      this.groupEl.focus();\n    }\n  }\n\n  private sideNavExpandHandler = (event?: CustomEvent): void => {\n    this.isSideNavExpanded = event.detail.sideNavExpanded;\n\n    if (this.isCollapsedLabelVariant === undefined) {\n      this.isCollapsedLabelVariant = !!(\n        event.target as HTMLIcSideNavigationElement\n      ).getAttribute(\"collapsed-icon-labels\");\n    }\n\n    // Store sum of heights on all collapsed icon label items\n    if (this.isCollapsedLabelVariant && !this.isSideNavExpanded) {\n      this.collapsedIconLabelsNavigationItemsHeight =\n        this.getNavigationChildItemsHeight();\n    }\n\n    setTimeout(\n      () => this.setInitialGroupedLinksWrapperHeight(),\n      this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n    );\n  };\n\n  private topNavResizedHandler = (ev: CustomEvent): void => {\n    const newSize = ev.detail.size;\n    if (newSize !== this.deviceSize) {\n      this.deviceSize = newSize;\n      this.inTopNavSideMenu = newSize <= DEVICE_SIZES.L;\n    }\n  };\n\n  private toggleDropdown() {\n    this.dropdownOpen = !this.dropdownOpen;\n  }\n\n  private setGroupedNavItemTabIndex = (tabIndexValue: string) => {\n    this.el\n      .querySelectorAll(this.IC_NAVIGATION_ITEM)\n      .forEach((navigationItem) => {\n        const navItem =\n          navigationItem.shadowRoot.querySelector(\"a\") ||\n          navigationItem.querySelector(\"a\");\n        if (navItem) {\n          navItem.setAttribute(\"tabindex\", tabIndexValue);\n        }\n      });\n  };\n\n  private toggleGroupedLinkWrapperHeight = (\n    wrapper: HTMLElement,\n    expanded: boolean\n  ) => {\n    if (wrapper) {\n      if (expanded) {\n        wrapper.setAttribute(\n          \"style\",\n          `--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`\n        );\n        this.setGroupedNavItemTabIndex(\"0\");\n      } else {\n        wrapper.setAttribute(\"style\", `--navigation-child-items-height: 0`);\n        this.setGroupedNavItemTabIndex(\"-1\");\n      }\n    }\n  };\n\n  private toggleExpanded = () => {\n    this.expanded = !this.expanded;\n    const linkWrapper = this.el.shadowRoot.querySelector(\n      \".grouped-links-wrapper\"\n    ) as HTMLElement;\n    this.toggleGroupedLinkWrapperHeight(linkWrapper, this.expanded);\n  };\n\n  private showDropdown() {\n    if (!this.dropdownOpen) {\n      this.toggleDropdown();\n    }\n  }\n\n  private hideDropdown() {\n    document.removeEventListener(\"keydown\", this.handleKeydown);\n    if (this.dropdownOpen) {\n      this.toggleDropdown();\n    }\n  }\n\n  private handleClick = (ev: MouseEvent) => {\n    if (this.navigationType === \"top\" && ev.detail) {\n      this.toggleDropdown();\n    } else {\n      this.toggleExpanded();\n    }\n  };\n\n  private handleBlur = (ev: FocusEvent) => {\n    const target = ev.relatedTarget as HTMLElement;\n    if (!this.el.contains(target)) {\n      this.hideDropdown();\n    }\n  };\n\n  private handleTopNavKeydown = (ev: KeyboardEvent) => {\n    if (ev.key === \" \" || ev.key === \"Enter\") {\n      this.toggleDropdown();\n    } else if (!this.inTopNavSideMenu && ev.key === \"Escape\") {\n      this.hideDropdown();\n    }\n  };\n\n  private handleKeydown = (ev: KeyboardEvent) => {\n    if (ev.key === \"Enter\" || ev.key === \" \" || ev.key === \"Escape\") {\n      switch (this.navigationType) {\n        case \"top\":\n          this.handleTopNavKeydown(ev as KeyboardEvent);\n          break;\n        case \"side\":\n          this.toggleExpanded();\n          ev.preventDefault();\n          break;\n        default:\n          this.toggleExpanded();\n          break;\n      }\n    }\n  };\n\n  private handleMouseLeave = (ev: MouseEvent) => {\n    const relTarget = ev.relatedTarget as HTMLElement;\n\n    this.mouseGate = false;\n\n    if (\n      !this.el.contains(relTarget) &&\n      relTarget !== this.dropdown &&\n      document.activeElement !== this.el &&\n      !this.el.contains(document.activeElement) &&\n      relTarget.nodeName === this.nodeName &&\n      this.dropdownOpen === true\n    ) {\n      this.mouseGate = true;\n      this.hideDropdown();\n    } else if (\n      !this.el.contains(relTarget) &&\n      relTarget !== this.dropdown &&\n      !this.el.contains(document.activeElement)\n    ) {\n      this.mouseGate = false;\n      setTimeout(() => {\n        this.dropdownOpen ? this.hideDropdown() : null;\n      }, 500);\n    }\n  };\n\n  private handleMouseEnter = (ev: MouseEvent) => {\n    const relTarget = ev.relatedTarget as HTMLElement;\n    document.addEventListener(\"keydown\", this.handleKeydown);\n\n    if (relTarget.nodeName === this.nodeName && this.mouseGate === true) {\n      this.showDropdown();\n    } else if (\n      this.dropdownOpen === false &&\n      relTarget !== null &&\n      this.mouseGate === false\n    ) {\n      this.mouseGate = true;\n      setTimeout(() => {\n        this.mouseGate && this.showDropdown();\n      }, 500);\n    }\n  };\n\n  private renderDropdownGroupedLinks = (): HTMLDivElement => (\n    <div\n      class={{\n        [\"navigation-group-dropdown\"]: !this.inTopNavSideMenu,\n        [\"navigation-group-dropdown-side-menu\"]: this.inTopNavSideMenu,\n        [\"selected\"]: this.dropdownOpen && !this.inTopNavSideMenu,\n      }}\n      onMouseLeave={!this.inTopNavSideMenu ? this.handleMouseLeave : null}\n      ref={(el) => (this.dropdown = el)}\n    >\n      <nav\n        class={{\n          [\"navigation-group-dropdown-items\"]: !this.inTopNavSideMenu,\n        }}\n      >\n        <ul>\n          <slot></slot>\n        </ul>\n      </nav>\n    </div>\n  );\n\n  private renderGroupedLinks = (): HTMLDivElement => (\n    <ul class=\"grouped-links-wrapper\">\n      <slot></slot>\n    </ul>\n  );\n\n  /**\n   * Gets the total height of navigation links to improve\n   * smoothness of expand/collapse animations\n   */\n  private getNavigationChildItemsHeight = (): string => {\n    let navigationChildItemsHeight = 0;\n    this.allGroupedNavigationItems.forEach((navItem) => {\n      navigationChildItemsHeight += navItem.clientHeight;\n    });\n\n    return `${navigationChildItemsHeight}px`;\n  };\n\n  private setInitialGroupedLinksWrapperHeight = () => {\n    const linkWrapper = this.el.shadowRoot.querySelector(\n      \".grouped-links-wrapper\"\n    ) as HTMLElement;\n\n    if (\n      linkWrapper &&\n      this.expanded &&\n      !this.isSideNavExpanded &&\n      this.isCollapsedLabelVariant\n    ) {\n      /**\n       * Collapsed icon labels height is different depending on if ic-side-navigation is collapsed or expanded.\n       * If collapsed, use collapsedIconLabelsNavigationItemsHeight which is set on initial load.\n       */\n      linkWrapper.setAttribute(\n        \"style\",\n        `--navigation-child-items-height: ${this.collapsedIconLabelsNavigationItemsHeight}px`\n      );\n    } else if (linkWrapper && this.expanded) {\n      linkWrapper.setAttribute(\n        \"style\",\n        `--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`\n      );\n    }\n  };\n\n  private renderNavigationItems = (): HTMLDivElement | null => {\n    if (this.dropdownOpen || (this.inTopNavSideMenu && !this.expandable)) {\n      return this.renderDropdownGroupedLinks();\n    }\n\n    if (this.navigationType !== \"top\") {\n      return this.renderGroupedLinks();\n    }\n\n    return null;\n  };\n\n  render() {\n    const { label, dropdownOpen, inTopNavSideMenu, expandable } = this;\n    const NavigationGroupElement =\n      !inTopNavSideMenu || expandable ? \"button\" : \"div\";\n    return (\n      <Host\n        class={{\n          [\"in-side-menu\"]: inTopNavSideMenu,\n          expanded: this.expanded,\n          collapsed: !this.expanded,\n          [\"navigation-group-side-nav\"]: this.navigationType === \"side\",\n        }}\n        role=\"listitem\"\n      >\n        <NavigationGroupElement\n          onMouseEnter={\n            !inTopNavSideMenu &&\n            this.navigationType === \"top\" &&\n            this.handleMouseEnter\n          }\n          onMouseLeave={this.navigationType === \"top\" && this.handleMouseLeave}\n          tabindex={inTopNavSideMenu && !expandable ? \"-1\" : \"0\"}\n          onBlur={this.handleBlur}\n          onClick={expandable ? this.handleClick : null}\n          onKeyDown={this.handleKeydown}\n          class={{\n            [\"navigation-group\"]: true,\n            [this.focusStyle]: !inTopNavSideMenu,\n            [\"navigation-group-side-menu\"]: inTopNavSideMenu && !expandable,\n            [\"navigation-group-side-menu-collapsed\"]:\n              inTopNavSideMenu && expandable && !dropdownOpen,\n            [\"navigation-group-side-menu-expanded\"]:\n              inTopNavSideMenu && expandable && dropdownOpen,\n            [\"selected\"]: dropdownOpen && !inTopNavSideMenu,\n          }}\n          ref={(el) => (this.groupEl = el)}\n          aria-expanded={dropdownOpen || this.expanded ? \"true\" : \"false\"}\n          aria-haspopup={\n            !inTopNavSideMenu && this.navigationType === \"top\"\n              ? \"true\"\n              : \"false\"\n          }\n        >\n          <ic-typography\n            variant={this.navigationType === \"side\" ? \"caption\" : \"label\"}\n          >\n            {label}\n          </ic-typography>\n          {this.navigationType === \"side\" && expandable && (\n            <div\n              class={{\n                \"chevron-toggle-icon-wrapper\": true,\n                \"chevron-toggle-icon-closed\": this.expanded,\n              }}\n              innerHTML={chevronIcon}\n            ></div>\n          )}\n        </NavigationGroupElement>\n        {this.renderNavigationItems()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}