@ukic/web-components 3.20.0 → 3.22.0

package/dist/core/p-0f6fd5d3.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as i,H as e,g as s}from"./p-8e4e97b4.js";import{V as o,E as r,h as a,I as l}from"./p-dbc8bf0c.js";import"./p-6215e2ae.js";const n=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M13.0875 6.175L11.9125 5L6.91251 10L11.9125 15L13.0875 13.825L9.27084 10L13.0875 6.175Z"/>\n</svg>`;const c=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M8.08748 5L6.91248 6.175L10.7291 10L6.91248 13.825L8.08748 15L13.0875 10L8.08748 5Z"/>\n</svg>`;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{--border-bottom-color:var(--ic-architectural-300);--splitter-color:var(--ic-architectural-100);display:flex;max-width:100%}:host(.ic-horizontal-scroll-light){--splitter-color:var(--ic-color-keyline-lighten)}:host(.ic-horizontal-scroll-light) ic-button>svg{color:var(--ic-color-text-action-monochrome-dark)}:host(.ic-horizontal-scroll-dark){--splitter-color:var(--ic-color-keyline-darken)}:host(.ic-horizontal-scroll-dark) ic-button>svg{color:var(--ic-color-text-action-monochrome-light)}::slotted(*){overflow-x:scroll;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;margin:calc(var(--ic-space-xs) * -1) !important;padding:var(--ic-space-xs) !important}:host(.ic-horizontal-scroll-visible) ::slotted(*){margin:calc(var(--ic-space-xs) * -1) 0 !important;padding:var(--ic-space-xs) !important}.tabs-container::-webkit-scrollbar{display:none}.scroll-container-left,.scroll-container-right{display:flex}.scroll-container-left{margin-left:var(--ic-space-xxs)}.scroll-container-right{margin-right:var(--ic-space-xxs)}.hidden{display:none}.scroll-arrow{margin:var(--ic-space-xxs) 0}.disabled .ic-tooltip-container{display:none !important}.scroll-splitter-left,.scroll-splitter-right{display:flex;height:var(--ic-space-lg);width:var(--ic-space-1px);margin-top:var(--ic-space-xs);border-radius:var(--ic-space-1px);background-color:var(--splitter-color)}.scroll-splitter-left{margin-left:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.scroll-splitter-right{margin-right:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.disabled .scroll-splitter-left,.disabled .scroll-splitter-right{background-color:transparent}:host(.ic-horizontal-scroll-dark) .disabled ic-button>svg,:host(.ic-horizontal-scroll-light) .disabled ic-button>svg{color:var(--splitter-color) !important}';const d=h;const b=200;const p=class{constructor(i){t(this,i);this.buttonStateSet=false;this.firstItemVisible=true;this.itemOverflow=false;this.lastItemVisible=false;this.appearance="default";this.monochrome=false;this.theme="inherit";this.focusTrigger="focus";this.focusHandler=t=>{this.itemFocusHandler(Array.from(this.items).indexOf(t.target))};this.resizeObserverCallback=()=>{if(this.el.clientWidth>=this.itemsContainerEl.scrollWidth){this.itemOverflow=false}else{this.itemOverflow=o(this.itemsContainerEl)}if(this.itemOverflow){this.lastItemVisible=this.itemsContainerEl.offsetWidth+this.itemsContainerEl.scrollLeft>=this.itemsContainerEl.scrollWidth}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.itemsContainerEl)};this.scrollLeft=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()-1)};this.scrollRight=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()+1)};this.longScrollRight=()=>{this.scrollRight();this.scrollDelay=window.setTimeout(this.longScrollRight,b)};this.longScrollLeft=()=>{this.scrollLeft();this.scrollDelay=window.setTimeout(this.longScrollLeft,b)};this.leftArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollLeft,b)};this.rightArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollRight,b)};this.arrowMouseUpHandler=()=>{window.clearTimeout(this.scrollDelay)};this.getCurrentLeftItem=()=>{const t=this.itemOffsets.findIndex((t=>t>Math.round(this.itemsContainerEl.scrollLeft)));return t<0?0:t};this.scrollHandler=()=>{window.clearTimeout(this.isScrolling);this.isScrolling=window.setTimeout(this.scrollStopped,50)};this.scrollStopped=()=>{const t=Math.round(this.itemsContainerEl.scrollLeft);if(this.buttonStateSet===false){this.firstItemVisible=t===0;this.lastItemVisible=this.itemsContainerEl.offsetWidth+t>=this.itemsContainerEl.scrollWidth}this.buttonStateSet=false}}componentWillLoad(){this.itemsContainerEl=this.el.children[0];this.itemsContainerEl.addEventListener("scroll",this.scrollHandler);this.items=r(this.itemsContainerEl);this.items.forEach((t=>{if(t.addEventListener){t.addEventListener(this.focusTrigger,this.focusHandler)}}))}componentDidLoad(){var t;let i=0;this.itemOffsets=this.items.map((t=>{i+=t.offsetWidth;return i}));a(this.runResizeObserver);const e=Array.from(((t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelectorAll("div"))||[]);["mouseup","mouseleave"].forEach((t=>{e.forEach((i=>i.addEventListener(t,this.arrowMouseUpHandler)))}))}disconnectedCallback(){var t,i,e;if(this.resizeObserver!==undefined){this.resizeObserver.disconnect()}const s=Array.from(((t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelectorAll("div"))||[]);["mouseup","mouseleave"].forEach((t=>{s.forEach((i=>i.removeEventListener(t,this.arrowMouseUpHandler)))}));(i=this.items)===null||i===void 0?void 0:i.forEach((t=>{if(t.removeEventListener){t.removeEventListener(this.focusTrigger,this.focusHandler)}}));(e=this.itemsContainerEl)===null||e===void 0?void 0:e.removeEventListener("scroll",this.scrollHandler)}async scrollItemIntoView(t){this.firstItemVisible=t<=0;const i=t<=0?0:this.itemOffsets[t-1];this.lastItemVisible=this.itemsContainerEl.offsetWidth+i>=this.itemsContainerEl.scrollWidth;this.buttonStateSet=true;this.itemsContainerEl.scrollLeft=i}itemFocusHandler(t){if(this.itemOverflow){this.scrollItemIntoView(t)}}render(){const{firstItemVisible:t,lastItemVisible:s,itemOverflow:o}=this;return i(e,{key:"329d00bc4e7ebfab434cb41dd32e919820c5adb5",class:{["ic-horizontal-scroll-visible"]:o,["ic-horizontal-scroll-dark"]:this.appearance===l.Dark,["ic-horizontal-scroll-light"]:this.appearance===l.Light,[`ic-theme-${this.theme}`]:this.theme!=="inherit"}},i("div",{key:"ed231bf1fcd68399e29e790026b377bf8f96a14e","aria-hidden":"true",class:{["scroll-container-left"]:true,["hidden"]:!o,["disabled"]:t},role:"tab"},i("ic-button",{key:"c34f45cb44e242939985f792a21e482a11078fba",class:"scroll-arrow",variant:"icon-tertiary","aria-label":"Scroll left",theme:this.theme==="light"||this.theme==="inherit"?"dark":"light",monochrome:this.monochrome,innerHTML:n,disabled:t,tabindex:"-1",onClick:this.scrollLeft,onMouseDown:this.leftArrowMouseDownHandler}),i("span",{key:"c5b52e4cfa655f8dc499e69da531870f4e4fe216",class:"scroll-splitter-left"})),i("slot",{key:"8478dc63668ed2e842182c47e9a3b27b77ac642f"}),i("div",{key:"b9b0e21e69a40f7afda403db3db8b983257240c0","aria-hidden":"true",class:{["scroll-container-right"]:true,["hidden"]:!o,["disabled"]:s},role:"tab"},i("span",{key:"909936dddf54502bb1bdc3fdfdf36d59b5582238",class:"scroll-splitter-right"}),i("ic-button",{key:"4e9093a9da1b3e387933dfc2495f1279bb7ad180",class:"scroll-arrow",variant:"icon-tertiary","aria-label":"Scroll right",theme:this.theme==="light"||this.theme==="inherit"?"dark":"light",monochrome:this.monochrome,innerHTML:c,disabled:s,tabindex:"-1",onClick:this.scrollRight,onMouseDown:this.rightArrowMouseDownHandler})))}get el(){return s(this)}};p.style=d;export{p as ic_horizontal_scroll};
-//# sourceMappingURL=p-0f6fd5d3.entry.js.map

package/dist/core/p-0f6fd5d3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icHorizontalScrollCss","IcHorizontalScrollStyle0","SCROLL_DELAY_MS","HorizontalScroll","constructor","hostRef","this","buttonStateSet","firstItemVisible","itemOverflow","lastItemVisible","appearance","monochrome","theme","focusTrigger","focusHandler","event","itemFocusHandler","Array","from","items","indexOf","target","resizeObserverCallback","el","clientWidth","itemsContainerEl","scrollWidth","elementOverflowsX","offsetWidth","scrollLeft","runResizeObserver","resizeObserver","ResizeObserver","observe","scrollItemIntoView","getCurrentLeftItem","scrollRight","longScrollRight","scrollDelay","window","setTimeout","longScrollLeft","leftArrowMouseDownHandler","e","preventDefault","rightArrowMouseDownHandler","arrowMouseUpHandler","clearTimeout","index","itemOffsets","findIndex","Math","round","scrollHandler","isScrolling","scrollStopped","componentWillLoad","children","addEventListener","getSlotElements","forEach","item","componentDidLoad","runningTotal","map","checkResizeObserver","scrollArrows","_a","shadowRoot","querySelectorAll","arrow","disconnectedCallback","undefined","disconnect","removeEventListener","_b","_c","itemPosition","newScrollPos","render","h","Host","key","class","IcBrandForegroundEnum","Dark","Light","role","variant","innerHTML","LeftArrow","disabled","tabindex","onClick","onMouseDown","RightArrow"],"sources":["src/components/ic-horizontal-scroll/ic-horizontal-scroll.css?tag=ic-horizontal-scroll&encapsulation=shadow","src/components/ic-horizontal-scroll/ic-horizontal-scroll.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  --border-bottom-color: var(--ic-architectural-300);\n  --splitter-color: var(--ic-architectural-100);\n\n  display: flex;\n  max-width: 100%;\n}\n\n:host(.ic-horizontal-scroll-light) {\n  --splitter-color: var(--ic-color-keyline-lighten);\n}\n\n:host(.ic-horizontal-scroll-light) ic-button > svg {\n  color: var(--ic-color-text-action-monochrome-dark);\n}\n\n:host(.ic-horizontal-scroll-dark) {\n  --splitter-color: var(--ic-color-keyline-darken);\n}\n\n:host(.ic-horizontal-scroll-dark) ic-button > svg {\n  color: var(--ic-color-text-action-monochrome-light);\n}\n\n/* Slotted items container element */\n::slotted(*) {\n  overflow-x: scroll;\n  overflow-y: hidden;\n  scroll-behavior: smooth;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  margin: calc(var(--ic-space-xs) * -1) !important;\n  padding: var(--ic-space-xs) !important;\n}\n\n:host(.ic-horizontal-scroll-visible) ::slotted(*) {\n  margin: calc(var(--ic-space-xs) * -1) 0 !important;\n  padding: var(--ic-space-xs) !important;\n}\n\n.tabs-container::-webkit-scrollbar {\n  display: none;\n}\n\n.scroll-container-left,\n.scroll-container-right {\n  display: flex;\n}\n\n.scroll-container-left {\n  margin-left: var(--ic-space-xxs);\n}\n\n.scroll-container-right {\n  margin-right: var(--ic-space-xxs);\n}\n\n.hidden {\n  display: none;\n}\n\n.scroll-arrow {\n  margin: var(--ic-space-xxs) 0;\n}\n\n.disabled .ic-tooltip-container {\n  display: none !important;\n}\n\n.scroll-splitter-left,\n.scroll-splitter-right {\n  display: flex;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-1px);\n  margin-top: var(--ic-space-xs);\n  border-radius: var(--ic-space-1px);\n  background-color: var(--splitter-color);\n}\n\n.scroll-splitter-left {\n  margin-left: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.scroll-splitter-right {\n  margin-right: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.disabled .scroll-splitter-left,\n.disabled .scroll-splitter-right {\n  background-color: transparent;\n}\n\n:host(.ic-horizontal-scroll-dark) .disabled ic-button > svg,\n:host(.ic-horizontal-scroll-light) .disabled ic-button > svg {\n  color: var(--splitter-color) !important;\n}\n","import {\n  Component,\n  Element,\n  h,\n  Host,\n  State,\n  Method,\n  Prop,\n} from \"@stencil/core\";\n\nimport LeftArrow from \"./assets/left-arrow.svg\";\nimport RightArrow from \"./assets/right-arrow.svg\";\nimport { getSlotElements } from \"../../utils/helpers\";\n\nimport { checkResizeObserver, elementOverflowsX } from \"../../utils/helpers\";\nimport {\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n  IcThemeMode,\n} from \"../../utils/types\";\n\nconst SCROLL_DELAY_MS = 200;\n\n@Component({\n  tag: \"ic-horizontal-scroll\",\n  styleUrl: \"./ic-horizontal-scroll.css\",\n  shadow: true,\n})\nexport class HorizontalScroll {\n  private buttonStateSet: boolean = false;\n  private isScrolling: number;\n  private itemOffsets: number[];\n  private items: HTMLElement[];\n  private itemsContainerEl: HTMLElement;\n  private resizeObserver: ResizeObserver;\n  private scrollDelay: number;\n\n  @Element() el: HTMLIcHorizontalScrollElement;\n\n  @State() firstItemVisible: boolean = true;\n  @State() itemOverflow: boolean = false;\n  @State() lastItemVisible: boolean = false;\n\n  /**\n   * The appearance of the horizontal scroll, e.g. dark, light or the default.\n   */\n  @Prop() appearance?: IcBrandForeground = \"default\";\n\n  /** @internal Determines whether black variant of the tabs should be displayed. */\n  @Prop() monochrome?: boolean = false;\n\n  /**\n   * @internal  Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * @internal The name of the event that triggers focus handler logic.\n   */\n  @Prop() focusTrigger?: string = \"focus\";\n\n  componentWillLoad(): void {\n    this.itemsContainerEl = this.el.children[0] as HTMLElement;\n    this.itemsContainerEl.addEventListener(\"scroll\", this.scrollHandler);\n    this.items = getSlotElements(this.itemsContainerEl) as HTMLElement[];\n    this.items.forEach((item) => {\n      if (item.addEventListener) {\n        item.addEventListener(\n          this.focusTrigger as keyof HTMLElementEventMap,\n          this.focusHandler\n        );\n      }\n    });\n  }\n\n  componentDidLoad(): void {\n    let runningTotal = 0;\n    this.itemOffsets = this.items.map((item) => {\n      runningTotal += item.offsetWidth;\n      return runningTotal;\n    });\n\n    checkResizeObserver(this.runResizeObserver);\n\n    // Add event listener to scroll containers as mouse events are not fired on disabled elements (ic-button's <button>)\n    // 'mouseleave' needed in case the user moves their mouse while holding the arrow buttons\n    // - 'mouseup' otherwise not detected and scrolling not stopped\n    const scrollArrows = Array.from(\n      this.el.shadowRoot?.querySelectorAll(\"div\") || []\n    ) as HTMLElement[];\n    [\"mouseup\", \"mouseleave\"].forEach((event) => {\n      scrollArrows.forEach((arrow) =>\n        arrow.addEventListener(event, this.arrowMouseUpHandler)\n      );\n    });\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== undefined) {\n      this.resizeObserver.disconnect();\n    }\n\n    const scrollArrows = Array.from(\n      this.el.shadowRoot?.querySelectorAll(\"div\") || []\n    ) as HTMLElement[];\n    [\"mouseup\", \"mouseleave\"].forEach((event) => {\n      scrollArrows.forEach((arrow) =>\n        arrow.removeEventListener(event, this.arrowMouseUpHandler)\n      );\n    });\n\n    this.items?.forEach((item) => {\n      if (item.removeEventListener) {\n        item.removeEventListener(\n          this.focusTrigger as keyof HTMLElementEventMap,\n          this.focusHandler\n        );\n      }\n    });\n\n    this.itemsContainerEl?.removeEventListener(\"scroll\", this.scrollHandler);\n  }\n\n  /**\n   * @internal if side scrolling enabled, scrolls the specified item into view.\n   */\n  @Method()\n  async scrollItemIntoView(itemPosition: number): Promise<void> {\n    this.firstItemVisible = itemPosition <= 0;\n    const newScrollPos =\n      itemPosition <= 0 ? 0 : this.itemOffsets[itemPosition - 1];\n    this.lastItemVisible =\n      this.itemsContainerEl.offsetWidth + newScrollPos >=\n      this.itemsContainerEl.scrollWidth;\n    this.buttonStateSet = true;\n    this.itemsContainerEl.scrollLeft = newScrollPos;\n  }\n\n  private focusHandler = (event: Event) => {\n    this.itemFocusHandler(\n      Array.from(this.items).indexOf(event.target as HTMLElement)\n    );\n  };\n\n  private itemFocusHandler(itemPosition: number): void {\n    if (this.itemOverflow) {\n      this.scrollItemIntoView(itemPosition);\n    }\n  }\n\n  private resizeObserverCallback = () => {\n    if (this.el.clientWidth >= this.itemsContainerEl.scrollWidth) {\n      this.itemOverflow = false;\n    } else {\n      this.itemOverflow = elementOverflowsX(this.itemsContainerEl);\n    }\n\n    if (this.itemOverflow) {\n      this.lastItemVisible =\n        this.itemsContainerEl.offsetWidth + this.itemsContainerEl.scrollLeft >=\n        this.itemsContainerEl.scrollWidth;\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback();\n    });\n    this.resizeObserver.observe(this.itemsContainerEl);\n  };\n\n  private scrollLeft = () => {\n    this.scrollItemIntoView(this.getCurrentLeftItem() - 1);\n  };\n\n  private scrollRight = () => {\n    this.scrollItemIntoView(this.getCurrentLeftItem() + 1);\n  };\n\n  private longScrollRight = () => {\n    this.scrollRight();\n    this.scrollDelay = window.setTimeout(this.longScrollRight, SCROLL_DELAY_MS);\n  };\n\n  private longScrollLeft = () => {\n    this.scrollLeft();\n    this.scrollDelay = window.setTimeout(this.longScrollLeft, SCROLL_DELAY_MS);\n  };\n\n  private leftArrowMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    this.scrollDelay = window.setTimeout(this.longScrollLeft, SCROLL_DELAY_MS);\n  };\n\n  private rightArrowMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    this.scrollDelay = window.setTimeout(this.longScrollRight, SCROLL_DELAY_MS);\n  };\n\n  private arrowMouseUpHandler = () => {\n    window.clearTimeout(this.scrollDelay);\n  };\n\n  private getCurrentLeftItem = (): number => {\n    const index = this.itemOffsets.findIndex(\n      (el) => el > Math.round(this.itemsContainerEl.scrollLeft)\n    );\n    return index < 0 ? 0 : index;\n  };\n\n  private scrollHandler = () => {\n    window.clearTimeout(this.isScrolling);\n    // Set a timeout to run after scrolling ends\n    this.isScrolling = window.setTimeout(this.scrollStopped, 50);\n  };\n\n  private scrollStopped = () => {\n    // If scrollItemIntoView has been called, the button states will already be set\n    // Can't just handle it here as it causes strange jumping behaviour in positioning\n    const scrollLeft = Math.round(this.itemsContainerEl.scrollLeft);\n    if (this.buttonStateSet === false) {\n      this.firstItemVisible = scrollLeft === 0;\n      this.lastItemVisible =\n        this.itemsContainerEl.offsetWidth + scrollLeft >=\n        this.itemsContainerEl.scrollWidth;\n    }\n    this.buttonStateSet = false;\n  };\n\n  render() {\n    const { firstItemVisible, lastItemVisible, itemOverflow } = this;\n\n    return (\n      <Host\n        class={{\n          [\"ic-horizontal-scroll-visible\"]: itemOverflow,\n          [\"ic-horizontal-scroll-dark\"]:\n            this.appearance === IcBrandForegroundEnum.Dark,\n          [\"ic-horizontal-scroll-light\"]:\n            this.appearance === IcBrandForegroundEnum.Light,\n          [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n        }}\n      >\n        <div\n          aria-hidden=\"true\"\n          class={{\n            [\"scroll-container-left\"]: true,\n            [\"hidden\"]: !itemOverflow,\n            [\"disabled\"]: firstItemVisible,\n          }}\n          role=\"tab\"\n        >\n          <ic-button\n            class=\"scroll-arrow\"\n            variant=\"icon-tertiary\"\n            aria-label=\"Scroll left\"\n            theme={\n              this.theme === \"light\" || this.theme === \"inherit\"\n                ? \"dark\"\n                : \"light\"\n            }\n            monochrome={this.monochrome}\n            innerHTML={LeftArrow}\n            disabled={firstItemVisible}\n            tabindex=\"-1\"\n            onClick={this.scrollLeft}\n            onMouseDown={this.leftArrowMouseDownHandler}\n          ></ic-button>\n          <span class=\"scroll-splitter-left\"></span>\n        </div>\n        <slot></slot>\n        <div\n          aria-hidden=\"true\"\n          class={{\n            [\"scroll-container-right\"]: true,\n            [\"hidden\"]: !itemOverflow,\n            [\"disabled\"]: lastItemVisible,\n          }}\n          role=\"tab\"\n        >\n          <span class=\"scroll-splitter-right\"></span>\n          <ic-button\n            class=\"scroll-arrow\"\n            variant=\"icon-tertiary\"\n            aria-label=\"Scroll right\"\n            theme={\n              this.theme === \"light\" || this.theme === \"inherit\"\n                ? \"dark\"\n                : \"light\"\n            }\n            monochrome={this.monochrome}\n            innerHTML={RightArrow}\n            disabled={lastItemVisible}\n            tabindex=\"-1\"\n            onClick={this.scrollRight}\n            onMouseDown={this.rightArrowMouseDownHandler}\n          ></ic-button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-0f998905.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icPaginationItemCss","IcPaginationItemStyle0","PaginationItem","constructor","hostRef","this","disabled","label","monochrome","selected","theme","handleClick","paginationItemClick","emit","page","watchDisabledHandler","removeDisabledFalse","el","watchLabelHandler","capitalizedLabel","capitalize","componentWillLoad","render","type","h","key","class","variant","onClick","tabindex","role"],"sources":["src/components/ic-pagination-item/ic-pagination-item.css?tag=ic-pagination-item&encapsulation=shadow","src/components/ic-pagination-item/ic-pagination-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\na {\n  text-align: center;\n}\n\n.item-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: calc(var(--ic-space-xl) + var(--ic-space-sm));\n  height: var(--ic-space-xl);\n  margin: var(--ic-space-xxs) var(--ic-space-xxxs);\n  cursor: pointer;\n  text-decoration: none;\n}\n\nbutton {\n  background: none;\n  border: none;\n  outline: inherit;\n  position: relative;\n}\n\n.ellipsis {\n  pointer-events: none;\n\n  --ic-typography-color: var(--ic-pagination-ellipsis);\n}\n\n.monochrome .ellipsis {\n  --ic-typography-color: var(--ic-pagination-ellipsis-monochrome);\n}\n\n.item-container:focus {\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-fast);\n}\n\n.page {\n  --ic-typography-color: var(--ic-pagination-page-number);\n}\n\n.monochrome .page {\n  --ic-typography-color: var(--ic-pagination-page-number-monochrome);\n}\n\n.simple-current {\n  min-width: calc(var(--ic-space-xxl) + var(--ic-space-md));\n  height: var(--ic-space-lg);\n  cursor: default;\n}\n\n/** DEFAULT STATES **/\n.item-container.page:hover:not(.selected):not(:focus) {\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-pagination-hover);\n}\n\n.item-container.page:active:not(.selected):not(:focus) {\n  background-color: var(--ic-pagination-pressed);\n}\n\n.monochrome .item-container.page:hover:not(.selected):not(:focus) {\n  background-color: var(--ic-pagination-hover-monochrome);\n}\n\n.monochrome .item-container.page:active:not(.selected):not(:focus) {\n  background-color: var(--ic-pagination-pressed-monochrome);\n}\n\n.selected {\n  pointer-events: none;\n  outline: none;\n}\n\n.selected::after {\n  content: \"\";\n  height: var(--ic-space-xxs);\n  width: 100%;\n  position: absolute;\n  bottom: 0;\n  background-color: var(--ic-pagination-selected-banner);\n}\n\n.monochrome .selected::after {\n  background-color: var(--ic-pagination-selected-banner-monochrome);\n}\n\n.page-selected {\n  --ic-typography-color: var(--ic-pagination-text);\n}\n\n/** LIGHT STATES **/\n.item-container.page.light:hover:not(.selected):not(:focus) {\n  background-color: var(--ic-action-light-bg-hover);\n}\n\n.item-container.page.light:active:not(.selected):not(:focus) {\n  background-color: var(--ic-action-light-bg-pressed);\n}\n\nic-typography.light,\nic-typography.page-selected.light {\n  --ic-typography-color: var(--ic-architectural-white);\n}\n\n.selected.light::after {\n  content: \"\";\n  height: var(--ic-space-xxs);\n  width: 100%;\n  position: absolute;\n  bottom: 0;\n  background-color: var(--ic-action-monochrome);\n}\n\n/** DARK STATES **/\n.item-container.page.dark:hover:not(.selected):not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.item-container.page.dark:active:not(.selected):not(:focus) {\n  background-color: var(--ic-action-dark-bg-pressed);\n}\n\nic-typography.dark {\n  --ic-typography-color: var(--ic-color-text-primary);\n}\n\n.selected.dark::after {\n  content: \"\";\n  height: var(--ic-space-xxs);\n  width: 100%;\n  position: absolute;\n  bottom: 0;\n  background-color: var(--ic-action-monochrome-dark);\n}\n\n.disabled {\n  --ic-typography-color: var(--ic-pagination-text-disabled);\n\n  pointer-events: none;\n  cursor: none;\n  user-select: none;\n}\n\n.disabled.page ic-typography {\n  --ic-typography-color: var(--ic-pagination-page-number-disabled);\n}\n\n.disabled.ellipsis {\n  --ic-typography-color: var(--ic-pagination-ellipsis-disabled);\n}\n\n.monochrome .disabled.page {\n  --ic-typography-color: var(--ic-pagination-page-number-monochrome-disabled);\n}\n\n.monochrome .disabled.ellipsis {\n  --ic-typography-color: var(--ic-pagination-ellipsis-monochrome-disabled);\n}\n\n@media (forced-colors: active) {\n  .selected::after {\n    background-color: Highlight;\n  }\n\n  .selected.light::after {\n    background-color: Highlight;\n  }\n\n  .selected.dark::after {\n    background-color: Highlight;\n  }\n\n  .disabled {\n    --ic-typography-color: GrayText;\n  }\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Element,\n  h,\n  Event,\n  EventEmitter,\n  Watch,\n} from \"@stencil/core\";\nimport { IcPaginationItemType } from \"./ic-pagination-item.types\";\nimport { IcThemeMode } from \"../../utils/types\";\nimport { removeDisabledFalse, capitalize } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-pagination-item\",\n  styleUrl: \"ic-pagination-item.css\",\n  shadow: true,\n})\nexport class PaginationItem {\n  @Element() el: HTMLIcPaginationItemElement;\n\n  @State() capitalizedLabel: string;\n\n  /**\n   * If `true`, the pagination item will be disabled.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * The label for the pagination item (applicable when simple pagination is being used).\n   */\n  @Prop() label?: string = \"Page\";\n\n  @Watch(\"label\")\n  watchLabelHandler(): void {\n    this.capitalizedLabel = capitalize(this.label!);\n  }\n\n  /**\n   * If `true`, the pagination item will display as black in the light theme, and white in dark theme.\n   */\n  @Prop() monochrome?: boolean = false;\n\n  /**\n   * The current page number.\n   */\n  @Prop() page?: number;\n\n  /**\n   * If `true`, the pagination item will be selected.\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * The type of pagination item - 'page' or 'ellipsis'.\n   */\n  @Prop() type: IcPaginationItemType;\n\n  /**\n   * @internal - Emitted when a pagination item is clicked.\n   */\n  @Event() paginationItemClick: EventEmitter<{ page: number | null }>;\n\n  componentWillLoad(): void {\n    this.watchLabelHandler();\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  private handleClick = () => {\n    this.paginationItemClick.emit({ page: this.page || null });\n  };\n\n  render() {\n    const {\n      page,\n      selected,\n      type,\n      disabled,\n      label,\n      capitalizedLabel,\n      monochrome,\n    } = this;\n\n    return (\n      <a class={{ [\"monochrome\"]: !!monochrome }}>\n        {type === \"ellipsis\" ? (\n          <div\n            class={{\n              [\"item-container\"]: true,\n              [\"ellipsis\"]: true,\n              [\"disabled\"]: !!disabled,\n            }}\n          >\n            <ic-typography variant=\"label\">...</ic-typography>\n          </div>\n        ) : type === \"page\" ? (\n          <button\n            disabled={disabled}\n            onClick={this.handleClick}\n            tabindex={selected ? \"-1\" : \"0\"}\n            role=\"button\"\n            aria-current={selected && \"page\"}\n            aria-label={\n              selected ? `${label}: ${page}` : `Go to ${label} ${page}`\n            }\n            class={{\n              [\"selected\"]: !disabled && selected,\n              [\"disabled\"]: !!disabled,\n              [\"item-container\"]: true,\n              [\"page\"]: type === \"page\",\n            }}\n          >\n            <ic-typography\n              variant=\"label\"\n              class={{\n                [\"page-selected\"]: selected,\n                [\"disabled\"]: !!disabled,\n              }}\n            >\n              {page}\n            </ic-typography>\n          </button>\n        ) : (\n          <ic-typography\n            aria-live=\"polite\"\n            class={{\n              [`simple-current`]: true,\n              [\"disabled\"]: !!disabled,\n            }}\n            variant=\"label\"\n          >\n            {capitalizedLabel} {page}\n          </ic-typography>\n        )}\n      </a>\n    );\n  }\n}\n"],"mappings":"4HAAA,MAAMA,EAAsB,yrLAC5B,MAAAC,EAAeD,E,MCkBFE,EAAc,MAL3B,WAAAC,CAAAC,G,mEAaUC,KAAAC,SAAqB,MASrBD,KAAAE,MAAiB,OAUjBF,KAAAG,WAAuB,MAUvBH,KAAAI,SAAoB,MAKpBJ,KAAAK,MAAsB,UAiBtBL,KAAAM,YAAc,KACpBN,KAAKO,oBAAoBC,KAAK,CAAEC,KAAMT,KAAKS,MAAQ,MAAO,C,CAlD5D,oBAAAC,GACEC,EAAoBX,KAAKC,SAAUD,KAAKY,G,CAS1C,iBAAAC,GACEb,KAAKc,iBAAmBC,EAAWf,KAAKE,M,CAiC1C,iBAAAc,GACEhB,KAAKa,oBACLF,EAAoBX,KAAKC,SAAUD,KAAKY,G,CAO1C,MAAAK,GACE,MAAMR,KACJA,EAAIL,SACJA,EAAQc,KACRA,EAAIjB,SACJA,EAAQC,MACRA,EAAKY,iBACLA,EAAgBX,WAChBA,GACEH,KAEJ,OACEmB,EAAA,KAAAC,IAAA,2CAAGC,MAAO,CAAE,CAAC,gBAAiBlB,IAC3Be,IAAS,WACRC,EAAA,OACEE,MAAO,CACL,CAAC,kBAAmB,KACpB,CAAC,YAAa,KACd,CAAC,cAAepB,IAGlBkB,EAAA,iBAAeG,QAAQ,SAAO,QAE9BJ,IAAS,OACXC,EAAA,UACElB,SAAUA,EACVsB,QAASvB,KAAKM,YACdkB,SAAUpB,EAAW,KAAO,IAC5BqB,KAAK,SAAQ,eACCrB,GAAY,OAAM,aAE9BA,EAAW,GAAGF,MAAUO,IAAS,SAASP,KAASO,IAErDY,MAAO,CACL,CAAC,aAAcpB,GAAYG,EAC3B,CAAC,cAAeH,EAChB,CAAC,kBAAmB,KACpB,CAAC,QAASiB,IAAS,SAGrBC,EAAA,iBACEG,QAAQ,QACRD,MAAO,CACL,CAAC,iBAAkBjB,EACnB,CAAC,cAAeH,IAGjBQ,IAILU,EAAA,6BACY,SACVE,MAAO,CACL,CAAC,kBAAmB,KACpB,CAAC,cAAepB,GAElBqB,QAAQ,SAEPR,EAAgB,IAAGL,G","ignoreList":[]}

package/dist/core/p-107281c4.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-8e4e97b4.js";import{P as o,K as n,r as l,J as c,l as d,z as h,k as u,o as b,O as f,q as p,m,n as v,i as x}from"./p-dbc8bf0c.js";import{e as g,I as y}from"./p-6215e2ae.js";const w='/*! 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-helpertext-padding:var(--ic-space-xs);--border-color:var(--ic-text-field-border-neutral);--border-color-hover:var(--ic-text-field-border-neutral-hover);--border-color-pressed:var(--ic-text-field-border-neutral-pressed);--border-color-disabled:var(--ic-text-field-border-disabled);--border-color-error:var(--ic-text-field-border-error);--border-color-error-hover:var(--ic-text-field-border-error-hover);--border-color-error-pressed:var(--ic-text-field-border-error-pressed);--border-color-success:var(--ic-text-field-border-success);--border-color-success-hover:var(--ic-text-field-border-success-hover);--border-color-success-pressed:var(--ic-text-field-border-success-pressed);--border-color-warning:var(--ic-text-field-border-warning);--border-color-warning-hover:var(--ic-text-field-border-warning-hover);--border-color-warning-pressed:var(--ic-text-field-border-warning-pressed);--ic-input-label-text-color:var(--ic-text-field-label);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle);--ic-input-validation-status-text-color:var(--ic-text-field-state-text);--ic-input-validation-error:var(--ic-text-field-state-icon-error);--ic-input-validation-warning-icon-color:var(\n    --ic-text-field-state-icon-warning\n  );--ic-input-validation-success-icon-color:var(\n    --ic-text-field-state-icon-success\n  );--ic-input-component-container-success-icon-inline-color:var(\n    --ic-text-field-state-icon-success\n  )}:host(.ic-text-field-disabled){--ic-input-label-text-color:var(--ic-text-field-label-disabled);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle-disabled);--text-field-placeholder-color:var(\n    --ic-text-field-text-area-placeholder-text-disabled\n  )}:host(.ic-text-field-full-width){width:100%}::-moz-placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}::placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}input,textarea{border:0;border-radius:var(--ic-border-radius);color:var(--text-field-text-color, var(--ic-text-field-text));background-color:var(--input-bg-color, var(--ic-text-field-background));line-height:1.5rem;letter-spacing:0.005rem;width:100%;padding-right:var(--ic-space-xs);padding-left:var(--ic-space-xs);caret-color:var(\n    --text-field-typing-cursor,\n    var(--ic-text-field-typing-cursor)\n  )}textarea{min-height:var(--ic-space-lg);resize:vertical;padding-top:0.375rem}input:focus,textarea:focus{border:0;outline:0}input:disabled,textarea:disabled{color:var(\n    --text-field-disabled-text-color,\n    var(--ic-text-field-text-disabled)\n  )}input.readonly,textarea.readonly{color:var(--ic-text-field-read-only-input-text-internal);background:transparent}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}textarea.no-resize{resize:none}.char-count-text{--ic-typography-color:var(--ic-text-field-character-limit);padding-right:var(--ic-space-xxxs)}:host(.ic-text-field-disabled) .char-count-text{--ic-typography-color:var(--ic-text-field-character-limit-disabled)}.no-left-pad{padding-left:0}::slotted([slot="icon"]){fill:var(--ic-text-field-text-disabled)}.has-value ::slotted([slot="icon"]){fill:var(--ic-text-field-input-internal-icon)}.char-count{margin-right:calc(-1 * var(--ic-space-xxxs))}.remaining-char-count-desc{position:absolute;left:-9999px}.show-validation{margin-top:var(--ic-space-xs)}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-results-button,input[type="search"]::-webkit-search-results-decoration{display:none}input[type="search"].truncate-value{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}@media (forced-colors: active){input.readonly,textarea.readonly{color:canvastext}.has-value ::slotted([slot="icon"]){fill:currentcolor}}';const k=w;let z=0;const C=[...y,"title"];const $=class{constructor(a){e(this,a);this.getValidationText=t(this,"getValidationText",7);this.icBlur=t(this,"icBlur",7);this.icChange=t(this,"icChange",7);this.icFocus=t(this,"icFocus",7);this.icInput=t(this,"icInput",7);this.icKeydown=t(this,"icKeydown",7);this.icScroll=t(this,"icScroll",7);this.inheritedAttributes={};this.hostMutationObserver=null;this.numChars=0;this.maxCharactersReached=false;this.maxCharactersWarning=false;this.minCharactersUnattained=false;this.maxValueExceeded=false;this.minValueUnattained=false;this.isFocussed=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autofocus=false;this.disabled=false;this.fullWidth=false;this.helperText="";this.hideCharCount=false;this.hideLabel=false;this.hiddenInput=true;this.inputId=`ic-text-field-input-${z++}`;this.inputmode="text";this.maxCharacters=0;this.maxCharactersMessage=`Maximum input is ${this.maxCharacters} characters`;this.maxMessage=`Maximum value of ${this.max} exceeded`;this.minCharacters=0;this.minCharactersMessage=`Minimum input is ${this.minCharacters} characters`;this.minMessage=`Minimum value of ${this.min} not met`;this.name=this.inputId;this.placeholder="";this.readonly=false;this.required=false;this.resize=false;this.rows=1;this.size="medium";this.spellcheck=false;this.theme="inherit";this.truncateValue=false;this.type="text";this.validationAriaLive="default";this.validationInline=false;this.validationInlineInternal=false;this.validationStatus="";this.validationText="";this.debounce=0;this.value="";this.initialValue=this.value;this.checkChildHydration=()=>{var e,t;if(this.hideLabel||((t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("ic-typography"))===null||t===void 0?void 0:t.classList.contains("hydrated"))){this.setFocus();clearInterval(this.interval)}};this.getNumberOfCharacters=e=>e!==null&&e!==undefined?e.length:0;this.getMaxValueExceeded=e=>{this.numChars=this.getNumberOfCharacters(e);if(this.type==="number"){this.minValueUnattained=!!e&&Number(e)<Number(this.min);this.maxValueExceeded=Number(e)>Number(this.max)}};this.getMaxCharactersReached=e=>{this.numChars=this.getNumberOfCharacters(e);this.maxCharactersReached=this.maxCharacters>0&&this.numChars>=this.maxCharacters;if(this.maxCharactersWarning&&!this.maxCharactersReached){this.maxCharactersWarning=false}};this.onInput=e=>{this.value=e.target.value;this.icInput.emit({value:this.value})};this.onBlur=e=>{const t=e.target;t.removeEventListener("wheel",this.onWheel);const{value:i}=t;this.numChars=i.length;this.minCharactersUnattained=this.minCharacters>0&&this.numChars<this.minCharacters;this.icBlur.emit({value:i});this.isFocussed=false};this.onFocus=e=>{const t=e.target;t.addEventListener("wheel",this.onWheel);this.icFocus.emit({value:t.value});this.isFocussed=true};this.onTextAreaScroll=()=>{this.icScroll.emit()};this.onWheel=e=>{const t=e.target;if(t.type==="number"){t.blur();setTimeout((()=>{t.focus()}),0)}};this.hasStatus=e=>e!==""&&!this.disabled;this.handleFormReset=()=>{this.value=this.initialValue};this.showValidationMargin=()=>{const e=this.readonly?0:this.maxCharacters;const t=o(this.validationStatus)||o(this.validationText);const i=this.minValueUnattained||this.maxValueExceeded;const a=e>0||this.minCharactersUnattained;return(!t||i||a)&&!this.validationInlineInternal};this.hostMutationCallback=e=>{let t=false;e.forEach((({attributeName:e,type:i,addedNodes:a,removedNodes:s})=>{if(e&&C.includes(e)){const i=this.el.getAttribute(e);if(i){this.inheritedAttributes[e]=i}t=true}else if(i==="childList"){t=n(a,s,"icon")}}));if(t){i(this)}}}watchDisabledHandler(){l(this.disabled,this.el)}debounceChanged(){this.icChange=c(this.icChange,this.debounce)}watchValueHandler(e){let t;if(this.maxCharacters>0){t=e.substring(0,this.maxCharacters);if(t.length<e.length){this.maxCharactersWarning=true}this.value=t}else{t=e}if(this.inputEl&&this.inputEl.value!==t){this.inputEl.value=t}this.getMaxValueExceeded(t);this.getMaxCharactersReached(t);this.icChange.emit({value:t})}connectedCallback(){this.debounceChanged()}disconnectedCallback(){var e;d(this.el,this.handleFormReset);(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentWillLoad(){if(this.value!==this.initialValue){this.watchValueHandler(this.value)}else if(this.maxCharacters>0){this.value=this.value.substring(0,this.maxCharacters)}this.getMaxValueExceeded(this.value);this.getMaxCharactersReached(this.value);this.inheritedAttributes=h(this.el,C);if(this.readonly){this.maxValueExceeded=false;this.minValueUnattained=false}u(this.el,this.handleFormReset);l(this.disabled,this.el)}componentDidLoad(){b([{prop:this.label,propName:"label"}],"Text Field");if(this.validationInlineInternal){this.getValidationText.emit({value:this.validationText})}this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{attributes:true,childList:true});if(this.autofocus&&!this.disabled&&!this.readonly){this.interval=setInterval(this.checkChildHydration,50)}}handleKeyDown(e){var t,i;this.icKeydown.emit({event:e,cursorPosition:(t=this.inputEl.selectionStart)!==null&&t!==void 0?t:0,selectionEnd:(i=this.inputEl.selectionEnd)!==null&&i!==void 0?i:0});if(!e.ctrlKey&&!g.includes(e.key)){this.maxCharactersWarning=this.maxCharactersReached}}async setFocus(){var e;(e=this.inputEl)===null||e===void 0?void 0:e.focus()}render(){const{inputId:e,name:t,label:i,required:r,size:o,placeholder:n,helperText:l,hideCharCount:c,rows:d,resize:h,disabled:u,value:b,min:g,max:y,numChars:w,readonly:k,maxCharacters:z,maxCharactersMessage:C,maxCharactersWarning:$,maxCharactersReached:I,maxMessage:M,minCharacters:L,minCharactersMessage:N,minCharactersUnattained:T,minMessage:j,minValueUnattained:q,maxValueExceeded:F,validationAriaLive:V,validationStatus:D,validationText:H,validationInline:O,validationInlineInternal:W,spellcheck:B,inputmode:S,fullWidth:A,truncateValue:E,hiddenInput:K,theme:P,hideLabel:U,type:_,autocapitalize:J,ariaActiveDescendant:R,inheritedAttributes:G,ariaExpanded:Q,ariaOwns:X,autocomplete:Y,role:Z,isFocussed:ee}=this;const te=this.el;const ie=k||u;const ae=F||q||T||$?$?f.Warning:f.Error:D;const se=$?C:F?M:q?j:T?N:H;const re=k?0:z;const oe=V==="default"?$||F||q||ae===f.Error?"assertive":"polite":V;const ne=this.hasStatus(ae)&&!(ae==f.Success&&O)&&!W;const le=d>1;const ce=z>0?`${e}-char-count-desc`:"";const de=re-w;const he=z>0?`${e}-remaining-char-count-desc`:"";const ue=`${de} character${de===1?"":"s"} remaining.`;const be=`${p(this.el,e,l!=="",ne)} ${ce} ${w>0?he:""}`.trim();const fe=ie&&!k;const pe=!!this.el.querySelector(`[slot="icon"]`)&&!fe;const me=`${ae===f.Error}`;K?m(this.el,b,t,ie):v(this.el);return a(s,{key:"c94560bea90464d881f323a308aa17926a2ff1e6",class:{"ic-text-field-full-width":A,"ic-text-field-disabled":ie,[`ic-theme-${P}`]:P!=="inherit"}},a("ic-input-container",{key:"cf76ec0c26f5003f66707b697df8c6e065872a66",readonly:k,disabled:ie},!U&&a("ic-input-label",{key:"0e8b2170e02cafadcda1cd7c73b1fe0d17695247",for:e,label:i,helperText:l,required:r,disabled:fe,readonly:k},a("slot",{key:"fb77e901d7b762bcdbe4b5aa1c448602617d1951",name:"helper-text",slot:"helper-text"})),a("ic-input-component-container",{key:"51aff4fba6d8c8e474ebfc27f77c560cce1125f8",size:o,validationStatus:ae,multiLine:le,disabled:ie,readonly:k,validationInline:O,fullWidth:A},pe&&a("span",{key:"85df3728d49c37c33e1fe792973c527137431a78",class:{readonly:k,"has-value":this.getNumberOfCharacters(b)>0},slot:"left-icon"},a("slot",{key:"dc4cbe888dbe0e864102f60496be589951c4e610",name:"icon"})),!le?a("input",Object.assign({id:e,name:t,ref:e=>this.inputEl=e,type:_,min:g,max:y,value:b,class:{"no-left-pad":!pe&&k,readonly:k,"truncate-value":E},placeholder:n?n:"",required:r,disabled:ie,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,"aria-label":i,"aria-describedby":be,"aria-invalid":me,"aria-activedescendant":R,"aria-expanded":Q,"aria-owns":X,autocomplete:Y,autocapitalize:J,spellcheck:B,inputmode:S,role:Z||undefined,maxlength:I?z:undefined,minlength:T?L:undefined},G)):a("textarea",Object.assign({id:e,class:{"no-resize":h===false||!!k,"no-left-pad":!pe&&!!k,readonly:!!k},name:t,ref:e=>this.inputEl=e,value:b,rows:d,required:r,disabled:ie,placeholder:n,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,onScroll:this.onTextAreaScroll,"aria-label":i,"aria-describedby":be,"aria-invalid":me,autocomplete:Y,autocapitalize:J,spellcheck:B,inputmode:S,maxlength:I?z:undefined,minlength:T?L:undefined},G)),x(te,"clear-button")&&a("slot",{key:"6faa3c12856f4f6c10158af49f14b51d5dac92e8",name:"clear-button"}),x(te,"search-submit-button")&&a("slot",{key:"c18e08b7ae93e3f65e0410af0b6d64eb418e3940",name:"search-submit-button"})),x(te,"menu")&&a("slot",{key:"e1a46ef6a4d97c4910df75941d6608a7765d127a",name:"menu"}),a("ic-input-validation",{key:"e963d95a1e5bfc767c35b798c61bcf958dbcdfa6",class:{"show-validation":this.showValidationMargin()},status:this.hasStatus(ae)===false||ae===f.Success&&O||W?"":ae,message:ne?se:"",ariaLiveMode:oe,for:e,fullWidth:A},x(te,"validation-text")&&a("slot",{key:"4b5817e1c52b9af6511e07c202e5eb0e8457689d",name:"validation-text",slot:"validation-message"}),!k&&re>0&&a("div",{key:"059e8dc7ffbb0225d0c901821ff53d5b90ddf9f1",slot:"validation-message-adornment"},!c&&a("ic-typography",{key:"afe9cb357584f91fd2762d2c9f87d68eb7e25e68",variant:"caption",class:"char-count-text"},a("span",{key:"583f62c58407615b2ce37edb17eed4928952e6ee",class:"char-count"},w,"/",re)),a("span",{key:"953722d8ddd1d3c4e187308944fdd0723e8e8e70",class:"remaining-char-count-desc","aria-live":"polite",hidden:!ee,id:he},ue),a("span",{key:"973adba9f9c7dca2409423f36af8dc4a9a3a7192",hidden:true,id:ce},"Field can contain a maximum of ",re," characters.")))))}get el(){return r(this)}static get watchers(){return{disabled:["watchDisabledHandler"],debounce:["debounceChanged"],value:["watchValueHandler"]}}};$.style=k;export{$ as ic_text_field};
-//# sourceMappingURL=p-107281c4.entry.js.map

package/dist/core/p-107281c4.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icTextFieldCss","IcTextFieldStyle0","inputIds","MUTABLE_ATTRIBUTES","IC_INHERITED_ARIA","TextField","constructor","hostRef","this","inheritedAttributes","hostMutationObserver","numChars","maxCharactersReached","maxCharactersWarning","minCharactersUnattained","maxValueExceeded","minValueUnattained","isFocussed","autocapitalize","autocomplete","autocorrect","autofocus","disabled","fullWidth","helperText","hideCharCount","hideLabel","hiddenInput","inputId","inputmode","maxCharacters","maxCharactersMessage","maxMessage","max","minCharacters","minCharactersMessage","minMessage","min","name","placeholder","readonly","required","resize","rows","size","spellcheck","theme","truncateValue","type","validationAriaLive","validationInline","validationInlineInternal","validationStatus","validationText","debounce","value","initialValue","checkChildHydration","_b","_a","el","shadowRoot","querySelector","classList","contains","setFocus","clearInterval","interval","getNumberOfCharacters","undefined","length","getMaxValueExceeded","Number","getMaxCharactersReached","onInput","ev","target","icInput","emit","onBlur","removeEventListener","onWheel","icBlur","onFocus","addEventListener","icFocus","onTextAreaScroll","icScroll","blur","setTimeout","focus","hasStatus","status","handleFormReset","showValidationMargin","maxNumChars","emptyString","isEmptyString","valueOutsideRange","charsOutsideRange","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","addedNodes","removedNodes","includes","attribute","getAttribute","checkSlotInChildMutations","forceUpdate","watchDisabledHandler","removeDisabledFalse","debounceChanged","icChange","debounceEvent","watchValueHandler","newValue","substring","inputEl","connectedCallback","disconnectedCallback","removeFormResetListener","disconnect","componentWillLoad","inheritAttributes","addFormResetListener","componentDidLoad","onComponentRequiredPropUndefined","prop","label","propName","getValidationText","MutationObserver","observe","attributes","childList","setInterval","handleKeyDown","icKeydown","event","cursorPosition","selectionStart","selectionEnd","ctrlKey","IGNORED_KEYBOARD_CHARACTERS","key","render","ariaActiveDescendant","ariaExpanded","ariaOwns","role","disabledMode","currentStatus","IcInformationStatus","Warning","Error","currentValidationText","messageAriaLive","showStatusText","Success","multiline","hiddenCharCountDescId","charsRemaining","remainingCharCountDescId","remainingCharCountDesc","describedBy","getInputDescribedByText","trim","disabledText","showLeftIcon","invalid","renderHiddenInput","removeHiddenInput","h","Host","class","for","slot","multiLine","Object","assign","id","ref","maxlength","minlength","onScroll","isSlotUsed","message","ariaLiveMode","variant","hidden"],"sources":["src/components/ic-text-field/ic-text-field.css?tag=ic-text-field&encapsulation=shadow","src/components/ic-text-field/ic-text-field.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --input-width: Width of the input field\n   */\n  display: block;\n\n  --ic-input-label-helpertext-padding: var(--ic-space-xs);\n  --border-color: var(--ic-text-field-border-neutral);\n  --border-color-hover: var(--ic-text-field-border-neutral-hover);\n  --border-color-pressed: var(--ic-text-field-border-neutral-pressed);\n  --border-color-disabled: var(--ic-text-field-border-disabled);\n  --border-color-error: var(--ic-text-field-border-error);\n  --border-color-error-hover: var(--ic-text-field-border-error-hover);\n  --border-color-error-pressed: var(--ic-text-field-border-error-pressed);\n  --border-color-success: var(--ic-text-field-border-success);\n  --border-color-success-hover: var(--ic-text-field-border-success-hover);\n  --border-color-success-pressed: var(--ic-text-field-border-success-pressed);\n  --border-color-warning: var(--ic-text-field-border-warning);\n  --border-color-warning-hover: var(--ic-text-field-border-warning-hover);\n  --border-color-warning-pressed: var(--ic-text-field-border-warning-pressed);\n  --ic-input-label-text-color: var(--ic-text-field-label);\n  --ic-input-label-helper-text-color: var(--ic-text-field-subtitle);\n  --ic-input-validation-status-text-color: var(--ic-text-field-state-text);\n  --ic-input-validation-error: var(--ic-text-field-state-icon-error);\n  --ic-input-validation-warning-icon-color: var(\n    --ic-text-field-state-icon-warning\n  );\n  --ic-input-validation-success-icon-color: var(\n    --ic-text-field-state-icon-success\n  );\n  --ic-input-component-container-success-icon-inline-color: var(\n    --ic-text-field-state-icon-success\n  );\n}\n\n:host(.ic-text-field-disabled) {\n  --ic-input-label-text-color: var(--ic-text-field-label-disabled);\n  --ic-input-label-helper-text-color: var(--ic-text-field-subtitle-disabled);\n  --text-field-placeholder-color: var(\n    --ic-text-field-text-area-placeholder-text-disabled\n  );\n}\n\n:host(.ic-text-field-full-width) {\n  width: 100%;\n}\n\n::placeholder {\n  color: var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );\n  opacity: 1;\n}\n\ninput,\ntextarea {\n  border: 0;\n  border-radius: var(--ic-border-radius);\n  color: var(--text-field-text-color, var(--ic-text-field-text));\n  background-color: var(--input-bg-color, var(--ic-text-field-background));\n  line-height: 1.5rem;\n  letter-spacing: 0.005rem;\n  width: 100%;\n  padding-right: var(--ic-space-xs);\n  padding-left: var(--ic-space-xs);\n  caret-color: var(\n    --text-field-typing-cursor,\n    var(--ic-text-field-typing-cursor)\n  );\n}\n\ntextarea {\n  min-height: var(--ic-space-lg);\n  resize: vertical;\n  padding-top: 0.375rem;\n}\n\ninput:focus,\ntextarea:focus {\n  border: 0;\n  outline: 0;\n}\n\ninput:disabled,\ntextarea:disabled {\n  color: var(\n    --text-field-disabled-text-color,\n    var(--ic-text-field-text-disabled)\n  );\n}\n\ninput.readonly,\ntextarea.readonly {\n  color: var(--ic-text-field-read-only-input-text-internal);\n  background: transparent;\n}\n\n/* Chrome, Safari, Edge */\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n/* Firefox */\ninput[type=\"number\"] {\n  -moz-appearance: textfield;\n}\n\ntextarea.no-resize {\n  resize: none;\n}\n\n.char-count-text {\n  --ic-typography-color: var(--ic-text-field-character-limit);\n\n  padding-right: var(--ic-space-xxxs);\n}\n\n:host(.ic-text-field-disabled) .char-count-text {\n  --ic-typography-color: var(--ic-text-field-character-limit-disabled);\n}\n\n.no-left-pad {\n  padding-left: 0;\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-text-field-text-disabled);\n}\n\n.has-value ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-text-field-input-internal-icon);\n}\n\n.char-count {\n  margin-right: calc(-1 * var(--ic-space-xxxs));\n}\n\n.remaining-char-count-desc {\n  position: absolute;\n  left: -9999px;\n}\n\n.show-validation {\n  margin-top: var(--ic-space-xs);\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n  display: none;\n}\n\ninput[type=\"search\"].truncate-value {\n  width: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n@media (forced-colors: active) {\n  input.readonly,\n  textarea.readonly {\n    color: canvastext;\n  }\n\n  .has-value ::slotted([slot=\"icon\"]) {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  h,\n  forceUpdate,\n} from \"@stencil/core\";\nimport {\n  IcInformationStatus,\n  IcAutocompleteTypes,\n  IcAutocorrectStates,\n  IcInformationStatusOrEmpty,\n  IcValueEventDetail,\n  IcSizesNoLarge,\n  IcThemeMode,\n  IcValidationAriaLive,\n} from \"../../utils/types\";\nimport {\n  inheritAttributes,\n  debounceEvent,\n  getInputDescribedByText,\n  renderHiddenInput,\n  isEmptyString,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n  isSlotUsed,\n  removeDisabledFalse,\n  checkSlotInChildMutations,\n  removeHiddenInput,\n} from \"../../utils/helpers\";\nimport {\n  IC_INHERITED_ARIA,\n  IGNORED_KEYBOARD_CHARACTERS,\n} from \"../../utils/constants\";\nimport {\n  IcAriaAutocompleteTypes,\n  IcTextFieldInputModes,\n  IcTextFieldKeydownEventDetail,\n  IcTextFieldTypes,\n} from \"./ic-text-field.types\";\n\nlet inputIds = 0;\nconst MUTABLE_ATTRIBUTES = [...IC_INHERITED_ARIA, \"title\"];\n\n/**\n * @slot helper-text - Content is set as the helper text for the text field.\n * @slot validation-text - Content is set as validation text for the text field.\n * @slot icon - Content will be placed to the left of the text input.\n */\n@Component({\n  tag: \"ic-text-field\",\n  styleUrl: \"ic-text-field.css\",\n  shadow: true,\n})\nexport class TextField {\n  private inheritedAttributes: { [k: string]: string } = {};\n  private inputEl: HTMLInputElement | HTMLTextAreaElement;\n  private hostMutationObserver: MutationObserver | null = null;\n  private interval: ReturnType<typeof setInterval>;\n\n  @Element() el: HTMLIcTextFieldElement;\n\n  @State() numChars: number = 0;\n  @State() maxCharactersReached: boolean = false;\n  @State() maxCharactersWarning: boolean = false;\n  @State() minCharactersUnattained: boolean = false;\n  @State() maxValueExceeded: boolean = false;\n  @State() minValueUnattained: boolean = false;\n  @State() isFocussed: boolean = false;\n\n  /**\n   * @slot clear-button - an ic-button clear component will render as an end adornment to the input.\n   * @slot search-submit-button - an ic-button search submit component will render as an end adornment to the input.\n   * @slot menu - an ic-menu component will appear below the input.\n   */\n\n  /**\n   * @internal The active element when focus is on the ic-menu items.\n   */\n  @Prop() ariaActiveDescendant?: string;\n\n  /**\n   * @internal Used to identify whether inputting any text triggers more predictions\n   */\n  @Prop() ariaAutocomplete?: IcAriaAutocompleteTypes;\n\n  /**\n   * @internal Used to identify if the slotted menu is rendered\n   */\n  @Prop() ariaExpanded: string | null;\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaOwns?: string;\n\n  /**\n   * The automatic capitalisation of the text value as it is entered/edited by the user.\n   * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n   */\n  @Prop() autocapitalize = \"off\";\n\n  /**\n   * The state of autocompletion the browser can apply on the text value.\n   */\n  @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n  /**\n   * The state of autocorrection the browser can apply when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n  /**\n   * If `true`, the form control will have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el as HTMLElement);\n  }\n\n  /**\n   * Specify whether the text field fills the full width of the container.\n   * If `true`, this overrides the --input-width CSS variable.\n   */\n  @Prop() fullWidth = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText = \"\";\n\n  /**\n   * If `true`, the character count which is displayed when `maxCharacters` is set will be visually hidden.\n   */\n  @Prop() hideCharCount = false;\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 = false;\n\n  /**\n   * @internal If `true`, the hidden form input will stop rendering for form submission.\n   */\n  @Prop() hiddenInput = true;\n\n  /**\n   * The ID for the input.\n   */\n  @Prop() inputId = `ic-text-field-input-${inputIds++}`;\n\n  /**\n   * A hint to the browser for which keyboard to display.\n   * Possible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n   * `\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n   */\n  @Prop() inputmode: IcTextFieldInputModes = \"text\";\n\n  /**\n   * The label for the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The maximum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of max value in `helperText` or `label`)\n   */\n  @Prop() max?: string | number;\n\n  /**\n   * The count of characters in the field. Will display a warning if the bound is reached. (NOTE: If the value of the text field has been set using the `value` prop, it will be truncated to this number of characters)\n   */\n  @Prop() maxCharacters = 0;\n\n  /**\n   * The text to display as the warning message when the maximum number of characters (the `maxCharacters` prop value) is reached.\n   */\n  // prettier-ignore\n  @Prop() maxCharactersMessage = `Maximum input is ${this.maxCharacters} characters`;\n\n  /**\n   * The text to display as the error message when the maximum value (the `max` prop value) has been exceeded.\n   */\n  @Prop() maxMessage = `Maximum value of ${this.max} exceeded`;\n\n  /**\n   * The minimum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of min value in `helperText` or `label`)\n   */\n  @Prop() min?: string | number;\n\n  /**\n   * The minimum number of characters that can be entered in the field.\n   */\n  @Prop() minCharacters = 0;\n\n  /**\n   * The text to display as the error message when the minimum number of characters (the `minCharacters` prop value) has not been met.\n   */\n  // prettier-ignore\n  @Prop() minCharactersMessage = `Minimum input is ${this.minCharacters} characters`;\n\n  /**\n   * The text to display as the error message when the minimum value (the `min` prop value) has not been met.\n   */\n  @Prop() minMessage = `Minimum value of ${this.min} not met`;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name = this.inputId;\n\n  /**\n   * The placeholder value to be displayed.\n   */\n  @Prop() placeholder = \"\";\n\n  /**\n   * If `true`, the read only state will be set.\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * If `true`, the input will require a value.\n   */\n  @Prop() required = false;\n\n  /**\n   * If `true`, the multiline text area will be resizeable.\n   */\n  @Prop() resize = false;\n\n  /**\n   * @internal Used to set the role if not default textbox;\n   */\n  @Prop() role: string | null;\n\n  /**\n   * The number of rows to transform the text field into a text area with a specific height.\n   */\n  @Prop() rows = 1;\n\n  /**\n   * The size of the text field component.\n   */\n  @Prop() size: IcSizesNoLarge = \"medium\";\n\n  /**\n   * If `true`, the value of the text field will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck = false;\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n\n  /**\n   * @internal If `true`, an ellipsis will be displayed at the end of the value if the value is longer than the container.\n   */\n  @Prop() truncateValue = false;\n\n  /**\n   * The type of control to display. The default type is text.\n   */\n  @Prop() type: IcTextFieldTypes = \"text\";\n\n  /**\n   * The value of the `aria-live` attribute on the validation message. When set to \"default\", the `aria-live` value will be handled automatically, e.g. \"assertive\" for `validation-status=\"error\"`.\n   */\n  @Prop() validationAriaLive: IcValidationAriaLive = \"default\";\n\n  /**\n   * If `true`, the icon in input control will be displayed - only applies when validationStatus ='success'.\n   */\n  @Prop() validationInline = false;\n\n  /**\n   *  @internal If `true`, the validation will display inline.\n   */\n  @Prop() validationInlineInternal = false;\n\n  /**\n   * The validation state - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The text to display as the validation message.\n   */\n  @Prop() validationText: string = \"\";\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop() debounce = 0;\n  @Watch(\"debounce\")\n  private debounceChanged() {\n    this.icChange = debounceEvent(this.icChange, this.debounce);\n  }\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value = \"\";\n  @State() initialValue = this.value;\n  @Watch(\"value\")\n  private watchValueHandler(newValue: string): void {\n    let value;\n\n    if (this.maxCharacters > 0) {\n      value = newValue.substring(0, this.maxCharacters);\n      if (value.length < newValue.length) {\n        this.maxCharactersWarning = true;\n      }\n      this.value = value;\n    } else {\n      value = newValue;\n    }\n\n    if (this.inputEl && this.inputEl.value !== value) {\n      this.inputEl.value = value;\n    }\n\n    this.getMaxValueExceeded(value);\n\n    this.getMaxCharactersReached(value);\n\n    this.icChange.emit({ value });\n  }\n\n  /**\n   * @internal Emitted when the validationInlineInternal is `true`\n   */\n  @Event() getValidationText: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input loses focus.\n   */\n  @Event() icBlur: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input gains focus.\n   */\n  @Event() icFocus: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keydown event occurred.\n   */\n  @Event() icKeydown: EventEmitter<IcTextFieldKeydownEventDetail>;\n\n  /**\n   * Emitted when the textarea variant is scrolled.\n   */\n  @Event() icScroll: EventEmitter;\n\n  connectedCallback(): void {\n    this.debounceChanged();\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.el as HTMLElement, this.handleFormReset);\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    if (this.value !== this.initialValue) {\n      this.watchValueHandler(this.value);\n    } else if (this.maxCharacters > 0) {\n      this.value = this.value.substring(0, this.maxCharacters);\n    }\n\n    this.getMaxValueExceeded(this.value);\n    this.getMaxCharactersReached(this.value);\n\n    this.inheritedAttributes = inheritAttributes(\n      this.el as HTMLElement,\n      MUTABLE_ATTRIBUTES\n    );\n\n    if (this.readonly) {\n      this.maxValueExceeded = false;\n      this.minValueUnattained = false;\n    }\n\n    addFormResetListener(this.el as HTMLElement, this.handleFormReset);\n\n    removeDisabledFalse(this.disabled, this.el as HTMLElement);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Text Field\"\n    );\n    if (this.validationInlineInternal) {\n      this.getValidationText.emit({ value: this.validationText });\n    }\n\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, {\n      attributes: true,\n      childList: true,\n    });\n\n    if (this.autofocus && !this.disabled && !this.readonly) {\n      this.interval = setInterval(this.checkChildHydration, 50);\n    }\n  }\n\n  private checkChildHydration = () => {\n    if (\n      this.hideLabel ||\n      this.el.shadowRoot\n        ?.querySelector(\"ic-typography\")\n        ?.classList.contains(\"hydrated\")\n    ) {\n      this.setFocus();\n      clearInterval(this.interval);\n    }\n  };\n\n  @Listen(\"keydown\", {})\n  handleKeyDown(ev: KeyboardEvent): void {\n    this.icKeydown.emit({\n      event: ev,\n      cursorPosition: this.inputEl.selectionStart ?? 0,\n      selectionEnd: this.inputEl.selectionEnd ?? 0,\n    });\n\n    if (!ev.ctrlKey && !IGNORED_KEYBOARD_CHARACTERS.includes(ev.key)) {\n      this.maxCharactersWarning = this.maxCharactersReached;\n    }\n  }\n\n  /**\n   * Sets focus on the native `input`.\n   */\n\n  @Method()\n  async setFocus(): Promise<void> {\n    this.inputEl?.focus();\n  }\n\n  private getNumberOfCharacters = (value: string) =>\n    value !== null && value !== undefined ? value.length : 0;\n\n  private getMaxValueExceeded = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    if (this.type === \"number\") {\n      this.minValueUnattained = !!value && Number(value) < Number(this.min);\n      this.maxValueExceeded = Number(value) > Number(this.max);\n    }\n  };\n\n  private getMaxCharactersReached = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    this.maxCharactersReached =\n      this.maxCharacters > 0 && this.numChars >= this.maxCharacters;\n\n    if (this.maxCharactersWarning && !this.maxCharactersReached) {\n      this.maxCharactersWarning = false;\n    }\n  };\n\n  private onInput = (ev: Event) => {\n    this.value = (ev.target as HTMLInputElement).value;\n    this.icInput.emit({ value: this.value });\n  };\n\n  private onBlur = (ev: Event) => {\n    const target = ev.target as HTMLInputElement;\n    target.removeEventListener(\"wheel\", this.onWheel);\n    const { value } = target;\n    this.numChars = value.length;\n    this.minCharactersUnattained =\n      this.minCharacters > 0 && this.numChars < this.minCharacters;\n    this.icBlur.emit({ value });\n    this.isFocussed = false;\n  };\n\n  private onFocus = (ev: Event) => {\n    const target = ev.target as HTMLInputElement;\n    target.addEventListener(\"wheel\", this.onWheel);\n    this.icFocus.emit({ value: target.value });\n    this.isFocussed = true;\n  };\n\n  private onTextAreaScroll = () => {\n    this.icScroll.emit();\n  };\n\n  private onWheel = (ev: WheelEvent) => {\n    const target = ev.target as HTMLInputElement;\n    if (target.type === \"number\") {\n      target.blur();\n      setTimeout(() => {\n        target.focus();\n      }, 0);\n    }\n  };\n\n  private hasStatus = (status: IcInformationStatusOrEmpty) =>\n    status !== \"\" && !this.disabled;\n\n  private handleFormReset = (): void => {\n    this.value = this.initialValue;\n  };\n\n  private showValidationMargin = (): boolean => {\n    const maxNumChars = this.readonly ? 0 : this.maxCharacters;\n    const emptyString =\n      isEmptyString(this.validationStatus) ||\n      isEmptyString(this.validationText);\n    const valueOutsideRange = this.minValueUnattained || this.maxValueExceeded;\n    const charsOutsideRange = maxNumChars > 0 || this.minCharactersUnattained;\n    return (\n      (!emptyString || valueOutsideRange || charsOutsideRange) &&\n      !this.validationInlineInternal\n    );\n  };\n\n  // triggered when attributes of host element change\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(\n      ({ attributeName, type, addedNodes, removedNodes }) => {\n        if (attributeName && MUTABLE_ATTRIBUTES.includes(attributeName)) {\n          const attribute = this.el.getAttribute(attributeName);\n          if (attribute) {\n            this.inheritedAttributes[attributeName] = attribute;\n          }\n          forceComponentUpdate = true;\n        } else if (type === \"childList\") {\n          forceComponentUpdate = checkSlotInChildMutations(\n            addedNodes,\n            removedNodes,\n            \"icon\"\n          );\n        }\n      }\n    );\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  render() {\n    const {\n      inputId,\n      name,\n      label,\n      required,\n      size,\n      placeholder,\n      helperText,\n      hideCharCount,\n      rows,\n      resize,\n      disabled,\n      value,\n      min,\n      max,\n      numChars,\n      readonly,\n      maxCharacters,\n      maxCharactersMessage,\n      maxCharactersWarning,\n      maxCharactersReached,\n      maxMessage,\n      minCharacters,\n      minCharactersMessage,\n      minCharactersUnattained,\n      minMessage,\n      minValueUnattained,\n      maxValueExceeded,\n      validationAriaLive,\n      validationStatus,\n      validationText,\n      validationInline,\n      validationInlineInternal,\n      spellcheck,\n      inputmode,\n      fullWidth,\n      truncateValue,\n      hiddenInput,\n      theme,\n      hideLabel,\n      type,\n      autocapitalize,\n      ariaActiveDescendant,\n      inheritedAttributes,\n      ariaExpanded,\n      ariaOwns,\n      autocomplete,\n      role,\n      isFocussed,\n    } = this;\n\n    const el = this.el as HTMLElement;\n\n    const disabledMode = readonly || disabled;\n\n    const currentStatus =\n      maxValueExceeded ||\n      minValueUnattained ||\n      minCharactersUnattained ||\n      maxCharactersWarning\n        ? maxCharactersWarning\n          ? IcInformationStatus.Warning\n          : IcInformationStatus.Error\n        : validationStatus;\n\n    const currentValidationText = maxCharactersWarning\n      ? maxCharactersMessage\n      : maxValueExceeded\n      ? maxMessage\n      : minValueUnattained\n      ? minMessage\n      : minCharactersUnattained\n      ? minCharactersMessage\n      : validationText;\n\n    const maxNumChars = readonly ? 0 : maxCharacters;\n    const messageAriaLive =\n      validationAriaLive === \"default\"\n        ? maxCharactersWarning ||\n          maxValueExceeded ||\n          minValueUnattained ||\n          currentStatus === IcInformationStatus.Error\n          ? \"assertive\"\n          : \"polite\"\n        : validationAriaLive;\n\n    const showStatusText =\n      this.hasStatus(currentStatus) &&\n      !(currentStatus == IcInformationStatus.Success && validationInline) &&\n      !validationInlineInternal;\n\n    const multiline = rows > 1;\n\n    const hiddenCharCountDescId =\n      maxCharacters > 0 ? `${inputId}-char-count-desc` : \"\";\n\n    const charsRemaining = maxNumChars - numChars;\n    const remainingCharCountDescId =\n      maxCharacters > 0 ? `${inputId}-remaining-char-count-desc` : \"\";\n    const remainingCharCountDesc = `${charsRemaining} character${\n      charsRemaining === 1 ? \"\" : \"s\"\n    } remaining.`;\n\n    const describedBy = `${getInputDescribedByText(\n      this.el,\n      inputId,\n      helperText !== \"\",\n      showStatusText\n    )} ${hiddenCharCountDescId} ${\n      numChars > 0 ? remainingCharCountDescId : \"\"\n    }`.trim();\n\n    const disabledText = disabledMode && !readonly;\n    const showLeftIcon =\n      !!this.el.querySelector(`[slot=\"icon\"]`) && !disabledText;\n\n    const invalid = `${currentStatus === IcInformationStatus.Error}`;\n\n    hiddenInput\n      ? renderHiddenInput(this.el as HTMLElement, value, name, disabledMode)\n      : removeHiddenInput(this.el as HTMLElement);\n\n    return (\n      <Host\n        class={{\n          \"ic-text-field-full-width\": fullWidth,\n          \"ic-text-field-disabled\": disabledMode,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <ic-input-container readonly={readonly} disabled={disabledMode}>\n          {!hideLabel && (\n            <ic-input-label\n              for={inputId}\n              label={label}\n              helperText={helperText}\n              required={required}\n              disabled={disabledText}\n              readonly={readonly}\n            >\n              <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n            </ic-input-label>\n          )}\n\n          <ic-input-component-container\n            size={size}\n            validationStatus={currentStatus}\n            multiLine={multiline}\n            disabled={disabledMode}\n            readonly={readonly}\n            validationInline={validationInline}\n            fullWidth={fullWidth}\n          >\n            {showLeftIcon && (\n              <span\n                class={{\n                  readonly,\n                  \"has-value\": this.getNumberOfCharacters(value) > 0,\n                }}\n                slot=\"left-icon\"\n              >\n                <slot name=\"icon\" />\n              </span>\n            )}\n\n            {!multiline ? (\n              <input\n                id={inputId}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLInputElement)}\n                type={type}\n                min={min}\n                max={max}\n                value={value}\n                class={{\n                  \"no-left-pad\": !showLeftIcon && readonly,\n                  readonly,\n                  \"truncate-value\": truncateValue,\n                }}\n                placeholder={placeholder ? placeholder : \"\"}\n                required={required}\n                disabled={disabledMode}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                aria-activedescendant={ariaActiveDescendant}\n                aria-expanded={ariaExpanded}\n                aria-owns={ariaOwns}\n                autocomplete={autocomplete}\n                autocapitalize={autocapitalize}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                role={role || undefined}\n                maxlength={maxCharactersReached ? maxCharacters : undefined}\n                minlength={minCharactersUnattained ? minCharacters : undefined}\n                {...inheritedAttributes}\n              ></input>\n            ) : (\n              <textarea\n                id={inputId}\n                class={{\n                  \"no-resize\": resize === false || !!readonly,\n                  \"no-left-pad\": !showLeftIcon && !!readonly,\n                  readonly: !!readonly,\n                }}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLTextAreaElement)}\n                value={value}\n                rows={rows}\n                required={required}\n                disabled={disabledMode}\n                placeholder={placeholder}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                onScroll={this.onTextAreaScroll}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                autocomplete={autocomplete}\n                autocapitalize={autocapitalize}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                maxlength={maxCharactersReached ? maxCharacters : undefined}\n                minlength={minCharactersUnattained ? minCharacters : undefined}\n                {...inheritedAttributes}\n              ></textarea>\n            )}\n            {isSlotUsed(el, \"clear-button\") && (\n              <slot name=\"clear-button\"></slot>\n            )}\n            {isSlotUsed(el, \"search-submit-button\") && (\n              <slot name=\"search-submit-button\"></slot>\n            )}\n          </ic-input-component-container>\n          {isSlotUsed(el, \"menu\") && <slot name=\"menu\"></slot>}\n          <ic-input-validation\n            class={{ \"show-validation\": this.showValidationMargin() }}\n            status={\n              this.hasStatus(currentStatus) === false ||\n              (currentStatus === IcInformationStatus.Success &&\n                validationInline) ||\n              validationInlineInternal\n                ? \"\"\n                : currentStatus\n            }\n            message={showStatusText ? currentValidationText : \"\"}\n            ariaLiveMode={messageAriaLive}\n            for={inputId}\n            fullWidth={fullWidth}\n          >\n            {isSlotUsed(el, \"validation-text\") && (\n              <slot name=\"validation-text\" slot=\"validation-message\"></slot>\n            )}\n            {!readonly && maxNumChars > 0 && (\n              <div slot=\"validation-message-adornment\">\n                {!hideCharCount && (\n                  <ic-typography variant=\"caption\" class=\"char-count-text\">\n                    <span class=\"char-count\">\n                      {numChars}/{maxNumChars}\n                    </span>\n                  </ic-typography>\n                )}\n                <span\n                  class=\"remaining-char-count-desc\"\n                  aria-live=\"polite\"\n                  hidden={!isFocussed}\n                  id={remainingCharCountDescId}\n                >\n                  {remainingCharCountDesc}\n                </span>\n                <span hidden={true} id={hiddenCharCountDescId}>\n                  Field can contain a maximum of {maxNumChars} characters.\n                </span>\n              </div>\n            )}\n          </ic-input-validation>\n        </ic-input-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-1fc4b88f.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icFooterLinkCss","IcFooterLinkStyle0","FooterLink","constructor","hostRef","this","deviceSize","DEVICE_SIZES","XL","footerConfig","small","grouped","foregroundColor","getBrandForegroundAppearance","download","componentWillLoad","inferConfig","el","footerResizeHandler","footerBrandChangeHandler","ev","detail","mode","e","parentElement","classList","contains","render","href","hreflang","referrerpolicy","rel","target","isLogoLink","closest","h","Host","key","class","role","undefined"],"sources":["src/components/ic-footer-link/ic-footer-link.css?tag=ic-footer-link&encapsulation=shadow","src/components/ic-footer-link/ic-footer-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-ungrouped-sparse) {\n  --footer-link-margin-left: 0;\n  --footer-link-margin-right: 2.5rem;\n  --footer-link-margin-bottom: 0;\n}\n\n:host(.footer-link-ungrouped-small) {\n  --footer-link-margin-left: 0;\n  --footer-link-margin-right: 0;\n  --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-sparse) {\n  --footer-link-margin-left: 0;\n  --footer-link-margin-right: 0;\n  --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-small) {\n  --footer-link-margin-left: var(--ic-space-md);\n  --footer-link-margin-right: 0;\n  --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link) {\n  margin-left: var(--footer-link-margin-left);\n  margin-right: var(--footer-link-margin-right);\n  margin-bottom: var(--footer-link-margin-bottom);\n}\n\n.ic-link-open-in-new-icon {\n  vertical-align: middle;\n  margin-left: var(--ic-space-xxs);\n}\n\n.ic-link > .ic-link-open-in-new-icon {\n  fill: var(--ic-color-hyperlink-default);\n}\n\n.ic-link-open-in-new-icon > svg {\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n  fill: currentcolor;\n}\n\n.ic-link:visited > .ic-link-open-in-new-icon {\n  fill: var(--ic-color-hyperlink-visited);\n}\n\n.ic-link.light:visited > .ic-link-open-in-new-icon {\n  fill: var(--ic-color-hyperlink-contrast-visited);\n}\n\n:host(.breadcrumb-link) .ic-link {\n  display: var(--breadcrumb-link-display);\n  align-items: var(--breadcrumb-link-align-items);\n  gap: var(--breadcrumb-link-gap);\n}\n\n:host(.breadcrumb-link) .ic-link ::slotted(.back-icon) {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n}\n\n:host(.breadcrumb-link.current-page) a,\n:host(.breadcrumb-link.current-page) ::slotted(a) {\n  font-weight: normal;\n  color: inherit;\n  text-decoration: none;\n  display: flex;\n  align-items: center;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link,\n:host(.breadcrumb-link.current-page) ::slotted(a:focus) {\n  outline: var(--ic-hc-focus-outline);\n  text-decoration: none;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link:visited {\n  color: var(--ic-color-text-primary);\n}\n\n:host(.footer-link-light) ::part(link),\n:host(.footer-link-dark) ::part(link) {\n  color: var(--ic-footer-link);\n}\n\n:host(.footer-link-light) ::slotted(svg),\n:host(.footer-link-dark) ::slotted(svg) {\n  fill: var(--ic-footer-logo);\n}\n\n:host(.footer-logo-link) {\n  transition: var(--ic-easing-transition-fast);\n}\n\n:host(.footer-logo-link:hover) {\n  background-color: var(--ic-footer-hover);\n}\n\n:host(.footer-logo-link:active) {\n  background-color: var(--ic-footer-pressed);\n}\n\n:host(.footer-logo-link: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@media (forced-colors: active) {\n  :host(.footer-link-light) ::slotted(svg),\n  :host(.footer-link-dark) ::slotted(svg) {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Listen,\n  Prop,\n  h,\n  State,\n} from \"@stencil/core\";\nimport {\n  DEVICE_SIZES,\n  getBrandForegroundAppearance,\n} from \"../../utils/helpers\";\nimport { IcBrand, IcBrandForeground } from \"../../utils/types\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n  tag: \"ic-footer-link\",\n  styleUrl: \"ic-footer-link.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class FooterLink {\n  @Element() el: HTMLIcFooterLinkElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() footerConfig: FooterConfig = { small: false, grouped: false };\n  @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\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   * The URL that the link points to.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n\n  /**\n   * The 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  componentWillLoad(): void {\n    this.footerConfig = this.inferConfig(this.el);\n  }\n\n  @Listen(\"footerResized\", { target: \"document\" })\n  footerResizeHandler(): void {\n    this.footerConfig = this.inferConfig(this.el);\n  }\n\n  @Listen(\"brandChange\", { target: \"document\" })\n  footerBrandChangeHandler(ev: CustomEvent<IcBrand>): void {\n    this.foregroundColor = ev.detail.mode;\n  }\n\n  private inferConfig(e: HTMLElement): FooterConfig {\n    if (e.parentElement !== null) {\n      if (e.parentElement.classList.contains(\"ic-footer\")) {\n        return {\n          small: e.parentElement.classList.contains(\"ic-footer-small\"),\n          grouped: e.parentElement.classList.contains(\"ic-footer-grouped\"),\n        };\n      } else {\n        return this.inferConfig(e.parentElement);\n      }\n    } else {\n      return { small: false, grouped: false };\n    }\n  }\n\n  render() {\n    const {\n      footerConfig,\n      href,\n      hreflang,\n      referrerpolicy,\n      rel,\n      target,\n      download,\n    } = this;\n    const { small, grouped } = footerConfig;\n\n    const isLogoLink = !!this.el.closest(\"div[slot='logo']\");\n\n    return (\n      <Host\n        class={{\n          \"footer-link\": true,\n          [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n            small ? \"small\" : \"sparse\"\n          }`]: true,\n          [`footer-link-${this.foregroundColor}`]: true,\n          \"footer-logo-link\": isLogoLink,\n        }}\n        role=\"listitem\"\n      >\n        <ic-link\n          class=\"footer-link\"\n          href={href}\n          hreflang={hreflang}\n          referrerpolicy={referrerpolicy}\n          rel={rel}\n          download={download !== false ? download : undefined}\n          target={target}\n        >\n          <slot />\n        </ic-link>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4HAAA,MAAMA,EAAkB,g0JACxB,MAAAC,EAAeD,E,MCuBFE,EAAU,MAPvB,WAAAC,CAAAC,G,UAUWC,KAAAC,WAAqBC,EAAaC,GAClCH,KAAAI,aAA6B,CAAEC,MAAO,MAAOC,QAAS,OACtDN,KAAAO,gBAAqCC,IAKtCR,KAAAS,SAA8B,K,CA2BtC,iBAAAC,GACEV,KAAKI,aAAeJ,KAAKW,YAAYX,KAAKY,G,CAI5C,mBAAAC,GACEb,KAAKI,aAAeJ,KAAKW,YAAYX,KAAKY,G,CAI5C,wBAAAE,CAAyBC,GACvBf,KAAKO,gBAAkBQ,EAAGC,OAAOC,I,CAG3B,WAAAN,CAAYO,GAClB,GAAIA,EAAEC,gBAAkB,KAAM,CAC5B,GAAID,EAAEC,cAAcC,UAAUC,SAAS,aAAc,CACnD,MAAO,CACLhB,MAAOa,EAAEC,cAAcC,UAAUC,SAAS,mBAC1Cf,QAASY,EAAEC,cAAcC,UAAUC,SAAS,qB,KAEzC,CACL,OAAOrB,KAAKW,YAAYO,EAAEC,c,MAEvB,CACL,MAAO,CAAEd,MAAO,MAAOC,QAAS,M,EAIpC,MAAAgB,GACE,MAAMlB,aACJA,EAAYmB,KACZA,EAAIC,SACJA,EAAQC,eACRA,EAAcC,IACdA,EAAGC,OACHA,EAAMlB,SACNA,GACET,KACJ,MAAMK,MAAEA,EAAKC,QAAEA,GAAYF,EAE3B,MAAMwB,IAAe5B,KAAKY,GAAGiB,QAAQ,oBAErC,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,cAAe,KACf,CAAC,eAAe3B,EAAU,UAAY,eACpCD,EAAQ,QAAU,YACf,KACL,CAAC,eAAeL,KAAKO,mBAAoB,KACzC,mBAAoBqB,GAEtBM,KAAK,YAELJ,EAAA,WAAAE,IAAA,2CACEC,MAAM,cACNV,KAAMA,EACNC,SAAUA,EACVC,eAAgBA,EAChBC,IAAKA,EACLjB,SAAUA,IAAa,MAAQA,EAAW0B,UAC1CR,OAAQA,GAERG,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/core/p-23dc27a8.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as t,H as a,g as i}from"./p-8e4e97b4.js";import{D as s,i as n,f as o,h as d}from"./p-dbc8bf0c.js";import"./p-6215e2ae.js";const r='/*! 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;z-index:var(--ic-z-index-page-header)}:host(.ic-page-header-sticky){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay);z-index:var(--ic-z-index-sticky-page-header)}header{background-color:var(--ic-page-header-background)}header.border-bottom{border-bottom:var(--ic-border-default);border-bottom:var(--ic-space-1px) solid var(--ic-page-header-border)}header.tabs{padding-top:var(--ic-space-md)}.breadcrumb-area{margin-bottom:var(--ic-space-md)}::slotted(ic-navigation-item){--navigation-link-colour:var(--ic-color-text-primary)}.main-content{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"title-area action-area"\n    "input-area action-area";-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md);justify-content:space-between;width:100%}.title-area{display:flex;flex-direction:column;flex:1;min-width:19rem;grid-area:title-area}.header-content{display:flex;align-items:center;width:100%;flex-wrap:wrap;-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md)}.heading{display:inline-block;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.subheading-content{margin-top:var(--ic-space-xs)}.subheading-content.small{margin-top:var(--ic-space-md)}.action-area{display:flex;gap:var(--ic-space-md);flex-flow:row wrap;justify-self:end;justify-content:flex-end;height:-moz-fit-content;height:fit-content;grid-area:action-area}.input-area,.navigation-area{margin-top:var(--ic-space-md);width:100%}.tabs-slot{display:flex;overflow-x:auto;padding:0.5rem;margin:-0.5rem}.tabs-slot::-webkit-scrollbar{display:none}.input-area{grid-area:input-area}@media screen and (max-width: 576px){::slotted(ic-text-field){--input-width:100%;max-width:20rem}.main-content{grid-template-areas:"title-area"\n      "action-area"\n      "input-area";justify-content:flex-start}.title-area{min-width:0}.action-area{min-width:100%;margin-top:var(--ic-space-md);justify-content:start}}@media screen and (min-width: 992px){:host(.ic-page-header-sticky-desktop){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay);z-index:var(--ic-z-index-sticky-page-header)}}';const c=r;const l=class{constructor(t){e(this,t);this.resizeObserver=null;this.areButtonsReversed=false;this.deviceSize=s.XL;this.aligned="left";this.border=true;this.reverseOrder=false;this.size="medium";this.sticky=false;this.stickyDesktopOnly=false;this.theme="inherit";this.resizeObserverCallback=()=>{if(this.reverseOrder&&n(this.el,"actions")){this.applyReverseOrder()}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.el)};this.applyReverseOrder=()=>{var e;const t=o();if(t!==this.deviceSize){this.deviceSize=t}const a=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div.action-area");const i=[];for(let e=0;e<this.actionContent.length;e++){const t=this.actionContent[e];let a=t.offsetHeight;if(a===undefined){a=0}i.push(a)}const n=Math.max(...i);let d=a.offsetHeight;if(d===undefined){d=0}const r=()=>{this.actionContent=this.actionContent.reverse();this.actionContent.forEach((e=>{this.el.append(e)}));this.areButtonsReversed=!this.areButtonsReversed};if(this.deviceSize>s.S&&d<=n&&!this.areButtonsReversed||(this.deviceSize>s.S&&d>n||this.deviceSize<=s.S)&&this.areButtonsReversed){r()}}}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentWillLoad(){this.actionContent=Array.from(this.el.querySelectorAll(`[slot="actions"]`))}componentDidLoad(){d(this.runResizeObserver)}render(){var e,i;const{size:s,border:o,heading:d,subheading:r,aligned:c,sticky:l,stickyDesktopOnly:b,theme:p}=this;const h=`${n(this.el,"heading")?(i=(e=this.el.querySelector('[slot="heading"]'))===null||e===void 0?void 0:e.textContent)!==null&&i!==void 0?i:"":d!==null&&d!==void 0?d:""} page sections`;return t(a,{key:"b72fc99f5588d6c9549ba2fe0bacbfb9b0c133be",class:{["ic-page-header-sticky"]:!!l,["ic-page-header-sticky-desktop"]:!l&&!!b,[`ic-theme-${p}`]:p!=="inherit"},"aria-label":this.el.ariaLabel||"page header"},t("header",{key:"0dd8b54fbbc330f0202d8b42075aa2ad7e944690",class:{["border-bottom"]:!!o,["tabs"]:n(this.el,"tabs")},role:"presentation"},t("ic-section-container",{key:"191d13b8e42c92543bbc3c8c85a88eeba47b7462",aligned:c,fullHeight:n(this.el,"tabs")},n(this.el,"breadcrumbs")&&t("div",{key:"ceb08e816c6215199c33363b32c182c06de1c19e",class:"breadcrumb-area"},t("slot",{key:"e7a24051f7c9544eb1c629813b6a414cc2be42ec",name:"breadcrumbs"})),t("div",{key:"ad3ad094ae44d2cd5b12612d47487e9f94cb405b",class:"main-content"},t("div",{key:"0b9da0f1195a8eaa974f985f0268fed78d051f6d",class:"title-area"},t("div",{key:"314147f4f76b8827ee90bb68bad21fe931e55fb5",class:"header-content"},t("slot",{key:"a0d82decef083a02afbb103bcc94e6dfb809c9ab",name:"heading"},t("ic-typography",{key:"bb7ad7d29d53fe971d2298ec25fb377d2c525ed4",variant:s==="small"?"h4":"h2",class:"heading"},t("h2",{key:"10dcebaa154cab7717654db7f8342c8781bbb500"},d))),t("slot",{key:"8933dd41330b29fdd6f534069d54ac1f7b8d956e",name:"heading-adornment"})),t("div",{key:"22d58adbadef2d8f594e08f5d62b24596d4be3bf",class:{["subheading-content"]:!!r||n(this.el,"subheading"),["small"]:s==="small"}},t("slot",{key:"6a0e2482c20cd6e5c6ea74259c4f90ee59f372b8",name:"subheading"},t("ic-typography",{key:"d519ee27c3125320bc6b2a105b285148f791298c",variant:"body"},r)))),n(this.el,"actions")&&t("div",{key:"db7b9b202c23c922149d77e3c378a7f369270022",class:"action-area"},t("slot",{key:"018da769d0d0d85f56e8400270a182846028c8f8",name:"actions"})),n(this.el,"input")&&t("div",{key:"28495ab831e90484f64a731c2ac9589da255f7c9",class:"input-area"},t("slot",{key:"0584473df8a5318ca3a91c81fa42085d98ec03e8",name:"input"}))),(n(this.el,"stepper")||n(this.el,"tabs"))&&t("div",{key:"e9b414dd0c40f9c72c4099119f43b90998b660e3",class:"navigation-area"},n(this.el,"stepper")&&!n(this.el,"tabs")&&t("slot",{key:"6767b004d2c71a4e009a23eb73e9c33c976c3d22",name:"stepper"}),n(this.el,"tabs")&&t("nav",{key:"2966875a2e393299b01907959a925c960a1f5795","aria-label":h},t("ic-horizontal-scroll",{key:"3ab38c0a4933f7b38af7fc9bb039624a5d98f3fd"},t("ul",{key:"ce1c14207346ad570188c1e70f9ca39e0bfd2d68",class:"tabs-slot"},t("slot",{key:"38f22f779dd42b5015faa5604dc5af848a72121b",name:"tabs"}))))))))}get el(){return i(this)}};l.style=c;export{l as ic_page_header};
-//# sourceMappingURL=p-23dc27a8.entry.js.map

package/dist/core/p-3582c7df.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icCheckboxGroupCss","IcCheckboxGroupStyle0","CHECKBOX_SELECTOR","CheckboxGroup","constructor","hostRef","this","disabled","helperText","hideLabel","required","size","theme","validationAriaLive","validationStatus","validationText","setCheckboxProps","checkboxes","Array","from","el","querySelectorAll","forEach","checkbox","watchDisabledHandler","removeDisabledFalse","labelNameHandler","newValue","oldValue","propName","groupLabel","name","watchSizeHandler","watchThemeHandler","handleChange","ev","target","tagName","stopImmediatePropagation","componentWillLoad","componentDidLoad","onComponentRequiredPropUndefined","prop","label","selectHandler","checkedOptions","filter","checked","icChange","emit","value","map","opt","textFieldValue","_a","querySelector","selectedOption","render","describedBy","getInputDescribedByText","renderSRText","showValidation","hasValidationStatus","h","Host","key","class","id","trim","useLabelTag","slot","for","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  --ic-input-label-text-color: var(--ic-checkbox-group-label);\n  --ic-input-label-helper-text-color: var(--ic-checkbox-group-subtitle);\n  --ic-input-validation-error: var(--ic-checkbox-state-icon-error);\n  --ic-input-validation-status-text-color: var(--ic-checkbox-state-text);\n}\n\n:host(.ic-checkbox-group-disabled) {\n  --ic-input-label-text-color: var(--ic-checkbox-group-label-disabled);\n  --ic-input-label-helper-text-color: var(\n    --ic-checkbox-group-subtitle-disabled\n  );\n}\n\nic-input-label.error {\n  color: var(--ic-checkbox-group-label-error);\n\n  --ic-typography-color: var(--ic-checkbox-group-label-error);\n  --ic-input-label-helper-text-color: var(--ic-checkbox-group-subtitle-error);\n}\n\nic-input-label:not(.with-helper) .ic-typography-label,\nic-input-label .helpertext {\n  margin-bottom: var(--ic-space-sm);\n}\n\n:host(.ic-checkbox-group-small)\n  ic-input-label:not(.with-helper)\n  .ic-typography-label,\n:host(.ic-checkbox-group-small) ic-input-label .helpertext {\n  margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n:host(.ic-checkbox-group-large)\n  ic-input-label:not(.with-helper)\n  .ic-typography-label,\n:host(.ic-checkbox-group-large) ic-input-label .helpertext {\n  margin-bottom: calc(var(--ic-space-sm) * 1.5);\n}\n\nic-input-label .helpertext {\n  display: block;\n}\n\nic-input-validation.show-validation {\n  margin-top: var(--ic-space-sm);\n}\n\n:host(.ic-checkbox-group-small) ic-input-validation.show-validation {\n  margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n:host(.ic-checkbox-group-large) ic-input-validation.show-validation {\n  margin-top: calc(var(--ic-space-sm) * 1.5);\n}\n\n.checkboxes-container {\n  margin-bottom: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-checkbox-group-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\n.screen-reader-only-text:dir(rtl) {\n  right: -9999px;\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 {\n  IcAriaLive,\n  IcInformationStatusOrEmpty,\n  IcSizes,\n  IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\nconst CHECKBOX_SELECTOR = \"ic-checkbox\";\n\n/**\n * @slot helper-text - Content is set as the helper text for the checkbox group.\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  private checkboxes: HTMLIcCheckboxElement[];\n\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  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    this.checkboxes.forEach((checkbox) => {\n      checkbox.disabled = this.disabled;\n    });\n    removeDisabledFalse(this.disabled, this.el);\n  }\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(CHECKBOX_SELECTOR)).forEach(\n      (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  /**\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 = \"medium\";\n  @Watch(\"size\")\n  watchSizeHandler(): void {\n    this.checkboxes.forEach((checkbox) => {\n      checkbox.size = this.size;\n    });\n  }\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(newValue: IcThemeMode): void {\n    Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach(\n      (checkbox) => {\n        checkbox.theme = newValue;\n      }\n    );\n  }\n\n  /**\n   * The value of the `aria-live` attribute on the validation message.\n   */\n  @Prop() validationAriaLive: IcAriaLive = \"polite\";\n\n  /**\n   * The validation status - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The text to display as the validation message.\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    this.setCheckboxProps();\n    removeDisabledFalse(this.disabled, this.el);\n    this.watchThemeHandler(this.theme);\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(CHECKBOX_SELECTOR)\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  private setCheckboxProps = () => {\n    this.checkboxes = Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR));\n\n    this.checkboxes.forEach((checkbox) => {\n      if (!checkbox.disabled) {\n        checkbox.disabled = this.disabled;\n      }\n      if (!checkbox.size) {\n        checkbox.size = this.size;\n      }\n    });\n  };\n\n  render() {\n    const {\n      disabled,\n      helperText,\n      hideLabel,\n      label,\n      name,\n      required,\n      size,\n      theme,\n      validationAriaLive,\n      validationStatus,\n      validationText,\n    } = this;\n\n    const describedBy = getInputDescribedByText(\n      this.el,\n      name,\n      helperText !== \"\",\n      validationStatus !== \"\"\n    );\n\n    const renderSRText = validationStatus === \"error\" || required || hideLabel;\n\n    const showValidation = hasValidationStatus(validationStatus, disabled);\n\n    return (\n      <Host\n        class={{\n          \"ic-checkbox-group-disabled\": !!disabled,\n          [`ic-checkbox-group-${size}`]: true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        {renderSRText && (\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            renderSRText ? \"screenReaderOnlyText\" : \"\"\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                useLabelTag={false}\n              >\n                <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n              </ic-input-label>\n            </legend>\n          )}\n          <div class=\"checkboxes-container\">\n            <slot></slot>\n          </div>\n        </fieldset>\n        <ic-input-validation\n          class={{\n            \"show-validation\": showValidation,\n          }}\n          for={name}\n          ariaLiveMode={validationAriaLive}\n          status={showValidation ? validationStatus : \"\"}\n          message={showValidation ? validationText : \"\"}\n        ></ic-input-validation>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-3c7e90a7.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as o,H as i,g as n}from"./p-8e4e97b4.js";import{r}from"./p-dbc8bf0c.js";import"./p-6215e2ae.js";const s='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:root{display:block}:host{display:flex;flex-direction:row;width:-moz-fit-content;width:fit-content;min-width:-moz-min-content;min-width:min-content;border:var(--ic-border-width) solid var(--ic-toggle-button-unselected-border);border-radius:var(--ic-border-radius)}:host(.ic-toggle-button-group-full-width){width:100%;max-width:100%}:host(.ic-toggle-button-group-loading){min-width:-moz-max-content;min-width:max-content}:host(:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast);outline:none}::slotted(ic-toggle-button){flex-grow:1;width:-moz-min-content;width:min-content;--toggle-button-border:none !important;--toggle-button-border-hover:none !important;--toggle-button-border-active:none !important}::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border)}:host(.ic-toggle-button-group-disabled){border:var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);pointer-events:none}:host(.ic-toggle-button-group-disabled) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled)}:host(.ic-toggle-button-group-monochrome){border:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome)}:host(.ic-toggle-button-group-monochrome) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome)}:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome){border:var(--ic-border-width) dashed\n    var(--ic-toggle-button-unselected-border-disabled-monochrome)}:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-disabled-monochrome)}:host(.ic-toggle-button-group-hide-outline){--ic-toggle-button-unselected-border:transparent;--ic-toggle-button-unselected-border-disabled:transparent;--ic-toggle-button-unselected-border-monochrome:transparent;--ic-toggle-button-unselected-border-disabled-monochrome:transparent}';const a=s;const l="IC-TOGGLE-BUTTON-GROUP";const d=class{constructor(o){t(this,o);this.icChange=e(this,"icChange",7);this.lastKeyPressed={key:null,shift:false};this.externallySetActiveToggle=null;this.accessibleLabel="Toggle button group";this.disabled=false;this.fullWidth=false;this.loading=false;this.monochrome=false;this.outline=true;this.selectMethod="manual";this.selectType="single";this.size="medium";this.theme="inherit";this.tooltipPlacement="bottom";this.variant="default";this.keyListener=t=>{this.lastKeyPressed={key:t.key,shift:t.shiftKey}};this.handleHostFocus=({target:t,relatedTarget:e})=>{var o;if(this.disabled){t===null||t===void 0?void 0:t.blur();return}if(this.loading)return;const i=t;const n=e;const r=Array.from((i===null||i===void 0?void 0:i.querySelectorAll("ic-toggle-button"))||[]);const s=r.every((t=>!t.checked));const{shift:a}=this.lastKeyPressed;if((s||this.selectType!=="single")&&!a||s&&a&&(n===null||n===void 0?void 0:n.tagName)==l){(o=r[0])===null||o===void 0?void 0:o.focus()}else if(!a||(n===null||n===void 0?void 0:n.tagName)==l){r.filter((t=>t.checked))[0].focus()}};this.handleKeyDown=({key:t})=>{if(t!=="ArrowDown"&&t!=="ArrowRight"&&t!=="ArrowLeft"&&t!=="ArrowUp")return;const e=this.getAllToggleButtons();let o;if(this.externallySetActiveToggle){o=e[this.getNextItemToSelect(e.indexOf(e.filter((t=>t===this.externallySetActiveToggle))[0]),t==="ArrowDown"||t==="ArrowRight")]}else{o=e[this.getNextItemToSelect(e.indexOf(e.filter((t=>t===document.activeElement))[0]),t==="ArrowDown"||t==="ArrowRight")]}if(this.selectMethod==="auto"){o.checked=true;this.selectHandler(new CustomEvent("icToggleChecked",{detail:{checked:o.checked}}),o)}else{o.focus()}};this.getNextItemToSelect=(t,e)=>{const o=this.getAllToggleButtons();const i=o.length-1;if(t<1){t=0}let n=e?t+1:t-1;if(n<0){n=i}else if(n>i){n=0}if(o[n].disabled){n=this.getNextItemToSelect(n,e)}return n};this.getAllToggleButtons=()=>Array.from(this.el.querySelectorAll("ic-toggle-button"))}watchDisabledHandler(){this.getAllToggleButtons().forEach((t=>{t.disabled=this.disabled}));r(this.disabled,this.el)}watchFullWidthHandler(){this.getAllToggleButtons().forEach((t=>{t.fullWidth=this.fullWidth}))}watchLoadingHandler(){this.getAllToggleButtons().forEach((t=>{t.loading=this.loading}))}watchMonochromeHandler(){this.getAllToggleButtons().forEach((t=>{t.monochrome=this.monochrome}))}watchOutlineHandler(){this.getAllToggleButtons().forEach((t=>{t.outline=this.outline}))}watchSizeHandler(){this.getAllToggleButtons().forEach((t=>{t.size=this.size}))}watchThemeHandler(){this.getAllToggleButtons().forEach((t=>{t.theme=this.theme}))}watchTooltipPlacementHandler(){this.getAllToggleButtons().forEach((t=>{t.tooltipPlacement=this.tooltipPlacement}))}watchVariantHandler(){this.getAllToggleButtons().forEach((t=>{t.variant=this.variant}))}selectHandler(t,e){const o=this.getAllToggleButtons();let i=t.target;if(e)e.focus();if(this.selectType==="single"){if(!i&&e){i=e}o.forEach((t=>{if(t.id!==i.id&&t.checked){t.checked=false}}));this.icChange.emit({checked:t.detail.checked,selectedOption:i})}else{const t=o.filter((t=>t.checked&&!t.disabled));this.icChange.emit({checked:t.map((t=>t.checked)),toggledOptions:t.map((t=>({toggleButton:t}))),selectedOption:i})}}async setActiveToggle(t){this.externallySetActiveToggle=t}componentWillLoad(){if(this.selectType==="multi")this.selectMethod="manual";document.addEventListener("keydown",this.keyListener);r(this.disabled,this.el)}componentDidLoad(){this.getAllToggleButtons().forEach(((t,e)=>{var o,i,n;const r=(n=(i=(o=t.shadowRoot)===null||o===void 0?void 0:o.querySelector("ic-button"))===null||i===void 0?void 0:i.shadowRoot)===null||n===void 0?void 0:n.querySelector("button");if(r){const t=r.getAttribute("aria-label");const e=t?`${t}, `:"";r.setAttribute("aria-label",`${e}${this.accessibleLabel}`)}t.id=e.toString();t.tabIndex=-1;t.addEventListener("keydown",(t=>{this.handleKeyDown(t)}));t.classList.add("expand-toggle-group-child")}))}disconnectedCallback(){document===null||document===void 0?void 0:document.removeEventListener("keydown",this.keyListener)}render(){const{accessibleLabel:t,disabled:e,fullWidth:n,loading:r,monochrome:s,outline:a,theme:l}=this;return o(i,{key:"5c8877eaeec66fb0cc9fbcd5ba593fc86bd2b5f2",role:"group","aria-label":t,tabindex:e?-1:0,class:{"ic-toggle-button-group-disabled":e,"ic-toggle-button-group-full-width":n,"ic-toggle-button-group-loading":r,"ic-toggle-button-group-monochrome":s,"ic-toggle-button-group-hide-outline":!a,[`ic-theme-${l}`]:l!=="inherit"},onFocus:this.handleHostFocus},o("slot",{key:"f701ba436d48cd8d33abe55a252b4dd40455b67a"}))}get el(){return n(this)}static get watchers(){return{disabled:["watchDisabledHandler"],fullWidth:["watchFullWidthHandler"],loading:["watchLoadingHandler"],monochrome:["watchMonochromeHandler"],outline:["watchOutlineHandler"],size:["watchSizeHandler"],theme:["watchThemeHandler"],tooltipPlacement:["watchTooltipPlacementHandler"],variant:["watchVariantHandler"]}}};d.style=a;export{d as ic_toggle_button_group};
-//# sourceMappingURL=p-3c7e90a7.entry.js.map

package/dist/core/p-3c7e90a7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icToggleButtonGroupCss","IcToggleButtonGroupStyle0","TOGGLE_GROUP","ToggleButtonGroup","constructor","hostRef","this","lastKeyPressed","key","shift","externallySetActiveToggle","accessibleLabel","disabled","fullWidth","loading","monochrome","outline","selectMethod","selectType","size","theme","tooltipPlacement","variant","keyListener","ev","shiftKey","handleHostFocus","target","relatedTarget","blur","el","relEl","toggleButtons","Array","from","querySelectorAll","noToggleButtonsChecked","every","checked","tagName","_a","focus","filter","handleKeyDown","toggleButtonOptions","getAllToggleButtons","targetToggle","getNextItemToSelect","indexOf","document","activeElement","selectHandler","CustomEvent","detail","currentItem","movingDown","numToggles","length","nextItem","watchDisabledHandler","forEach","removeDisabledFalse","watchFullWidthHandler","watchLoadingHandler","watchMonochromeHandler","watchOutlineHandler","watchSizeHandler","watchThemeHandler","watchTooltipPlacementHandler","watchVariantHandler","tabTarget","allToggles","clickedToggle","id","icChange","emit","selectedOption","toggledOptions","map","opt","toggleButton","setActiveToggle","toggle","componentWillLoad","addEventListener","componentDidLoad","i","btn","_c","_b","shadowRoot","querySelector","btnAriaLabel","getAttribute","aria","setAttribute","toString","tabIndex","classList","add","disconnectedCallback","removeEventListener","render","h","Host","role","tabindex","class","onFocus"],"sources":["src/components/ic-toggle-button-group/ic-toggle-button-group.css?tag=ic-toggle-button-group&encapsulation=shadow","src/components/ic-toggle-button-group/ic-toggle-button-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/* PARENT HOST */\n\n:root {\n  display: block;\n}\n\n:host {\n  display: flex;\n  flex-direction: row;\n  width: fit-content;\n  min-width: min-content;\n  border: var(--ic-border-width) solid var(--ic-toggle-button-unselected-border);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(.ic-toggle-button-group-full-width) {\n  width: 100%;\n  max-width: 100%;\n}\n\n:host(.ic-toggle-button-group-loading) {\n  min-width: max-content;\n}\n\n:host(:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-transition-duration-fast);\n  outline: none;\n}\n\n/* CHILDREN SLOTTED */\n\n::slotted(ic-toggle-button) {\n  flex-grow: 1;\n  width: min-content;\n\n  --toggle-button-border: none !important;\n  --toggle-button-border-hover: none !important;\n  --toggle-button-border-active: none !important;\n}\n\n::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border);\n}\n\n/* DISABLED */\n:host(.ic-toggle-button-group-disabled) {\n  border: var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);\n  pointer-events: none;\n}\n\n:host(.ic-toggle-button-group-disabled)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);\n}\n\n:host(.ic-toggle-button-group-monochrome) {\n  border: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome);\n}\n\n:host(.ic-toggle-button-group-monochrome)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome);\n}\n\n:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome) {\n  border: var(--ic-border-width) dashed\n    var(--ic-toggle-button-unselected-border-disabled-monochrome);\n}\n\n:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-disabled-monochrome);\n}\n\n:host(.ic-toggle-button-group-hide-outline) {\n  --ic-toggle-button-unselected-border: transparent;\n  --ic-toggle-button-unselected-border-disabled: transparent;\n  --ic-toggle-button-unselected-border-monochrome: transparent;\n  --ic-toggle-button-unselected-border-disabled-monochrome: transparent;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Listen,\n  Element,\n  Event,\n  EventEmitter,\n  State,\n  Watch,\n  Method,\n} from \"@stencil/core\";\nimport {\n  IcSizes,\n  IcSelectTypes,\n  IcSelectMethodTypes,\n  IcThemeMode,\n  IcButtonTooltipPlacement,\n  IcIconPlacementOptions,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-toggle-button-group.types\";\nimport { removeDisabledFalse } from \"../../utils/helpers\";\n\ninterface lastKey {\n  key: string | null;\n  shift: boolean;\n}\n\nconst TOGGLE_GROUP = \"IC-TOGGLE-BUTTON-GROUP\";\n\n@Component({\n  tag: \"ic-toggle-button-group\",\n  styleUrl: \"ic-toggle-button-group.css\",\n  shadow: true,\n})\nexport class ToggleButtonGroup {\n  @Element() el: HTMLIcToggleButtonGroupElement;\n\n  @State() lastKeyPressed: lastKey = {\n    key: null,\n    shift: false,\n  };\n  @State() externallySetActiveToggle: HTMLIcToggleButtonElement | null = null;\n\n  /**\n   * The accessible label of the toggle button group component to provide context for screen reader users.\n   */\n  @Prop() accessibleLabel = \"Toggle button group\";\n\n  /**\n   * If `true`, the toggle button group will be set to the disabled state.\n   */\n  @Prop() disabled = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.disabled = this.disabled;\n    });\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * If `true`, the toggle button group will fill the width of the container.\n   */\n  @Prop() fullWidth = false;\n  @Watch(\"fullWidth\")\n  watchFullWidthHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.fullWidth = this.fullWidth;\n    });\n  }\n\n  /**\n   * The placement of the icons in relation to the toggle button labels.\n   */\n  @Prop() iconPlacement?: IcIconPlacementOptions;\n\n  /**\n   * If `true`, the toggle button group will be in loading state.\n   */\n  @Prop() loading = false;\n  @Watch(\"loading\")\n  watchLoadingHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.loading = this.loading;\n    });\n  }\n\n  /**\n   * If `true`, the toggle button group will display as black in the light theme, and white in dark theme.\n   */\n  @Prop() monochrome = false;\n  @Watch(\"monochrome\")\n  watchMonochromeHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.monochrome = this.monochrome;\n    });\n  }\n\n  /**\n   * If `true`, the toggle button group will display with an outline.\n   */\n  @Prop() outline = true;\n  @Watch(\"outline\")\n  watchOutlineHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.outline = this.outline;\n    });\n  }\n\n  /**\n   * If `auto`, controls are toggled automatically when navigated to. If `manual`, the controls must be actioned to change their toggled state. The value of this prop is ignored if `selectType` is set to`multi`.\n   */\n  @Prop({ mutable: true }) selectMethod: IcSelectMethodTypes = \"manual\";\n\n  /**\n   * Sets whether single or multiple options can be toggled. If `multi`, then the `selectMethod` is always `manual`.\n   */\n  @Prop() selectType: IcSelectTypes = \"single\";\n\n  /**\n   * The size of the toggle buttons to be displayed. This does not affect the font size of the accessible label.\n   */\n  @Prop() size: IcSizes = \"medium\";\n  @Watch(\"size\")\n  watchSizeHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.size = this.size;\n    });\n  }\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.theme = this.theme;\n    });\n  }\n\n  /**\n   * The position of the tooltip in relation to the toggle buttons.\n   */\n  @Prop() tooltipPlacement: IcButtonTooltipPlacement = \"bottom\";\n  @Watch(\"tooltipPlacement\")\n  watchTooltipPlacementHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.tooltipPlacement = this.tooltipPlacement;\n    });\n  }\n\n  /**\n   * The variant of the toggle button.\n   */\n  @Prop({ reflect: true }) variant: \"default\" | \"icon\" = \"default\";\n  @Watch(\"variant\")\n  watchVariantHandler(): void {\n    this.getAllToggleButtons().forEach((el) => {\n      el.variant = this.variant;\n    });\n  }\n\n  /**\n   * Emitted when a toggle button is selected.\n   */\n  @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n  @Listen(\"icToggleChecked\")\n  selectHandler(ev: CustomEvent, tabTarget?: HTMLIcToggleButtonElement): void {\n    const allToggles = this.getAllToggleButtons();\n    let clickedToggle = ev.target as HTMLIcToggleButtonElement;\n\n    if (tabTarget) tabTarget.focus(); // tabTarget used in proxySelectHandler\n\n    if (this.selectType === \"single\") {\n      if (!clickedToggle && tabTarget) {\n        clickedToggle = tabTarget;\n      }\n      allToggles.forEach((el) => {\n        if (el.id !== clickedToggle.id && el.checked) {\n          el.checked = false;\n        }\n      });\n\n      this.icChange.emit({\n        checked: ev.detail.checked,\n        selectedOption: clickedToggle,\n      });\n    } else {\n      const toggledOptions = allToggles.filter(\n        (el) => el.checked && !el.disabled\n      );\n\n      this.icChange.emit({\n        checked: toggledOptions.map((opt) => opt.checked),\n        toggledOptions: toggledOptions.map((opt) => ({\n          toggleButton: opt,\n        })),\n        selectedOption: clickedToggle,\n      });\n    }\n  }\n\n  /**\n   * @internal Used to enable other components to set the active toggle button when toggle button group is in a shadow dom.\n   */\n  @Method()\n  async setActiveToggle(toggle: HTMLIcToggleButtonElement): Promise<void> {\n    this.externallySetActiveToggle = toggle;\n  }\n\n  componentWillLoad(): void {\n    if (this.selectType === \"multi\") this.selectMethod = \"manual\";\n    if (this.selectMethod === \"auto\") this.selectType === \"single\";\n    document.addEventListener(\"keydown\", this.keyListener);\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    this.getAllToggleButtons().forEach((el, i) => {\n      const btn = el.shadowRoot\n        ?.querySelector(\"ic-button\")\n        ?.shadowRoot?.querySelector(\"button\");\n      if (btn) {\n        const btnAriaLabel = btn.getAttribute(\"aria-label\");\n        const aria = btnAriaLabel ? `${btnAriaLabel}, ` : \"\";\n        btn.setAttribute(\"aria-label\", `${aria}${this.accessibleLabel}`);\n      }\n\n      el.id = i.toString();\n      el.tabIndex = -1;\n      el.addEventListener(\"keydown\", (ev) => {\n        this.handleKeyDown(ev);\n      });\n      el.classList.add(\"expand-toggle-group-child\");\n    });\n  }\n\n  disconnectedCallback(): void {\n    document?.removeEventListener(\"keydown\", this.keyListener);\n  }\n\n  private keyListener = (ev: KeyboardEvent) => {\n    this.lastKeyPressed = {\n      key: ev.key,\n      shift: ev.shiftKey,\n    };\n  };\n\n  private handleHostFocus = ({ target, relatedTarget }: FocusEvent) => {\n    if (this.disabled) {\n      (target as HTMLElement)?.blur();\n      return;\n    }\n    if (this.loading) return;\n    const el = target as HTMLIcToggleButtonGroupElement | null;\n    const relEl = relatedTarget as HTMLIcToggleButtonElement | null;\n    const toggleButtons = Array.from(\n      el?.querySelectorAll(\"ic-toggle-button\") || []\n    );\n    const noToggleButtonsChecked = toggleButtons.every((el) => !el.checked);\n    const { shift } = this.lastKeyPressed;\n    if (\n      ((noToggleButtonsChecked || this.selectType !== \"single\") && !shift) ||\n      (noToggleButtonsChecked && shift && relEl?.tagName == TOGGLE_GROUP)\n    ) {\n      toggleButtons[0]?.focus();\n    } else if (!shift || relEl?.tagName == TOGGLE_GROUP) {\n      // if checked is true and selectMethod is \"single\", focus that toggle\n      toggleButtons.filter((el) => el.checked)[0].focus();\n    }\n  };\n\n  private handleKeyDown = ({ key }: KeyboardEvent) => {\n    if (\n      key !== \"ArrowDown\" &&\n      key !== \"ArrowRight\" &&\n      key !== \"ArrowLeft\" &&\n      key !== \"ArrowUp\"\n    )\n      return;\n\n    const toggleButtonOptions = this.getAllToggleButtons();\n    let targetToggle: HTMLIcToggleButtonElement;\n    if (this.externallySetActiveToggle) {\n      targetToggle =\n        toggleButtonOptions[\n          this.getNextItemToSelect(\n            toggleButtonOptions.indexOf(\n              toggleButtonOptions.filter(\n                (el) => el === this.externallySetActiveToggle\n              )[0]\n            ),\n            key === \"ArrowDown\" || key === \"ArrowRight\"\n          )\n        ];\n    } else {\n      targetToggle =\n        toggleButtonOptions[\n          this.getNextItemToSelect(\n            toggleButtonOptions.indexOf(\n              toggleButtonOptions.filter(\n                (el) => el === document.activeElement\n              )[0]\n            ),\n            key === \"ArrowDown\" || key === \"ArrowRight\"\n          )\n        ];\n    }\n\n    if (this.selectMethod === \"auto\") {\n      // trigger selectHandler when unable to add 'target'\n      targetToggle.checked = true;\n      this.selectHandler(\n        new CustomEvent(\"icToggleChecked\", {\n          detail: {\n            checked: targetToggle.checked,\n          },\n        }),\n        targetToggle\n      );\n    } else {\n      targetToggle.focus();\n    }\n  };\n\n  private getNextItemToSelect = (currentItem: number, movingDown: boolean) => {\n    const toggleButtonOptions = this.getAllToggleButtons();\n    const numToggles = toggleButtonOptions.length - 1;\n\n    if (currentItem < 1) {\n      currentItem = 0;\n    }\n\n    let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n    if (nextItem < 0) {\n      nextItem = numToggles;\n    } else if (nextItem > numToggles) {\n      nextItem = 0;\n    }\n\n    if (toggleButtonOptions[nextItem].disabled) {\n      nextItem = this.getNextItemToSelect(nextItem, movingDown);\n    }\n\n    return nextItem;\n  };\n\n  private getAllToggleButtons = () =>\n    Array.from(this.el.querySelectorAll(\"ic-toggle-button\"));\n\n  render() {\n    const {\n      accessibleLabel,\n      disabled,\n      fullWidth,\n      loading,\n      monochrome,\n      outline,\n      theme,\n    } = this;\n\n    return (\n      <Host\n        role=\"group\"\n        aria-label={accessibleLabel}\n        tabindex={disabled ? -1 : 0}\n        class={{\n          \"ic-toggle-button-group-disabled\": disabled,\n          \"ic-toggle-button-group-full-width\": fullWidth,\n          \"ic-toggle-button-group-loading\": loading,\n          \"ic-toggle-button-group-monochrome\": monochrome,\n          \"ic-toggle-button-group-hide-outline\": !outline,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n        onFocus={this.handleHostFocus}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uHAAA,MAAMA,EAAyB,sjJAC/B,MAAAC,EAAeD,EC4Bf,MAAME,EAAe,yB,MAORC,EAAiB,MAL9B,WAAAC,CAAAC,G,6CAQWC,KAAAC,eAA0B,CACjCC,IAAK,KACLC,MAAO,OAEAH,KAAAI,0BAA8D,KAK/DJ,KAAAK,gBAAkB,sBAKlBL,KAAAM,SAAW,MAYXN,KAAAO,UAAY,MAgBZP,KAAAQ,QAAU,MAWVR,KAAAS,WAAa,MAWbT,KAAAU,QAAU,KAWOV,KAAAW,aAAoC,SAKrDX,KAAAY,WAA4B,SAK5BZ,KAAAa,KAAgB,SAWhBb,KAAAc,MAAqB,UAWrBd,KAAAe,iBAA6C,SAW5Bf,KAAAgB,QAA8B,UAwF/ChB,KAAAiB,YAAeC,IACrBlB,KAAKC,eAAiB,CACpBC,IAAKgB,EAAGhB,IACRC,MAAOe,EAAGC,SACX,EAGKnB,KAAAoB,gBAAkB,EAAGC,SAAQC,oB,MACnC,GAAItB,KAAKM,SAAU,CAChBe,IAAsB,MAAtBA,SAAM,SAANA,EAAwBE,OACzB,M,CAEF,GAAIvB,KAAKQ,QAAS,OAClB,MAAMgB,EAAKH,EACX,MAAMI,EAAQH,EACd,MAAMI,EAAgBC,MAAMC,MAC1BJ,IAAE,MAAFA,SAAE,SAAFA,EAAIK,iBAAiB,sBAAuB,IAE9C,MAAMC,EAAyBJ,EAAcK,OAAOP,IAAQA,EAAGQ,UAC/D,MAAM7B,MAAEA,GAAUH,KAAKC,eACvB,IACI6B,GAA0B9B,KAAKY,aAAe,YAAcT,GAC7D2B,GAA0B3B,IAASsB,IAAK,MAALA,SAAK,SAALA,EAAOQ,UAAWrC,EACtD,EACAsC,EAAAR,EAAc,MAAE,MAAAQ,SAAA,SAAAA,EAAEC,O,MACb,IAAKhC,IAASsB,IAAK,MAALA,SAAK,SAALA,EAAOQ,UAAWrC,EAAc,CAEnD8B,EAAcU,QAAQZ,GAAOA,EAAGQ,UAAS,GAAGG,O,GAIxCnC,KAAAqC,cAAgB,EAAGnC,UACzB,GACEA,IAAQ,aACRA,IAAQ,cACRA,IAAQ,aACRA,IAAQ,UAER,OAEF,MAAMoC,EAAsBtC,KAAKuC,sBACjC,IAAIC,EACJ,GAAIxC,KAAKI,0BAA2B,CAClCoC,EACEF,EACEtC,KAAKyC,oBACHH,EAAoBI,QAClBJ,EAAoBF,QACjBZ,GAAOA,IAAOxB,KAAKI,4BACpB,IAEJF,IAAQ,aAAeA,IAAQ,c,KAGhC,CACLsC,EACEF,EACEtC,KAAKyC,oBACHH,EAAoBI,QAClBJ,EAAoBF,QACjBZ,GAAOA,IAAOmB,SAASC,gBACxB,IAEJ1C,IAAQ,aAAeA,IAAQ,c,CAKvC,GAAIF,KAAKW,eAAiB,OAAQ,CAEhC6B,EAAaR,QAAU,KACvBhC,KAAK6C,cACH,IAAIC,YAAY,kBAAmB,CACjCC,OAAQ,CACNf,QAASQ,EAAaR,WAG1BQ,E,KAEG,CACLA,EAAaL,O,GAITnC,KAAAyC,oBAAsB,CAACO,EAAqBC,KAClD,MAAMX,EAAsBtC,KAAKuC,sBACjC,MAAMW,EAAaZ,EAAoBa,OAAS,EAEhD,GAAIH,EAAc,EAAG,CACnBA,EAAc,C,CAGhB,IAAII,EAAWH,EAAaD,EAAc,EAAIA,EAAc,EAC5D,GAAII,EAAW,EAAG,CAChBA,EAAWF,C,MACN,GAAIE,EAAWF,EAAY,CAChCE,EAAW,C,CAGb,GAAId,EAAoBc,GAAU9C,SAAU,CAC1C8C,EAAWpD,KAAKyC,oBAAoBW,EAAUH,E,CAGhD,OAAOG,CAAQ,EAGTpD,KAAAuC,oBAAsB,IAC5BZ,MAAMC,KAAK5B,KAAKwB,GAAGK,iBAAiB,oB,CAzStC,oBAAAwB,GACErD,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGlB,SAAWN,KAAKM,QAAQ,IAE7BiD,EAAoBvD,KAAKM,SAAUN,KAAKwB,G,CAQ1C,qBAAAgC,GACExD,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGjB,UAAYP,KAAKO,SAAS,G,CAcjC,mBAAAkD,GACEzD,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGhB,QAAUR,KAAKQ,OAAO,G,CAS7B,sBAAAkD,GACE1D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGf,WAAaT,KAAKS,UAAU,G,CASnC,mBAAAkD,GACE3D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGd,QAAUV,KAAKU,OAAO,G,CAmB7B,gBAAAkD,GACE5D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGX,KAAOb,KAAKa,IAAI,G,CASvB,iBAAAgD,GACE7D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGV,MAAQd,KAAKc,KAAK,G,CASzB,4BAAAgD,GACE9D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGT,iBAAmBf,KAAKe,gBAAgB,G,CAS/C,mBAAAgD,GACE/D,KAAKuC,sBAAsBe,SAAS9B,IAClCA,EAAGR,QAAUhB,KAAKgB,OAAO,G,CAU7B,aAAA6B,CAAc3B,EAAiB8C,GAC7B,MAAMC,EAAajE,KAAKuC,sBACxB,IAAI2B,EAAgBhD,EAAGG,OAEvB,GAAI2C,EAAWA,EAAU7B,QAEzB,GAAInC,KAAKY,aAAe,SAAU,CAChC,IAAKsD,GAAiBF,EAAW,CAC/BE,EAAgBF,C,CAElBC,EAAWX,SAAS9B,IAClB,GAAIA,EAAG2C,KAAOD,EAAcC,IAAM3C,EAAGQ,QAAS,CAC5CR,EAAGQ,QAAU,K,KAIjBhC,KAAKoE,SAASC,KAAK,CACjBrC,QAASd,EAAG6B,OAAOf,QACnBsC,eAAgBJ,G,KAEb,CACL,MAAMK,EAAiBN,EAAW7B,QAC/BZ,GAAOA,EAAGQ,UAAYR,EAAGlB,WAG5BN,KAAKoE,SAASC,KAAK,CACjBrC,QAASuC,EAAeC,KAAKC,GAAQA,EAAIzC,UACzCuC,eAAgBA,EAAeC,KAAKC,IAAG,CACrCC,aAAcD,MAEhBH,eAAgBJ,G,EAStB,qBAAMS,CAAgBC,GACpB5E,KAAKI,0BAA4BwE,C,CAGnC,iBAAAC,GACE,GAAI7E,KAAKY,aAAe,QAASZ,KAAKW,aAAe,SAErDgC,SAASmC,iBAAiB,UAAW9E,KAAKiB,aAC1CsC,EAAoBvD,KAAKM,SAAUN,KAAKwB,G,CAG1C,gBAAAuD,GACE/E,KAAKuC,sBAAsBe,SAAQ,CAAC9B,EAAIwD,K,UACtC,MAAMC,GAAMC,GAAAC,GAAAjD,EAAAV,EAAG4D,cAAU,MAAAlD,SAAA,SAAAA,EACrBmD,cAAc,gBAAY,MAAAF,SAAA,SAAAA,EAC1BC,cAAU,MAAAF,SAAA,SAAAA,EAAEG,cAAc,UAC9B,GAAIJ,EAAK,CACP,MAAMK,EAAeL,EAAIM,aAAa,cACtC,MAAMC,EAAOF,EAAe,GAAGA,MAAmB,GAClDL,EAAIQ,aAAa,aAAc,GAAGD,IAAOxF,KAAKK,kB,CAGhDmB,EAAG2C,GAAKa,EAAEU,WACVlE,EAAGmE,UAAY,EACfnE,EAAGsD,iBAAiB,WAAY5D,IAC9BlB,KAAKqC,cAAcnB,EAAG,IAExBM,EAAGoE,UAAUC,IAAI,4BAA4B,G,CAIjD,oBAAAC,GACEnD,WAAQ,MAARA,gBAAQ,SAARA,SAAUoD,oBAAoB,UAAW/F,KAAKiB,Y,CAgHhD,MAAA+E,GACE,MAAM3F,gBACJA,EAAeC,SACfA,EAAQC,UACRA,EAASC,QACTA,EAAOC,WACPA,EAAUC,QACVA,EAAOI,MACPA,GACEd,KAEJ,OACEiG,EAACC,EAAI,CAAAhG,IAAA,2CACHiG,KAAK,QAAO,aACA9F,EACZ+F,SAAU9F,GAAY,EAAI,EAC1B+F,MAAO,CACL,kCAAmC/F,EACnC,oCAAqCC,EACrC,iCAAkCC,EAClC,oCAAqCC,EACrC,uCAAwCC,EACxC,CAAC,YAAYI,KAAUA,IAAU,WAEnCwF,QAAStG,KAAKoB,iBAEd6E,EAAA,QAAA/F,IAAA,6C","ignoreList":[]}

package/dist/core/p-57ce68e5.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as a,F as i,H as o,g as n}from"./p-8e4e97b4.js";import{D as s,g as r,i as c,R as l,f as d,c as h,h as p,o as b,P as m,I as v,e as u}from"./p-dbc8bf0c.js";import"./p-6215e2ae.js";const g='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;color:var(--ic-top-navigation-text);width:100%;position:relative;--ic-typography-color:var(--ic-top-navigation-text);--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color);--navigation-link-colour:var(--ic-top-navigation-text);--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-light);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-lighten-20)}:host(.dark){--ic-top-navigation-status-tag-text:var(--ic-color-text-primary-dark);--ic-top-navigation-status-tag-secondary:var(--ic-state-layer-darken-10);--ic-top-navigation-title-hover:var(--ic-action-dark-bg-hover);--ic-top-navigation-title-pressed:var(--ic-action-dark-bg-pressed)}:host(.dark) ::slotted(ic-navigation-button){--ic-button-icon-monochrome:var(--ic-color-text-primary-light)}::slotted(ic-navigation-button){--ic-button-icon-monochrome:white}:host .top-navigation{background-color:var(--ic-top-navigation-background);height:-moz-max-content;height:max-content}:host(.fullwidth-searchbar) slot[name="search"]::slotted(form){width:100%}:host .title-link{display:inline-flex;align-items:center;text-decoration:none;padding:var(--ic-space-xxs);transition:var(--ic-easing-transition-fast)}:host .title-link,:host .title-link:visited,:host .title-link:active,:host .title-link ::slotted(a),:host .title-link:visited ::slotted(a),:host .title-link:active ::slotted(a){color:var(--ic-top-navigation-icon-and-label);text-decoration:none;outline:none;--ic-typography-color:var(--ic-top-navigation-icon-and-label)}:host .title-link:hover:not(:focus){background-color:var(--ic-top-navigation-title-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-top-navigation-title-pressed)}:host .title-link:hover{border-radius:var(--ic-border-radius)}:host .menu-button-container{--ic-button-secondary-text-monochrome:var(--ic-brand-text-color);--ic-button-secondary-border-monochrome:var(--ic-brand-text-color)}:host .title-link:focus,:host .title-link:focus-within{border-radius:var(--ic-border-radius);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}:host .title-link ic-typography{font-weight:600}:host .nav-panel-container{border-top:var(--ic-space-1px) solid var(--ic-top-navigation-keyline);padding:0 var(--ic-space-lg);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin));display:flex}:host(.dark) .nav-panel-container{border-top:var(--ic-border-keyline-darken)}.top-panel-container{display:flex;padding-top:0.5rem;padding-bottom:0.5rem}.navigation-tabs{margin-top:calc(-1 * var(--ic-space-1px))}.app-details-container{display:flex;align-items:center;flex:1 1 auto;margin-right:var(--ic-space-md)}.app-icon-container{display:flex;padding-right:var(--ic-space-xs)}.icon-buttons-container{display:flex;margin-left:var(--ic-space-md)}.icon-buttons-container ::slotted(nav){display:flex}.title-wrap{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}:host .app-status{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag);color:var(--ic-top-navigation-status-tag-text);--ic-typography-color:var(--ic-top-navigation-status-tag-text);padding:var(--ic-space-xxs) var(--ic-space-lg);margin-left:var(--ic-space-md);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-top-navigation-status-tag-secondary);color:var(--ic-top-navigation-status-tag);padding:var(--ic-space-xxs) var(--ic-space-sm);margin-left:var(--ic-space-xs);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content;--ic-typography-color:var(--ic-top-navigation-status-tag)}slot[name="app-icon"]::slotted(*){fill:var(--ic-top-navigation-logo);width:2em;height:2em;cursor:pointer}slot[name="toggle-icon"] svg{fill:var(--ic-top-navigation-icon)}.search-menu-container{justify-content:right;display:flex;align-items:center}.menu-button-container{margin-left:var(--ic-space-md)}.menu-button-container .navigation-landmark-button-text{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;color:var(--ic-brand-text-color)}.menu-button-container .navigation-landmark-button-text:dir(rtl){right:-9999px}.search-actions-container{display:flex}.menu-buttons-slot{display:flex;flex-direction:column}.navigation-landmark-text{position:absolute;width:var(--ic-space-1px);height:var(--ic-space-1px);padding:0;margin:calc(-1 * var(--ic-space-1px));overflow:hidden}.navigation-item-list{display:flex;list-style:none;height:2.75rem}.navigation-item-list::-webkit-scrollbar{display:none}:host ic-section-container{padding-bottom:0 !important;padding-top:0 !important}@media screen and (min-width: 993px){.app-details-container{margin-right:var(--ic-space-lg)}}@media screen and (max-width: 1200px){:host .nav-panel-container{padding:0 var(--ic-space-md)}}:host(.mobile-mode) .app-status,:host(.mobile-mode) .app-version{display:none}:host(.mobile-mode) .title-link{margin-right:var(--ic-space-xs)}:host(.mobile-mode) .search-menu-container{max-width:10rem}:host(.mobile-mode) .search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-border-keyline-darken);height:4rem;padding-left:var(--ic-space-md);padding-right:var(--ic-space-md);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin))}@media screen and (max-width: 576px){:host .title-link{margin-right:var(--ic-space-xxxs);word-break:break-word;-webkit-hyphens:none;hyphens:none}.top-panel-container{min-height:2.5rem}.search-bar-container{margin-top:0;height:3.5rem;padding-left:var(--ic-space-xs);padding-right:var(--ic-space-xs)}.menu-button-container{margin-left:var(--ic-space-sm)}slot[name="app-icon"]::slotted(*){width:1.5em;height:1.5em}slot[name="toggle-icon"] svg{width:1.5em;height:1.5em}}@media (forced-colors: active){:host .top-navigation{border-bottom:var(--ic-border-hc)}.app-status,.app-version{border:var(--ic-border-hc)}slot[name="app-icon"]::slotted(*){fill:currentcolor}slot[name="toggle-icon"] svg{fill:currentcolor}}';const f=g;const y=class{constructor(a){t(this,a);this.icNavigationMenuClosed=e(this,"icNavigationMenuClosed",7);this.icNavigationMenuOpened=e(this,"icNavigationMenuOpened",7);this.icTopNavResized=e(this,"icTopNavResized",7);this.hasAppIcon=false;this.hasAppTitleSlot=false;this.hasIconButtons=false;this.hasNavigation=false;this.hasSearchSlotContent=false;this.resizeObserver=null;this.searchBar=null;this.deviceSize=s.XL;this.foregroundColor=r();this.hasFullWidthSearchBar=false;this.mobileSearchBarVisible=false;this.mobileSearchHiddenOnBlur=false;this.navMenuVisible=false;this.searchButtonClick=false;this.searchValue="";this.contentAligned="full-width";this.customMobileBreakpoint=s.L;this.href="/";this.inline=false;this.shortAppTitle="";this.status="";this.theme="inherit";this.version="";this.checkSlots=()=>{this.hasAppIcon=c(this.el,"app-icon");this.hasAppTitleSlot=c(this.el,"app-title");this.hasNavigation=c(this.el,"navigation");this.hasIconButtons=c(this.el,"buttons");this.hasSearchSlotContent=c(this.el,"search");if(this.hasAppIcon){const t=this.el.querySelector('[slot="app-icon"]');if(t&&t.tagName==="A")t.tabIndex=-1}};this.initialiseSearchBar=()=>{if(!this.hasSearchSlotContent)return;const t=l(this.el,"search");if((t===null||t===void 0?void 0:t.tagName)==="IC-SEARCH-BAR"){this.searchBar=t}else if((t===null||t===void 0?void 0:t.tagName)==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}};this.toggleSearchBar=()=>{var t;this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(!this.searchBar)return;(t=this.mobileSearchButtonEl)===null||t===void 0?void 0:t.setAttribute("aria-label",`${this.mobileSearchBarVisible?"Hide":"Show"} search`);this.hasFullWidthSearchBar=this.mobileSearchBarVisible;this.searchBar.fullWidth=this.mobileSearchBarVisible;if(this.mobileSearchBarVisible){setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.menuButtonClick=()=>{this.showNavMenu(true)};this.showNavMenu=t=>{this.navMenuVisible=t;(t?this.icNavigationMenuOpened:this.icNavigationMenuClosed).emit();document.body.style.height=t?"100%":"auto";document.body.style.overflow=t?"hidden":"auto"};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserverCallback=t=>{if(t===this.deviceSize)return;this.deviceSize=t;if(t>this.customMobileBreakpoint){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.icTopNavResized.emit({size:t});if(this.searchBar&&document.activeElement===this.searchBar){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{var t;(t=this.searchBar)===null||t===void 0?void 0:t.focus()}),100)}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback(d())}));this.resizeObserver.observe(this.el)}}watchPropHandler(t,e){h(e,t,this.initialiseSearchBar)}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}componentWillLoad(){this.checkSlots();this.deviceSize=d();this.initialiseSearchBar()}componentDidLoad(){p(this.runResizeObserver);if(!this.hasAppTitleSlot){b([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}}componentWillRender(){this.checkSlots()}navBarMenuCloseHandler(){var t;this.showNavMenu(false);(t=this.menuButtonEl)===null||t===void 0?void 0:t.setFocus()}searchInputBlurHandler({detail:t}){if(t!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.value}}searchValueChangeHandler({detail:t}){this.searchValue=t.value}brandChangeHandler({detail:t}){this.foregroundColor=t.mode}render(){const{appTitle:t,contentAligned:e,customMobileBreakpoint:n,deviceSize:r,el:l,foregroundColor:d,hasAppIcon:h,hasAppTitleSlot:p,hasFullWidthSearchBar:b,hasIconButtons:g,hasNavigation:f,hasSearchSlotContent:y,href:x,inline:k,menuButtonClick:w,mobileSearchBarVisible:z,navMenuVisible:H,searchButtonClickHandler:M,searchButtonMouseDownHandler:C,shortAppTitle:B,status:S,version:T,theme:j}=this;const A=S!=="";const R=T!=="";const $=f||g||A||R;const I=r<=s.S;const N=I?"medium":"large";const V=t!==""&&u(t);const O=r<=n;const D=O?I?"subtitle-small":"h4":"h3";const L=`${z?"Hide":"Show"} search`;const F=I?"small":"medium";const P=c(l,"short-app-title");const W=p?"div":"a";const q=W=="a"&&{href:x};return a(o,{key:"c0c457a694891bb06ad49c6601fb57d83e6ac6c6",class:{"fullwidth-searchbar":b,"mobile-mode":O,[v.Dark]:d===v.Dark,[`ic-theme-${j}`]:j!=="inherit"}},a("div",{key:"fd5f04cfce660e81024b45ebee521d73d42a448d",class:"top-navigation"},a("ic-section-container",{key:"028947110e4a66cccc58659ca164b2938cd7e533",aligned:e,"full-height":true},a("header",{key:"f528842ca7c9fe6a127e53cf7ea0c5af9aeebe79",role:"banner"},a("div",{key:"e23371a5539f686060f624053e8b04a2cef1f860",class:"top-panel-container"},a("div",{key:"25ede4b34cb30ba1d25d3fb06a3f44e48ad4a4c9",class:"app-details-container"},(V||p)&&a(W,Object.assign({key:"666eddef4b8be110a1796083432cd754cda18152",class:"title-link"},q),h&&a("div",{key:"cb7c5cdf6ccc28c5dc5d7699e0332770aa5246f9",class:"app-icon-container"},a("slot",{key:"cd21e969e6fd23594aeb2b31468e81d1d68de7f7",name:"app-icon"})),I&&(!m(B)||P)?a("ic-typography",{variant:"subtitle-small","aria-label":(!p||!P)&&`${t} (${B})`},a("h1",null,P?a("slot",{name:"short-app-title"}):B)):a("ic-typography",{variant:D},a("h1",{class:"title-wrap"},p?a("slot",{name:"app-title"}):t))),A&&a("div",{key:"938a6e6d13bfd92a87baf43934342fb426802d65",class:"app-status"},a("ic-typography",{key:"e3e8e83984ead5be2e4869e67640762af42f5f32","aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},S)),R&&a("div",{key:"1129e504a1db3af56d2c931e08bd15f992b5721f",class:"app-version"},a("ic-typography",{key:"c6f56458fc5f565055fdb0bde408e6078216d51b",variant:"label",class:"app-version-text","aria-label":"app version"},T))),(y||$)&&a("div",{key:"4523603a02eeb22eca466afc1d2cfa44755b8f17",class:"search-menu-container"},a("div",{key:"77ff191542abaa41c8610418d54922e91268d364",class:"search-actions-container"},!O?a(i,null,a("slot",{name:"search"}),g&&a("div",{class:"icon-buttons-container"},a("slot",{name:"buttons"}))):a(i,null,y&&a("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:C,variant:"icon-tertiary",monochrome:true,size:N,"aria-label":L,theme:d,onClick:M},a("slot",{name:"toggle-icon"},a("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},a("path",{d:"M0 0h24v24H0V0z",fill:"none"}),a("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})))),$&&a("div",{class:"menu-button-container"},a("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),a("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":`${H}`},a("ic-button",{id:"menu-button",ref:t=>this.menuButtonEl=t,theme:d,variant:"secondary",monochrome:true,"aria-expanded":"false","aria-haspopup":"true","aria-label":`Open ${f?"navigation":"app"} menu`,size:F,onClick:w},"Menu",a("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"left-icon"},a("path",{d:"M0 0h24v24H0V0z",fill:"none"}),a("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"}))))))))),z&&a("div",{key:"e18aab12917ebdfead1c16c9d508c7feaf7797cb",class:"search-bar-container"},a("slot",{key:"4bf9ae342c58629ea76dc7de395128afd695dc8b",name:"search"})),f&&!O&&a("div",{key:"30401c56949e21a33b18166da0ba2b07ad91c3f0",class:"navigation-tabs"},a("span",{key:"72561ee2554f09e0ff33b29fb257e7dde0a99a0f",id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main pages"),a("nav",{key:"411b215af2ef320d415af6e189a60dce1b730cdf","aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},a("ic-horizontal-scroll",{key:"fac1019061aeaea2ea8197cc0100a23f0cd1a69d",monochrome:true,appearance:d},a("ul",{key:"b85234906c34f1fa03b56903656d6f18eb20829d",class:"navigation-item-list",tabindex:"-1"},a("slot",{key:"d8ef04882230955d8faba63b13edffeeb969e6e6",name:"navigation"})))))))),H&&a("ic-navigation-menu",{key:"46b00abe99e079c940d24d4e9693c5445ebcbafa",version:T,status:S,class:{inline:k}},g&&a("div",{key:"29a9b4e6ba1733b2e96ad9b886bb879ade662d41",class:"menu-buttons-slot",slot:"buttons"},a("slot",{key:"748b40fd29aedee029a4fa27e999cf9844483613",name:"buttons"})),a("ul",{key:"20b81216ba0c01470673678a14d873fe8cbcaaae",slot:"navigation"},a("slot",{key:"fb9e239a48344888b970e865e103b1ee2f9156ed",name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};y.style=f;export{y as ic_top_navigation};
-//# sourceMappingURL=p-57ce68e5.entry.js.map

package/dist/core/p-57ce68e5.entry.js.map

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