@ukic/web-components 2.28.0 → 3.0.0-alpha.1

package/dist/core/p-8c325d9b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icHeroCss","Hero","this","hostMutationObserver","hostMutationCallback","mutationList","some","type","addedNodes","removedNodes","checkSlotInChildMutations","forceUpdate","getThemeForegroundColor","rightContent","secondaryHeading","undefined","disconnectedCallback","_a","disconnect","componentWillLoad","slotHasContent","el","componentDidLoad","isSlotUsed","onComponentRequiredPropUndefined","prop","heading","propName","MutationObserver","observe","childList","componentWillRender","themeChangeHandler","ev","theme","detail","foregroundColor","mode","doScroll","disableBackgroundParallax","scrolltotop","document","scrollingElement","scrollTop","factor","y","scrollFactor","render","aligned","small","size","subheading","secondarySubheading","backgroundImage","style","isPropDefined","h","Host","class","IcThemeForegroundEnum","Dark","fullHeight","leftContentFullWidth","name","variant"],"sources":["src/components/ic-hero/ic-hero.css?tag=ic-hero&encapsulation=shadow","src/components/ic-hero/ic-hero.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  background-color: var(--ic-theme-tertiary);\n  color: var(--ic-theme-text);\n\n  --hero-heading-bottom-margin: var(--ic-space-md);\n}\n\n:host(.dark) {\n  background-color: var(--ic-theme-secondary);\n}\n\n:host(.has-background-image) {\n  background-repeat: no-repeat;\n  background-position: right -6.25rem;\n  background-size: auto calc(100% + 6.25rem);\n  box-shadow: var(--ic-elevation-inset);\n}\n\n@media (prefers-reduced-motion) {\n  :host(.has-background-image) {\n    background-position: right -6.25rem !important;\n  }\n}\n\nic-typography.heading-bottom-spacing {\n  margin-bottom: var(--hero-heading-bottom-margin);\n}\n\n.section-container {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n\n.left-container {\n  padding: var(--ic-space-xl) 0;\n}\n\n.left-container:not(.left-container-full-width) {\n  flex-basis: 50%;\n}\n\n.left-container-full-width {\n  width: 100%;\n}\n\n.right-container {\n  flex-basis: 50%;\n}\n\n.interaction-container {\n  display: flex;\n  gap: var(--ic-space-md);\n  margin-top: var(--ic-space-lg);\n  flex-wrap: wrap;\n}\n\n.secondary-container {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  border-left: var(--ic-space-xxxs) solid var(--ic-theme-text);\n}\n\n.secondary-subheading {\n  margin-top: var(--ic-space-xxs);\n}\n\n:host([content-aligned=\"left\"]) .left-container,\n:host([content-aligned=\"left\"]) .interaction-container {\n  justify-content: flex-start;\n  text-align: left;\n}\n\n:host([content-aligned=\"center\"]) .left-container,\n:host([content-aligned=\"center\"]) .interaction-container {\n  justify-content: center;\n  text-align: center;\n}\n\n@media (min-width: 992px) {\n  .left-container-full-width {\n    width: 66.6%;\n  }\n}\n\n@media (min-width: 1044px) {\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  .left-container:not(.left-container-full-width) {\n    flex-basis: 66.6%;\n  }\n\n  .left-container {\n    min-height: 9rem;\n  }\n\n  .right-container {\n    flex-basis: 33.3%;\n    margin-left: 3.125rem;\n  }\n\n  .secondary-container {\n    min-height: 9rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 3.938rem;\n  }\n}\n\n@media (min-width: 801px) and (max-width: 1043px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 5.922rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 641px) and (max-width: 800px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 2.125rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 481px) and (max-width: 640px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 17.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n\n  .right-container {\n    margin-bottom: 2.5rem;\n  }\n}\n\n@media (max-width: 480px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 12rem;\n  }\n\n  :host,\n  .right-container {\n    margin-bottom: var(--ic-space-md);\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 16.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Listen,\n  forceUpdate,\n} from \"@stencil/core\";\nimport {\n  IcAlignment,\n  IcSizesNoLarge,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport {\n  slotHasContent,\n  getThemeForegroundColor,\n  onComponentRequiredPropUndefined,\n  isPropDefined,\n  isSlotUsed,\n  checkSlotInChildMutations,\n} from \"../../utils/helpers\";\nimport { IcHeroContentAlignments } from \"./ic-hero.types\";\n\n/**\n * @slot heading - Content will be rendered in the title area, in place of the heading.\n * @slot subheading - Content will be rendered in the title area, in place of the subheading.\n * @slot interaction - Content will be rendered in the interaction area, adjacent to the title area.\n * @slot secondary - Content will be rendered in the secondary content area.\n */\n\n@Component({\n  tag: \"ic-hero\",\n  styleUrl: \"ic-hero.css\",\n  shadow: true,\n})\nexport class Hero {\n  private hostMutationObserver: MutationObserver = null;\n\n  @Element() el: HTMLIcHeroElement;\n\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n  @State() rightContent: boolean = false;\n  // set by above state\n  @State() leftContentFullWidth: boolean =\n    !this.rightContent && this.secondaryHeading === undefined;\n  @State() scrollFactor: string = \"right -100px\";\n\n  /**\n   * The alignment of the hero.\n   */\n  @Prop() aligned: IcAlignment = \"left\";\n\n  /**\n   * The optional background image.\n   */\n  @Prop() backgroundImage?: string;\n\n  /**\n   * The alignment of the hero content.\n   */\n  @Prop() contentAligned: IcHeroContentAlignments = \"left\";\n\n  /**\n   * If `true`, the background image (if set) will not scroll using a parallax effect.\n   */\n  @Prop() disableBackgroundParallax?: boolean = false;\n\n  /**\n   * The heading of the hero.\n   */\n  @Prop() heading: string;\n\n  /**\n   * The optional secondary heading, replaced by slotted right content.\n   */\n  @Prop() secondaryHeading?: string;\n\n  /**\n   * The optional secondary subheading, replaced by slotted right content.\n   */\n  @Prop() secondarySubheading?: string;\n\n  /**\n   * The size of the hero component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * The description for the hero.\n   */\n  @Prop() subheading?: string;\n\n  disconnectedCallback(): void {\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  componentDidLoad(): void {\n    !isSlotUsed(this.el, \"heading\") &&\n      onComponentRequiredPropUndefined(\n        [{ prop: this.heading, propName: \"heading\" }],\n        \"Hero\"\n      );\n\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, {\n      childList: true,\n    });\n  }\n\n  componentWillRender(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  @Listen(\"scroll\", { target: \"document\" })\n  doScroll(): void {\n    if (this.disableBackgroundParallax) {\n      return;\n    }\n\n    const scrolltotop = document.scrollingElement.scrollTop;\n    const factor = 0.4;\n    const y = -100 + scrolltotop * factor;\n    this.scrollFactor = \"right \" + y + \"px\";\n  }\n\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    if (\n      mutationList.some(({ type, addedNodes, removedNodes }) =>\n        type === \"childList\"\n          ? checkSlotInChildMutations(addedNodes, removedNodes, \"secondary\")\n          : false\n      )\n    ) {\n      forceUpdate(this);\n    }\n  };\n\n  render() {\n    const {\n      aligned,\n      small,\n      size,\n      heading,\n      subheading,\n      secondaryHeading,\n      secondarySubheading,\n      foregroundColor,\n      backgroundImage,\n      scrollFactor,\n    } = this;\n\n    let style = {};\n\n    if (isPropDefined(backgroundImage)) {\n      style = {\n        \"background-image\": \"url(\" + backgroundImage + \")\",\n        \"background-position\": scrollFactor,\n      };\n    }\n\n    return (\n      <Host\n        class={{\n          [IcThemeForegroundEnum.Dark]:\n            foregroundColor === IcThemeForegroundEnum.Dark,\n          [\"has-background-image\"]: backgroundImage !== undefined,\n          [\"small\"]: small || size === \"small\",\n          [\"secondary-heading\"]: !!secondaryHeading,\n        }}\n        style={style}\n      >\n        <ic-section-container\n          aligned={aligned}\n          fullHeight\n          class=\"section-container\"\n        >\n          <div\n            class={{\n              [\"left-container\"]: true,\n              [\"left-container-full-width\"]: this.leftContentFullWidth,\n            }}\n          >\n            <div class=\"heading\">\n              <slot name=\"heading\">\n                <ic-typography\n                  variant={small || size === \"small\" ? \"h2\" : \"h1\"}\n                  class={{\n                    [\"heading-bottom-spacing\"]: !small && size !== \"small\",\n                  }}\n                >\n                  {heading}\n                </ic-typography>\n              </slot>\n            </div>\n            <div class=\"subheading\">\n              <slot name=\"subheading\">\n                <ic-typography variant=\"body\">{subheading}</ic-typography>\n              </slot>\n            </div>\n            <div class=\"interaction-container\">\n              <slot name=\"interaction\"></slot>\n            </div>\n          </div>\n          {(isPropDefined(secondaryHeading) || this.rightContent) && (\n            <div class=\"right-container\">\n              <slot name=\"secondary\">\n                {secondaryHeading && (\n                  <div class=\"secondary-container\">\n                    <div class=\"secondary-heading\">\n                      <ic-typography variant=\"h4\">\n                        {secondaryHeading}\n                      </ic-typography>\n                    </div>\n                    <div class=\"secondary-subheading\">\n                      <ic-typography variant=\"subtitle-small\">\n                        {secondarySubheading}\n                      </ic-typography>\n                    </div>\n                  </div>\n                )}\n              </slot>\n            </div>\n          )}\n        </ic-section-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2KAAA,MAAMA,EAAY,mzM,MCuCLC,EAAI,M,yBACPC,KAAAC,qBAAyC,KAwGzCD,KAAAE,qBAAwBC,IAC9B,GACEA,EAAaC,MAAK,EAAGC,OAAMC,aAAYC,kBACrCF,IAAS,YACLG,EAA0BF,EAAYC,EAAc,aACpD,QAEN,CACAE,EAAYT,K,wBA5G8BU,I,kBACb,M,2BAG9BV,KAAKW,cAAgBX,KAAKY,mBAAqBC,U,kBAClB,e,aAKD,O,mDAUmB,O,+BAKJ,M,oGAoBd,U,WAKN,M,0BAO1B,oBAAAC,G,OACEC,EAAAf,KAAKC,wBAAoB,MAAAc,SAAA,SAAAA,EAAEC,Y,CAG7B,iBAAAC,GACEjB,KAAKW,aAAeO,EAAelB,KAAKmB,GAAI,Y,CAG9C,gBAAAC,IACGC,EAAWrB,KAAKmB,GAAI,YACnBG,EACE,CAAC,CAAEC,KAAMvB,KAAKwB,QAASC,SAAU,YACjC,QAGJzB,KAAKC,qBAAuB,IAAIyB,iBAAiB1B,KAAKE,sBACtDF,KAAKC,qBAAqB0B,QAAQ3B,KAAKmB,GAAI,CACzCS,UAAW,M,CAIf,mBAAAC,GACE7B,KAAKW,aAAeO,EAAelB,KAAKmB,GAAI,Y,CAI9C,kBAAAW,CAAmBC,GACjB,MAAMC,EAAiBD,EAAGE,OAC1BjC,KAAKkC,gBAAkBF,EAAMG,I,CAI/B,QAAAC,GACE,GAAIpC,KAAKqC,0BAA2B,CAClC,M,CAGF,MAAMC,EAAcC,SAASC,iBAAiBC,UAC9C,MAAMC,EAAS,GACf,MAAMC,GAAK,IAAML,EAAcI,EAC/B1C,KAAK4C,aAAe,SAAWD,EAAI,I,CAerC,MAAAE,GACE,MAAMC,QACJA,EAAOC,MACPA,EAAKC,KACLA,EAAIxB,QACJA,EAAOyB,WACPA,EAAUrC,iBACVA,EAAgBsC,oBAChBA,EAAmBhB,gBACnBA,EAAeiB,gBACfA,EAAeP,aACfA,GACE5C,KAEJ,IAAIoD,EAAQ,GAEZ,GAAIC,EAAcF,GAAkB,CAClCC,EAAQ,CACN,mBAAoB,OAASD,EAAkB,IAC/C,sBAAuBP,E,CAI3B,OACEU,EAACC,EAAI,CACHC,MAAO,CACL,CAACC,EAAsBC,MACrBxB,IAAoBuB,EAAsBC,KAC5C,CAAC,wBAAyBP,IAAoBtC,UAC9C,CAAC,SAAUkC,GAASC,IAAS,QAC7B,CAAC,uBAAwBpC,GAE3BwC,MAAOA,GAEPE,EAAA,wBACER,QAASA,EACTa,WAAU,KACVH,MAAM,qBAENF,EAAA,OACEE,MAAO,CACL,CAAC,kBAAmB,KACpB,CAAC,6BAA8BxD,KAAK4D,uBAGtCN,EAAA,OAAKE,MAAM,WACTF,EAAA,QAAMO,KAAK,WACTP,EAAA,iBACEQ,QAASf,GAASC,IAAS,QAAU,KAAO,KAC5CQ,MAAO,CACL,CAAC,2BAA4BT,GAASC,IAAS,UAGhDxB,KAIP8B,EAAA,OAAKE,MAAM,cACTF,EAAA,QAAMO,KAAK,cACTP,EAAA,iBAAeQ,QAAQ,QAAQb,KAGnCK,EAAA,OAAKE,MAAM,yBACTF,EAAA,QAAMO,KAAK,mBAGbR,EAAczC,IAAqBZ,KAAKW,eACxC2C,EAAA,OAAKE,MAAM,mBACTF,EAAA,QAAMO,KAAK,aACRjD,GACC0C,EAAA,OAAKE,MAAM,uBACTF,EAAA,OAAKE,MAAM,qBACTF,EAAA,iBAAeQ,QAAQ,MACpBlD,IAGL0C,EAAA,OAAKE,MAAM,wBACTF,EAAA,iBAAeQ,QAAQ,kBACpBZ,Q"}

package/dist/core/p-936ab032.entry.js

@@ -1,2 +0,0 @@
-import{r as i,c as t,h as e,H as a,g as o}from"./p-6b5e91e2.js";import{i as n,D as s,b as r,e as d,z as c}from"./p-fef9e8c9.js";import{C as l}from"./p-3b185c32.js";import{O as v}from"./p-426ec638.js";import"./p-26b7b18f.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(:focus-within){z-index:var(--ic-z-index-navigation-item)}svg{width:var(--ic-space-xl);fill:var(--ic-theme-text)}.svg{margin-left:auto}.chevron-container svg,.chevron-container .svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chevron-container{flex-grow:1}:host(.expandable.navigation-item) .link,:host(.expandable.navigation-item) ::slotted(a){padding-right:0}:host(.navigation-item) .link,:host(.navigation-item) ::slotted(a){height:calc(100% - var(--ic-space-xxs));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) var(--ic-space-xxs);text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative;white-space:nowrap}:host(.navigation-item) ::slotted(a){height:100%;font:var(--ic-font-label) !important;letter-spacing:var(--ic-font-letter-spacing-0pt025) !important;padding:0 var(--ic-space-md) !important}:host(.navigation-item-selected) .link::after,:host(.navigation-item-selected) ::slotted(a.active)::after,:host(.navigation-item-top-nav) ::slotted(a.active)::after{content:"";height:0.25rem;width:100%;position:absolute;bottom:0;background-color:var(--ic-theme-text)}:host(.navigation-item-selected.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-selected.navigation-item-page-header) .link::after,:host(.navigation-item.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-top-nav-child) ::slotted(a.active)::after{content:none}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){box-shadow:none}:host(.navigation-item) .link:hover:not(:focus){background-color:var(--ic-theme-hover);cursor:pointer}:host(.navigation-item:not(.navigation-item-page-header,.navigation-item-side-menu)) ::slotted(a:hover:not(:focus)){background-color:var(--ic-theme-hover) !important}:host(.navigation-item:not(.navigation-item-top-nav-child,.navigation-item-side-menu,.navigation-item-top-nav-child-selected .navigation-item-side-menu-selected)) .focus-indicator:focus-within{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius)}:host(.navigation-item) .link:focus,:host(.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}:host(.navigation-item-selected) .link:focus,:host(.navigation-item) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}:host(.navigation-item-selected.dark) .link:focus,:host(.navigation-item.dark) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}:host(.navigation-item) .link:active:not(:focus),:host(.navigation-item) ::slotted(a:active:not(:focus)){background-color:var(--ic-theme-active)}:host(.navigation-item-side-menu) .link,:host(.navigation-item-side-menu) ::slotted(a){min-height:2.5rem;height:auto;width:100%;box-sizing:border-box;color:var(--ic-color-primary-text);display:flex;align-items:center;justify-content:flex-start;text-decoration:none;text-wrap:wrap;white-space:normal;transition:box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-fast)}:host(.navigation-item-side-menu) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important;transition:box-shadow var(--ic-easing-transition-fast),\n    background-color var(--ic-easing-transition-fast)}:host(.navigation-item-side-menu) .link:hover:not(:focus){background-color:var(--ic-action-dark-bg-hover)}:host(.navigation-item-side-menu) ::slotted(a:hover:not(:focus)){background-color:var(--ic-action-dark-bg-hover) !important}:host(.navigation-item-side-menu) .focus-indicator:focus-within{box-shadow:none}:host(.navigation-item-side-menu) .link:focus,:host(.navigation-item-side-menu) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset) !important;width:auto;border-radius:var(--ic-border-radius-inset) !important}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu-selected) ::slotted(a){transition:box-shadow var(--ic-easing-transition-slow),\n    background-color var(--ic-easing-transition-slow)}:host(.navigation-item-side-menu-selected) .link:focus,:host(.navigation-item-side-menu) ::slotted(a.active:focus),:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){margin-left:var(--ic-space-xs) !important;padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child) .link,:host(.navigation-item-top-nav-child) ::slotted(a){height:2.5rem;width:-moz-fit-content;width:fit-content;min-width:9.063rem;color:var(--ic-color-primary-text);display:flex;align-items:center;justify-content:flex-start;padding:0 var(--ic-space-md) !important;text-decoration:none;position:relative;transition:box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-slow)}:host(.navigation-item-top-nav-child) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important}:host(.navigation-item-top-nav-child) .link:hover:not(:focus){background-color:var(--ic-action-dark-bg-hover) !important}:host(.navigation-item-top-nav-child) ::slotted(a:hover):not(:focus){background-color:var(--ic-action-dark-bg-hover) !important}:host(.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-top-nav-child) ::slotted(a:focus){z-index:1;outline:var(--ic-hc-focus-outline);border-radius:var(--ic-border-radius-inset);box-shadow:var(--ic-border-focus-inset);transition:border-radius 0s, box-shadow var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}:host(.navigation-item-side-menu) .link:active:not(:focus){background-color:var(--ic-action-dark-bg-active)}:host(.navigation-item-top-nav-child) .link:active:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus){outline:var(--ic-hc-focus-outline);background-color:var(--ic-action-dark-bg-active)}:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus),:host(.navigation-item-side-menu) ::slotted(a:active):not(:focus){background-color:var(--ic-action-dark-bg-active) !important}:host(.navigation-item-side-menu-selected) *,:host(.navigation-item-top-nav-child-selected) *,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){font-weight:700 !important}:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{content:"";position:absolute;left:0;width:var(--ic-space-xs);height:inherit;min-height:2.5rem;background-color:var(--ic-action-default);transition:left 0s}:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu-selected) .link:focus::before{margin-top:0.25rem}:host(.navigation-item-top-nav-child-selected) .link:focus{margin-left:var(--ic-space-xs);margin-right:calc(-1 * var(--ic-space-xs));padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child-selected) .link:focus::before{left:calc(-1 * var(--ic-space-xs));z-index:1}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{z-index:1}:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,:host(.navigation-item-top-nav-child) ::slotted(a.active:focus)::before{left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-side-menu-selected) .link::after{display:none}:host(.navigation-item-side-nav-collapsed) .link{height:100%}:host(.navigation-item-side-nav-collapsed) ::slotted(svg),:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(svg){margin:auto;pointer-events:none}:host(.navigation-item-side-nav-collapsed) .icon,:host(.navigation-item-side-nav-collapsed-with-label) .icon,:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{align-items:center;padding:0;margin:auto 0;width:-moz-fit-content;width:fit-content;pointer-events:none}:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}:host(.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;padding:var(--ic-space-xs) !important;gap:var(--ic-space-xxs)}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){height:auto !important;gap:0;width:auto;padding:var(--ic-space-xs) !important}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block;text-align:center}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link ic-typography{opacity:1;min-width:-moz-min-content;min-width:min-content}:host(.navigation-item-side-nav-collapsed) svg,:host(.navigation-item-side-nav-collapsed-with-label) svg{display:none}::slotted(svg){fill:var(--ic-theme-text);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}.icon{height:var(--ic-space-lg);width:var(--ic-space-xxl);margin-left:calc(-1 * var(--ic-space-md));flex:0 1 0%;position:relative}.icon>::slotted(*){margin-left:var(--ic-space-md) !important}:host(.navigation-item-side-nav-collapsed) .icon>::slotted(*){margin:auto !important}:host(.navigation-item-side-nav) .link,:host(.navigation-item-side-nav) ::slotted(a){height:var(--navigation-item-height, 56px);min-height:var(--navigation-item-min-height);width:var(--navigation-item-width, auto);justify-content:var(--navigation-item-justify-content);display:flex;gap:var(--ic-space-xs);box-sizing:border-box;color:var(--navigation-item-child-color) !important;text-decoration:none !important;white-space:nowrap;padding-top:var(--ic-space-md) !important;padding-bottom:var(--ic-space-md) !important;text-wrap:wrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a){height:var(--navigation-item-child-height);width:var(--navigation-group-width);color:var(--navigation-item-child-color) !important;display:flex;gap:0.625rem;box-sizing:border-box;min-width:0;transition:box-shadow var(--ic-easing-transition-fast);text-decoration:none !important;white-space:nowrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:focus){box-shadow:var(--ic-border-focus-dark)}:host(.navigation-item-side-nav.navigation-item-side-menu) .link:active{background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:active,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:active){background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav) a.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) a.link ic-typography,:host(.navigation-item-side-nav) div.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) div.link ic-typography,.navigation-item-side-nav-slotted-text{opacity:var(--navigation-item-label-opacity);transition:opacity var(--ic-easing-transition-slow);white-space:wrap;text-overflow:ellipsis;overflow:hidden}:host(.navigation-item-side-nav.navigation-item-selected) .link,:host(.navigation-item-side-nav.navigation-item) ::slotted(a.active){box-shadow:inset 0.313rem 0 0 var(--ic-theme-text)}:host(.navigation-item-side-nav.navigation-item-selected) .link::before,:host(.navigation-item-side-nav) ::slotted(a.active)::before{content:"";display:block;position:absolute;inset:0 0 0 0.313rem;border-radius:0.688rem !important;transition:var(--ic-easing-transition-slow)}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus::before,:host(.navigation-item-side-nav) ::slotted(a.active:focus)::before{box-shadow:var(--ic-border-focus-inset)}:host(:not(.navigation-item-side-nav-collapsed).navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link{opacity:var(--navigation-item-label-opacity);height:auto}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){min-width:var(--navigation-group-item-min-width);padding:var(--ic-space-xs) !important;height:auto;gap:0}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block}:host(.navigation-item-side-nav.navigation-item-selected) .link::after,:host(.navigation-item-side-nav) ::slotted(a.active)::after{display:none}:host(.navigation-item-side-nav.navigation-item) .link:focus,:host(.navigation-item-side-nav.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background-color:transparent}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus,:host(.navigation-item-side-nav) ::slotted(a.active:focus){margin:0 auto;box-shadow:inset 0.313rem 0 0 var(--ic-theme-text);border-radius:0}:host(.navigation-item-side-nav.navigation-item) .link:hover:not(:focus){background-color:var(--ic-theme-hover) !important}:host(.navigation-item-page-header).link,:host(.navigation-item-page-header) a,:host(.navigation-item-page-header) ::slotted(a){height:2.5rem !important;color:var(--ic-color-primary-text) !important;transition:all var(--ic-easing-transition-fast) !important;box-shadow:rgba(23 89 188 / 0%) !important}:host(.navigation-item-page-header.navigation-item-selected) .link::after,:host(.navigation-item-page-header) ::slotted(a.active)::after{content:" " !important;position:absolute;bottom:0;left:0;right:0;height:var(--ic-space-xxs);background-color:var(--ic-action-default) !important}:host(.navigation-item-page-header) .link:hover,:host(.navigation-item-page-header) ::slotted(.link:hover),:host(.navigation-item-page-header) ::slotted(a:hover),:host(.navigation-item-page-header) .link:hover:not(:focus){background-color:var(--ic-action-default-bg-hover) !important;cursor:pointer}:host(.navigation-item-page-header) .link:focus,:host(.navigation-item-page-header) ::slotted(a:focus){box-shadow:var(--ic-border-focus)}:host(.navigation-item-page-header) .link:active,:host(.navigation-item-page-header) ::slotted(a:active){background-color:var(--ic-action-default-bg-active) !important}:host(.navigation-item-page-header.navigation-item-selected) .link:focus::after,:host(.navigation-item-page-header) ::slotted(a.active:focus)::after{border-bottom-left-radius:var(--ic-border-radius);border-bottom-right-radius:var(--ic-border-radius)}:host(.navigation-item-page-header.navigation-item-selected.with-transition) .link,:host(.navigation-item-page-header.navigation-item-selected.with-transition) ::slotted(a.active){transition:all var(--ic-easing-transition-fast),\n    border-color var(--ic-transition-duration-fast)}:host(.navigation-item-page-header) ::slotted(a.active)::before,:host(.navigation-item-page-header) ::slotted(a.active:focus)::before,:host(.navigation-item-page-header.navigation-item-selected) .link:focus::before{display:none}.open-in-new-icon{flex:1}.open-in-new-icon svg{margin-top:var(--ic-space-xxs);padding-left:var(--ic-space-xxs)}:host(.navigation-item-side-nav) .open-in-new-icon{margin-left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-top-nav) .open-in-new-icon svg,:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-side-nav) .open-in-new-icon svg{height:0.875rem;width:0.875rem}:host(.navigation-item-side-menu) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg{height:var(--ic-space-md);width:var(--ic-space-md)}:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg,:host(.navigation-item-side-menu) .open-in-new-icon svg{fill:var(--ic-color-primary-text)}@media (forced-colors: active){.open-in-new-icon svg{fill:currentcolor}}';const m=class{constructor(a){i(this,a);this.childBlur=t(this,"childBlur",7);this.navItemClicked=t(this,"navItemClicked",7);this.isInitialRender=true;this.displayDefaultNavigationItem=(i,t,a,o,s,r,d)=>{const c=this.isTopNavChild||this.inTopNavSideMenu?"body":"label";const h=this.expandable&&e("div",{class:{svg:true},innerHTML:l});const m=this.el.querySelector('[slot="icon"]')&&e("div",{class:"icon"},e("slot",{name:"icon"}),n(this.el,"badge")&&e("slot",{name:"badge"}));if(i!==""){return e("a",{href:i,target:a,rel:o,hreflang:t,referrerPolicy:s,download:r!==false?r:null,class:"link",ref:i=>this.itemEl=i,part:"link"},m,e("ic-typography",{variant:c},d),e("div",{class:"chevron-container"},h),a==="_blank"&&e("span",{class:"open-in-new-icon",innerHTML:v}))}return e("div",{tabindex:"0",class:"link",ref:i=>this.itemEl=i},m,e("ic-typography",{variant:c},d),h)};this.topNavResizedHandler=({detail:i})=>{var t;const{size:e}=i;if(e!==this.deviceSize){this.deviceSize=e;this.inTopNavSideMenu=e<=(((t=this.parentEl)===null||t===void 0?void 0:t.customMobileBreakpoint)||s.L)}};this.sideNavExpandHandler=({detail:i})=>{const{sideNavExpanded:t,sideNavMobile:e}=i;this.sideNavExpanded=t;this.isSideNavMobile=e};this.handleBlur=({relatedTarget:i})=>{if(i===null||i.tagName!=="IC-NAVIGATION-ITEM"){this.childBlur.emit()}};this.handleClick=()=>{this.navItemClicked.emit()};this.generateTooltipLabel=()=>{if(this.label){return this.label}if(this.navigationSlot){return this.navigationSlot.textContent}if(this.el.children[0]){return this.el.children[0].textContent}return""};this.renderNavigationItemContent=()=>{if(this.label){return this.displayDefaultNavigationItem(this.href,this.hreflang,this.target,this.rel,this.referrerpolicy,this.download,this.label)}if(this.navigationSlot){return e("slot",{name:"navigation-item"})}return e("slot",null)};this.deviceSize=s.XL;this.focusStyle=r();this.inTopNavSideMenu=false;this.isSideNavMobile=false;this.isTopNavChild=false;this.navigationType=undefined;this.parentEl=undefined;this.sideNavExpanded=false;this.collapsedIconLabel=false;this.displayNavigationTooltip=false;this.download=false;this.expandable=false;this.href="";this.hreflang=undefined;this.label=undefined;this.rel=undefined;this.referrerpolicy=undefined;this.selected=false;this.target=undefined}disconnectedCallback(){if(this.navigationType==="side"){this.parentEl.removeEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.removeEventListener("topNavResized",this.topNavResizedHandler)}}componentWillLoad(){const{navType:i,parent:t}=c(this.el);this.navigationType=i;this.parentEl=t;this.deviceSize=d();if(this.navigationType==="side"){this.parentEl.addEventListener("sideNavExpanded",this.sideNavExpandHandler)}else if(this.navigationType==="top"){this.parentEl.addEventListener("topNavResized",this.topNavResizedHandler);if(this.el.parentElement.tagName==="IC-NAVIGATION-GROUP")this.isTopNavChild=true;if(this.deviceSize<=this.parentEl.customMobileBreakpoint)this.inTopNavSideMenu=true}this.navigationSlot=this.el.querySelector('[slot="navigation-item"]');if(this.navigationSlot){this.navigationSlot.ariaLabel=this.navigationSlot.textContent.trim()}}componentDidUpdate(){this.isInitialRender=false}themeChangeHandler({detail:i}){this.focusStyle=i.mode}async setFocus(){var i;(i=this.itemEl)===null||i===void 0?void 0:i.focus()}render(){const{inTopNavSideMenu:i,isTopNavChild:t,selected:o}=this;return e(a,{class:{["navigation-item"]:true,["navigation-item-top-nav"]:!i&&this.navigationType==="top",["navigation-item-top-nav-child-selected"]:t&&!i&&o,[this.focusStyle]:!i&&!t||this.navigationType==="side"&&t,["navigation-item-selected"]:!t&&o,["navigation-item-side-menu"]:i,["navigation-item-side-menu-selected"]:i&&o,["navigation-item-top-nav-child"]:t&&!i,["navigation-item-page-header"]:this.navigationType==="page-header",["with-transition"]:!this.isInitialRender,["navigation-item-side-nav"]:this.navigationType==="side",["navigation-item-side-nav-collapsed"]:(!this.sideNavExpanded||this.displayNavigationTooltip)&&this.navigationType==="side",["navigation-item-side-nav-collapsed-with-label"]:!this.sideNavExpanded&&this.navigationType==="side"&&this.collapsedIconLabel&&!this.isSideNavMobile,["expandable"]:this.expandable},onBlur:t&&!i?this.handleBlur:null,onClick:this.handleClick,"aria-current":o?"page":null,role:"listitem"},e("ic-tooltip",{label:this.generateTooltipLabel(),target:"navigation-item",placement:"right",class:{["tooltip-navigation-item"]:true,["tooltip-navigation-item-side-nav-collapsed"]:(!this.sideNavExpanded||this.displayNavigationTooltip)&&this.navigationType==="side",["tooltip-long-label-navigation-item-side-nav-expanded"]:this.el.hasAttribute("[display-navigation-tooltip = 'true']")}},this.renderNavigationItemContent()))}static get delegatesFocus(){return true}get el(){return o(this)}};m.style=h;export{m as ic_navigation_item};
-//# sourceMappingURL=p-936ab032.entry.js.map

package/dist/core/p-936ab032.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icNavigationItemCss","NavigationItem","this","isInitialRender","displayDefaultNavigationItem","href","hreflang","target","rel","referrerpolicy","download","label","variant","isTopNavChild","inTopNavSideMenu","ChevronIconComponent","expandable","h","class","svg","innerHTML","chevronIcon","IconComponent","el","querySelector","name","isSlotUsed","referrerPolicy","ref","itemEl","part","OpenInNew","tabindex","topNavResizedHandler","detail","size","deviceSize","_a","parentEl","customMobileBreakpoint","DEVICE_SIZES","L","sideNavExpandHandler","sideNavExpanded","sideNavMobile","isSideNavMobile","handleBlur","relatedTarget","tagName","childBlur","emit","handleClick","navItemClicked","generateTooltipLabel","navigationSlot","textContent","children","renderNavigationItemContent","XL","getThemeForegroundColor","disconnectedCallback","navigationType","removeEventListener","componentWillLoad","navType","parent","getNavItemParentDetails","getCurrentDeviceSize","addEventListener","parentElement","ariaLabel","trim","componentDidUpdate","themeChangeHandler","focusStyle","mode","setFocus","focus","render","selected","Host","displayNavigationTooltip","collapsedIconLabel","onBlur","onClick","role","placement","hasAttribute"],"sources":["src/components/ic-navigation-item/ic-navigation-item.css?tag=ic-navigation-item&encapsulation=shadow","src/components/ic-navigation-item/ic-navigation-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-navigation-item: z-index of navigation item\n */\n\n:host {\n  display: block;\n}\n\n:host(:focus-within) {\n  z-index: var(--ic-z-index-navigation-item);\n}\n\n/* chevron */\nsvg {\n  width: var(--ic-space-xl);\n  fill: var(--ic-theme-text);\n}\n\n.svg {\n  margin-left: auto;\n}\n\n.chevron-container svg,\n.chevron-container .svg {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.chevron-container {\n  flex-grow: 1;\n}\n\n:host(.expandable.navigation-item) .link,\n:host(.expandable.navigation-item) ::slotted(a) {\n  padding-right: 0;\n}\n\n:host(.navigation-item) .link,\n:host(.navigation-item) ::slotted(a) {\n  height: calc(100% - var(--ic-space-xxs));\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) var(--ic-space-xxs);\n  text-decoration: none;\n  transition: var(--ic-easing-transition-fast);\n  position: relative;\n  white-space: nowrap;\n}\n\n:host(.navigation-item) ::slotted(a) {\n  height: 100%;\n  font: var(--ic-font-label) !important;\n  letter-spacing: var(--ic-font-letter-spacing-0pt025) !important;\n  padding: 0 var(--ic-space-md) !important;\n}\n\n:host(.navigation-item-selected) .link::after,\n:host(.navigation-item-selected) ::slotted(a.active)::after,\n:host(.navigation-item-top-nav) ::slotted(a.active)::after {\n  content: \"\";\n  height: 0.25rem;\n  width: 100%;\n  position: absolute;\n  bottom: 0;\n  background-color: var(--ic-theme-text);\n}\n\n:host(.navigation-item-selected.navigation-item-page-header)\n  ::slotted(a.active)::after,\n:host(.navigation-item-selected.navigation-item-page-header) .link::after,\n:host(.navigation-item.navigation-item-page-header) ::slotted(a.active)::after,\n:host(.navigation-item-top-nav-child) ::slotted(a.active)::after {\n  content: none;\n}\n\n:host(.navigation-item-side-menu-selected) .link,\n:host(.navigation-item-side-menu) ::slotted(a.active),\n:host(.navigation-item-top-nav-child) ::slotted(a.active) {\n  box-shadow: none;\n}\n\n:host(.navigation-item) .link:hover:not(:focus) {\n  background-color: var(--ic-theme-hover);\n  cursor: pointer;\n}\n\n:host(\n    .navigation-item:not(\n        .navigation-item-page-header,\n        .navigation-item-side-menu\n      )\n  )\n  ::slotted(a:hover:not(:focus)) {\n  background-color: var(--ic-theme-hover) !important;\n}\n\n:host(\n    .navigation-item:not(\n        .navigation-item-top-nav-child,\n        .navigation-item-side-menu,\n        .navigation-item-top-nav-child-selected\n          .navigation-item-side-menu-selected\n      )\n  )\n  .focus-indicator:focus-within {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(.navigation-item) .link:focus,\n:host(.navigation-item) ::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.navigation-item-selected) .link:focus,\n:host(.navigation-item) ::slotted(a.active:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.navigation-item-selected.dark) .link:focus,\n:host(.navigation-item.dark) ::slotted(a.active:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.navigation-item) .link:active:not(:focus),\n:host(.navigation-item) ::slotted(a:active:not(:focus)) {\n  background-color: var(--ic-theme-active);\n}\n\n:host(.navigation-item-side-menu) .link,\n:host(.navigation-item-side-menu) ::slotted(a) {\n  min-height: 2.5rem;\n  height: auto;\n  width: 100%;\n  box-sizing: border-box;\n  color: var(--ic-color-primary-text);\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  text-decoration: none;\n  text-wrap: wrap;\n  white-space: normal;\n  transition: box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-fast);\n}\n\n:host(.navigation-item-side-menu) ::slotted(a) {\n  font: var(--ic-font-body) !important;\n  letter-spacing: var(--ic-font-letter-spacing-0pt005) !important;\n  transition: box-shadow var(--ic-easing-transition-fast),\n    background-color var(--ic-easing-transition-fast);\n}\n\n:host(.navigation-item-side-menu) .link:hover:not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host(.navigation-item-side-menu) ::slotted(a:hover:not(:focus)) {\n  background-color: var(--ic-action-dark-bg-hover) !important;\n}\n\n:host(.navigation-item-side-menu) .focus-indicator:focus-within {\n  box-shadow: none;\n}\n\n:host(.navigation-item-side-menu) .link:focus,\n:host(.navigation-item-side-menu) ::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus-inset) !important;\n  width: auto;\n  border-radius: var(--ic-border-radius-inset) !important;\n}\n\n:host(.navigation-item-side-menu-selected) .link,\n:host(.navigation-item-side-menu-selected) ::slotted(a) {\n  transition: box-shadow var(--ic-easing-transition-slow),\n    background-color var(--ic-easing-transition-slow);\n}\n\n:host(.navigation-item-side-menu-selected) .link:focus,\n:host(.navigation-item-side-menu) ::slotted(a.active:focus),\n:host(.navigation-item-top-nav-child) ::slotted(a.active:focus) {\n  margin-left: var(--ic-space-xs) !important;\n  padding-left: var(--ic-space-xs) !important;\n}\n\n:host(.navigation-item-top-nav-child) .link,\n:host(.navigation-item-top-nav-child) ::slotted(a) {\n  height: 2.5rem;\n  width: fit-content;\n  min-width: 9.063rem;\n  color: var(--ic-color-primary-text);\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: 0 var(--ic-space-md) !important;\n  text-decoration: none;\n  position: relative;\n  transition: box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-slow);\n}\n\n:host(.navigation-item-top-nav-child) ::slotted(a) {\n  font: var(--ic-font-body) !important;\n  letter-spacing: var(--ic-font-letter-spacing-0pt005) !important;\n}\n\n:host(.navigation-item-top-nav-child) .link:hover:not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover) !important;\n}\n\n:host(.navigation-item-top-nav-child) ::slotted(a:hover):not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover) !important;\n}\n\n:host(.navigation-item-top-nav-child) .link:focus,\n:host(.navigation-item-top-nav-child) ::slotted(a:focus) {\n  z-index: 1;\n  outline: var(--ic-hc-focus-outline);\n  border-radius: var(--ic-border-radius-inset);\n  box-shadow: var(--ic-border-focus-inset);\n  transition: border-radius 0s, box-shadow var(--ic-transition-duration-fast);\n}\n\n:host(.navigation-item-top-nav-child) ::slotted(a.active:focus) {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n}\n\n:host(.navigation-item-side-menu) .link:active:not(:focus) {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n:host(.navigation-item-top-nav-child) .link:active:not(:focus),\n:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus) {\n  outline: var(--ic-hc-focus-outline);\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus),\n:host(.navigation-item-side-menu) ::slotted(a:active):not(:focus) {\n  background-color: var(--ic-action-dark-bg-active) !important;\n}\n\n:host(.navigation-item-side-menu-selected) *,\n:host(.navigation-item-top-nav-child-selected) *,\n:host(.navigation-item-side-menu) ::slotted(a.active),\n:host(.navigation-item-top-nav-child) ::slotted(a.active) {\n  font-weight: 700 !important;\n}\n\n:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,\n:host(.navigation-item-top-nav-child-selected) .link::before,\n:host(.navigation-item-side-menu-selected) .link::before,\n:host(.navigation-item-side-menu) ::slotted(a.active)::before,\n:host(.navigation-item-side-menu-selected) .link:focus::before,\n:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  width: var(--ic-space-xs);\n  height: inherit;\n  min-height: 2.5rem;\n  background-color: var(--ic-action-default);\n  transition: left 0s;\n}\n\n:host(.navigation-item-top-nav-child-selected) .link::before,\n:host(.navigation-item-side-menu-selected) .link::before,\n:host(.navigation-item-side-menu-selected) .link:focus::before {\n  margin-top: 0.25rem;\n}\n\n:host(.navigation-item-top-nav-child-selected) .link:focus {\n  margin-left: var(--ic-space-xs);\n  margin-right: calc(-1 * var(--ic-space-xs));\n  padding-left: var(--ic-space-xs) !important;\n}\n\n:host(.navigation-item-top-nav-child-selected) .link:focus::before {\n  left: calc(-1 * var(--ic-space-xs));\n  z-index: 1;\n}\n\n:host(.navigation-item-side-menu-selected) .link::before,\n:host(.navigation-item-side-menu) ::slotted(a.active)::before,\n:host(.navigation-item-side-menu-selected) .link:focus::before,\n:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before {\n  z-index: 1;\n}\n\n:host(.navigation-item-side-menu-selected) .link:focus::before,\n:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,\n:host(.navigation-item-top-nav-child) ::slotted(a.active:focus)::before {\n  left: calc(-1 * var(--ic-space-xs));\n}\n\n:host(.navigation-item-side-menu-selected) .link::after {\n  display: none;\n}\n\n:host(.navigation-item-side-nav-collapsed) .link {\n  height: 100%;\n}\n\n:host(.navigation-item-side-nav-collapsed) ::slotted(svg),\n:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(svg) {\n  margin: auto;\n  pointer-events: none;\n}\n\n:host(.navigation-item-side-nav-collapsed) .icon,\n:host(.navigation-item-side-nav-collapsed-with-label) .icon,\n:host(.navigation-item-side-nav-collapsed-with-label) ic-typography {\n  align-items: center;\n  padding: 0;\n  margin: auto 0;\n  width: fit-content;\n  pointer-events: none;\n}\n\n:host(.navigation-item-side-nav-collapsed-with-label) ic-typography {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  width: 100%;\n  text-align: center;\n}\n\n:host(.navigation-item-side-nav-collapsed-with-label) .link,\n:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(a) {\n  display: flex;\n  flex-direction: column;\n  height: fit-content;\n  padding: var(--ic-space-xs) !important;\n  gap: var(--ic-space-xxs);\n}\n\n:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label)\n  .link,\n:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label)\n  ::slotted(a) {\n  height: auto !important;\n  gap: 0;\n  width: auto;\n  padding: var(--ic-space-xs) !important;\n}\n\n:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label)\n  ::slotted(a) {\n  display: block;\n  text-align: center;\n}\n\n:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label)\n  .link\n  ic-typography {\n  opacity: 1;\n  min-width: min-content;\n}\n\n:host(.navigation-item-side-nav-collapsed) svg,\n:host(.navigation-item-side-nav-collapsed-with-label) svg {\n  display: none;\n}\n\n::slotted(svg) {\n  fill: var(--ic-theme-text);\n  width: var(--ic-space-lg);\n  margin-left: var(--ic-space-md);\n}\n\n.icon {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-xxl);\n  margin-left: calc(-1 * var(--ic-space-md));\n  flex: 0 1 0%;\n  position: relative;\n}\n\n.icon > ::slotted(*) {\n  margin-left: var(--ic-space-md) !important;\n}\n\n:host(.navigation-item-side-nav-collapsed) .icon > ::slotted(*) {\n  margin: auto !important;\n}\n\n:host(.navigation-item-side-nav) .link,\n:host(.navigation-item-side-nav) ::slotted(a) {\n  height: var(--navigation-item-height, 56px);\n  min-height: var(--navigation-item-min-height);\n  width: var(--navigation-item-width, auto);\n  justify-content: var(--navigation-item-justify-content);\n  display: flex;\n  gap: var(--ic-space-xs);\n  box-sizing: border-box;\n  color: var(--navigation-item-child-color) !important;\n  text-decoration: none !important;\n  white-space: nowrap;\n  padding-top: var(--ic-space-md) !important;\n  padding-bottom: var(--ic-space-md) !important;\n  text-wrap: wrap;\n}\n\n:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,\n:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a) {\n  height: var(--navigation-item-child-height);\n  width: var(--navigation-group-width);\n  color: var(--navigation-item-child-color) !important;\n  display: flex;\n  gap: 0.625rem;\n  box-sizing: border-box;\n  min-width: 0;\n  transition: box-shadow var(--ic-easing-transition-fast);\n  text-decoration: none !important;\n  white-space: nowrap;\n}\n\n:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:focus,\n:host(.navigation-item-side-nav.navigation-item-top-nav-child)\n  ::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus-dark);\n}\n\n:host(.navigation-item-side-nav.navigation-item-side-menu) .link:active {\n  background-color: var(--navigation-item-child-active);\n}\n\n:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:active,\n:host(.navigation-item-side-nav.navigation-item-top-nav-child)\n  ::slotted(a:active) {\n  background-color: var(--navigation-item-child-active);\n}\n\n:host(.navigation-item-side-nav) a.link ic-typography,\n:host(.navigation-item-side-nav.navigation-item-top-nav-child)\n  a.link\n  ic-typography,\n:host(.navigation-item-side-nav) div.link ic-typography,\n:host(.navigation-item-side-nav.navigation-item-top-nav-child)\n  div.link\n  ic-typography,\n.navigation-item-side-nav-slotted-text {\n  opacity: var(--navigation-item-label-opacity);\n  transition: opacity var(--ic-easing-transition-slow);\n  white-space: wrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n\n:host(.navigation-item-side-nav.navigation-item-selected) .link,\n:host(.navigation-item-side-nav.navigation-item) ::slotted(a.active) {\n  box-shadow: inset 0.313rem 0 0 var(--ic-theme-text);\n}\n\n:host(.navigation-item-side-nav.navigation-item-selected) .link::before,\n:host(.navigation-item-side-nav) ::slotted(a.active)::before {\n  content: \"\";\n  display: block;\n  position: absolute;\n  inset: 0 0 0 0.313rem;\n  border-radius: 0.688rem !important;\n  transition: var(--ic-easing-transition-slow);\n}\n\n:host(.navigation-item-side-nav.navigation-item-selected) .link:focus::before,\n:host(.navigation-item-side-nav) ::slotted(a.active:focus)::before {\n  box-shadow: var(--ic-border-focus-inset);\n}\n\n:host(\n    :not(\n        .navigation-item-side-nav-collapsed\n      ).navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label\n  )\n  .link {\n  opacity: var(--navigation-item-label-opacity);\n  height: auto;\n}\n\n:host(\n    .navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label\n  )\n  .link,\n:host(\n    .navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label\n  )\n  ::slotted(a) {\n  min-width: var(--navigation-group-item-min-width);\n  padding: var(--ic-space-xs) !important;\n  height: auto;\n  gap: 0;\n}\n\n:host(\n    .navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label\n  )\n  ::slotted(a) {\n  display: block;\n}\n\n:host(.navigation-item-side-nav.navigation-item-selected) .link::after,\n:host(.navigation-item-side-nav) ::slotted(a.active)::after {\n  display: none;\n}\n\n:host(.navigation-item-side-nav.navigation-item) .link:focus,\n:host(.navigation-item-side-nav.navigation-item) ::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n  background-color: transparent;\n}\n\n:host(.navigation-item-side-nav.navigation-item-selected) .link:focus,\n:host(.navigation-item-side-nav) ::slotted(a.active:focus) {\n  margin: 0 auto;\n  box-shadow: inset 0.313rem 0 0 var(--ic-theme-text);\n  border-radius: 0;\n}\n\n:host(.navigation-item-side-nav.navigation-item) .link:hover:not(:focus) {\n  background-color: var(--ic-theme-hover) !important;\n}\n\n:host(.navigation-item-page-header).link,\n:host(.navigation-item-page-header) a,\n:host(.navigation-item-page-header) ::slotted(a) {\n  height: 2.5rem !important;\n  color: var(--ic-color-primary-text) !important;\n  transition: all var(--ic-easing-transition-fast) !important;\n  box-shadow: rgba(23 89 188 / 0%) !important;\n}\n\n:host(.navigation-item-page-header.navigation-item-selected) .link::after,\n:host(.navigation-item-page-header) ::slotted(a.active)::after {\n  content: \" \" !important;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: var(--ic-space-xxs);\n  background-color: var(--ic-action-default) !important;\n}\n\n:host(.navigation-item-page-header) .link:hover,\n:host(.navigation-item-page-header) ::slotted(.link:hover),\n:host(.navigation-item-page-header) ::slotted(a:hover),\n:host(.navigation-item-page-header) .link:hover:not(:focus) {\n  background-color: var(--ic-action-default-bg-hover) !important;\n  cursor: pointer;\n}\n\n:host(.navigation-item-page-header) .link:focus,\n:host(.navigation-item-page-header) ::slotted(a:focus) {\n  box-shadow: var(--ic-border-focus);\n}\n\n:host(.navigation-item-page-header) .link:active,\n:host(.navigation-item-page-header) ::slotted(a:active) {\n  background-color: var(--ic-action-default-bg-active) !important;\n}\n\n:host(.navigation-item-page-header.navigation-item-selected) .link:focus::after,\n:host(.navigation-item-page-header) ::slotted(a.active:focus)::after {\n  border-bottom-left-radius: var(--ic-border-radius);\n  border-bottom-right-radius: var(--ic-border-radius);\n}\n\n:host(.navigation-item-page-header.navigation-item-selected.with-transition)\n  .link,\n:host(.navigation-item-page-header.navigation-item-selected.with-transition)\n  ::slotted(a.active) {\n  transition: all var(--ic-easing-transition-fast),\n    border-color var(--ic-transition-duration-fast);\n}\n\n:host(.navigation-item-page-header) ::slotted(a.active)::before,\n:host(.navigation-item-page-header) ::slotted(a.active:focus)::before,\n:host(.navigation-item-page-header.navigation-item-selected)\n  .link:focus::before {\n  display: none;\n}\n\n.open-in-new-icon {\n  flex: 1;\n}\n\n.open-in-new-icon svg {\n  margin-top: var(--ic-space-xxs);\n  padding-left: var(--ic-space-xxs);\n}\n\n:host(.navigation-item-side-nav) .open-in-new-icon {\n  margin-left: calc(-1 * var(--ic-space-xs));\n}\n\n:host(.navigation-item-top-nav) .open-in-new-icon svg,\n:host(.navigation-item-page-header) .open-in-new-icon svg,\n:host(.navigation-item-side-nav) .open-in-new-icon svg {\n  height: 0.875rem;\n  width: 0.875rem;\n}\n\n:host(.navigation-item-side-menu) .open-in-new-icon svg,\n:host(.navigation-item-top-nav-child) .open-in-new-icon svg {\n  height: var(--ic-space-md);\n  width: var(--ic-space-md);\n}\n\n:host(.navigation-item-page-header) .open-in-new-icon svg,\n:host(.navigation-item-top-nav-child) .open-in-new-icon svg,\n:host(.navigation-item-side-menu) .open-in-new-icon svg {\n  fill: var(--ic-color-primary-text);\n}\n\n@media (forced-colors: active) {\n  .open-in-new-icon svg {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Method,\n  h,\n  Host,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\nimport {\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  getNavItemParentDetails,\n  isSlotUsed,\n} from \"../../utils/helpers\";\nimport { IcNavType, IcTheme } from \"../../utils/types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\nimport OpenInNew from \"../../assets/OpenInNew.svg\";\nimport { IcExpandedDetail } from \"../ic-side-navigation/ic-side-navigation.types\";\n\n/**\n * @part link - The `<a>` within ic-navigation-item\n * @slot badge - Badge component overlaying the top right of the icon.\n * @slot icon - Content will be displayed to the left of the label for expanded navigation items, and in replacement of the label for collapsed navigation items.\n */\n\n@Component({\n  tag: \"ic-navigation-item\",\n  styleUrl: \"ic-navigation-item.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class NavigationItem {\n  private navigationSlot: HTMLElement;\n  private isInitialRender: boolean = true;\n  private itemEl: HTMLElement;\n\n  @Element() el: HTMLIcNavigationItemElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() focusStyle = getThemeForegroundColor();\n  @State() inTopNavSideMenu: boolean = false;\n  @State() isSideNavMobile: boolean = false;\n  @State() isTopNavChild: boolean = false;\n  @State() navigationType: IcNavType | \"\";\n  @State() parentEl: HTMLElement;\n  @State() sideNavExpanded: boolean = false;\n\n  /**\n   * @internal If `true`, the icon and label will be displayed when side navigation is collapsed.\n   */\n  @Prop() collapsedIconLabel: boolean = false;\n\n  /**\n   * @internal If `true`, the navigation item will be displayed within a tooltip.\n   */\n  @Prop() displayNavigationTooltip: boolean = false;\n\n  /**\n   * If `true`, the user can save the linked URL instead of navigating to it.\n   */\n  @Prop() download?: string | boolean = false;\n\n  /**\n   *  @internal If `true`, the navigation item will be expandable.\n   */\n  @Prop() expandable: boolean = false;\n\n  /**\n   * The destination of the navigation item.\n   */\n  @Prop() href: string = \"\";\n\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n\n  /**\n   * The label of the navigation item.\n   */\n  @Prop() label: string;\n\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n\n  /**\n   *  If `true`, the navigation item will be set in a selected state.\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   *  The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n\n  /**\n   * @internal - Emitted when item loses focus.\n   */\n  @Event() childBlur: EventEmitter<void>;\n\n  /**\n   * @internal - Emitted when navigation item clicked.\n   */\n  @Event() navItemClicked: EventEmitter<void>;\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    const { navType, parent } = getNavItemParentDetails(this.el);\n    this.navigationType = navType;\n    this.parentEl = parent;\n    this.deviceSize = getCurrentDeviceSize();\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      if (this.el.parentElement.tagName === \"IC-NAVIGATION-GROUP\")\n        this.isTopNavChild = true;\n      if (\n        this.deviceSize <=\n        (this.parentEl as HTMLIcTopNavigationElement).customMobileBreakpoint\n      )\n        this.inTopNavSideMenu = true;\n    }\n\n    this.navigationSlot = this.el.querySelector('[slot=\"navigation-item\"]');\n    if (this.navigationSlot) {\n      this.navigationSlot.ariaLabel = this.navigationSlot.textContent.trim();\n    }\n  }\n\n  componentDidUpdate(): void {\n    this.isInitialRender = false;\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler({ detail }: CustomEvent<IcTheme>): void {\n    this.focusStyle = detail.mode;\n  }\n\n  /**\n   * Sets focus on the nav item.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.itemEl?.focus();\n  }\n\n  private displayDefaultNavigationItem = (\n    href: string,\n    hreflang: string,\n    target: string,\n    rel: string,\n    referrerpolicy: ReferrerPolicy,\n    download: string | boolean,\n    label: string\n  ): HTMLElement => {\n    const variant =\n      this.isTopNavChild || this.inTopNavSideMenu ? \"body\" : \"label\";\n    const ChevronIconComponent = this.expandable && (\n      <div class={{ svg: true }} innerHTML={chevronIcon}></div>\n    );\n    const IconComponent = this.el.querySelector('[slot=\"icon\"]') && (\n      <div class=\"icon\">\n        <slot name=\"icon\"></slot>\n        {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n      </div>\n    );\n\n    if (href !== \"\") {\n      return (\n        <a\n          href={href}\n          target={target}\n          rel={rel}\n          hreflang={hreflang}\n          referrerPolicy={referrerpolicy}\n          download={download !== false ? download : null}\n          class=\"link\"\n          ref={(el) => (this.itemEl = el)}\n          part=\"link\"\n        >\n          {IconComponent}\n\n          <ic-typography variant={variant}>{label}</ic-typography>\n          <div class=\"chevron-container\">{ChevronIconComponent}</div>\n          {target === \"_blank\" && (\n            <span class=\"open-in-new-icon\" innerHTML={OpenInNew} />\n          )}\n        </a>\n      );\n    }\n\n    return (\n      <div tabindex=\"0\" class=\"link\" ref={(el) => (this.itemEl = el)}>\n        {IconComponent}\n        <ic-typography variant={variant}>{label}</ic-typography>\n        {ChevronIconComponent}\n      </div>\n    );\n  };\n\n  private topNavResizedHandler = ({\n    detail,\n  }: CustomEvent<{ size: number }>): void => {\n    const { size } = detail;\n    if (size !== this.deviceSize) {\n      this.deviceSize = size;\n      this.inTopNavSideMenu =\n        size <=\n        ((this.parentEl as HTMLIcTopNavigationElement)\n          ?.customMobileBreakpoint || DEVICE_SIZES.L);\n    }\n  };\n\n  private sideNavExpandHandler = ({\n    detail,\n  }: CustomEvent<IcExpandedDetail>): void => {\n    const { sideNavExpanded, sideNavMobile } = detail;\n    this.sideNavExpanded = sideNavExpanded;\n    this.isSideNavMobile = sideNavMobile;\n  };\n\n  private handleBlur = ({ relatedTarget }: FocusEvent) => {\n    if (\n      relatedTarget === null ||\n      (relatedTarget as HTMLElement).tagName !== \"IC-NAVIGATION-ITEM\"\n    ) {\n      this.childBlur.emit();\n    }\n  };\n\n  private handleClick = () => {\n    this.navItemClicked.emit();\n  };\n\n  private generateTooltipLabel = () => {\n    if (this.label) {\n      return this.label;\n    }\n\n    if (this.navigationSlot) {\n      return this.navigationSlot.textContent;\n    }\n\n    if (this.el.children[0]) {\n      return this.el.children[0].textContent;\n    }\n\n    return \"\";\n  };\n\n  private renderNavigationItemContent = () => {\n    if (this.label) {\n      return this.displayDefaultNavigationItem(\n        this.href,\n        this.hreflang,\n        this.target,\n        this.rel,\n        this.referrerpolicy,\n        this.download,\n        this.label\n      );\n    }\n\n    if (this.navigationSlot) {\n      return <slot name=\"navigation-item\"></slot>;\n    }\n    return <slot></slot>;\n  };\n\n  render() {\n    const { inTopNavSideMenu, isTopNavChild, selected } = this;\n\n    return (\n      <Host\n        class={{\n          [\"navigation-item\"]: true,\n          [\"navigation-item-top-nav\"]:\n            !inTopNavSideMenu && this.navigationType === \"top\",\n          [\"navigation-item-top-nav-child-selected\"]:\n            isTopNavChild && !inTopNavSideMenu && selected,\n          [this.focusStyle]:\n            (!inTopNavSideMenu && !isTopNavChild) ||\n            (this.navigationType === \"side\" && isTopNavChild),\n          [\"navigation-item-selected\"]: !isTopNavChild && selected,\n          [\"navigation-item-side-menu\"]: inTopNavSideMenu,\n          [\"navigation-item-side-menu-selected\"]: inTopNavSideMenu && selected,\n          [\"navigation-item-top-nav-child\"]: isTopNavChild && !inTopNavSideMenu,\n          [\"navigation-item-page-header\"]:\n            this.navigationType === \"page-header\",\n          [\"with-transition\"]: !this.isInitialRender,\n          [\"navigation-item-side-nav\"]: this.navigationType === \"side\",\n          [\"navigation-item-side-nav-collapsed\"]:\n            (!this.sideNavExpanded || this.displayNavigationTooltip) &&\n            this.navigationType === \"side\",\n          [\"navigation-item-side-nav-collapsed-with-label\"]:\n            !this.sideNavExpanded &&\n            this.navigationType === \"side\" &&\n            this.collapsedIconLabel &&\n            !this.isSideNavMobile,\n          [\"expandable\"]: this.expandable,\n        }}\n        onBlur={isTopNavChild && !inTopNavSideMenu ? this.handleBlur : null}\n        onClick={this.handleClick}\n        aria-current={selected ? \"page\" : null}\n        role=\"listitem\"\n      >\n        {/* Tooltip enabled by applying navigation-item-side-nav-collapsed class to host */}\n        <ic-tooltip\n          label={this.generateTooltipLabel()}\n          target=\"navigation-item\"\n          placement=\"right\"\n          class={{\n            [\"tooltip-navigation-item\"]: true,\n            [\"tooltip-navigation-item-side-nav-collapsed\"]:\n              (!this.sideNavExpanded || this.displayNavigationTooltip) &&\n              this.navigationType === \"side\",\n            [\"tooltip-long-label-navigation-item-side-nav-expanded\"]:\n              this.el.hasAttribute(\"[display-navigation-tooltip = 'true']\"),\n          }}\n        >\n          {this.renderNavigationItemContent()}\n        </ic-tooltip>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,H as a,g as o}from"./p-6b5e91e2.js";import{k as n,a as s,s as r,t as l}from"./p-fef9e8c9.js";import"./p-26b7b18f.js";const c='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}.checkboxes-container{margin-bottom:calc(-1 * var(--ic-space-xxs))}:host(.small) .checkboxes-container{margin-bottom:calc(-1 * var(--ic-space-xxxs))}.screen-reader-only-text{position:absolute;left:-9999px;background-color:#fff;color:#000;text-transform:none}';const d=class{constructor(i){e(this,i);this.icChange=t(this,"icChange",7);this.disabled=false;this.helperText="";this.hideLabel=false;this.label=undefined;this.name=undefined;this.required=false;this.size="default";this.small=false;this.validationStatus="";this.validationText=""}labelNameHandler(e,t,i){Array.from(this.el.querySelectorAll("ic-checkbox")).forEach((a=>{if(i==="label")a.groupLabel=e;else if(a.name===t){a.name=e}}))}handleChange(e){if(e.target.tagName==="IC-TEXT-FIELD"){e.stopImmediatePropagation()}}componentWillLoad(){n(this.disabled,this.el)}componentDidLoad(){s([{prop:this.label,propName:"label"},{prop:this.name,propName:"name"}],"Checkbox Group")}selectHandler({target:e}){const t=Array.from(this.el.querySelectorAll("ic-checkbox")).filter((({checked:e,disabled:t})=>e&&!t));this.icChange.emit({value:t.map((({value:e})=>e)),checkedOptions:t.map((e=>{var t;return{checkbox:e,textFieldValue:(t=e.querySelector("ic-text-field"))===null||t===void 0?void 0:t.value}})),selectedOption:e})}render(){const{disabled:e,helperText:t,hideLabel:o,label:n,name:s,required:c,size:d,small:p,validationStatus:b,validationText:m}=this;const u=r(s,t!=="",b!=="");return i(a,{class:{["small"]:p,[`${d}`]:true}},(b==="error"||c||o)&&i("span",{id:"screenReaderOnlyText",class:"screen-reader-only-text","aria-hidden":"true"},n," ",b==="error"?"invalid data ":null," ",c?"required":null),i("fieldset",{id:s,"aria-labelledby":`${b==="error"||c||o?"screenReaderOnlyText":""} ${u}`.trim(),disabled:e},!o&&i("legend",null,i("ic-input-label",{class:{[`${b}`]:true},label:n,helperText:t,required:c,disabled:e,for:s})),i("div",{class:"checkboxes-container"},i("slot",null))),l(b,e)&&i("ic-input-validation",{for:s,ariaLiveMode:"polite",status:b,message:m}))}get el(){return o(this)}static get watchers(){return{label:["labelNameHandler"],name:["labelNameHandler"]}}};d.style=c;export{d as ic_checkbox_group};
-//# sourceMappingURL=p-96505636.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["icCheckboxGroupCss","CheckboxGroup","labelNameHandler","newValue","oldValue","propName","Array","from","this","el","querySelectorAll","forEach","checkbox","groupLabel","name","handleChange","ev","target","tagName","stopImmediatePropagation","componentWillLoad","removeDisabledFalse","disabled","componentDidLoad","onComponentRequiredPropUndefined","prop","label","selectHandler","checkedOptions","filter","checked","icChange","emit","value","map","opt","textFieldValue","_a","querySelector","selectedOption","render","helperText","hideLabel","required","size","small","validationStatus","validationText","describedBy","getInputDescribedByText","h","Host","class","id","trim","for","hasValidationStatus","ariaLiveMode","status","message"],"sources":["src/components/ic-checkbox-group/ic-checkbox-group.css?tag=ic-checkbox-group&encapsulation=shadow","src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\nic-input-label.error {\n  color: var(--ic-status-error);\n}\n\nic-input-label ic-typography {\n  margin-bottom: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-label ic-typography {\n  margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-validation {\n  margin-top: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-validation {\n  margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.checkboxes-container {\n  margin-bottom: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.small) .checkboxes-container {\n  margin-bottom: calc(-1 * var(--ic-space-xxxs));\n}\n\n.screen-reader-only-text {\n  position: absolute;\n  left: -9999px;\n  background-color: #fff;\n  color: #000;\n  text-transform: none;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Listen,\n  Element,\n  Event,\n  EventEmitter,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  getInputDescribedByText,\n  hasValidationStatus,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty, IcSizes } from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n  tag: \"ic-checkbox-group\",\n  styleUrl: \"ic-checkbox-group.css\",\n  shadow: true,\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class CheckboxGroup {\n  @Element() el: HTMLIcCheckboxGroupElement;\n\n  /**\n   * If `true`, the checkbox group will be set to the disabled state.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText: string = \"\";\n\n  /**\n   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel: boolean = false;\n\n  /**\n   * The label for the checkbox group to be displayed.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The name for the checkbox group to differentiate from other groups.\n   */\n  @Prop() name!: string;\n\n  @Watch(\"label\")\n  @Watch(\"name\")\n  labelNameHandler(\n    newValue: string,\n    oldValue: string,\n    propName: \"label\" | \"name\"\n  ): void {\n    Array.from(this.el.querySelectorAll(\"ic-checkbox\")).forEach((checkbox) => {\n      if (propName === \"label\") checkbox.groupLabel = newValue;\n      else if (checkbox.name === oldValue) {\n        // If the checkbox name has been set by the parent, then override it\n        checkbox.name = newValue;\n      }\n    });\n  }\n\n  /**\n   * If `true`, the checkbox group will require a value.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * The size of the checkboxes to be displayed. This does not affect the font size of the label.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n   */\n  @Prop() small: boolean = false;\n\n  /**\n   * The validation status - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The validation text - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationText: string = \"\";\n\n  /**\n   * Emitted when a checkbox is checked.\n   */\n  @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n  @Listen(\"icChange\")\n  handleChange(ev: CustomEvent): void {\n    //don't pass on the event if it has come from slotted text field\n    //otherwise any icChange handler bound to the checkbox group will also run\n    if ((ev.target as HTMLElement).tagName === \"IC-TEXT-FIELD\") {\n      ev.stopImmediatePropagation();\n    }\n  }\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.label, propName: \"label\" },\n        { prop: this.name, propName: \"name\" },\n      ],\n      \"Checkbox Group\"\n    );\n  }\n\n  @Listen(\"icCheck\")\n  selectHandler({ target }: CustomEvent): void {\n    const checkedOptions = Array.from(\n      this.el.querySelectorAll(\"ic-checkbox\")\n    ).filter(({ checked, disabled }) => checked && !disabled);\n    this.icChange.emit({\n      value: checkedOptions.map(({ value }) => value),\n      checkedOptions: checkedOptions.map((opt) => ({\n        checkbox: opt,\n        textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n      })),\n      selectedOption: target as HTMLIcCheckboxElement,\n    });\n  }\n\n  render() {\n    const {\n      disabled,\n      helperText,\n      hideLabel,\n      label,\n      name,\n      required,\n      size,\n      small,\n      validationStatus,\n      validationText,\n    } = this;\n\n    const describedBy = getInputDescribedByText(\n      name,\n      helperText !== \"\",\n      validationStatus !== \"\"\n    );\n\n    return (\n      <Host class={{ [\"small\"]: small, [`${size}`]: true }}>\n        {(validationStatus === \"error\" || required || hideLabel) && (\n          <span\n            id=\"screenReaderOnlyText\"\n            class=\"screen-reader-only-text\"\n            aria-hidden=\"true\"\n          >\n            {label} {validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n            {required ? \"required\" : null}\n          </span>\n        )}\n        <fieldset\n          id={name}\n          aria-labelledby={`${\n            validationStatus === \"error\" || required || hideLabel\n              ? \"screenReaderOnlyText\"\n              : \"\"\n          } ${describedBy}`.trim()}\n          disabled={disabled}\n        >\n          {!hideLabel && (\n            <legend>\n              <ic-input-label\n                class={{ [`${validationStatus}`]: true }}\n                label={label}\n                helperText={helperText}\n                required={required}\n                disabled={disabled}\n                for={name}\n              ></ic-input-label>\n            </legend>\n          )}\n          <div class=\"checkboxes-container\">\n            <slot></slot>\n          </div>\n        </fieldset>\n        {hasValidationStatus(validationStatus, disabled) && (\n          <ic-input-validation\n            for={name}\n            ariaLiveMode=\"polite\"\n            status={validationStatus}\n            message={validationText}\n          ></ic-input-validation>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"iJAAA,MAAMA,EAAqB,47F,MC0BdC,EAAa,M,0EAMI,M,gBAKC,G,eAKA,M,uDA+BD,M,UAKH,U,WAKA,M,sBAK8B,G,oBAKtB,E,CArCjC,gBAAAC,CACEC,EACAC,EACAC,GAEAC,MAAMC,KAAKC,KAAKC,GAAGC,iBAAiB,gBAAgBC,SAASC,IAC3D,GAAIP,IAAa,QAASO,EAASC,WAAaV,OAC3C,GAAIS,EAASE,OAASV,EAAU,CAEnCQ,EAASE,KAAOX,C,KAoCtB,YAAAY,CAAaC,GAGX,GAAKA,EAAGC,OAAuBC,UAAY,gBAAiB,CAC1DF,EAAGG,0B,EAIP,iBAAAC,GACEC,EAAoBb,KAAKc,SAAUd,KAAKC,G,CAG1C,gBAAAc,GACEC,EACE,CACE,CAAEC,KAAMjB,KAAKkB,MAAOrB,SAAU,SAC9B,CAAEoB,KAAMjB,KAAKM,KAAMT,SAAU,SAE/B,iB,CAKJ,aAAAsB,EAAcV,OAAEA,IACd,MAAMW,EAAiBtB,MAAMC,KAC3BC,KAAKC,GAAGC,iBAAiB,gBACzBmB,QAAO,EAAGC,UAASR,cAAeQ,IAAYR,IAChDd,KAAKuB,SAASC,KAAK,CACjBC,MAAOL,EAAeM,KAAI,EAAGD,WAAYA,IACzCL,eAAgBA,EAAeM,KAAKC,I,MAAQ,OAC1CvB,SAAUuB,EACVC,gBAAgBC,EAAAF,EAAIG,cAAc,oBAAgB,MAAAD,SAAA,SAAAA,EAAEJ,MACrD,IACDM,eAAgBtB,G,CAIpB,MAAAuB,GACE,MAAMlB,SACJA,EAAQmB,WACRA,EAAUC,UACVA,EAAShB,MACTA,EAAKZ,KACLA,EAAI6B,SACJA,EAAQC,KACRA,EAAIC,MACJA,EAAKC,iBACLA,EAAgBC,eAChBA,GACEvC,KAEJ,MAAMwC,EAAcC,EAClBnC,EACA2B,IAAe,GACfK,IAAqB,IAGvB,OACEI,EAACC,EAAI,CAACC,MAAO,CAAE,CAAC,SAAUP,EAAO,CAAC,GAAGD,KAAS,QAC1CE,IAAqB,SAAWH,GAAYD,IAC5CQ,EAAA,QACEG,GAAG,uBACHD,MAAM,0BAAyB,cACnB,QAEX1B,EAAK,IAAGoB,IAAqB,QAAU,gBAAkB,KAAM,IAC/DH,EAAW,WAAa,MAG7BO,EAAA,YACEG,GAAIvC,EAAI,kBACS,GACfgC,IAAqB,SAAWH,GAAYD,EACxC,uBACA,MACFM,IAAcM,OAClBhC,SAAUA,IAERoB,GACAQ,EAAA,cACEA,EAAA,kBACEE,MAAO,CAAE,CAAC,GAAGN,KAAqB,MAClCpB,MAAOA,EACPe,WAAYA,EACZE,SAAUA,EACVrB,SAAUA,EACViC,IAAKzC,KAIXoC,EAAA,OAAKE,MAAM,wBACTF,EAAA,eAGHM,EAAoBV,EAAkBxB,IACrC4B,EAAA,uBACEK,IAAKzC,EACL2C,aAAa,SACbC,OAAQZ,EACRa,QAASZ,I"}

package/dist/core/p-9c9ba3cd.entry.js

@@ -1,2 +0,0 @@
-import{r as o,c as t,h as r,H as e}from"./p-6b5e91e2.js";import{J as s,K as i,W as c,c as a,b as h}from"./p-fef9e8c9.js";import"./p-26b7b18f.js";const n=class{constructor(r){o(this,r);this.themeChange=t(this,"themeChange",7);this.checkThemeColorContrast=()=>{if(s()<i&&s()>c){console.warn(`The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`)}};this.setThemeColor=()=>{const o=a(this.color);if(o){const{r:t,g:r,b:e,a:s}=o;const{style:i}=document.documentElement;i.setProperty("--ic-theme-primary-r",`${t}`);i.setProperty("--ic-theme-primary-g",`${r}`);i.setProperty("--ic-theme-primary-b",`${e}`);i.setProperty("--ic-theme-primary-a",`${s}`);this.checkThemeColorContrast();this.themeChange.emit({mode:h(),color:o})}};this.color=null}watchColorPropHandler(){this.setThemeColor()}componentWillLoad(){this.setThemeColor()}render(){return r(e,null)}static get watchers(){return{color:["watchColorPropHandler"]}}};export{n as ic_theme};
-//# sourceMappingURL=p-9c9ba3cd.entry.js.map

package/dist/core/p-9c9ba3cd.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Theme","this","checkThemeColorContrast","getThemeColorBrightness","BLACK_MIN_COLOR_BRIGHTNESS","WHITE_MAX_COLOR_BRIGHTNESS","console","warn","setThemeColor","colorRGBA","convertToRGBA","color","r","g","b","a","style","document","documentElement","setProperty","themeChange","emit","mode","getThemeForegroundColor","watchColorPropHandler","componentWillLoad","render","h","Host"],"sources":["src/components/ic-theme/ic-theme.tsx"],"sourcesContent":["import {\n  Component,\n  Host,\n  Event,\n  EventEmitter,\n  h,\n  Watch,\n  Prop,\n} from \"@stencil/core\";\n\nimport { IcColor, IcTheme } from \"../../utils/types\";\nimport { convertToRGBA, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { getThemeColorBrightness } from \"../../utils/helpers\";\nimport {\n  BLACK_MIN_COLOR_BRIGHTNESS,\n  WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../utils/constants\";\n\n@Component({\n  tag: \"ic-theme\",\n  shadow: true,\n})\nexport class Theme {\n  /**\n   * The theme colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n   */\n  @Prop() color?: IcColor = null;\n\n  @Watch(\"color\")\n  watchColorPropHandler(): void {\n    this.setThemeColor();\n  }\n\n  /**\n   * @internal Emitted when the theme is changed.\n   */\n  @Event() themeChange: EventEmitter<IcTheme>;\n\n  componentWillLoad(): void {\n    this.setThemeColor();\n  }\n\n  private checkThemeColorContrast = (): void => {\n    if (\n      getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n      getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS\n    ) {\n      console.warn(\n        `The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`\n      );\n    }\n  };\n\n  private setThemeColor = () => {\n    const colorRGBA = convertToRGBA(this.color);\n\n    if (colorRGBA) {\n      const { r, g, b, a } = colorRGBA;\n      const { style } = document.documentElement;\n      style.setProperty(\"--ic-theme-primary-r\", `${r}`);\n      style.setProperty(\"--ic-theme-primary-g\", `${g}`);\n      style.setProperty(\"--ic-theme-primary-b\", `${b}`);\n      style.setProperty(\"--ic-theme-primary-a\", `${a}`);\n\n      this.checkThemeColorContrast();\n\n      this.themeChange.emit({\n        mode: getThemeForegroundColor(),\n        color: colorRGBA,\n      });\n    }\n  };\n\n  render() {\n    return <Host></Host>;\n  }\n}\n"],"mappings":"uJAsBaA,EAAK,M,kEAoBRC,KAAAC,wBAA0B,KAChC,GACEC,IAA4BC,GAC5BD,IAA4BE,EAC5B,CACAC,QAAQC,KACN,4T,GAKEN,KAAAO,cAAgB,KACtB,MAAMC,EAAYC,EAAcT,KAAKU,OAErC,GAAIF,EAAW,CACb,MAAMG,EAAEA,EAACC,EAAEA,EAACC,EAAEA,EAACC,EAAEA,GAAMN,EACvB,MAAMO,MAAEA,GAAUC,SAASC,gBAC3BF,EAAMG,YAAY,uBAAwB,GAAGP,KAC7CI,EAAMG,YAAY,uBAAwB,GAAGN,KAC7CG,EAAMG,YAAY,uBAAwB,GAAGL,KAC7CE,EAAMG,YAAY,uBAAwB,GAAGJ,KAE7Cd,KAAKC,0BAELD,KAAKmB,YAAYC,KAAK,CACpBC,KAAMC,IACNZ,MAAOF,G,cA1Ca,I,CAG1B,qBAAAe,GACEvB,KAAKO,e,CAQP,iBAAAiB,GACExB,KAAKO,e,CAkCP,MAAAkB,GACE,OAAOC,EAACC,EAAI,K"}

package/dist/core/p-9e15d0e1.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,f as i,h as a,H as s,g as r}from"./p-6b5e91e2.js";import{c as n}from"./p-f074ef5b.js";import{j as o,i as l,V as c}from"./p-fef9e8c9.js";import{I as d}from"./p-26b7b18f.js";const u='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}.container{min-height:3.5rem;border-radius:var(--ic-border-radius);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-status-unknown-light)}.container-info{background-color:var(--ic-status-info-light)}.container-warning{background-color:var(--ic-status-warning-light)}.container-error{background-color:var(--ic-status-error-light)}.container-success{background-color:var(--ic-status-success-light)}.alert-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}.divider-neutral{background-color:var(--ic-status-unknown)}.divider-info{background-color:var(--ic-status-info)}.divider-warning{background-color:var(--ic-status-warning)}.divider-error{background-color:var(--ic-status-error)}.divider-success{background-color:var(--ic-status-success)}.alert-icon{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}.icon-placeholder{margin-left:var(--ic-space-xs)}.alert-icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}.icon-neutral>svg,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block;fill:var(--ic-status-unknown)}:host([variant="info"]) .alert-icon svg{fill:var(--ic-status-info)}:host([variant="warning"]) .alert-icon svg{fill:var(--ic-status-warning)}:host([variant="error"]) .alert-icon svg{fill:var(--ic-status-error)}:host([variant="success"]) .alert-icon svg{fill:var(--ic-status-success)}.alert-content{display:flex;align-items:center;margin-left:0.625rem;width:100%}.alert-message{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1}.alert-message-title-above{display:inline}.alert-title{margin-right:var(--ic-space-xs)}.alert-title-above{white-space:normal}.alert-action-container{margin-right:var(--ic-space-xs);display:flex;align-items:center}.dismiss-icon{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}.dismiss-icon:hover{cursor:pointer}@media (max-width: 628px){.alert-content{display:flex;flex-direction:column;align-items:flex-start}.alert-message{display:flex;flex-direction:column;align-items:flex-start}.alert-title{white-space:normal}.alert-action-container{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){.container{border:var(--ic-hc-border)}}';const p=class{constructor(a){e(this,a);this.dismiss=t(this,"dismiss",7);this.icDismiss=t(this,"icDismiss",7);this.hostMutationObserver=null;this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.hostMutationCallback=e=>{if(e.some((({type:e,addedNodes:t,removedNodes:i})=>e==="childList"?o(t,i,"action"):false))){i(this)}};this.alertTitleWrap=false;this.visible=true;this.announced=true;this.dismissible=false;this.heading="";this.message=undefined;this.titleAbove=false;this.variant="neutral";this.showDefaultIcon=true}disconnectedCallback(){var e;(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentDidLoad(){this.alertTitleShouldWrap();this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{childList:true})}handleClick(){this.visible=!this.visible}alertTitleShouldWrap(){var e;const t=(e=this.el.shadowRoot.querySelector(".alert-title"))===null||e===void 0?void 0:e.clientHeight;if(t>24)this.alertTitleWrap=true}render(){const{variant:e,heading:t,message:i,titleAbove:r,dismissible:o,announced:u,visible:p,showDefaultIcon:m}=this;return p&&a(s,{role:u?"alert":null,class:{[d.Dark]:true}},a("div",{class:{["container"]:true,[`container-${e}`]:true}},a("div",{class:"alert-icon-container"},a("div",{class:{["divider"]:true,[`divider-${e}`]:true}}),e==="neutral"?l(this.el,"neutral-icon")?a("div",{class:"alert-icon svg-container icon-neutral"},a("slot",{name:"neutral-icon"})):m?a("span",{class:{["alert-icon"]:true,["svg-container"]:true,[`icon-${e}`]:true},innerHTML:c[e].icon}):a("div",{class:"icon-placeholder"}):a("span",{class:{["alert-icon"]:true,["svg-container"]:true,[`icon-${e}`]:true},innerHTML:c[e].icon})),a("div",{class:"alert-content"},a("div",{class:{["alert-message"]:true,["alert-message-title-above"]:r||this.alertTitleWrap}},t&&a("ic-typography",{class:{["alert-title"]:true,["alert-title-above"]:r||this.alertTitleWrap},variant:"subtitle-large"},a("p",null,t)),a("slot",{name:"message"},a("ic-typography",{variant:"body"},i))),l(this.el,"action")&&a("div",{class:"alert-action-container"},a("slot",{name:"action"}))),a("div",{class:"dismiss-icon-container"},o&&a("ic-button",{class:{["svg-container"]:true,["dismiss-icon"]:true},innerHTML:n,onClick:this.dismissAction,variant:"icon",appearance:d.Dark,title:"dismiss"}))))}get el(){return r(this)}};p.style=u;export{p as ic_alert};
-//# sourceMappingURL=p-9e15d0e1.entry.js.map

package/dist/core/p-9e15d0e1.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icAlertCss","Alert","this","hostMutationObserver","dismissAction","dismiss","emit","icDismiss","hostMutationCallback","mutationList","some","type","addedNodes","removedNodes","checkSlotInChildMutations","forceUpdate","disconnectedCallback","_a","disconnect","componentDidLoad","alertTitleShouldWrap","MutationObserver","observe","el","childList","handleClick","visible","titleHeight","shadowRoot","querySelector","clientHeight","alertTitleWrap","render","variant","heading","message","titleAbove","dismissible","announced","showDefaultIcon","h","Host","role","class","IcThemeForegroundEnum","Dark","isSlotUsed","name","innerHTML","VARIANT_ICONS","icon","closeIcon","onClick","appearance","title"],"sources":["src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\n.container {\n  min-height: 3.5rem;\n  border-radius: var(--ic-border-radius);\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.container-neutral {\n  background-color: var(--ic-status-unknown-light);\n}\n\n.container-info {\n  background-color: var(--ic-status-info-light);\n}\n\n.container-warning {\n  background-color: var(--ic-status-warning-light);\n}\n\n.container-error {\n  background-color: var(--ic-status-error-light);\n}\n\n.container-success {\n  background-color: var(--ic-status-success-light);\n}\n\n.alert-icon-container {\n  height: 100%;\n  display: flex;\n  align-items: center;\n}\n\n.divider {\n  height: 100%;\n  width: var(--ic-space-xs);\n  border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n  position: absolute;\n}\n\n.divider-neutral {\n  background-color: var(--ic-status-unknown);\n}\n\n.divider-info {\n  background-color: var(--ic-status-info);\n}\n\n.divider-warning {\n  background-color: var(--ic-status-warning);\n}\n\n.divider-error {\n  background-color: var(--ic-status-error);\n}\n\n.divider-success {\n  background-color: var(--ic-status-success);\n}\n\n.alert-icon {\n  height: var(--ic-space-lg);\n  width: 1.375rem;\n  margin-left: 1.125rem;\n}\n\n.icon-placeholder {\n  margin-left: var(--ic-space-xs);\n}\n\n.alert-icon > svg {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  display: inline-block;\n}\n\n.icon-neutral > svg,\n::slotted(svg) {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  display: inline-block;\n  fill: var(--ic-status-unknown);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n  fill: var(--ic-status-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n  fill: var(--ic-status-warning);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n  fill: var(--ic-status-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n  fill: var(--ic-status-success);\n}\n\n.alert-content {\n  display: flex;\n  align-items: center;\n  margin-left: 0.625rem;\n  width: 100%;\n}\n\n.alert-message {\n  display: flex;\n  align-items: center;\n  padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n  flex: 1;\n}\n\n.alert-message-title-above {\n  display: inline;\n}\n\n.alert-title {\n  margin-right: var(--ic-space-xs);\n}\n\n.alert-title-above {\n  white-space: normal;\n}\n\n.alert-action-container {\n  margin-right: var(--ic-space-xs);\n  display: flex;\n  align-items: center;\n}\n\n.dismiss-icon {\n  margin-right: var(--ic-space-xxxs);\n  margin-left: -0.375rem;\n  padding: 0.375rem;\n  border: none;\n  border-radius: 50%;\n  background-color: inherit;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.dismiss-icon:hover {\n  cursor: pointer;\n}\n\n@media (max-width: 628px) {\n  .alert-content {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-message {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-title {\n    white-space: normal;\n  }\n\n  .alert-action-container {\n    margin-bottom: var(--ic-space-xs);\n  }\n}\n\n@media (forced-colors: active) {\n  .container {\n    border: var(--ic-hc-border);\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  State,\n  Listen,\n  Prop,\n  h,\n  forceUpdate,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { isSlotUsed, checkSlotInChildMutations } from \"../../utils/helpers\";\nimport { IcThemeForegroundEnum, IcStatusVariants } from \"../../utils/types\";\nimport { VARIANT_ICONS } from \"../../utils/constants\";\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the right of the message.\n * @slot neutral-icon - A custom neutral icon is placed to the left of the title. This will override the default icon if used.\n */\n@Component({\n  tag: \"ic-alert\",\n  styleUrl: \"ic-alert.css\",\n  shadow: true,\n})\nexport class Alert {\n  private hostMutationObserver: MutationObserver = null;\n\n  @Element() el: HTMLIcAlertElement;\n\n  @State() alertTitleWrap: boolean = false;\n  @State() visible: boolean = true;\n\n  /**\n   * If `true`, the alert will have the 'alert' ARIA role and will be announced to screen readers.\n   */\n  @Prop() announced?: boolean = true;\n\n  /**\n   * If `true`, the alert will have a close icon at the end to dismiss it.\n   */\n  @Prop() dismissible?: boolean = false;\n\n  /**\n   * The optional title to display at the start of the alert.\n   */\n  @Prop() heading?: string = \"\";\n\n  /**\n   * The main body message of the alert.\n   */\n  @Prop() message?: string;\n\n  /**\n   * If `true`, the title and message will appear above and below instead of inline.\n   */\n  @Prop() titleAbove?: boolean = false;\n\n  /**\n   * The variant of the alert which will be rendered.\n   */\n  @Prop() variant?: IcStatusVariants = \"neutral\";\n\n  /**\n   * If `true`, the default icon for the neutral variant will be appear on the left of the alert.\n   */\n  @Prop() showDefaultIcon: boolean = true;\n\n  /**\n   * @deprecated This event should not be used anymore. Use icDismiss instead.\n   */\n  @Event() dismiss: EventEmitter<void>;\n\n  /**\n   * Is emitted when the user dismisses the alert.\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentDidLoad(): void {\n    this.alertTitleShouldWrap();\n\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, {\n      childList: true,\n    });\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleClick(): void {\n    this.visible = !this.visible;\n  }\n\n  private dismissAction = (): void => {\n    this.dismiss.emit();\n    this.icDismiss.emit();\n  };\n\n  private alertTitleShouldWrap() {\n    const titleHeight =\n      this.el.shadowRoot.querySelector(\".alert-title\")?.clientHeight;\n    if (titleHeight > 24) this.alertTitleWrap = true;\n  }\n\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    if (\n      mutationList.some(({ type, addedNodes, removedNodes }) =>\n        type === \"childList\"\n          ? checkSlotInChildMutations(addedNodes, removedNodes, \"action\")\n          : false\n      )\n    ) {\n      forceUpdate(this);\n    }\n  };\n\n  render() {\n    const {\n      variant,\n      heading,\n      message,\n      titleAbove,\n      dismissible,\n      announced,\n      visible,\n      showDefaultIcon,\n    } = this;\n\n    return (\n      visible && (\n        <Host\n          role={announced ? \"alert\" : null}\n          class={{\n            [IcThemeForegroundEnum.Dark]: true,\n          }}\n        >\n          <div\n            class={{\n              [\"container\"]: true,\n              [`container-${variant}`]: true,\n            }}\n          >\n            <div class=\"alert-icon-container\">\n              <div\n                class={{\n                  [\"divider\"]: true,\n                  [`divider-${variant}`]: true,\n                }}\n              ></div>\n              {variant === \"neutral\" ? (\n                isSlotUsed(this.el, \"neutral-icon\") ? (\n                  <div class=\"alert-icon svg-container icon-neutral\">\n                    <slot name=\"neutral-icon\"></slot>\n                  </div>\n                ) : showDefaultIcon ? (\n                  <span\n                    class={{\n                      [\"alert-icon\"]: true,\n                      [\"svg-container\"]: true,\n                      [`icon-${variant}`]: true,\n                    }}\n                    innerHTML={VARIANT_ICONS[variant].icon}\n                  ></span>\n                ) : (\n                  <div class=\"icon-placeholder\"></div>\n                )\n              ) : (\n                <span\n                  class={{\n                    [\"alert-icon\"]: true,\n                    [\"svg-container\"]: true,\n                    [`icon-${variant}`]: true,\n                  }}\n                  innerHTML={VARIANT_ICONS[variant].icon}\n                ></span>\n              )}\n            </div>\n            <div class=\"alert-content\">\n              <div\n                class={{\n                  [\"alert-message\"]: true,\n                  [\"alert-message-title-above\"]:\n                    titleAbove || this.alertTitleWrap,\n                }}\n              >\n                {heading && (\n                  <ic-typography\n                    class={{\n                      [\"alert-title\"]: true,\n                      [\"alert-title-above\"]: titleAbove || this.alertTitleWrap,\n                    }}\n                    variant=\"subtitle-large\"\n                  >\n                    <p>{heading}</p>\n                  </ic-typography>\n                )}\n                <slot name=\"message\">\n                  <ic-typography variant=\"body\">{message}</ic-typography>\n                </slot>\n              </div>\n              {isSlotUsed(this.el, \"action\") && (\n                <div class=\"alert-action-container\">\n                  <slot name=\"action\" />\n                </div>\n              )}\n            </div>\n            <div class=\"dismiss-icon-container\">\n              {dismissible && (\n                <ic-button\n                  class={{\n                    [\"svg-container\"]: true,\n                    [\"dismiss-icon\"]: true,\n                  }}\n                  innerHTML={closeIcon}\n                  onClick={this.dismissAction}\n                  variant=\"icon\"\n                  appearance={IcThemeForegroundEnum.Dark}\n                  title=\"dismiss\"\n                ></ic-button>\n              )}\n            </div>\n          </div>\n        </Host>\n      )\n    );\n  }\n}\n"],"mappings":"iMAAA,MAAMA,EAAa,k1J,MC2BNC,EAAK,M,+FACRC,KAAAC,qBAAyC,KAsEzCD,KAAAE,cAAgB,KACtBF,KAAKG,QAAQC,OACbJ,KAAKK,UAAUD,MAAM,EASfJ,KAAAM,qBAAwBC,IAC9B,GACEA,EAAaC,MAAK,EAAGC,OAAMC,aAAYC,kBACrCF,IAAS,YACLG,EAA0BF,EAAYC,EAAc,UACpD,QAEN,CACAE,EAAYb,K,uBArFmB,M,aACP,K,eAKE,K,iBAKE,M,aAKL,G,uCAUI,M,aAKM,U,qBAKF,I,CAYnC,oBAAAc,G,OACEC,EAAAf,KAAKC,wBAAoB,MAAAc,SAAA,SAAAA,EAAEC,Y,CAG7B,gBAAAC,GACEjB,KAAKkB,uBAELlB,KAAKC,qBAAuB,IAAIkB,iBAAiBnB,KAAKM,sBACtDN,KAAKC,qBAAqBmB,QAAQpB,KAAKqB,GAAI,CACzCC,UAAW,M,CAKf,WAAAC,GACEvB,KAAKwB,SAAWxB,KAAKwB,O,CAQf,oBAAAN,G,MACN,MAAMO,GACJV,EAAAf,KAAKqB,GAAGK,WAAWC,cAAc,mBAAe,MAAAZ,SAAA,SAAAA,EAAEa,aACpD,GAAIH,EAAc,GAAIzB,KAAK6B,eAAiB,I,CAe9C,MAAAC,GACE,MAAMC,QACJA,EAAOC,QACPA,EAAOC,QACPA,EAAOC,WACPA,EAAUC,YACVA,EAAWC,UACXA,EAASZ,QACTA,EAAOa,gBACPA,GACErC,KAEJ,OACEwB,GACEc,EAACC,EAAI,CACHC,KAAMJ,EAAY,QAAU,KAC5BK,MAAO,CACL,CAACC,EAAsBC,MAAO,OAGhCL,EAAA,OACEG,MAAO,CACL,CAAC,aAAc,KACf,CAAC,aAAaV,KAAY,OAG5BO,EAAA,OAAKG,MAAM,wBACTH,EAAA,OACEG,MAAO,CACL,CAAC,WAAY,KACb,CAAC,WAAWV,KAAY,QAG3BA,IAAY,UACXa,EAAW5C,KAAKqB,GAAI,gBAClBiB,EAAA,OAAKG,MAAM,yCACTH,EAAA,QAAMO,KAAK,kBAEXR,EACFC,EAAA,QACEG,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,iBAAkB,KACnB,CAAC,QAAQV,KAAY,MAEvBe,UAAWC,EAAchB,GAASiB,OAGpCV,EAAA,OAAKG,MAAM,qBAGbH,EAAA,QACEG,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,iBAAkB,KACnB,CAAC,QAAQV,KAAY,MAEvBe,UAAWC,EAAchB,GAASiB,QAIxCV,EAAA,OAAKG,MAAM,iBACTH,EAAA,OACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,6BACCP,GAAclC,KAAK6B,iBAGtBG,GACCM,EAAA,iBACEG,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,qBAAsBP,GAAclC,KAAK6B,gBAE5CE,QAAQ,kBAERO,EAAA,SAAIN,IAGRM,EAAA,QAAMO,KAAK,WACTP,EAAA,iBAAeP,QAAQ,QAAQE,KAGlCW,EAAW5C,KAAKqB,GAAI,WACnBiB,EAAA,OAAKG,MAAM,0BACTH,EAAA,QAAMO,KAAK,aAIjBP,EAAA,OAAKG,MAAM,0BACRN,GACCG,EAAA,aACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,gBAAiB,MAEpBK,UAAWG,EACXC,QAASlD,KAAKE,cACd6B,QAAQ,OACRoB,WAAYT,EAAsBC,KAClCS,MAAM,c"}

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

@@ -1,2 +0,0 @@
-import{r as i,f as e,h as t,H as s,g as n,c,F as o}from"./p-6b5e91e2.js";import{a}from"./p-26b7b18f.js";import{j as r,v as h,P as u,a as l}from"./p-fef9e8c9.js";import{C as d}from"./p-c2e091d7.js";import{c as m}from"./p-68a5aaff.js";const p="ic-input-component-container{display:flex;border:var(--ic-border-width) solid\n    var(--border-color, var(--ic-architectural-400));border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-slow);height:2.5rem;width:var(--input-width, 20rem);padding:var(--ic-space-1px);background-color:var(--ic-architectural-white);box-sizing:border-box;fill:var(--ic-architectural-400);outline:none}ic-input-component-container.fullwidth{width:100%}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:var(--ic-border-width) dashed var(--ic-architectural-200)}ic-input-component-container.readonly,ic-input-component-container.readonly:hover{border:none;padding:0}ic-input-component-container.error{border:var(--ic-error-border-default);padding:0}ic-input-component-container.error:hover{border:var(--ic-error-border-hover)}ic-input-component-container.error:focus-within{border:var(--ic-error-border-pressed)}ic-input-component-container.warning{border:var(--ic-warning-border-default);padding:0}ic-input-component-container.warning:hover{border:var(--ic-warning-border-hover)}ic-input-component-container.warning:focus-within{border:var(--ic-warning-border-pressed)}ic-input-component-container.success{border:var(--ic-success-border-default);padding:0}ic-input-component-container.success:hover{border:var(--ic-success-border-hover)}ic-input-component-container.success:focus-within{border:var(--ic-success-border-pressed)}ic-input-component-container.small{height:var(--ic-space-xl)}ic-input-component-container.large{height:var(--ic-space-xxl)}ic-input-component-container.multiline{height:auto}ic-input-component-container .icon-container{margin-top:var(--ic-space-xxs);margin-left:0.438rem;display:flex;align-items:center}ic-input-component-container.multiline .icon-container,ic-input-component-container.multiline.small .icon-container{margin-top:0.375rem;display:block}ic-input-component-container.readonly .icon-container{margin-left:-0.313rem}ic-input-component-container.disabled ::-moz-placeholder{display:none}ic-input-component-container.disabled ::placeholder{display:none}ic-input-component-container .inline-success{margin:var(--ic-space-xs) 0.375rem;display:flex;align-items:center}ic-input-component-container.dark:hover{--border-color:var(--ic-architectural-400)}ic-input-component-container .inline-success>svg{fill:var(--ic-status-success);height:1.25rem;width:1.25rem}ic-input-component-container:hover{border:var(--ic-border-hover);color:var(--ic-action-dark-hover)}ic-input-component-container:focus{border:var(--ic-border-pressed)}.focus-indicator{display:flex;width:100%;margin:-0.125rem;padding:0.125rem;border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast)}.focus-indicator:focus-within,.focus-indicator-enabled{box-shadow:var(--ic-border-focus)}.focus-indicator.dark:focus-within{box-shadow:var(--ic-border-focus)}@media (forced-colors: active){ic-input-component-container,.focus-indicator{transition:none}ic-input-component-container:focus-within{border:var(--ic-border-width) solid Highlight;outline:0.125rem solid Highlight}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:var(--ic-border-width) dashed GrayText}}";const f=class{constructor(t){i(this,t);this.hostMutationCallback=i=>{if(i.some((({type:i,addedNodes:e,removedNodes:t})=>i==="childList"?r(e,t,"left-icon"):false))){e(this)}};this.appearance="default";this.dark=false;this.disabled=false;this.fullWidth=false;this.multiLine=false;this.readonly=false;this.size="default";this.small=false;this.validationInline=false;this.validationStatus=""}componentDidLoad(){this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{childList:true})}render(){const{size:i,small:e,validationStatus:n,disabled:c,readonly:o,multiLine:r,fullWidth:l,dark:d,appearance:m,validationInline:p}=this;const f=this.validationStatus!==""&&!this.disabled&&!this.readonly?true:false;return t(s,{class:{small:e,[`${i}`]:true,[n]:f,disabled:c,readonly:o,["multiline"]:r,["fullwidth"]:l,["dark"]:d||m==="dark"},"aria-disabled":c&&`${c}`},t("div",{class:{"focus-indicator":true,dark:d||m==="dark"}},h(this.el,"left-icon")&&t("div",{class:{["icon-container"]:true}},t("slot",{name:"left-icon"})),t("slot",null),p&&n===a.Success&&t("span",{class:{["inline-success"]:true},innerHTML:u})))}get el(){return n(this)}};f.style=p;const b="ic-input-container .component-container{display:flex;flex-direction:column}";const v=class{constructor(e){i(this,e);this.disabled=false;this.readonly=false}render(){return t(s,null,t("div",{class:{["component-container"]:true,["disabled"]:this.disabled,["readonly"]:this.readonly}},t("slot",null)))}};v.style=b;const g='html.sc-ic-menu{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu{margin:0}main.sc-ic-menu{display:block}h1.sc-ic-menu{font-size:2em;margin:0.67em 0}hr.sc-ic-menu{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu{background-color:transparent}abbr[title].sc-ic-menu{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu,strong.sc-ic-menu{font-weight:bolder}code.sc-ic-menu,kbd.sc-ic-menu,samp.sc-ic-menu{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu{font-size:80%}sub.sc-ic-menu,sup.sc-ic-menu{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu{bottom:-0.25em}sup.sc-ic-menu{top:-0.5em}img.sc-ic-menu{border-style:none}button.sc-ic-menu,input.sc-ic-menu,optgroup.sc-ic-menu,select.sc-ic-menu,textarea.sc-ic-menu{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu,input.sc-ic-menu{overflow:visible}button.sc-ic-menu,select.sc-ic-menu{text-transform:none}button.sc-ic-menu,[type="button"].sc-ic-menu,[type="reset"].sc-ic-menu,[type="submit"].sc-ic-menu{-webkit-appearance:button}button.sc-ic-menu::-moz-focus-inner,[type="button"].sc-ic-menu::-moz-focus-inner,[type="reset"].sc-ic-menu::-moz-focus-inner,[type="submit"].sc-ic-menu::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu:-moz-focusring,[type="button"].sc-ic-menu:-moz-focusring,[type="reset"].sc-ic-menu:-moz-focusring,[type="submit"].sc-ic-menu:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu{vertical-align:baseline}textarea.sc-ic-menu{overflow:auto}[type="checkbox"].sc-ic-menu,[type="radio"].sc-ic-menu{box-sizing:border-box;padding:0}[type="number"].sc-ic-menu::-webkit-inner-spin-button,[type="number"].sc-ic-menu::-webkit-outer-spin-button{height:auto}[type="search"].sc-ic-menu{-webkit-appearance:textfield;outline-offset:-2px}[type="search"].sc-ic-menu::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu{display:block}summary.sc-ic-menu{display:list-item}template.sc-ic-menu{display:none}[hidden].sc-ic-menu{display:none}html.sc-ic-menu,body.sc-ic-menu,div.sc-ic-menu,span.sc-ic-menu,applet.sc-ic-menu,object.sc-ic-menu,iframe.sc-ic-menu,h1.sc-ic-menu,h2.sc-ic-menu,h3.sc-ic-menu,h4.sc-ic-menu,h5.sc-ic-menu,h6.sc-ic-menu,p.sc-ic-menu,blockquote.sc-ic-menu,pre.sc-ic-menu,a.sc-ic-menu,abbr.sc-ic-menu,acronym.sc-ic-menu,address.sc-ic-menu,big.sc-ic-menu,cite.sc-ic-menu,code.sc-ic-menu,del.sc-ic-menu,dfn.sc-ic-menu,em.sc-ic-menu,img.sc-ic-menu,ins.sc-ic-menu,kbd.sc-ic-menu,q.sc-ic-menu,s.sc-ic-menu,samp.sc-ic-menu,small.sc-ic-menu,strike.sc-ic-menu,strong.sc-ic-menu,sub.sc-ic-menu,sup.sc-ic-menu,tt.sc-ic-menu,var.sc-ic-menu,b.sc-ic-menu,u.sc-ic-menu,i.sc-ic-menu,center.sc-ic-menu,dl.sc-ic-menu,dt.sc-ic-menu,dd.sc-ic-menu,ol.sc-ic-menu,ul.sc-ic-menu,li.sc-ic-menu,fieldset.sc-ic-menu,form.sc-ic-menu,label.sc-ic-menu,legend.sc-ic-menu,table.sc-ic-menu,caption.sc-ic-menu,tbody.sc-ic-menu,tfoot.sc-ic-menu,thead.sc-ic-menu,tr.sc-ic-menu,th.sc-ic-menu,td.sc-ic-menu,article.sc-ic-menu,aside.sc-ic-menu,canvas.sc-ic-menu,details.sc-ic-menu,embed.sc-ic-menu,figure.sc-ic-menu,figcaption.sc-ic-menu,footer.sc-ic-menu,header.sc-ic-menu,hgroup.sc-ic-menu,menu.sc-ic-menu,nav.sc-ic-menu,output.sc-ic-menu,ruby.sc-ic-menu,section.sc-ic-menu,summary.sc-ic-menu,time.sc-ic-menu,mark.sc-ic-menu,audio.sc-ic-menu,video.sc-ic-menu{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){.open.sc-ic-menu-h .menu.sc-ic-menu{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-h{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 20rem);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}.sc-ic-menu-h:not(.no-focus):focus-within{box-shadow:var(--ic-border-focus)}#retry-button.sc-ic-menu::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu #retry-button.sc-ic-menu::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-h{inset:auto !important}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border:var(--ic-border-width) solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll.sc-ic-menu{overflow-y:auto}.menu.sc-ic-menu:focus-visible{outline:none}.open.sc-ic-menu-h{max-height:none;display:block}.open.sc-ic-menu-h .menu.sc-ic-menu{visibility:visible;max-height:calc(var(--ic-space-xl) * 10 + var(--ic-space-xxxs))}.full-width.sc-ic-menu-h{width:100%}.option.sc-ic-menu{padding:var(--ic-space-xs) calc(var(--ic-space-xs) - var(--ic-space-1px));cursor:pointer;display:flex;align-items:center;overflow-wrap:anywhere}.option.sc-ic-menu:not(.loading-option){justify-content:space-between}.small.sc-ic-menu-h .option.sc-ic-menu{padding:var(--ic-space-xxs) calc(var(--ic-space-xs) - var(--ic-space-1px))}.large.sc-ic-menu-h .option.sc-ic-menu{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))}.option.sc-ic-menu:last-child{border-radius:0 0 var(--ic-space-1px) var(--ic-space-1px)}.option.sc-ic-menu:first-child{border-radius:var(--ic-space-1px) var(--ic-space-1px) 0 0}.option.sc-ic-menu:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option.sc-ic-menu:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu:not(.disabled-option) .option-description.sc-ic-menu{color:var(--ic-color-secondary-text)}.option.sc-ic-menu .option-label.sc-ic-menu{display:flex;flex-direction:row;align-items:top}.option.sc-ic-menu .option-element.sc-ic-menu{margin-top:var(--ic-space-xxs)}.option.sc-ic-menu .option-icon.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);margin-top:var(--ic-space-xxs);margin-right:var(--ic-space-xxxs)}.option-text-container.sc-ic-menu{pointer-events:none}.option.loading-option.sc-ic-menu .option-text-container.sc-ic-menu{margin-left:calc(var(--ic-space-xs) + var(--ic-space-xxxs));color:var(--ic-color-secondary-text)}.error-icon-svg.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-status-error);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu{display:flex}.check-icon.sc-ic-menu{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-xs);pointer-events:none}.focused-option.sc-ic-menu .check-icon.sc-ic-menu *.sc-ic-menu{fill:currentcolor}.option-group-title.sc-ic-menu{padding:var(--ic-space-lg) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xs);color:var(--ic-color-tertiary-text)}.small.sc-ic-menu-h .option-group-title.sc-ic-menu{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xxs)}.last-recommended-option.sc-ic-menu{border-bottom:var(--ic-border-default)}.disabled-option.sc-ic-menu{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu,.focused-option.sc-ic-menu .option-description.sc-ic-menu{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}.no-results.sc-ic-menu-h li.sc-ic-menu{cursor:no-drop}.no-results.sc-ic-menu-h li.sc-ic-menu:hover{background-color:transparent}@media (forced-colors: active){.focused-option.sc-ic-menu:focus{outline:none;border:0.125rem solid transparent}}';const x=class{constructor(e){i(this,e);this.menuKeyPress=c(this,"menuKeyPress",7);this.menuOptionId=c(this,"menuOptionId",7);this.menuOptionSelect=c(this,"menuOptionSelect",7);this.menuStateChange=c(this,"menuStateChange",7);this.menuValueChange=c(this,"menuValueChange",7);this.retryButtonClicked=c(this,"retryButtonClicked",7);this.timeoutBlur=c(this,"timeoutBlur",7);this.ungroupedOptionsSet=c(this,"ungroupedOptionsSet",7);this.disabledOptionSelected=false;this.hasPreviouslyBlurred=false;this.hasTimedOut=false;this.isLoading=false;this.isSearchBar=false;this.isSearchableSelect=false;this.preventClickOpen=false;this.ungroupedOptions=[];this.handleClearListener=()=>{this.optionHighlighted=""};this.handleSubmitSearch=()=>{const i=this.options.findIndex((i=>i[this.valueField]===this.optionHighlighted));this.setInputValue(i)};this.handleMenuChange=(i,e)=>{this.menuStateChange.emit({open:i,focusInput:e});if(!i&&e!==false){this.inputEl.focus();this.preventClickOpen=false}};this.setNextOptionValue=i=>{if(this.ungroupedOptions[i+1]){this.menuOptionSelect.emit({value:this.ungroupedOptions[i+1][this.valueField],optionId:this.getOptionId(this.ungroupedOptions[i+1][this.valueField])})}else{this.menuOptionSelect.emit({value:this.ungroupedOptions[0][this.valueField],optionId:this.getOptionId(this.ungroupedOptions[0][this.valueField])})}};this.setPreviousOptionValue=i=>{if(this.ungroupedOptions[i-1]){this.menuOptionSelect.emit({value:this.ungroupedOptions[i-1][this.valueField],optionId:this.getOptionId(this.ungroupedOptions[i-1][this.valueField])})}else{this.menuOptionSelect.emit({value:this.ungroupedOptions[this.ungroupedOptions.length-1][this.valueField],optionId:this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length-1][this.valueField])})}};this.getParentEl=i=>{if(i.tagName==="IC-SEARCH-BAR"){this.isSearchBar=true}else if(i.tagName==="IC-SELECT"&&i.getAttribute("searchable")!==null&&i.getAttribute("searchable")!==undefined){this.isSearchableSelect=true}};this.arrowBehaviour=i=>{i.preventDefault();this.handleMenuChange(true)};this.setMenuOptions=()=>this.isSearchBar?this.options:this.ungroupedOptions;this.setHighlightedOption=i=>{const e=this.setMenuOptions();e[i]&&!e[i].timedOut&&(this.optionHighlighted=e[i][this.valueField]||undefined)};this.autoSetInputValueKeyboardOpen=i=>{const e=this.ungroupedOptions.findIndex((i=>i[this.valueField]===this.value));this.keyboardNav=false;switch(i.key){case"ArrowDown":this.keyboardNav=true;this.arrowBehaviour(i);this.setNextOptionValue(e);break;case"ArrowUp":this.keyboardNav=true;this.arrowBehaviour(i);this.setPreviousOptionValue(e);break;case" ":case"Enter":if(i.target.id!=="clear-button"){this.handleMenuChange(true)}break}};this.manSetInputValueKeyboardOpen=i=>{const e=this.setMenuOptions();const t=e.findIndex((i=>i[this.valueField]===this.optionHighlighted));const s=i=>{var e;return(e=Array.from(this.host.querySelectorAll("li"))[i])===null||e===void 0?void 0:e.id};const n=this.isSearchBar||this.isSearchableSelect||this.open;switch(i.key){case"ArrowDown":this.keyboardNav=true;this.arrowBehaviour(i);if(t<e.length-1){this.setHighlightedOption(t+1);this.menuOptionId.emit({optionId:s(t+1)})}else{this.setHighlightedOption(0);this.menuOptionId.emit({optionId:s(0)})}this.preventIncorrectTabOrder=false;this.focusFromSearchKeypress=false;break;case"ArrowUp":this.keyboardNav=true;this.arrowBehaviour(i);if(t<=0||t>e.length+1){this.setHighlightedOption(e.length-1);this.menuOptionId.emit({optionId:s(e.length-1)})}else{this.setHighlightedOption(t-1);this.menuOptionId.emit({optionId:s(t-1)})}this.preventIncorrectTabOrder=false;this.focusFromSearchKeypress=false;break;case"Home":this.keyboardNav=true;i.preventDefault();this.arrowBehaviour(i);this.setHighlightedOption(0);this.menuOptionId.emit({optionId:s(0)});break;case"End":this.keyboardNav=true;i.preventDefault();this.arrowBehaviour(i);this.setHighlightedOption(e.length-1);this.menuOptionId.emit({optionId:s(e.length-1)});break;case" ":this.keyboardNav=false;if(this.isSearchBar||this.isSearchableSelect){break}else{if(i.target.id!=="clear-button"){this.handleMenuChange(true)}}break;case"Enter":i.preventDefault();this.keyboardNav=false;if(n){if(t>=0){if(e[t]!==undefined){if(this.isSearchBar&&e[t].disabled===true){this.disabledOptionSelected=true}else{this.setInputValue(t);this.value=e[t][this.valueField]}}}else{this.setInputValue(t)}}else{this.handleMenuChange(true)}break;case"Escape":if(this.open){i.stopImmediatePropagation()}this.handleMenuChange(false);this.menuOptionId.emit({optionId:undefined});break;case"Shift":case"Tab":if(this.isSearchBar){this.keyboardNav=true}this.preventIncorrectTabOrder=true;break;default:this.keyboardNav=false;this.focusOnSearchOrSelectInput(e,t);break}};this.setInputValue=i=>{const e=this.setMenuOptions();if(e[i]!==undefined){this.menuOptionSelect.emit({value:e[i][this.valueField]});this.optionHighlighted=undefined;this.menuOptionId.emit({optionId:undefined})}if(!this.hasTimedOut)this.handleMenuChange(false);else this.parentEl.setFocus()};this.handleOptionClick=i=>{const{value:e,label:t}=i.target.dataset;this.menuOptionSelect.emit({value:e,label:t});this.handleMenuChange(false)};this.handleRetry=()=>{this.retryButtonClicked.emit({value:this.value})};this.handleRetryKeyDown=i=>{if(i.key==="Enter"||i.key===" "){i.preventDefault();this.retryButtonClicked.emit({value:this.value,keyPressed:i.key})}};this.handleBlur=i=>{if(i.relatedTarget!==this.inputEl){if(!this.menu.contains(i.relatedTarget)){this.handleMenuChange(false,this.hasPreviouslyBlurred)}}else{this.handleMenuChange(false);this.preventClickOpen=true}if(!this.isSearchBar)this.hasPreviouslyBlurred=!!i.relatedTarget};this.handleMouseDown=i=>{i.preventDefault()};this.handleMenuKeyDown=i=>{if(this.activationType==="automatic"){this.autoSetValueOnMenuKeyDown(i)}else if(this.activationType==="manual"&&!this.isSearchBar){this.manSetInputValueKeyboardOpen(i)}};this.emitMenuKeyPress=(i,e)=>{this.menuKeyPress.emit({isNavKey:i,key:e})};this.autoSetValueOnMenuKeyDown=i=>{i.cancelBubble=true;const e=this.ungroupedOptions.findIndex((i=>i[this.valueField]===this.value));const t=this.inputEl.tagName==="INPUT";this.keyboardNav=false;switch(i.key){case" ":i.preventDefault();break;case"ArrowUp":if(!this.hasTimedOut){i.preventDefault();this.setPreviousOptionValue(e);this.keyboardNav=true}break;case"ArrowDown":if(!this.hasTimedOut){i.preventDefault();this.setNextOptionValue(e);this.keyboardNav=true}break;case"Home":this.menuOptionSelect.emit({value:this.ungroupedOptions[0][this.valueField]});this.keyboardNav=true;break;case"End":this.menuOptionSelect.emit({value:this.ungroupedOptions[this.ungroupedOptions.length-1][this.valueField]});this.keyboardNav=true;break;case"Enter":!this.hasTimedOut&&this.handleMenuChange(false);break;case"Escape":this.handleMenuChange(false);break;case"Backspace":if(t){this.inputEl.focus()}break;case"Shift":break;default:if(t&&i.key!=="Tab"&&!this.hasTimedOut){this.inputEl.focus()}if(i.key.length===1){this.keyboardNav=true}break}this.emitMenuKeyPress(this.keyboardNav,i.key)};this.handleMenuKeyUp=i=>{if(i.key==="Tab"&&i.shiftKey){this.preventClickOpen=false}if(i.key==="Enter"&&this.disabledOptionSelected){this.disabledOptionSelected=false;i.stopImmediatePropagation()}};this.getOptionId=i=>`${this.menuId}-${i}`;this.getOptionAriaLabel=(i,e)=>{let t=i[this.labelField];if(i.description){t=`${t}, ${i.description}`}if(i.element){t=`${t}, ${i.element.ariaLabel}`}if(e){return`${t}, ${e[this.labelField]} group`}else{return t}};this.getSortedOptions=i=>{let e=[];if(i.sort){e=i.sort(((i,e)=>i.recommended&&!e.recommended?-1:0))}return e};this.isManualMode=this.activationType==="manual";this.scrollToSelected=i=>{const e=this.selectOnEnter?this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`):i.querySelector(".option[aria-selected='true']");if(e){const t=e.offsetTop+e.offsetHeight;if(t>i.scrollTop+i.offsetHeight||t<i.scrollTop+i.offsetHeight){i.scrollTop=e.offsetTop}e.focus()}};this.loadUngroupedOptions=()=>{if(this.options.length>0&&this.options.map){this.options.map((i=>{if(i.children){i.children.map((i=>!i.disabled&&this.ungroupedOptions.push(i)))}else if(!i.disabled){this.ungroupedOptions.push(i)}}))}this.ungroupedOptions=this.getSortedOptions(this.ungroupedOptions);this.ungroupedOptionsSet.emit({options:this.ungroupedOptions})};this.setMenuScrollbar=()=>{let i=0;this.host.querySelectorAll(".option").forEach((e=>i+=e.clientHeight));if(i>=320){this.menu.classList.add("menu-scroll")}};this.handleTimeoutBlur=i=>{this.timeoutBlur.emit({ev:i})};this.optionContent=i=>{var e;return t(o,null,i.loading&&t("ic-loading-indicator",{size:"icon"}),t("div",{class:"option-text-container"},t("div",{class:"option-label"},i.icon&&t("div",{class:"option-icon",innerHTML:i.icon,"aria-hidden":"true"}),t("ic-typography",{variant:"body","aria-hidden":"true"},i[this.labelField])),i.description&&t("ic-typography",{id:`${this.getOptionId(i[this.valueField])}-description`,class:"option-description",variant:"caption","aria-hidden":"true"},t("p",null,i.description)),i.element&&t("div",{class:"option-element",innerHTML:i.element.component,"aria-hidden":"true"})),!!i[this.valueField]&&!!this.value&&i[this.valueField].toLowerCase()===((e=this.value)===null||e===void 0?void 0:e.toLowerCase())&&this.parentEl.tagName!=="IC-SEARCH-BAR"&&t("span",{class:"check-icon",innerHTML:d}))};this.displayOption=(i,e,s)=>{const{open:n,value:c,keyboardNav:a,isManualMode:r,initialOptionsListRender:h,optionHighlighted:u,options:l}=this;return t("li",{id:this.getOptionId(i[this.valueField]),class:{option:true,"focused-option":r?(a||h)&&i[this.valueField]===u:a&&i[this.valueField]===c,"last-recommended-option":i.recommended&&l[e+1]&&!l[e+1].recommended,"disabled-option":i.disabled,"loading-option":i.loading,timeout:i.timedOut},role:"option",tabindex:n&&(i[this.valueField]===c||i[this.valueField]===u)&&a?"0":"-1","aria-label":this.getOptionAriaLabel(i,s),"aria-selected":`${i[this.valueField]===c}`,"aria-disabled":i.disabled?"true":"false",onClick:!i.timedOut&&!i.loading&&this.handleOptionClick,onBlur:this.handleBlur,onMouseDown:this.handleMouseDown,"data-value":i[this.valueField],"data-label":i[this.labelField]},i.timedOut?t(o,null,t("div",{class:"loading-error-info"},t("svg",{class:"error-icon-svg","aria-labelledby":"error-title",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#000000"},t("title",{id:"error-title"},"Error"),t("g",{id:"close-octagon"},t("path",{id:"Vector",d:"M8.77 3L3.5 8.27V15.73L8.77 21H16.23L21.5 15.73V8.27L16.23 3M8.91 7L12.5 10.59L16.09 7L17.5 8.41L13.91 12L17.5 15.59L16.09 17L12.5 13.41L8.91 17L7.5 15.59L11.09 12L7.5 8.41"}))),t("ic-typography",{variant:"label"},i[this.labelField])),t("ic-button",{size:"small",variant:"tertiary",onClick:this.handleRetry,onKeyDown:this.handleRetryKeyDown,onBlur:this.handleTimeoutBlur,id:"retry-button"},"Retry")):this.optionContent(i))};this.focusFromSearchKeypress=false;this.initialOptionsListRender=false;this.keyboardNav=false;this.optionHighlighted=undefined;this.preventIncorrectTabOrder=false;this.activationType="automatic";this.anchorEl=undefined;this.autoFocusOnSelected=true;this.fullWidth=false;this.inputEl=undefined;this.inputLabel=undefined;this.labelField="label";this.menuId=undefined;this.open=undefined;this.parentEl=undefined;this.searchMode="navigation";this.selectOnEnter=false;this.size="default";this.small=false;this.options=undefined;this.value=undefined;this.valueField="value"}watchOpenHandler(){if(!this.open&&this.popperInstance){this.popperInstance.destroy();this.popperInstance=null}}watchOptionsHandler(i){this.hasTimedOut=i.some((i=>i.timedOut));this.isLoading=i.some((i=>i.loading));this.ungroupedOptions=[];this.loadUngroupedOptions()}watchValueHandler(){this.menuValueChange.emit({value:this.value})}connectedCallback(){this.getParentEl(this.parentEl);if(this.isSearchBar){if(this.searchMode==="navigation")this.setHighlightedOption(0);this.initialOptionsListRender=true}}disconnectedCallback(){if(this.popperInstance){this.popperInstance.destroy()}this.parentEl.removeEventListener("icClear",this.handleClearListener);this.parentEl.removeEventListener("icSubmitSearch",this.handleSubmitSearch)}componentWillLoad(){var i,e;this.loadUngroupedOptions();this.parentEl.addEventListener("icClear",this.handleClearListener);this.parentEl.addEventListener("icSubmitSearch",this.handleSubmitSearch);this.hasTimedOut=(i=this.options)===null||i===void 0?void 0:i.some((i=>i.timedOut));this.isLoading=(e=this.options)===null||e===void 0?void 0:e.some((i=>i.loading))}componentDidLoad(){if(this.isSearchBar&&this.parentEl.disableFilter){this.focusFromSearchKeypress=true}l([{prop:this.open,propName:"open"},{prop:this.options,propName:"options"},{prop:this.menuId,propName:"menu-id"},{prop:this.inputLabel,propName:"input-label"}],"Menu")}componentDidUpdate(){const i=this.options.some((i=>i[this.valueField]===this.value));if(this.open&&this.options.length!==0){if(this.value&&this.keyboardNav&&i&&this.autoFocusOnSelected&&!this.isSearchableSelect){this.scrollToSelected(this.menu)}else if(this.inputEl.tagName!=="IC-TEXT-FIELD"&&this.inputEl.tagName!=="INPUT"){this.menu.focus()}else if(!!this.optionHighlighted&&!this.focusFromSearchKeypress&&!this.preventIncorrectTabOrder){const i=this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`);if(i){i.focus()}}}if(this.open&&!this.value&&this.selectOnEnter){this.scrollToSelected(this.menu)}}componentDidRender(){if(this.open&&!this.popperInstance&&this.anchorEl){this.initPopperJs(this.anchorEl)}if(this.open&&!!this.options.length){this.setMenuScrollbar()}}async handleClickOpen(){if(!this.preventClickOpen){this.menuStateChange.emit({open:!this.open});this.keyboardNav=false}this.preventClickOpen=false}async handleKeyboardOpen(i){if(this.activationType==="automatic"){this.autoSetInputValueKeyboardOpen(i)}else{this.manSetInputValueKeyboardOpen(i)}}async handleSetFirstOption(){this.setHighlightedOption(0)}async initPopperJs(i){this.popperInstance=m(i,this.host,{placement:"bottom",modifiers:[{name:"offset",options:{offset:[0,7]}},{name:"flip",options:{fallbackPlacements:["top"],rootBoundary:"viewport"}}]})}focusOnSearchOrSelectInput(i,e){if(!i[e])return;if(this.isSearchBar){this.parentEl.setFocus();if(this.searchMode==="navigation")this.setHighlightedOption(0)}if(this.isSearchableSelect){this.parentEl.setFocus()}this.focusFromSearchKeypress=true}render(){const{inputLabel:i,options:e,menuId:n,value:c,fullWidth:o,hasTimedOut:a,isLoading:r,size:h,small:u,open:l,inputEl:d,keyboardNav:m}=this;return t(s,{class:{"full-width":o,"no-focus":(d===null||d===void 0?void 0:d.tagName)==="INPUT"||a||r,small:u,[h]:true,open:l}},e.length!==0&&t("ul",{id:n,class:"menu",role:"listbox","aria-label":i,"aria-activedescendant":c!=null&&c!==""?this.getOptionId(c):"",tabindex:l&&!m&&(d===null||d===void 0?void 0:d.tagName)!=="INPUT"?"0":"-1",ref:i=>this.menu=i,onKeyDown:this.handleMenuKeyDown,onKeyUp:this.handleMenuKeyUp,onBlur:this.handleBlur},this.getSortedOptions(e).map(((i,e)=>{if(i.children){if(i.children.length>0){return t("div",null,t("ic-typography",{class:"option-group-title",role:"presentation",variant:"subtitle-small"},t("p",null,i[this.labelField])),i.children.map((t=>this.displayOption(t,e,i))))}else{return null}}else{return this.displayOption(i,e)}}))))}get host(){return n(this)}static get watchers(){return{open:["watchOpenHandler"],options:["watchOptionsHandler"],value:["watchValueHandler"]}}};x.style=g;export{f as ic_input_component_container,v as ic_input_container,x as ic_menu};
-//# sourceMappingURL=p-a6ff78aa.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["icInputComponentContainerCss","InputComponentContainer","this","hostMutationCallback","mutationList","some","type","addedNodes","removedNodes","checkSlotInChildMutations","forceUpdate","componentDidLoad","hostMutationObserver","MutationObserver","observe","el","childList","render","size","small","validationStatus","disabled","readonly","multiLine","fullWidth","dark","appearance","validationInline","hasValidationStatus","h","Host","class","slotHasContent","name","IcInformationStatus","Success","innerHTML","successIcon","icInputContainerCss","InputContainer","icMenuCss","Menu","disabledOptionSelected","hasPreviouslyBlurred","hasTimedOut","isLoading","isSearchBar","isSearchableSelect","preventClickOpen","ungroupedOptions","handleClearListener","optionHighlighted","handleSubmitSearch","highlightedOptionIndex","options","findIndex","option","valueField","setInputValue","handleMenuChange","open","focusInput","menuStateChange","emit","inputEl","focus","setNextOptionValue","selectedOptionIndex","menuOptionSelect","value","optionId","getOptionId","setPreviousOptionValue","length","getParentEl","parent","tagName","getAttribute","undefined","arrowBehaviour","event","preventDefault","setMenuOptions","setHighlightedOption","highlightedIndex","menuOptions","timedOut","autoSetInputValueKeyboardOpen","keyboardNav","key","target","id","manSetInputValueKeyboardOpen","index","_a","Array","from","host","querySelectorAll","isOpen","menuOptionId","preventIncorrectTabOrder","focusFromSearchKeypress","stopImmediatePropagation","focusOnSearchOrSelectInput","parentEl","setFocus","handleOptionClick","label","dataset","handleRetry","retryButtonClicked","handleRetryKeyDown","ev","keyPressed","handleBlur","relatedTarget","menu","contains","handleMouseDown","handleMenuKeyDown","activationType","autoSetValueOnMenuKeyDown","emitMenuKeyPress","isNavKey","menuKeyPress","cancelBubble","handleMenuKeyUp","shiftKey","menuId","getOptionAriaLabel","parentOption","ariaLabel","labelField","description","element","getSortedOptions","sorted","sort","optionA","optionB","recommended","isManualMode","scrollToSelected","selectedOption","selectOnEnter","querySelector","elTop","offsetTop","offsetHeight","scrollTop","loadUngroupedOptions","map","children","push","ungroupedOptionsSet","setMenuScrollbar","optionsHeight","forEach","clientHeight","classList","add","handleTimeoutBlur","timeoutBlur","optionContent","Fragment","loading","icon","variant","component","toLowerCase","Check","displayOption","initialOptionsListRender","timeout","role","tabindex","onClick","onBlur","onMouseDown","xmlns","viewBox","fill","d","onKeyDown","watchOpenHandler","popperInstance","destroy","watchOptionsHandler","newOptions","opt","watchValueHandler","menuValueChange","connectedCallback","searchMode","disconnectedCallback","removeEventListener","componentWillLoad","addEventListener","_b","disableFilter","onComponentRequiredPropUndefined","prop","propName","inputLabel","componentDidUpdate","inputValueInOptions","autoFocusOnSelected","highlightedEl","componentDidRender","anchorEl","initPopperJs","handleClickOpen","handleKeyboardOpen","handleSetFirstOption","anchor","createPopper","placement","modifiers","offset","fallbackPlacements","rootBoundary","ref","onKeyUp","childOption"],"sources":["src/components/ic-input-component-container/ic-input-component-container.css?tag=ic-input-component-container","src/components/ic-input-component-container/ic-input-component-container.tsx","src/components/ic-input-container/ic-input-container.css?tag=ic-input-container","src/components/ic-input-container/ic-input-container.tsx","src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=scoped","src/components/ic-menu/ic-menu.tsx"],"sourcesContent":["ic-input-component-container {\n  /**\n   * @prop --border-color: Border colour of the input component container\n   */\n\n  display: flex;\n  border: var(--ic-border-width) solid\n    var(--border-color, var(--ic-architectural-400));\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-slow);\n  height: 2.5rem;\n  width: var(--input-width, 20rem);\n  padding: var(--ic-space-1px);\n  background-color: var(--ic-architectural-white);\n  box-sizing: border-box;\n  fill: var(--ic-architectural-400);\n  outline: none;\n}\n\nic-input-component-container.fullwidth {\n  width: 100%;\n}\n\nic-input-component-container.disabled,\nic-input-component-container.disabled:hover {\n  border: var(--ic-border-width) dashed var(--ic-architectural-200);\n}\n\nic-input-component-container.readonly,\nic-input-component-container.readonly:hover {\n  border: none;\n  padding: 0;\n}\n\nic-input-component-container.error {\n  border: var(--ic-error-border-default);\n  padding: 0;\n}\n\nic-input-component-container.error:hover {\n  border: var(--ic-error-border-hover);\n}\n\nic-input-component-container.error:focus-within {\n  border: var(--ic-error-border-pressed);\n}\n\nic-input-component-container.warning {\n  border: var(--ic-warning-border-default);\n  padding: 0;\n}\n\nic-input-component-container.warning:hover {\n  border: var(--ic-warning-border-hover);\n}\n\nic-input-component-container.warning:focus-within {\n  border: var(--ic-warning-border-pressed);\n}\n\nic-input-component-container.success {\n  border: var(--ic-success-border-default);\n  padding: 0;\n}\n\nic-input-component-container.success:hover {\n  border: var(--ic-success-border-hover);\n}\n\nic-input-component-container.success:focus-within {\n  border: var(--ic-success-border-pressed);\n}\n\nic-input-component-container.small {\n  height: var(--ic-space-xl);\n}\n\nic-input-component-container.large {\n  height: var(--ic-space-xxl);\n}\n\nic-input-component-container.multiline {\n  height: auto;\n}\n\nic-input-component-container .icon-container {\n  margin-top: var(--ic-space-xxs);\n  margin-left: 0.438rem;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.multiline .icon-container,\nic-input-component-container.multiline.small .icon-container {\n  margin-top: 0.375rem;\n  display: block;\n}\n\nic-input-component-container.readonly .icon-container {\n  margin-left: -0.313rem;\n}\n\nic-input-component-container.disabled ::placeholder {\n  display: none;\n}\n\nic-input-component-container .inline-success {\n  margin: var(--ic-space-xs) 0.375rem;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.dark:hover {\n  --border-color: var(--ic-architectural-400);\n}\n\nic-input-component-container .inline-success > svg {\n  fill: var(--ic-status-success);\n  height: 1.25rem;\n  width: 1.25rem;\n}\n\nic-input-component-container:hover {\n  border: var(--ic-border-hover);\n  color: var(--ic-action-dark-hover);\n}\n\nic-input-component-container:focus {\n  border: var(--ic-border-pressed);\n}\n\n.focus-indicator {\n  display: flex;\n  width: 100%;\n  margin: -0.125rem;\n  padding: 0.125rem;\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-fast);\n}\n\n.focus-indicator:focus-within,\n.focus-indicator-enabled {\n  box-shadow: var(--ic-border-focus);\n}\n\n.focus-indicator.dark:focus-within {\n  box-shadow: var(--ic-border-focus);\n}\n\n@media (forced-colors: active) {\n  /* Styles here only apply to Forced Colors Mode */\n  ic-input-component-container,\n  .focus-indicator {\n    transition: none;\n  }\n\n  ic-input-component-container:focus-within {\n    border: var(--ic-border-width) solid Highlight;\n    outline: 0.125rem solid Highlight;\n  }\n\n  ic-input-component-container.disabled,\n  ic-input-component-container.disabled:hover {\n    border: var(--ic-border-width) dashed GrayText;\n  }\n}\n","import { Component, Element, Host, Prop, forceUpdate, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n  IcSizes,\n} from \"../../utils/types\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport { checkSlotInChildMutations, slotHasContent } from \"../../utils/helpers\";\n\n/**\n * @slot left-icon - Content will be placed to the left of the input.\n */\n@Component({\n  tag: \"ic-input-component-container\",\n  styleUrl: \"ic-input-component-container.css\",\n})\nexport class InputComponentContainer {\n  private hostMutationObserver: MutationObserver;\n  @Element() el: HTMLIcInputComponentContainerElement;\n\n  /**\n   * The appearance of the input component container.\n   */\n  @Prop() appearance?: \"dark\" | \"default\" = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `appearance` to \"dark\" instead.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   *  If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   *  If `true`, the input component container will fill the width of the container it is in.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   *  If `true`, the input component container will allow for multiple lines.\n   */\n  @Prop() multiLine: boolean = false;\n\n  /**\n   *  If `true`, the readonly state will be set.\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * The size of the input component container component.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   *  If `true`, the validation will display inline.\n   */\n  @Prop() validationInline: boolean = false;\n\n  /**\n   * The validation status of the input component container - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  componentDidLoad(): void {\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, { childList: true });\n  }\n\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    if (\n      mutationList.some(({ type, addedNodes, removedNodes }) =>\n        type === \"childList\"\n          ? checkSlotInChildMutations(addedNodes, removedNodes, \"left-icon\")\n          : false\n      )\n    ) {\n      forceUpdate(this);\n    }\n  };\n\n  render() {\n    const {\n      size,\n      small,\n      validationStatus,\n      disabled,\n      readonly,\n      multiLine,\n      fullWidth,\n      dark,\n      appearance,\n      validationInline,\n    } = this;\n    const hasValidationStatus =\n      this.validationStatus !== \"\" && !this.disabled && !this.readonly\n        ? true\n        : false;\n\n    return (\n      <Host\n        class={{\n          small: small,\n          [`${size}`]: true,\n          [validationStatus]: hasValidationStatus,\n          disabled: disabled,\n          readonly: readonly,\n          [\"multiline\"]: multiLine,\n          [\"fullwidth\"]: fullWidth,\n          [\"dark\"]: dark || appearance === \"dark\",\n        }}\n        aria-disabled={disabled && `${disabled}`}\n      >\n        <div\n          class={{\n            \"focus-indicator\": true,\n            dark: dark || appearance === \"dark\",\n          }}\n        >\n          {slotHasContent(this.el, \"left-icon\") && (\n            <div\n              class={{\n                [\"icon-container\"]: true,\n              }}\n            >\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          <slot></slot>\n\n          {validationInline &&\n            validationStatus === IcInformationStatus.Success && (\n              <span\n                class={{\n                  [\"inline-success\"]: true,\n                }}\n                innerHTML={successIcon}\n              />\n            )}\n        </div>\n      </Host>\n    );\n  }\n}\n","ic-input-container .component-container {\n  display: flex;\n  flex-direction: column;\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"ic-input-container\",\n  styleUrl: \"ic-input-container.css\",\n})\nexport class InputContainer {\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly?: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            [\"component-container\"]: true,\n            [\"disabled\"]: this.disabled,\n            [\"readonly\"]: this.readonly,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-menu: z-index of menu\n */\n\n@media (prefers-reduced-motion: no-preference) {\n  :host(.open) .menu {\n    transition: max-height var(--ic-transition-duration-slow);\n  }\n}\n\n:host {\n  border-radius: var(--ic-border-radius);\n  max-height: 0;\n  width: var(--input-width, 20rem);\n  color: var(--ic-color-primary-text);\n  background-color: var(--ic-architectural-white);\n  position: relative;\n  z-index: var(--ic-z-index-menu);\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n  box-shadow: var(--ic-border-focus);\n}\n\n#retry-button::part(button) {\n  height: var(--ic-space-lg);\n}\n\n.small #retry-button::part(button) {\n  height: var(--ic-space-md);\n}\n\n:host(.on-dialog) {\n  inset: auto !important;\n}\n\n.menu {\n  text-decoration: none;\n  list-style-type: none;\n  border: var(--ic-border-width) solid var(--ic-architectural-400);\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  visibility: hidden;\n  max-height: 0;\n  overflow-y: hidden;\n}\n\n.menu-scroll {\n  overflow-y: auto;\n}\n\n.menu:focus-visible {\n  outline: none;\n}\n\n:host(.open) {\n  max-height: none;\n  display: block;\n}\n\n:host(.open) .menu {\n  visibility: visible;\n  max-height: calc(var(--ic-space-xl) * 10 + var(--ic-space-xxxs));\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\n.option {\n  padding: var(--ic-space-xs) calc(var(--ic-space-xs) - var(--ic-space-1px));\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  overflow-wrap: anywhere;\n}\n\n.option:not(.loading-option) {\n  justify-content: space-between;\n}\n\n:host(.small) .option {\n  padding: var(--ic-space-xxs) calc(var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n:host(.large) .option {\n  padding: var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n.option:last-child {\n  border-radius: 0 0 var(--ic-space-1px) var(--ic-space-1px);\n}\n\n.option:first-child {\n  border-radius: var(--ic-space-1px) var(--ic-space-1px) 0 0;\n}\n\n.option:not(.disabled-option):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.option .option-label {\n  display: flex;\n  flex-direction: row;\n  align-items: top;\n}\n\n.option .option-element {\n  margin-top: var(--ic-space-xxs);\n}\n\n.option .option-icon {\n  height: var(--ic-space-md);\n  width: var(--ic-space-md);\n  margin-top: var(--ic-space-xxs);\n  margin-right: var(--ic-space-xxxs);\n}\n\n.option-text-container {\n  pointer-events: none;\n}\n\n.option.loading-option .option-text-container {\n  margin-left: calc(var(--ic-space-xs) + var(--ic-space-xxxs));\n  color: var(--ic-color-secondary-text);\n}\n\n.error-icon-svg {\n  height: var(--ic-space-md);\n  width: var(--ic-space-md);\n  fill: var(--ic-status-error);\n  align-self: center;\n  display: flex;\n  margin-right: calc(var(--ic-space-xxs) * 1.2);\n}\n\n.loading-error-info {\n  display: flex;\n}\n\n.check-icon {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  margin-left: var(--ic-space-xs);\n  pointer-events: none;\n}\n\n.focused-option .check-icon * {\n  fill: currentcolor;\n}\n\n.option-group-title {\n  padding: var(--ic-space-lg) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xs);\n  color: var(--ic-color-tertiary-text);\n}\n\n:host(.small) .option-group-title {\n  padding: var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xxs);\n}\n\n.last-recommended-option {\n  border-bottom: var(--ic-border-default);\n}\n\n.disabled-option {\n  color: var(--ic-architectural-200);\n  cursor: default;\n  pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n  background-color: var(--ic-focus-blue) !important;\n  color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n  cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n  background-color: transparent;\n}\n\n@media (forced-colors: active) {\n  .focused-option:focus {\n    outline: none;\n    border: 0.125rem solid transparent;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Method,\n  State,\n  Watch,\n  Fragment,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport {\n  IcActivationTypes,\n  IcMenuOption,\n  IcSizes,\n  IcValueEventDetail,\n} from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n  IcOptionSelectEventDetail,\n  IcMenuChangeEventDetail,\n  IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\nimport { IcSearchBarSearchModes } from \"../ic-search-bar/ic-search-bar.types\";\n\n@Component({\n  tag: \"ic-menu\",\n  styleUrl: \"ic-menu.css\",\n  scoped: true,\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Menu {\n  private disabledOptionSelected: boolean = false;\n  private hasPreviouslyBlurred: boolean = false;\n  private hasTimedOut: boolean = false;\n  private isLoading: boolean = false;\n  private isSearchBar: boolean = false;\n  private isSearchableSelect: boolean = false;\n  private menu: HTMLUListElement;\n  private popperInstance: PopperInstance;\n  // Prevents menu re-opening immediately after it is closed on blur when clicking input.\n  private preventClickOpen: boolean = false;\n  private ungroupedOptions: IcMenuOption[] = [];\n\n  @Element() host: HTMLIcMenuElement;\n\n  @State() focusFromSearchKeypress: boolean = false;\n  @State() initialOptionsListRender: boolean = false;\n  @State() keyboardNav: boolean = false;\n  @State() optionHighlighted: string;\n  @State() preventIncorrectTabOrder: boolean = false;\n\n  /**\n   * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * The reference to an anchor element the menu will position itself from when rendered.\n   */\n  @Prop() anchorEl!: HTMLElement;\n\n  /**\n   * @internal If `true`, autofocus will be applied on selected item when menu is open.\n   */\n  @Prop() autoFocusOnSelected: boolean = true;\n\n  /**\n   *  If `true`, the menu will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * The reference to the input element.\n   */\n  @Prop() inputEl!: HTMLElement;\n\n  /**\n   * The label for the input element.\n   */\n  @Prop() inputLabel!: string;\n\n  /**\n   * The custom name for the label field for IcMenuOption.\n   */\n  @Prop() labelField: string = \"label\";\n\n  /**\n   * The ID of the menu.\n   */\n  @Prop() menuId!: string;\n\n  /**\n   * If `true`, the menu will be displayed open.\n   */\n  @Prop({ reflect: true }) open!: boolean;\n\n  @Watch(\"open\")\n  watchOpenHandler(): void {\n    if (!this.open && this.popperInstance) {\n      this.popperInstance.destroy();\n      this.popperInstance = null;\n    }\n  }\n\n  /**\n   * @internal - The parent element if ic-menu is nested inside another component.\n   */\n  @Prop() parentEl?: HTMLElement;\n\n  /**\n   * Specify the mode search bar uses to search. `navigation` allows for quick lookups of a set of values, `query` allows for more general searches.\n   */\n  @Prop() searchMode?: IcSearchBarSearchModes = \"navigation\";\n\n  /**\n   * @internal If `true`, the icOptionSelect event will be fired on enter instead of ArrowUp and ArrowDown.\n   */\n  @Prop() selectOnEnter?: boolean = false;\n\n  /**\n   * The size of the menu component.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * The possible menu selection options.\n   */\n  @Prop() options!: IcMenuOption[];\n\n  @Watch(\"options\")\n  watchOptionsHandler(newOptions: IcMenuOption[]): void {\n    this.hasTimedOut = newOptions.some((opt) => opt.timedOut);\n    this.isLoading = newOptions.some((opt) => opt.loading);\n    this.ungroupedOptions = [];\n    this.loadUngroupedOptions();\n  }\n\n  /**\n   * The value of the currently selected option.\n   */\n  @Prop({ mutable: true }) value!: string;\n\n  @Watch(\"value\")\n  watchValueHandler(): void {\n    this.menuValueChange.emit({ value: this.value });\n  }\n\n  /**\n   * The custom name for the value field for IcMenuOption.\n   */\n  @Prop() valueField: string = \"value\";\n\n  /**\n   * @internal Emitted when key is pressed while menu is open\n   */\n  @Event() menuKeyPress: EventEmitter<{ isNavKey: boolean; key: string }>;\n\n  /**\n   * @internal Emitted when an option has been highlighted\n   */\n  @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n  /**\n   * @internal Emitted when an option is selected.\n   */\n  @Event() menuOptionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * @internal Emitted when state of menu changes (i.e. open or close).\n   */\n  @Event() menuStateChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n  /**\n   * @internal Emitted when menu value changes.\n   */\n  @Event() menuValueChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * @internal Emitted when the retry button is clicked\n   */\n  @Event() retryButtonClicked: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * @internal Emitted when the timeout menu loses focus\n   */\n  @Event() timeoutBlur: EventEmitter<{ ev: FocusEvent }>;\n\n  /**\n   * @internal Emitted when the ungrouped options have been set.\n   */\n  @Event() ungroupedOptionsSet: EventEmitter<{ options: IcMenuOption[] }>;\n\n  connectedCallback(): void {\n    this.getParentEl(this.parentEl);\n\n    if (this.isSearchBar) {\n      if (this.searchMode === \"navigation\") this.setHighlightedOption(0);\n      this.initialOptionsListRender = true;\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n    }\n    this.parentEl.removeEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.removeEventListener(\n      \"icSubmitSearch\",\n      this.handleSubmitSearch\n    );\n  }\n\n  componentWillLoad(): void {\n    this.loadUngroupedOptions();\n    this.parentEl.addEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.addEventListener(\"icSubmitSearch\", this.handleSubmitSearch);\n    this.hasTimedOut = this.options?.some((opt) => opt.timedOut);\n    this.isLoading = this.options?.some((opt) => opt.loading);\n  }\n\n  componentDidLoad(): void {\n    if (\n      this.isSearchBar &&\n      (this.parentEl as HTMLIcSearchBarElement).disableFilter\n    ) {\n      this.focusFromSearchKeypress = true;\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.open, propName: \"open\" },\n        { prop: this.options, propName: \"options\" },\n        { prop: this.menuId, propName: \"menu-id\" },\n        { prop: this.inputLabel, propName: \"input-label\" },\n        //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n      ],\n      \"Menu\"\n    );\n  }\n\n  componentDidUpdate(): void {\n    const inputValueInOptions = this.options.some(\n      (option) => option[this.valueField] === this.value\n    );\n\n    if (this.open && this.options.length !== 0) {\n      if (\n        this.value &&\n        this.keyboardNav &&\n        inputValueInOptions &&\n        this.autoFocusOnSelected &&\n        !this.isSearchableSelect\n      ) {\n        this.scrollToSelected(this.menu);\n      } else if (\n        this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n        this.inputEl.tagName !== \"INPUT\"\n      ) {\n        this.menu.focus();\n      } else if (\n        !!this.optionHighlighted &&\n        !this.focusFromSearchKeypress &&\n        !this.preventIncorrectTabOrder\n      ) {\n        const highlightedEl = this.host.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement;\n\n        if (highlightedEl) {\n          highlightedEl.focus();\n        }\n      }\n    }\n\n    if (this.open && !this.value && this.selectOnEnter) {\n      this.scrollToSelected(this.menu);\n    }\n  }\n\n  componentDidRender(): void {\n    if (this.open && !this.popperInstance && this.anchorEl) {\n      this.initPopperJs(this.anchorEl);\n    }\n\n    if (this.open && !!this.options.length) {\n      this.setMenuScrollbar();\n    }\n  }\n\n  /**\n   * @internal If menu is opened with the mouse, emit menuStateChange custom event.\n   */\n  @Method()\n  async handleClickOpen(): Promise<void> {\n    if (!this.preventClickOpen) {\n      this.menuStateChange.emit({ open: !this.open });\n      this.keyboardNav = false;\n    }\n    this.preventClickOpen = false;\n  }\n\n  /**\n   * Used alongside activationType\n   * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n   * @param {KeyboardEvent} event The keyboard event which is available when handleKeyboardOpen is invoked.\n   */\n  @Method()\n  async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n    if (this.activationType === \"automatic\") {\n      this.autoSetInputValueKeyboardOpen(event);\n    } else {\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  }\n\n  /**\n   * @internal Used to highlight the first option in the menu.\n   */\n  @Method()\n  async handleSetFirstOption(): Promise<void> {\n    this.setHighlightedOption(0);\n  }\n\n  /**\n   * @internal Used to initialize popperJS with an anchor element.\n   * 5/12/2023: Tested with Floating UI, however, discovered inconsistent\n   * boundary behaviour so sticking with PopperJS.\n   */\n  @Method()\n  async initPopperJs(anchor: HTMLElement): Promise<void> {\n    this.popperInstance = createPopper(anchor, this.host, {\n      placement: \"bottom\",\n      modifiers: [\n        {\n          name: \"offset\",\n          options: {\n            offset: [0, 7],\n          },\n        },\n        {\n          name: \"flip\",\n          options: {\n            fallbackPlacements: [\"top\"],\n            rootBoundary: \"viewport\",\n          },\n        },\n      ],\n    });\n  }\n\n  private handleClearListener = (): void => {\n    this.optionHighlighted = \"\";\n  };\n\n  private handleSubmitSearch = (): void => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option[this.valueField] === this.optionHighlighted\n    );\n\n    this.setInputValue(highlightedOptionIndex);\n  };\n\n  private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n    this.menuStateChange.emit({ open, focusInput });\n\n    if (!open && focusInput !== false) {\n      this.inputEl.focus();\n      this.preventClickOpen = false;\n    }\n  };\n\n  private setNextOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex + 1][this.valueField],\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex + 1][this.valueField]\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[0][this.valueField],\n        optionId: this.getOptionId(this.ungroupedOptions[0][this.valueField]),\n      });\n    }\n  };\n\n  private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex - 1][this.valueField],\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex - 1][this.valueField]\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value:\n          this.ungroupedOptions[this.ungroupedOptions.length - 1][\n            this.valueField\n          ],\n        optionId: this.getOptionId(\n          this.ungroupedOptions[this.ungroupedOptions.length - 1][\n            this.valueField\n          ]\n        ),\n      });\n    }\n  };\n\n  private getParentEl = (parent: HTMLElement) => {\n    if (parent.tagName === \"IC-SEARCH-BAR\") {\n      this.isSearchBar = true;\n    } else if (\n      parent.tagName === \"IC-SELECT\" &&\n      parent.getAttribute(\"searchable\") !== null &&\n      parent.getAttribute(\"searchable\") !== undefined\n    ) {\n      this.isSearchableSelect = true;\n    }\n  };\n\n  private arrowBehaviour = (event: KeyboardEvent): void => {\n    event.preventDefault();\n    this.handleMenuChange(true);\n  };\n\n  private setMenuOptions = () =>\n    this.isSearchBar ? this.options : this.ungroupedOptions;\n\n  private setHighlightedOption = (highlightedIndex: number): void => {\n    const menuOptions = this.setMenuOptions();\n\n    menuOptions[highlightedIndex] &&\n      !menuOptions[highlightedIndex].timedOut &&\n      (this.optionHighlighted =\n        menuOptions[highlightedIndex][this.valueField] || undefined);\n  };\n\n  private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option[this.valueField] === this.value\n    );\n\n    this.keyboardNav = false;\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setNextOptionValue(selectedOptionIndex);\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setPreviousOptionValue(selectedOptionIndex);\n        break;\n      case \" \":\n      case \"Enter\":\n        if ((event.target as HTMLElement).id !== \"clear-button\") {\n          this.handleMenuChange(true);\n        }\n        break;\n    }\n  };\n\n  private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const menuOptions = this.setMenuOptions();\n\n    const highlightedOptionIndex = menuOptions.findIndex(\n      (option) => option[this.valueField] === this.optionHighlighted\n    );\n\n    const getOptionId = (index: number): string =>\n      Array.from(this.host.querySelectorAll(\"li\"))[index]?.id;\n\n    const isOpen: boolean =\n      this.isSearchBar || this.isSearchableSelect || this.open;\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        if (highlightedOptionIndex < menuOptions.length - 1) {\n          this.setHighlightedOption(highlightedOptionIndex + 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex + 1),\n          });\n        } else {\n          this.setHighlightedOption(0);\n          this.menuOptionId.emit({\n            optionId: getOptionId(0),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        if (\n          highlightedOptionIndex <= 0 ||\n          highlightedOptionIndex > menuOptions.length + 1\n        ) {\n          this.setHighlightedOption(menuOptions.length - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(menuOptions.length - 1),\n          });\n        } else {\n          this.setHighlightedOption(highlightedOptionIndex - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex - 1),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"Home\":\n        this.keyboardNav = true;\n        event.preventDefault();\n        this.arrowBehaviour(event);\n        this.setHighlightedOption(0);\n        this.menuOptionId.emit({\n          optionId: getOptionId(0),\n        });\n        break;\n      case \"End\":\n        this.keyboardNav = true;\n        event.preventDefault();\n        this.arrowBehaviour(event);\n        this.setHighlightedOption(menuOptions.length - 1);\n        this.menuOptionId.emit({\n          optionId: getOptionId(menuOptions.length - 1),\n        });\n        break;\n      case \" \":\n        this.keyboardNav = false;\n        if (this.isSearchBar || this.isSearchableSelect) {\n          break;\n        } else {\n          if ((event.target as HTMLElement).id !== \"clear-button\") {\n            this.handleMenuChange(true);\n          }\n        }\n        break;\n      case \"Enter\":\n        event.preventDefault();\n        this.keyboardNav = false;\n        if (isOpen) {\n          if (highlightedOptionIndex >= 0) {\n            if (menuOptions[highlightedOptionIndex] !== undefined) {\n              if (\n                this.isSearchBar &&\n                menuOptions[highlightedOptionIndex].disabled === true\n              ) {\n                this.disabledOptionSelected = true;\n              } else {\n                this.setInputValue(highlightedOptionIndex);\n                this.value =\n                  menuOptions[highlightedOptionIndex][this.valueField];\n              }\n            }\n          } else {\n            this.setInputValue(highlightedOptionIndex);\n          }\n        } else {\n          this.handleMenuChange(true);\n        }\n        break;\n      case \"Escape\":\n        if (this.open) {\n          event.stopImmediatePropagation();\n        }\n        this.handleMenuChange(false);\n        this.menuOptionId.emit({ optionId: undefined });\n        break;\n      case \"Shift\":\n      case \"Tab\":\n        if (this.isSearchBar) {\n          this.keyboardNav = true;\n        }\n        this.preventIncorrectTabOrder = true;\n        break;\n      default:\n        this.keyboardNav = false;\n        this.focusOnSearchOrSelectInput(menuOptions, highlightedOptionIndex);\n        break;\n    }\n  };\n\n  private setInputValue = (highlightedOptionIndex: number) => {\n    const menuOptions = this.setMenuOptions();\n\n    if (menuOptions[highlightedOptionIndex] !== undefined) {\n      this.menuOptionSelect.emit({\n        value: menuOptions[highlightedOptionIndex][this.valueField],\n      });\n      this.optionHighlighted = undefined;\n      this.menuOptionId.emit({ optionId: undefined });\n    }\n    if (!this.hasTimedOut) this.handleMenuChange(false);\n    else (this.parentEl as HTMLIcSearchBarElement).setFocus();\n  };\n\n  private handleOptionClick = (event: Event): void => {\n    const { value, label } = (event.target as HTMLLIElement).dataset;\n    this.menuOptionSelect.emit({ value, label });\n    this.handleMenuChange(false);\n  };\n\n  private handleRetry = (): void => {\n    this.retryButtonClicked.emit({ value: this.value });\n  };\n\n  private handleRetryKeyDown = (ev: KeyboardEvent): void => {\n    if (ev.key === \"Enter\" || ev.key === \" \") {\n      ev.preventDefault();\n      this.retryButtonClicked.emit({ value: this.value, keyPressed: ev.key });\n    }\n  };\n\n  private handleBlur = (event: FocusEvent): void => {\n    if (event.relatedTarget !== this.inputEl) {\n      if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n        this.handleMenuChange(false, this.hasPreviouslyBlurred);\n      }\n    } else {\n      this.handleMenuChange(false);\n      this.preventClickOpen = true;\n    }\n    if (!this.isSearchBar) this.hasPreviouslyBlurred = !!event.relatedTarget;\n  };\n\n  private handleMouseDown = (event: Event): void => {\n    event.preventDefault();\n  };\n\n  private handleMenuKeyDown = (event: KeyboardEvent) => {\n    if (this.activationType === \"automatic\") {\n      this.autoSetValueOnMenuKeyDown(event);\n    } else if (this.activationType === \"manual\" && !this.isSearchBar) {\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  };\n\n  private emitMenuKeyPress = (isNavKey: boolean, key: string) => {\n    this.menuKeyPress.emit({ isNavKey: isNavKey, key: key });\n  };\n\n  private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n    event.cancelBubble = true;\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option[this.valueField] === this.value\n    );\n\n    const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n    this.keyboardNav = false;\n\n    switch (event.key) {\n      case \" \":\n        event.preventDefault();\n        break;\n      case \"ArrowUp\":\n        if (!this.hasTimedOut) {\n          event.preventDefault();\n          this.setPreviousOptionValue(selectedOptionIndex);\n          this.keyboardNav = true;\n        }\n        break;\n      case \"ArrowDown\":\n        if (!this.hasTimedOut) {\n          event.preventDefault();\n          this.setNextOptionValue(selectedOptionIndex);\n          this.keyboardNav = true;\n        }\n        break;\n      case \"Home\":\n        this.menuOptionSelect.emit({\n          value: this.ungroupedOptions[0][this.valueField],\n        });\n        this.keyboardNav = true;\n        break;\n      case \"End\":\n        this.menuOptionSelect.emit({\n          value:\n            this.ungroupedOptions[this.ungroupedOptions.length - 1][\n              this.valueField\n            ],\n        });\n        this.keyboardNav = true;\n        break;\n      case \"Enter\":\n        !this.hasTimedOut && this.handleMenuChange(false);\n        break;\n      case \"Escape\":\n        this.handleMenuChange(false);\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      case \"Shift\":\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\" && !this.hasTimedOut) {\n          this.inputEl.focus();\n        }\n        if (event.key.length === 1) {\n          this.keyboardNav = true;\n        }\n        break;\n    }\n    this.emitMenuKeyPress(this.keyboardNav, event.key);\n  };\n\n  private handleMenuKeyUp = (event: KeyboardEvent): void => {\n    if (event.key === \"Tab\" && event.shiftKey) {\n      this.preventClickOpen = false;\n    }\n    if (event.key === \"Enter\" && this.disabledOptionSelected) {\n      this.disabledOptionSelected = false;\n      event.stopImmediatePropagation();\n    }\n  };\n\n  private getOptionId = (value: string): string => {\n    return `${this.menuId}-${value}`;\n  };\n\n  private getOptionAriaLabel = (\n    option: IcMenuOption,\n    parentOption: IcMenuOption\n  ): string => {\n    let ariaLabel = option[this.labelField];\n\n    if (option.description) {\n      ariaLabel = `${ariaLabel}, ${option.description}`;\n    }\n\n    if (option.element) {\n      ariaLabel = `${ariaLabel}, ${option.element.ariaLabel}`;\n    }\n\n    if (parentOption) {\n      return `${ariaLabel}, ${parentOption[this.labelField]} group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    let sorted: IcMenuOption[] = [];\n    if (options.sort) {\n      sorted = options.sort((optionA, optionB) =>\n        optionA.recommended && !optionB.recommended ? -1 : 0\n      );\n    }\n    return sorted;\n  };\n\n  private isManualMode = this.activationType === \"manual\";\n\n  private scrollToSelected = (menu: HTMLUListElement) => {\n    const selectedOption = this.selectOnEnter\n      ? (this.host.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement)\n      : (menu.querySelector(\".option[aria-selected='true']\") as HTMLElement);\n\n    if (selectedOption) {\n      const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n      if (\n        elTop > menu.scrollTop + menu.offsetHeight ||\n        elTop < menu.scrollTop + menu.offsetHeight\n      ) {\n        menu.scrollTop = selectedOption.offsetTop;\n      }\n      selectedOption.focus();\n    }\n  };\n\n  private loadUngroupedOptions = () => {\n    if (this.options.length > 0 && this.options.map) {\n      this.options.map((option) => {\n        if (option.children) {\n          option.children.map(\n            (option) => !option.disabled && this.ungroupedOptions.push(option)\n          );\n        } else if (!option.disabled) {\n          this.ungroupedOptions.push(option);\n        }\n      });\n    }\n    this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n    this.ungroupedOptionsSet.emit({ options: this.ungroupedOptions });\n  };\n\n  private setMenuScrollbar = () => {\n    let optionsHeight = 0;\n    this.host\n      .querySelectorAll(\".option\")\n      .forEach((option) => (optionsHeight += option.clientHeight));\n\n    if (optionsHeight >= 320) {\n      this.menu.classList.add(\"menu-scroll\");\n    }\n  };\n\n  private handleTimeoutBlur = (ev: FocusEvent) => {\n    this.timeoutBlur.emit({ ev });\n  };\n\n  private focusOnSearchOrSelectInput(\n    menuOptions: IcMenuOption[],\n    highlightedOptionIndex: number\n  ) {\n    if (!menuOptions[highlightedOptionIndex]) return;\n\n    if (this.isSearchBar) {\n      (this.parentEl as HTMLIcSearchBarElement).setFocus();\n      if (this.searchMode === \"navigation\") this.setHighlightedOption(0);\n    }\n\n    if (this.isSearchableSelect) {\n      (this.parentEl as HTMLIcSelectElement).setFocus();\n    }\n\n    this.focusFromSearchKeypress = true;\n  }\n\n  private optionContent = (option: IcMenuOption) => {\n    return (\n      <Fragment>\n        {option.loading && <ic-loading-indicator size=\"icon\" />}\n        <div class=\"option-text-container\">\n          <div class=\"option-label\">\n            {option.icon && (\n              <div\n                class=\"option-icon\"\n                innerHTML={option.icon}\n                aria-hidden=\"true\"\n              ></div>\n            )}\n            <ic-typography variant=\"body\" aria-hidden=\"true\">\n              {option[this.labelField]}\n            </ic-typography>\n          </div>\n          {option.description && (\n            <ic-typography\n              id={`${this.getOptionId(option[this.valueField])}-description`}\n              class=\"option-description\"\n              variant=\"caption\"\n              aria-hidden=\"true\"\n            >\n              <p>{option.description}</p>\n            </ic-typography>\n          )}\n          {option.element && (\n            <div\n              class=\"option-element\"\n              innerHTML={option.element.component}\n              aria-hidden=\"true\"\n            ></div>\n          )}\n        </div>\n        {!!option[this.valueField] &&\n          !!this.value &&\n          option[this.valueField].toLowerCase() === this.value?.toLowerCase() &&\n          this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n            <span class=\"check-icon\" innerHTML={Check} />\n          )}\n      </Fragment>\n    );\n  };\n\n  private displayOption = (\n    option: IcMenuOption,\n    index?: number,\n    parentOption?: IcMenuOption\n  ): HTMLLIElement => {\n    const {\n      open,\n      value,\n      keyboardNav,\n      isManualMode,\n      initialOptionsListRender,\n      optionHighlighted,\n      options,\n    } = this;\n\n    return (\n      <li\n        id={this.getOptionId(option[this.valueField])}\n        class={{\n          option: true,\n          \"focused-option\": isManualMode\n            ? (keyboardNav || initialOptionsListRender) &&\n              option[this.valueField] === optionHighlighted\n            : keyboardNav && option[this.valueField] === value,\n          \"last-recommended-option\":\n            option.recommended &&\n            options[index + 1] &&\n            !options[index + 1].recommended,\n          \"disabled-option\": option.disabled,\n          \"loading-option\": option.loading,\n          timeout: option.timedOut,\n        }}\n        role=\"option\"\n        tabindex={\n          open &&\n          (option[this.valueField] === value ||\n            option[this.valueField] === optionHighlighted) &&\n          keyboardNav\n            ? \"0\"\n            : \"-1\"\n        }\n        aria-label={this.getOptionAriaLabel(option, parentOption)}\n        aria-selected={`${option[this.valueField] === value}`}\n        aria-disabled={option.disabled ? \"true\" : \"false\"}\n        onClick={!option.timedOut && !option.loading && this.handleOptionClick}\n        onBlur={this.handleBlur}\n        onMouseDown={this.handleMouseDown}\n        data-value={option[this.valueField]}\n        data-label={option[this.labelField]}\n      >\n        {option.timedOut ? (\n          <Fragment>\n            <div class=\"loading-error-info\">\n              <svg\n                class=\"error-icon-svg\"\n                aria-labelledby=\"error-title\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                fill=\"#000000\"\n              >\n                <title id=\"error-title\">Error</title>\n                <g id=\"close-octagon\">\n                  <path\n                    id=\"Vector\"\n                    d=\"M8.77 3L3.5 8.27V15.73L8.77 21H16.23L21.5 15.73V8.27L16.23 3M8.91 7L12.5 10.59L16.09 7L17.5 8.41L13.91 12L17.5 15.59L16.09 17L12.5 13.41L8.91 17L7.5 15.59L11.09 12L7.5 8.41\"\n                  />\n                </g>\n              </svg>\n              <ic-typography variant=\"label\">\n                {option[this.labelField]}\n              </ic-typography>\n            </div>\n            <ic-button\n              size=\"small\"\n              variant=\"tertiary\"\n              onClick={this.handleRetry}\n              onKeyDown={this.handleRetryKeyDown}\n              onBlur={this.handleTimeoutBlur}\n              id=\"retry-button\"\n            >\n              Retry\n            </ic-button>\n          </Fragment>\n        ) : (\n          this.optionContent(option)\n        )}\n      </li>\n    );\n  };\n\n  render() {\n    const {\n      inputLabel,\n      options,\n      menuId,\n      value,\n      fullWidth,\n      hasTimedOut,\n      isLoading,\n      size,\n      small,\n      open,\n      inputEl,\n      keyboardNav,\n    } = this;\n\n    return (\n      <Host\n        class={{\n          \"full-width\": fullWidth,\n          \"no-focus\": inputEl?.tagName === \"INPUT\" || hasTimedOut || isLoading,\n          small: small,\n          [size]: true,\n          open: open,\n        }}\n      >\n        {options.length !== 0 && (\n          <ul\n            id={menuId}\n            class=\"menu\"\n            role=\"listbox\"\n            aria-label={inputLabel}\n            aria-activedescendant={\n              value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n            }\n            tabindex={\n              open && !keyboardNav && inputEl?.tagName !== \"INPUT\" ? \"0\" : \"-1\"\n            }\n            ref={(el) => (this.menu = el)}\n            onKeyDown={this.handleMenuKeyDown}\n            onKeyUp={this.handleMenuKeyUp}\n            onBlur={this.handleBlur}\n          >\n            {this.getSortedOptions(options).map((option, index) => {\n              if (option.children) {\n                if (option.children.length > 0) {\n                  return (\n                    <div>\n                      <ic-typography\n                        class=\"option-group-title\"\n                        role=\"presentation\"\n                        variant=\"subtitle-small\"\n                      >\n                        <p>{option[this.labelField]}</p>\n                      </ic-typography>\n                      {option.children.map((childOption) =>\n                        this.displayOption(childOption, index, option)\n                      )}\n                    </div>\n                  );\n                } else {\n                  return null;\n                }\n              } else {\n                return this.displayOption(option, index);\n              }\n            })}\n          </ul>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,H as o,g as s}from"./p-6b5e91e2.js";import{d as a,k as n,a as r,i as c}from"./p-fef9e8c9.js";import{C as l}from"./p-c2e091d7.js";import{C as u}from"./p-3b185c32.js";import"./p-26b7b18f.js";const d='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}li{list-style:none;padding:0}:host ::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled) ::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"]) ::part(button){color:var(--ic-action-destructive)}:host ::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host ::part(button):focus-visible,:host ::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled) ::part(button):focus-visible,:host(.disabled) ::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host([variant="destructive"]) ::part(button):focus-visible,:host([variant="destructive"]) ::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host ::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant="destructive"]) ::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant="destructive"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant="destructive"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host ::part(button){border:canvas}:host ::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled) ::part(button):focus-visible,:host(.disabled) ::part(button):focus{outline-color:GrayText !important}}';const h=class{constructor(i){t(this,i);this.childBlur=e(this,"childBlur",7);this.handleMenuItemClick=e(this,"handleMenuItemClick",7);this.triggerPopoverMenuInstance=e(this,"triggerPopoverMenuInstance",7);this.handleClick=t=>{if(a(this.submenuTriggerFor)){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){t.preventDefault();this.toggleChecked=!this.toggleChecked}this.handleMenuItemClick.emit({label:this.label,hasSubMenu:!!this.el.submenuTriggerFor})};this.getMenuItemAriaLabel=()=>{let t=this.label;if(a(this.description)){t=`${t}, ${this.description}`}if(a(this.keyboardShortcut)){t=`${t}, ${this.keyboardShortcut}`}if(this.variant==="destructive"){t=`${t}, destructive`}if(a(this.submenuTriggerFor)){t=`${t}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){t="Go back to parent menu"}const e=this.el.parentElement;if(e.tagName==="IC-MENU-GROUP"&&e.label){return`${t}, ${e.label} menu group`}else{return t}};this.toggleChecked=false;this.description=undefined;this.disabled=false;this.href=undefined;this.hreflang=undefined;this.keyboardShortcut=undefined;this.label=undefined;this.referrerpolicy=undefined;this.rel=undefined;this.submenuTriggerFor=undefined;this.target=undefined;this.variant="default"}componentWillLoad(){if(a(this.submenuTriggerFor)&&this.variant!=="default"){this.variant="default"}n(this.disabled,this.el)}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Menu Item")}handleHostClick(t){if(this.disabled){t.stopImmediatePropagation()}}render(){const t=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcut&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcut)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["disabled"]:this.disabled}},i("li",{role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"?this.toggleChecked:undefined},i("ic-button",{fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:a(this.href),hreflang:a(this.hreflang),target:a(this.target),rel:a(this.rel),referrerpolicy:this.referrerpolicy!==undefined?this.referrerpolicy:null,"aria-disabled":`${this.disabled}`,"aria-label":this.getMenuItemAriaLabel(),ariaControlsId:a(this.submenuTriggerFor)?`ic-popover-submenu-${this.submenuTriggerFor}`:false,"aria-haspopup":a(this.submenuTriggerFor)||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false,ariaOwnsId:a(this.submenuTriggerFor)?`ic-popover-submenu-${this.submenuTriggerFor}`:false},i("div",{class:"focus-border"},c(this.el,"icon")&&i("span",{class:"icon"},i("slot",{name:"icon"})),i(t,null),this.variant==="toggle"&&i("span",{class:{["check-icon"]:true,["hide"]:!this.toggleChecked},"aria-hidden":"true",innerHTML:l}),a(this.submenuTriggerFor)&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:u})))))}static get delegatesFocus(){return true}get el(){return s(this)}};h.style=d;export{h as ic_menu_item};
-//# sourceMappingURL=p-a75f3c4d.entry.js.map