@ukic/web-components 2.1.0-beta.9 → 2.3.0

package/dist/core/p-20fafec4.entry.js.map

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

package/dist/core/p-24b88371.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as t,H as a,g as r}from"./p-69920d86.js";import{e as c,v as o,d as n,r as s,a as d}from"./p-dd980be4.js";import"./p-6f57b13c.js";const l='/*! 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:flex;flex-direction:column;width:-moz-fit-content;width:fit-content}:host([additional-field-display="static"]) ::slotted(ic-text-field){margin-top:calc(var(--ic-space-sm) / 2);margin-left:var(--ic-space-xl)}:host(.disabled){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus)}.container{display:grid;grid-template-columns:min-content auto;position:relative;cursor:pointer;align-items:center;margin:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs)}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:var(--ic-border-default);border-radius:50%;transition:var(--ic-easing-transition-fast);box-sizing:border-box}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:var(--ic-space-1px) solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:var(--ic-space-1px) solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:0.125rem solid var(--ic-action-default)}.container input:checked:disabled~.checkmark{background-color:transparent;border:0.125rem solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:var(--ic-space-1px) dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:0.125rem solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:"";position:absolute;display:none;top:calc(50% - var(--ic-space-xs));left:calc(50% - var(--ic-space-xs));width:var(--ic-space-md);height:var(--ic-space-md);border-radius:50%;background:var(--ic-action-default)}.radio-label{margin-left:var(--ic-space-md)}.additional-field-wrapper{margin-left:var(--ic-space-xs)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default);margin-left:calc(-1 * var(--ic-space-1px))}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.container input:checked~.checkmark,.container:active input:checked~.checkmark{border-color:Highlight}.container input:checked~.checkmark::after,.container:active input:checked~.checkmark::after{background-color:Highlight}.container input:disabled~.checkmark,.container input:checked:disabled~.checkmark{border-color:GrayText}.container input:disabled~.checkmark::after,.container:active input:disabled~.checkmark::after{background-color:GrayText}}';const h=class{constructor(t){e(this,t);this.icCheck=i(this,"icCheck",7);this.radioOptionSelect=i(this,"radioOptionSelect",7);this.icSelectedChange=i(this,"icSelectedChange",7);this.defaultRadioValue="";this.hasAdditionalField=false;this.skipFocus=false;this.handleClick=()=>{if(!this.disabled){if(this.skipFocus===false){this.radioElement.focus()}this.skipFocus=false;if(this.hasAdditionalField){const e=this.host.querySelector("ic-text-field");this.value=e.value!==""?e.value:this.defaultRadioValue}this.icCheck.emit({value:this.value});this.radioOptionSelect.emit({value:this.value})}};this.swallowClick=e=>{e.stopPropagation()};this.handleFormReset=()=>{this.skipFocus=true;this.selected=this.initiallySelected};this.additionalFieldDisplay="static";this.disabled=false;this.dynamicText="This selection requires additional answers";this.groupLabel=undefined;this.label=undefined;this.name=undefined;this.value=undefined;this.selected=false;this.initiallySelected=this.selected}watchSelectedHandler(){this.icSelectedChange.emit()}disconnectedCallback(){c(this.host,this.handleFormReset)}componentWillLoad(){const e=o(this.host,"additional-field");if(e!==null){this.hasAdditionalField=true;const i=e[0];if(i.tagName==="IC-TEXT-FIELD"){const e=i;e.hiddenInput=false}}this.defaultRadioValue=this.value;n(this.host,this.handleFormReset);s(this.disabled,this.host)}componentDidLoad(){d([{prop:this.value,propName:"value"}],"Radio Option")}componentDidRender(){if(this.additionalFieldDisplay==="static"){const e=this.host.querySelector("ic-text-field");if(!this.selected){e&&e.setAttribute("disabled","")}else{e&&e.removeAttribute("disabled")}}}textfieldValueHandler(e){const i=e.detail.value;if(this.selected){if(i!==""){this.value=e.detail.value;this.icCheck.emit({value:this.value});this.radioOptionSelect.emit({value:this.value})}else{this.value=this.defaultRadioValue;this.icCheck.emit({value:this.defaultRadioValue});this.radioOptionSelect.emit({value:this.defaultRadioValue})}}e.stopImmediatePropagation()}async setFocus(){if(this.host.shadowRoot.querySelector("input")){this.host.shadowRoot.querySelector("input").focus()}}render(){const e=`ic-radio-option-${this.label!==undefined?this.label:this.value}-${this.groupLabel}`;return t(a,{onClick:this.handleClick,class:{disabled:this.disabled}},t("div",{class:{["container"]:true,["disabled"]:this.disabled}},t("div",null,t("input",{role:"radio",tabindex:this.selected?"0":"-1",type:"radio",name:this.name,id:e,value:this.value,disabled:this.disabled?true:null,checked:this.selected,ref:e=>this.radioElement=e}),t("span",{class:"checkmark"})),t("ic-typography",{class:"radio-label",variant:"body"},t("label",{htmlFor:e},this.label))),this.hasAdditionalField&&t("div",{onClick:this.swallowClick,class:{"dynamic-container":true,hidden:this.additionalFieldDisplay==="dynamic"&&!this.selected}},this.additionalFieldDisplay==="dynamic"&&t("div",{class:"branch-corner"}),t("div",null,this.additionalFieldDisplay==="dynamic"&&t("ic-typography",{variant:"caption"},t("p",{class:"dynamic-text"},this.dynamicText)),t("div",{class:{"additional-field-wrapper":this.additionalFieldDisplay==="static"}},t("slot",{name:"additional-field"})))))}static get delegatesFocus(){return true}get host(){return r(this)}static get watchers(){return{selected:["watchSelectedHandler"]}}};h.style=l;export{h as ic_radio_option};
+//# sourceMappingURL=p-24b88371.entry.js.map

package/dist/core/p-24b88371.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icRadioOptionCss","RadioOption","this","defaultRadioValue","hasAdditionalField","skipFocus","handleClick","disabled","radioElement","focus","textfield","host","querySelector","value","icCheck","emit","radioOptionSelect","swallowClick","event","stopPropagation","handleFormReset","selected","initiallySelected","watchSelectedHandler","icSelectedChange","disconnectedCallback","removeFormResetListener","componentWillLoad","additonalFieldContent","getSlotContent","Element","tagName","textField","hiddenInput","addFormResetListener","removeDisabledFalse","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","componentDidRender","additionalFieldDisplay","setAttribute","removeAttribute","textfieldValueHandler","textFieldValue","detail","stopImmediatePropagation","async","shadowRoot","render","id","label","undefined","groupLabel","h","Host","onClick","class","role","tabindex","type","name","checked","ref","el","variant","htmlFor","hidden","dynamicText"],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: flex;\n  flex-direction: column;\n  width: fit-content;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-text-field) {\n  margin-top: calc(var(--ic-space-sm) / 2);\n  margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled  */\n:host(.disabled) {\n  color: var(--ic-architectural-200);\n}\n\n/* Focus states */\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n  box-shadow: var(--ic-border-focus);\n}\n\n/* The container */\n.container {\n  display: grid;\n  grid-template-columns: min-content auto;\n  position: relative;\n  cursor: pointer;\n  align-items: center;\n  margin: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n  cursor: default;\n}\n\n/* Hide the browser's default radio button */\n.container input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  display: inline-block;\n  position: absolute;\n  cursor: pointer;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  border-radius: 50%;\n  border: none;\n}\n\n/* Create a custom radio button */\n.checkmark {\n  display: block;\n  position: relative;\n  top: 0;\n  left: 0;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  background-color: transparent;\n  border: var(--ic-border-default);\n  border-radius: 50%;\n  transition: var(--ic-easing-transition-fast);\n  box-sizing: border-box;\n}\n\n/* Show the indicator (dot/circle) when checked */\n.container input:checked ~ .checkmark::after {\n  display: inline-block;\n}\n\n/* On mouse-over, add a light blue background color */\n.container:hover input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-hover);\n  box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-hover);\n  border: var(--ic-space-1px) solid var(--ic-action-default);\n}\n\n/* When pressed, adds the active colours */\n.container:active input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: var(--ic-space-1px) solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/* When pressed, adds the active colours */\n.container:active input:checked ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 0.125rem solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n}\n\n/* When pressed and selected, adds the active colours */\n.container:active input:checked ~ .checkmark::after {\n  background-color: var(--ic-action-default-active);\n}\n\n/* When the radio button is checked */\n.container input:checked ~ .checkmark {\n  border: 0.125rem solid var(--ic-action-default);\n}\n\n/* When the radio button is checked and disabled */\n.container input:checked:disabled ~ .checkmark {\n  background-color: transparent;\n  border: 0.125rem solid var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark {\n  border: var(--ic-space-1px) dashed var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark::after {\n  background: var(--ic-architectural-200);\n}\n\n/* On mouse-over inactive */\n.container:hover input:disabled ~ .checkmark {\n  background-color: transparent;\n  box-shadow: none;\n  border: 0.125rem solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n  background-color: var(--ic-architectural-200);\n}\n\n/* Style the indicator (dot/circle) */\n.container .checkmark::after {\n  content: \"\";\n  position: absolute;\n  display: none;\n  top: calc(50% - var(--ic-space-xs));\n  left: calc(50% - var(--ic-space-xs));\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n  border-radius: 50%;\n  background: var(--ic-action-default);\n}\n\n.radio-label {\n  margin-left: var(--ic-space-md);\n}\n\n.additional-field-wrapper {\n  margin-left: var(--ic-space-xs);\n}\n\n/* The line */\n.branch-corner {\n  color: var(--ic-action-default);\n  height: var(--ic-space-md);\n  width: var(--ic-space-xl);\n  border-radius: 0 0 0 0.188rem;\n  border-bottom: 0.125rem solid var(--ic-action-default);\n  border-left: 0.125rem solid var(--ic-action-default);\n  margin-left: calc(-1 * var(--ic-space-1px));\n}\n\n/* The dynamic container */\n.dynamic-container {\n  display: flex;\n  position: relative;\n  margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n  gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n  display: none;\n}\n\n.dynamic-text {\n  color: var(--ic-action-default);\n  margin-top: calc(var(--ic-space-sm) / 2);\n  margin-bottom: var(--ic-space-xs);\n  border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n  ::slotted(ic-text-field) {\n    --input-width: 100%;\n  }\n}\n\n@media (forced-colors: active) {\n  /* Styles here only apply to Forced Colors Mode */\n\n  .container input:checked ~ .checkmark,\n  .container:active input:checked ~ .checkmark {\n    border-color: Highlight;\n  }\n\n  .container input:checked ~ .checkmark::after,\n  .container:active input:checked ~ .checkmark::after {\n    background-color: Highlight;\n  }\n\n  .container input:disabled ~ .checkmark,\n  .container input:checked:disabled ~ .checkmark {\n    border-color: GrayText;\n  }\n\n  .container input:disabled ~ .checkmark::after,\n  .container:active input:disabled ~ .checkmark::after {\n    background-color: GrayText;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  State,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes, IcValueEventDetail } from \"../../utils/types\";\nimport {\n  getSlotContent,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\n@Component({\n  tag: \"ic-radio-option\",\n  styleUrl: \"ic-radio-option.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class RadioOption {\n  private defaultRadioValue: string = \"\";\n  private hasAdditionalField: boolean = false;\n  private radioElement: HTMLInputElement;\n  private skipFocus = false;\n\n  @Element() host: HTMLIcRadioOptionElement;\n\n  /**\n   * The style of additionalField that will be displayed if used.\n   */\n  @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n    \"static\";\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * The text to be displayed when dynamic.\n   */\n  @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n  /**\n   * The group label for the radio option.\n   */\n  @Prop() groupLabel: string;\n\n  /**\n   * The label for the radio option.\n   */\n  @Prop() label?: string;\n\n  /**\n   * The name for the radio option.\n   */\n  @Prop() name: string;\n\n  /**\n   * The value for the radio option.\n   */\n  @Prop({ mutable: true }) value!: string;\n\n  /**\n   * If `true`, the radio option will be displayed in a selected state.\n   */\n  @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n  @State() initiallySelected = this.selected;\n\n  @Watch(\"selected\")\n  watchSelectedHandler(): void {\n    this.icSelectedChange.emit();\n  }\n\n  /**\n   * Emitted when the radio option is selected.\n   */\n  @Event() icCheck: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * @deprecated This event should not be used anymore. Use icCheck instead.\n   */\n  @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when the radio option is selected or deselected.\n   */\n  @Event() icSelectedChange: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.host, this.handleFormReset);\n  }\n\n  componentWillLoad(): void {\n    const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n    if (additonalFieldContent !== null) {\n      this.hasAdditionalField = true;\n      const Element = additonalFieldContent[0] as HTMLElement;\n      if (Element.tagName === \"IC-TEXT-FIELD\") {\n        const textField = Element as HTMLIcTextFieldElement;\n        textField.hiddenInput = false;\n      }\n    }\n\n    this.defaultRadioValue = this.value;\n\n    addFormResetListener(this.host, this.handleFormReset);\n\n    removeDisabledFalse(this.disabled, this.host);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.value, propName: \"value\" }],\n      \"Radio Option\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.additionalFieldDisplay === \"static\") {\n      const textfield = this.host.querySelector(\"ic-text-field\");\n      if (!this.selected) {\n        textfield && textfield.setAttribute(\"disabled\", \"\");\n      } else {\n        textfield && textfield.removeAttribute(\"disabled\");\n      }\n    }\n  }\n\n  @Listen(\"icChange\")\n  textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n    const textFieldValue = event.detail.value;\n\n    if (this.selected) {\n      if (textFieldValue !== \"\") {\n        this.value = event.detail.value;\n        this.icCheck.emit({\n          value: this.value,\n        });\n        this.radioOptionSelect.emit({\n          value: this.value,\n        });\n      } else {\n        this.value = this.defaultRadioValue;\n        this.icCheck.emit({\n          value: this.defaultRadioValue,\n        });\n        this.radioOptionSelect.emit({\n          value: this.defaultRadioValue,\n        });\n      }\n    }\n\n    event.stopImmediatePropagation();\n  }\n\n  /**\n   * Sets focus on the radio option.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.host.shadowRoot.querySelector(\"input\")) {\n      this.host.shadowRoot.querySelector(\"input\").focus();\n    }\n  }\n\n  private handleClick = () => {\n    if (!this.disabled) {\n      if (this.skipFocus === false) {\n        this.radioElement.focus();\n      }\n      this.skipFocus = false;\n\n      if (this.hasAdditionalField) {\n        const textfield = this.host.querySelector(\"ic-text-field\");\n        this.value =\n          textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n      }\n\n      this.icCheck.emit({\n        value: this.value,\n      });\n\n      this.radioOptionSelect.emit({\n        value: this.value,\n      });\n    }\n  };\n\n  private swallowClick = (event: MouseEvent) => {\n    event.stopPropagation();\n  };\n\n  private handleFormReset = (): void => {\n    this.skipFocus = true;\n    this.selected = this.initiallySelected;\n  };\n\n  render() {\n    const id = `ic-radio-option-${\n      this.label !== undefined ? this.label : this.value\n    }-${this.groupLabel}`;\n\n    return (\n      <Host onClick={this.handleClick} class={{ disabled: this.disabled }}>\n        <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n          <div>\n            <input\n              role=\"radio\"\n              tabindex={this.selected ? \"0\" : \"-1\"}\n              type=\"radio\"\n              name={this.name}\n              id={id}\n              value={this.value}\n              disabled={this.disabled ? true : null}\n              checked={this.selected}\n              ref={(el) => (this.radioElement = el)}\n            ></input>\n            <span class=\"checkmark\"></span>\n          </div>\n          <ic-typography class=\"radio-label\" variant=\"body\">\n            <label htmlFor={id}>{this.label}</label>\n          </ic-typography>\n        </div>\n\n        {this.hasAdditionalField && (\n          <div\n            onClick={this.swallowClick}\n            class={{\n              \"dynamic-container\": true,\n              hidden:\n                this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n            }}\n          >\n            {this.additionalFieldDisplay === \"dynamic\" && (\n              <div class=\"branch-corner\"></div>\n            )}\n            <div>\n              {this.additionalFieldDisplay === \"dynamic\" && (\n                <ic-typography variant=\"caption\">\n                  <p class=\"dynamic-text\">{this.dynamicText}</p>\n                </ic-typography>\n              )}\n              <div\n                class={{\n                  \"additional-field-wrapper\":\n                    this.additionalFieldDisplay === \"static\",\n                }}\n              >\n                <slot name=\"additional-field\"></slot>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-2ae7687a.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as s,H as n,g as i}from"./p-69920d86.js";import{I as a}from"./p-6f57b13c.js";const c=":host{display:block}:host(.ic-tab-panel-light){color:white}";const d=class{constructor(s){t(this,s);this.tabPanelCreated=e(this,"tabPanelCreated",7);this.tabPanelRemoved=e(this,"tabPanelRemoved",7);this.appearance="dark";this.contextId="default";this.panelId=undefined;this.selectedTab=undefined;this.tabPosition=undefined}connectedCallback(){this.tabPanelCreated.emit(this.host)}disconnectedCallback(){const t=document.querySelector(`ic-tab-context[context-id=${this.contextId}]`);if(t){t.tabRemovedHandler()}}render(){const{panelId:t,selectedTab:e,appearance:i}=this;return s(n,{class:{["ic-tab-panel-light"]:i===a.Light},role:"tabpanel",hidden:t!==undefined&&e!==undefined?!(t===e):true},s("div",null,s("slot",null)))}get host(){return i(this)}};d.style=c;export{d as ic_tab_panel};
+//# sourceMappingURL=p-2ae7687a.entry.js.map

package/dist/core/p-2ae7687a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icTabPanelCss","TabPanel","connectedCallback","this","tabPanelCreated","emit","host","disconnectedCallback","tabContext","document","querySelector","contextId","tabRemovedHandler","render","panelId","selectedTab","appearance","h","Host","class","IcThemeForegroundEnum","Light","role","hidden","undefined"],"sources":["./src/components/ic-tab-panel/ic-tab-panel.css?tag=ic-tab-panel&encapsulation=shadow","./src/components/ic-tab-panel/ic-tab-panel.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n:host(.ic-tab-panel-light) {\n  color: white;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n} from \"@stencil/core\";\nimport {\n  IcThemeForegroundEnum,\n  IcThemeForegroundNoDefault,\n} from \"../../utils/types\";\n\n@Component({\n  tag: \"ic-tab-panel\",\n  styleUrl: \"ic-tab-panel.css\",\n  shadow: true,\n})\nexport class TabPanel {\n  @Element() host: HTMLIcTabPanelElement;\n\n  /**\n   * @internal The appearance of the tabs, e.g dark, or light.\n   */\n  @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n  /**\n   * @deprecated This is no longer required.\n   * The context id is passed down from `ic-tab-context`\n   */\n  @Prop({ reflect: true }) contextId?: string = \"default\";\n\n  /**\n   * @internal The shared ID that links the panel and tab.\n   */\n  @Prop({ reflect: true }) panelId?: string;\n\n  /**\n   * @internal The shared ID of the currently selected tab.\n   */\n  @Prop() selectedTab?: string;\n\n  /**\n   * @internal The position of the tab panel inside the tabs array in context.\n   */\n  @Prop({ reflect: true }) tabPosition?: number;\n\n  /**\n   * @internal Emitted when a tab panel is dynamically created.\n   */\n  @Event() tabPanelCreated: EventEmitter<HTMLIcTabPanelElement>;\n\n  /**\n   * @internal Emitted when a tab panel is unmounted.\n   */\n  @Event() tabPanelRemoved: EventEmitter<void>;\n\n  connectedCallback(): void {\n    this.tabPanelCreated.emit(this.host);\n  }\n\n  disconnectedCallback(): void {\n    const tabContext = document.querySelector(\n      `ic-tab-context[context-id=${this.contextId}]`\n    ) as HTMLIcTabContextElement;\n    if (tabContext) {\n      tabContext.tabRemovedHandler();\n    }\n  }\n\n  render() {\n    const { panelId, selectedTab, appearance } = this;\n    return (\n      <Host\n        class={{\n          [\"ic-tab-panel-light\"]: appearance === IcThemeForegroundEnum.Light,\n        }}\n        role=\"tabpanel\"\n        hidden={\n          panelId !== undefined && selectedTab !== undefined\n            ? !(panelId === selectedTab)\n            : true\n        }\n      >\n        <div>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAgB,8D,MCmBTC,EAAQ,M,2IAM+B,O,eAMJ,U,6EA2B9CC,oBACEC,KAAKC,gBAAgBC,KAAKF,KAAKG,K,CAGjCC,uBACE,MAAMC,EAAaC,SAASC,cAC1B,6BAA6BP,KAAKQ,cAEpC,GAAIH,EAAY,CACdA,EAAWI,mB,EAIfC,SACE,MAAMC,QAAEA,EAAOC,YAAEA,EAAWC,WAAEA,GAAeb,KAC7C,OACEc,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,sBAAuBH,IAAeI,EAAsBC,OAE/DC,KAAK,WACLC,OACET,IAAYU,WAAaT,IAAgBS,YACnCV,IAAYC,GACd,MAGNE,EAAA,WACEA,EAAA,c"}

package/dist/core/p-2f5a9d91.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as a,g as n}from"./p-69920d86.js";import{I as s}from"./p-6f57b13c.js";import{J as o,D as r,g as l,l as h,o as c,i as d,c as p,a as m,B as u}from"./p-dd980be4.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-theme-text);width:100%;position:relative}:host .top-navigation{background-color:var(--ic-theme-primary);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-theme-text);text-decoration:none;outline:none}:host .title-link:hover:not(:focus){background-color:var(--ic-theme-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-theme-active)}:host .title-link:hover{border-radius:var(--ic-border-radius)}: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-keyline-lighten);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-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-architectural-white);color:var(--ic-color-primary-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(.dark) .app-status{background-color:var(--ic-theme-text);color:var(--ic-color-white-text)}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-theme-active);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}slot[name="app-icon"]::slotted(svg){fill:var(--ic-theme-text);width:2em;height:2em}slot[name="toggle-icon"] svg{fill:var(--ic-theme-text)}.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:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.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)}}@media screen and (max-width: 992px){:host .nav-panel-container,:host .app-status,:host .app-version{display:none}:host .title-link{margin-right:var(--ic-space-xs)}.search-menu-container{max-width:10rem}.search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-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}.searchbox-inline{display:none}.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(svg){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-hc-border)}.app-status,.app-version{border:var(--ic-hc-border)}slot[name="app-icon"]::slotted(svg){fill:currentcolor}}';const v=class{constructor(e){t(this,e);this.icNavigationMenuClosed=i(this,"icNavigationMenuClosed",7);this.icNavigationMenuOpened=i(this,"icNavigationMenuOpened",7);this.hasAppIcon=false;this.hasIconButtons=false;this.hasNavigation=false;this.hasSearchSlotContent=false;this.resizeObserver=null;this.searchBar=null;this.initialiseSearchBar=()=>{if(this.hasSearchSlotContent){const t=o(this.el,"search");if(t&&t.tagName==="IC-SEARCH-BAR"){this.searchBar=t}else if(t&&t.tagName==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}}};this.emitTopNavResized=t=>{const i=new CustomEvent("topNavResized",{detail:{size:t}});this.el.dispatchEvent(i)};this.menuButtonClick=()=>{this.showNavMenu(true)};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserverCallback=t=>{if(t!==this.deviceSize){this.deviceSize=t;if(t>r.L){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.emitTopNavResized(t);if(document.activeElement!==null&&document.activeElement!==undefined&&document.activeElement.tagName==="IC-SEARCH-BAR"){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{this.searchBar.focus()}),100)}}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{const t=l();this.resizeObserverCallback(t)}));this.resizeObserver.observe(this.el)};this.deviceSize=r.XL;this.foregroundColor=h();this.hasFullWidthSearchBar=false;this.menuOpen=false;this.mobileSearchBarVisible=false;this.mobileSearchHiddenOnBlur=false;this.navMenuVisible=false;this.searchButtonClick=false;this.searchValue="";this.contentAligned="full-width";this.href="/";this.inline=false;this.shortAppTitle="";this.status="";this.version="";this.appTitle=undefined}watchPropHandler(t,i){c(i,t,this.initialiseSearchBar)}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentWillLoad(){this.hasAppIcon=d(this.el,"app-icon");this.hasNavigation=d(this.el,"navigation");this.hasIconButtons=d(this.el,"buttons");this.hasSearchSlotContent=d(this.el,"search");this.deviceSize=l();this.initialiseSearchBar()}componentDidLoad(){p(this.runResizeObserver);!d(this.el,"app-title")&&m([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}componentWillRender(){this.hasNavigation=d(this.el,"navigation");this.hasSearchSlotContent=d(this.el,"search");this.hasIconButtons=d(this.el,"buttons");this.hasAppIcon=d(this.el,"app-icon")}navBarMenuCloseHandler(){this.showNavMenu(false);const t=this.el.shadowRoot.querySelector("#menu-button");t.focus()}searchInputBlurHandler(t){if(t.detail!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.detail.value}}searchValueChangeHandler(t){this.searchValue=t.detail.value}themeChangeHandler(t){const i=t.detail;this.foregroundColor=i.mode}toggleSearchBar(){this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(this.searchBar!==null){if(this.mobileSearchBarVisible){this.mobileSearchButtonEl.updateAriaLabel("Hide search");this.hasFullWidthSearchBar=true;this.searchBar.fullWidth=true;setTimeout((()=>{this.searchBar.focus()}),100)}else{this.mobileSearchButtonEl.updateAriaLabel("Show search");this.hasFullWidthSearchBar=false;this.searchBar.fullWidth=false}}}showNavMenu(t){this.navMenuVisible=t;if(t){this.icNavigationMenuOpened.emit();document.body.style.height="100%";document.body.style.overflow="hidden"}else{this.icNavigationMenuClosed.emit();document.body.style.height="auto";document.body.style.overflow="auto"}}render(){const t=this.hasNavigation||this.hasIconButtons||this.status!==""||this.version!=="";const i=this.deviceSize<=r.S?"default":"large";let n="h3";const o=this.appTitle!==""&&this.appTitle!==undefined;if(this.deviceSize<=r.L){n="h4";if(this.deviceSize<=r.S){n="subtitle-small"}}const l=this.mobileSearchBarVisible?"Hide search":"Show search";const h=this.deviceSize<=r.S?"small":"default";const c=d(this.el,"app-title")?"div":"a";const p=c=="a"&&{href:this.href};return e(a,{class:{["fullwidth-searchbar"]:this.hasFullWidthSearchBar,[s.Dark]:this.foregroundColor===s.Dark}},e("div",{class:"top-navigation"},e("ic-section-container",{aligned:this.contentAligned,"full-height":true},e("header",{role:"banner"},e("div",{class:"top-panel-container"},e("div",{class:"app-details-container"},(o||d(this.el,"app-title"))&&e(c,Object.assign({class:"title-link"},p),this.hasAppIcon&&e("div",{class:"app-icon-container","aria-hidden":"true"},e("slot",{name:"app-icon"})),this.deviceSize<=r.S&&!u(this.shortAppTitle)?e("ic-typography",{variant:"subtitle-small","aria-label":`${this.appTitle} (${this.shortAppTitle})`},e("h1",null,this.shortAppTitle)):e("ic-typography",{variant:n},e("h1",{class:"title-wrap"},d(this.el,"app-title")?e("slot",{name:"app-title"}):this.appTitle))),this.status!==""&&e("div",{class:"app-status"},e("ic-typography",{"aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},this.status)),this.version!==""&&e("div",{class:"app-version"},e("ic-typography",{variant:"label",class:"app-version-text","aria-label":"app version"},this.version))),(this.hasSearchSlotContent||t)&&e("div",{class:"search-menu-container"},e("div",{class:"search-actions-container"},this.deviceSize>r.L&&e("slot",{name:"search"}),this.hasSearchSlotContent&&this.deviceSize<=r.L&&e("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:this.searchButtonMouseDownHandler,variant:"icon",size:i,"aria-label":l,appearance:this.foregroundColor,onClick:this.searchButtonClickHandler},e("slot",{name:"toggle-icon"},e("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})))),this.hasIconButtons&&this.deviceSize>r.L&&e("div",{class:"icon-buttons-container"},e("slot",{name:"buttons"})),t&&this.deviceSize<=r.L&&e("div",{class:"menu-button-container"},e("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),e("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":this.navMenuVisible?"true":"false"},e("ic-button",{id:"menu-button",appearance:this.foregroundColor,variant:"secondary","aria-expanded":this.menuOpen?"true":"false","aria-haspopup":"true","aria-label":`Open ${this.hasNavigation?"navigation":"app"} menu`,size:h,onClick:this.menuButtonClick},"Menu",e("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"icon"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"})))))))),this.mobileSearchBarVisible&&e("div",{class:"search-bar-container"},e("slot",{name:"search"})),this.hasNavigation&&this.deviceSize>r.L&&e("div",{class:"navigation-tabs"},e("span",{id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main navigation"),e("nav",{"aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},e("ic-horizontal-scroll",{appearance:this.foregroundColor},e("ul",{class:"navigation-item-list",tabindex:"-1"},e("slot",{name:"navigation"})))))))),this.navMenuVisible&&e("ic-navigation-menu",{version:this.version,status:this.status,class:{["inline"]:this.inline}},e("div",{class:"menu-buttons-slot",slot:"buttons"},e("slot",{name:"buttons"})),e("ul",{slot:"navigation"},e("slot",{name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};v.style=g;export{v as ic_top_navigation};
+//# sourceMappingURL=p-2f5a9d91.entry.js.map

package/dist/core/p-2f5a9d91.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icTopNavigationCss","TopNavigation","this","hasAppIcon","hasIconButtons","hasNavigation","hasSearchSlotContent","resizeObserver","searchBar","initialiseSearchBar","slot","getSlot","el","tagName","querySelector","hideLabel","emitTopNavResized","size","event","CustomEvent","detail","dispatchEvent","menuButtonClick","showNavMenu","searchButtonMouseDownHandler","searchButtonClick","searchButtonClickHandler","toggleSearchBar","resizeObserverCallback","currSize","deviceSize","DEVICE_SIZES","L","mobileSearchBarVisible","document","activeElement","undefined","setAttribute","removeAttribute","setTimeout","focus","runResizeObserver","ResizeObserver","getCurrentDeviceSize","observe","XL","getThemeForegroundColor","watchPropHandler","newValue","oldValue","onComponentPropUndefinedChange","disconnectedCallback","disconnect","componentWillLoad","isSlotUsed","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","appTitle","propName","componentWillRender","navBarMenuCloseHandler","menuBtn","shadowRoot","searchInputBlurHandler","ev","searchValue","value","searchValueChangeHandler","themeChangeHandler","theme","foregroundColor","mode","mobileSearchButtonEl","updateAriaLabel","hasFullWidthSearchBar","fullWidth","show","navMenuVisible","icNavigationMenuOpened","emit","body","style","height","overflow","icNavigationMenuClosed","render","hasMenuContent","status","version","searchButtonSize","S","appTitleVariant","hasTitle","mobileSearchButtonTitle","menuSize","Component","attrs","href","h","Host","class","IcThemeForegroundEnum","Dark","aligned","contentAligned","role","Object","assign","name","isEmptyString","shortAppTitle","variant","id","ref","onMouseDown","appearance","onClick","xmlns","viewBox","fill","d","menuOpen","width","tabindex","inline"],"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-theme-text);\n  width: 100%;\n  position: relative;\n}\n\n:host .top-navigation {\n  background-color: var(--ic-theme-primary);\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-theme-text);\n  text-decoration: none;\n  outline: none;\n}\n\n:host .title-link:hover:not(:focus) {\n  background-color: var(--ic-theme-hover);\n}\n\n:host .title-link:active:not(:focus) {\n  background-color: var(--ic-theme-active);\n}\n\n:host .title-link:hover {\n  border-radius: var(--ic-border-radius);\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-keyline-lighten);\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-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-architectural-white);\n  color: var(--ic-color-primary-text);\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(.dark) .app-status {\n  background-color: var(--ic-theme-text);\n  color: var(--ic-color-white-text);\n}\n\n:host .app-version {\n  border-radius: var(--ic-space-md);\n  background-color: var(--ic-theme-active);\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\nslot[name=\"app-icon\"]::slotted(svg) {\n  fill: var(--ic-theme-text);\n  width: 2em;\n  height: 2em;\n}\n\nslot[name=\"toggle-icon\"] svg {\n  fill: var(--ic-theme-text);\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: -10000px;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\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/* medium */\n@media screen and (max-width: 992px) {\n  :host .nav-panel-container,\n  :host .app-status,\n  :host .app-version {\n    display: none;\n  }\n\n  :host .title-link {\n    margin-right: var(--ic-space-xs);\n  }\n\n  .search-menu-container {\n    max-width: 10rem;\n  }\n\n  .search-bar-container {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-top: var(--ic-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\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  .searchbox-inline {\n    display: none;\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(svg) {\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-hc-border);\n  }\n\n  .app-status,\n  .app-version {\n    border: var(--ic-hc-border);\n  }\n\n  slot[name=\"app-icon\"]::slotted(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} from \"@stencil/core\";\n\nimport {\n  IcTypographyVariants,\n  IcAlignment,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n  IcTheme,\n} from \"../../utils/types\";\nimport {\n  checkResizeObserver,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  getSlot,\n  onComponentPropUndefinedChange,\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  isEmptyString,\n} from \"../../utils/helpers\";\n\n/**\n * @slot app-icon - Content will be rendered to left of app title.\n * @slot app-title - Handle routing by nesting a route in the app title.\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: boolean = false;\n  private hasIconButtons: boolean = false;\n  private hasNavigation: boolean = false;\n  private hasSearchSlotContent: boolean = false;\n  private mobileSearchButtonEl: HTMLIcButtonElement;\n  private resizeObserver: ResizeObserver = null;\n  private searchBar: HTMLIcSearchBarElement = null;\n\n  @Element() el: HTMLIcTopNavigationElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n  @State() hasFullWidthSearchBar: boolean = false;\n  @State() menuOpen: boolean = false;\n  @State() mobileSearchBarVisible: boolean = false;\n  @State() mobileSearchHiddenOnBlur: boolean = false;\n  @State() navMenuVisible: boolean = false;\n  @State() searchButtonClick: boolean = false;\n  @State() searchValue: string = \"\";\n\n  /**\n   * The alignment of the top navigation content.\n   */\n  @Prop() contentAligned: IcAlignment = \"full-width\";\n  /**\n   *  The URL to navigate to when the app title is clicked.\n   */\n  @Prop() href: string = \"/\";\n\n  /**\n   * If `true`, the flyout navigation menu on small devices will be contained by the parent element.\n   */\n  @Prop() inline: boolean = 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: string = \"\";\n\n  /**\n   * The status info to be displayed.\n   */\n  @Prop() status: string = \"\";\n\n  /**\n   * The version info to be displayed.\n   */\n  @Prop() version: string = \"\";\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 gatbsy 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  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n    this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n    this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n    this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n    this.deviceSize = getCurrentDeviceSize();\n    this.initialiseSearchBar();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n    !isSlotUsed(this.el, \"app-title\") &&\n      onComponentRequiredPropUndefined(\n        [{ prop: this.appTitle, propName: \"app-title\" }],\n        \"Top Navigation\"\n      );\n  }\n\n  componentWillRender(): void {\n    this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n    this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n    this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n    this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n  }\n\n  @Listen(\"icNavigationMenuClose\", {})\n  navBarMenuCloseHandler(): void {\n    this.showNavMenu(false);\n    const menuBtn = this.el.shadowRoot.querySelector(\n      \"#menu-button\"\n    ) as HTMLElement;\n    menuBtn.focus();\n  }\n\n  @Listen(\"icSearchBarBlur\", {})\n  searchInputBlurHandler(ev: CustomEvent): void {\n    if (ev.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 = ev.detail.value;\n    }\n  }\n\n  @Listen(\"icChange\", {})\n  searchValueChangeHandler(ev: CustomEvent): void {\n    this.searchValue = ev.detail.value;\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  private initialiseSearchBar = () => {\n    if (this.hasSearchSlotContent) {\n      const slot = getSlot(this.el, \"search\");\n      if (slot && slot.tagName === \"IC-SEARCH-BAR\") {\n        this.searchBar = slot as HTMLIcSearchBarElement;\n      } else if (slot && slot.tagName === \"FORM\") {\n        this.searchBar = slot.querySelector(\n          \"ic-search-bar\"\n        ) as HTMLIcSearchBarElement;\n      }\n\n      if (this.searchBar !== null) {\n        this.searchBar.hideLabel = true;\n      }\n    }\n  };\n\n  private toggleSearchBar(): void {\n    this.mobileSearchBarVisible = !this.mobileSearchBarVisible;\n\n    if (this.searchBar !== null) {\n      if (this.mobileSearchBarVisible) {\n        this.mobileSearchButtonEl.updateAriaLabel(\"Hide search\");\n        this.hasFullWidthSearchBar = true;\n        this.searchBar.fullWidth = true;\n        setTimeout(() => {\n          this.searchBar.focus();\n        }, 100);\n      } else {\n        this.mobileSearchButtonEl.updateAriaLabel(\"Show search\");\n        this.hasFullWidthSearchBar = false;\n        this.searchBar.fullWidth = false;\n      }\n    }\n  }\n\n  private emitTopNavResized = (size: number): void => {\n    const event = new CustomEvent(\"topNavResized\", { detail: { size: size } });\n    this.el.dispatchEvent(event);\n  };\n\n  private menuButtonClick = () => {\n    this.showNavMenu(true);\n  };\n\n  private showNavMenu(show: boolean): void {\n    this.navMenuVisible = show;\n    if (show) {\n      this.icNavigationMenuOpened.emit();\n      document.body.style.height = \"100%\";\n      document.body.style.overflow = \"hidden\";\n    } else {\n      this.icNavigationMenuClosed.emit();\n      document.body.style.height = \"auto\";\n      document.body.style.overflow = \"auto\";\n    }\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) {\n      this.deviceSize = currSize;\n      if (currSize > DEVICE_SIZES.L) {\n        this.showNavMenu(false);\n        if (this.mobileSearchBarVisible) {\n          this.toggleSearchBar();\n        }\n      }\n      this.emitTopNavResized(currSize);\n      if (\n        document.activeElement !== null &&\n        document.activeElement !== undefined &&\n        document.activeElement.tagName === \"IC-SEARCH-BAR\"\n      ) {\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\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      const currSize = getCurrentDeviceSize();\n      this.resizeObserverCallback(currSize);\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  render() {\n    const hasMenuContent =\n      this.hasNavigation ||\n      this.hasIconButtons ||\n      this.status !== \"\" ||\n      this.version !== \"\";\n\n    const searchButtonSize =\n      this.deviceSize <= DEVICE_SIZES.S ? \"default\" : \"large\";\n\n    let appTitleVariant: IcTypographyVariants = \"h3\";\n\n    const hasTitle = this.appTitle !== \"\" && this.appTitle !== undefined;\n\n    if (this.deviceSize <= DEVICE_SIZES.L) {\n      appTitleVariant = \"h4\";\n      if (this.deviceSize <= DEVICE_SIZES.S) {\n        appTitleVariant = \"subtitle-small\";\n      }\n    }\n\n    const mobileSearchButtonTitle = this.mobileSearchBarVisible\n      ? \"Hide search\"\n      : \"Show search\";\n    const menuSize = this.deviceSize <= DEVICE_SIZES.S ? \"small\" : \"default\";\n\n    const Component = isSlotUsed(this.el, \"app-title\") ? \"div\" : \"a\";\n\n    const attrs = Component == \"a\" && {\n      href: this.href,\n    };\n\n    return (\n      <Host\n        class={{\n          [\"fullwidth-searchbar\"]: this.hasFullWidthSearchBar,\n          [IcThemeForegroundEnum.Dark]:\n            this.foregroundColor === IcThemeForegroundEnum.Dark,\n        }}\n      >\n        <div class=\"top-navigation\">\n          <ic-section-container aligned={this.contentAligned} full-height>\n            <header role=\"banner\">\n              <div class=\"top-panel-container\">\n                <div class=\"app-details-container\">\n                  {(hasTitle || isSlotUsed(this.el, \"app-title\")) && (\n                    <Component class=\"title-link\" {...attrs}>\n                      {this.hasAppIcon && (\n                        <div class=\"app-icon-container\" aria-hidden=\"true\">\n                          <slot name=\"app-icon\" />\n                        </div>\n                      )}\n                      {this.deviceSize <= DEVICE_SIZES.S &&\n                      !isEmptyString(this.shortAppTitle) ? (\n                        <ic-typography\n                          variant=\"subtitle-small\"\n                          aria-label={`${this.appTitle} (${this.shortAppTitle})`}\n                        >\n                          <h1>{this.shortAppTitle}</h1>\n                        </ic-typography>\n                      ) : (\n                        <ic-typography variant={appTitleVariant}>\n                          <h1 class=\"title-wrap\">\n                            {isSlotUsed(this.el, \"app-title\") ? (\n                              <slot name=\"app-title\"></slot>\n                            ) : (\n                              this.appTitle\n                            )}\n                          </h1>\n                        </ic-typography>\n                      )}\n                    </Component>\n                  )}\n                  {this.status !== \"\" && (\n                    <div class=\"app-status\">\n                      <ic-typography\n                        aria-label=\"app tag\"\n                        variant=\"label-uppercase\"\n                        class=\"app-status-text\"\n                      >\n                        {this.status}\n                      </ic-typography>\n                    </div>\n                  )}\n                  {this.version !== \"\" && (\n                    <div class=\"app-version\">\n                      <ic-typography\n                        variant=\"label\"\n                        class=\"app-version-text\"\n                        aria-label=\"app version\"\n                      >\n                        {this.version}\n                      </ic-typography>\n                    </div>\n                  )}\n                </div>\n\n                {(this.hasSearchSlotContent || hasMenuContent) && (\n                  <div class=\"search-menu-container\">\n                    <div class=\"search-actions-container\">\n                      {this.deviceSize > DEVICE_SIZES.L && (\n                        <slot name=\"search\"></slot>\n                      )}\n\n                      {this.hasSearchSlotContent &&\n                        this.deviceSize <= DEVICE_SIZES.L && (\n                          <ic-button\n                            id=\"search-toggle-button\"\n                            ref={(el) => (this.mobileSearchButtonEl = el)}\n                            onMouseDown={this.searchButtonMouseDownHandler}\n                            variant=\"icon\"\n                            size={searchButtonSize}\n                            aria-label={mobileSearchButtonTitle}\n                            appearance={this.foregroundColor}\n                            onClick={this.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\n                      {this.hasIconButtons && this.deviceSize > DEVICE_SIZES.L && (\n                        <div class=\"icon-buttons-container\">\n                          <slot name=\"buttons\"></slot>\n                        </div>\n                      )}\n                      {hasMenuContent && this.deviceSize <= DEVICE_SIZES.L && (\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={this.navMenuVisible ? \"true\" : \"false\"}\n                          >\n                            <ic-button\n                              id=\"menu-button\"\n                              appearance={this.foregroundColor}\n                              variant=\"secondary\"\n                              aria-expanded={this.menuOpen ? \"true\" : \"false\"}\n                              aria-haspopup=\"true\"\n                              aria-label={`Open ${\n                                this.hasNavigation ? \"navigation\" : \"app\"\n                              } menu`}\n                              size={menuSize}\n                              onClick={this.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=\"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                    </div>\n                  </div>\n                )}\n              </div>\n\n              {this.mobileSearchBarVisible && (\n                <div class=\"search-bar-container\">\n                  <slot name=\"search\"></slot>\n                </div>\n              )}\n\n              {this.hasNavigation && this.deviceSize > DEVICE_SIZES.L && (\n                <div class=\"navigation-tabs\">\n                  <span\n                    id=\"navigation-landmark-text\"\n                    class=\"navigation-landmark-text\"\n                    aria-hidden=\"true\"\n                  >\n                    Main navigation\n                  </span>\n                  <nav\n                    aria-labelledby=\"navigation-landmark-text\"\n                    class=\"nav-panel-container\"\n                  >\n                    <ic-horizontal-scroll appearance={this.foregroundColor}>\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        {this.navMenuVisible && (\n          <ic-navigation-menu\n            version={this.version}\n            status={this.status}\n            class={{\n              [\"inline\"]: this.inline,\n            }}\n          >\n            <div class=\"menu-buttons-slot\" slot=\"buttons\">\n              <slot name=\"buttons\"></slot>\n            </div>\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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"}

package/dist/core/p-389c3913.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as s,g as a}from"./p-69920d86.js";import{r as n,a as o}from"./p-dd980be4.js";import"./p-6f57b13c.js";const r=`<svg width="8" height="10" viewBox="0 0 8 10" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M2.08748 0L0.912476 1.175L4.72914 5L0.912476 8.825L2.08748 10L7.08748 5L2.08748 0Z" fill="currentColor"/>\n</svg>\n`;const l=`<svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M11.1709 8.825L7.34589 5L11.1709 1.175L9.99589 0L4.99589 5L9.99589 10L11.1709 8.825ZM0.829224 0H2.49589V10H0.829224V0Z" fill="currentColour"/>\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{box-sizing:border-box;width:100%;display:flex;justify-content:center}nav{width:100%;display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center}ic-button{cursor:pointer}ic-button.next-previous{--icon-width:var(--ic-space-xs);--icon-height:calc(var(--ic-space-xs) + var(--ic-space-xxxs));padding:0 var(--ic-space-xxs) 0 var(--ic-space-xxxs)}ic-button.first-last{--icon-width:calc(var(--ic-space-sm) + var(--ic-space-xxxs));--icon-height:calc(var(--ic-space-xs) + var(--ic-space-xxxs))}.disabled{color:var(--ic-architectural-200);pointer-events:none;cursor:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.hide-current-page{display:none}';const p=class{constructor(s){t(this,s);this.icPageChange=i(this,"icPageChange",7);this.handleClickFirst=()=>{this.currentPage=1;this.icPageChange.emit({value:this.currentPage})};this.handleClickPrevious=()=>{this.currentPage--;this.icPageChange.emit({value:this.currentPage})};this.handleClickNext=()=>{this.currentPage++;this.icPageChange.emit({value:this.currentPage})};this.handleClickLast=()=>{this.currentPage=this.pages;this.icPageChange.emit({value:this.currentPage})};this.firstButton=()=>e("ic-button",{id:"first-page-button","aria-label":"Go to first page",disableTooltip:true,appearance:this.appearance,onClick:this.handleClickFirst,class:"page-button first-last",disabled:this.currentPage===1||this.disabled,variant:"icon",innerHTML:l});this.previousButton=()=>e("ic-button",{id:"previous-page-button","aria-label":"Go to previous page",disableTooltip:true,appearance:this.appearance,onClick:this.handleClickPrevious,class:"page-button next-previous flip",disabled:this.currentPage===1||this.disabled,variant:"icon",innerHTML:r});this.nextButton=()=>e("ic-button",{id:"next-page-button","aria-label":"Go to next page",disableTooltip:true,appearance:this.appearance,onClick:this.handleClickNext,class:"page-button next-previous",disabled:this.currentPage===this.pages||this.disabled,variant:"icon",innerHTML:r});this.lastButton=()=>e("ic-button",{id:"last-page-button","aria-label":"Go to last page",disableTooltip:true,appearance:this.appearance,onClick:this.handleClickLast,class:"page-button first-last flip",disabled:this.currentPage===this.pages||this.disabled,variant:"icon",innerHTML:l});this.renderStartEllipsis=()=>e("ic-pagination-item",{appearance:this.appearance,type:"ellipsis",id:"start-ellipsis",disabled:this.disabled});this.renderEndEllipsis=()=>e("ic-pagination-item",{appearance:this.appearance,type:"ellipsis",id:"end-ellipsis",disabled:this.disabled});this.renderStartItems=()=>this.startItems.map((t=>e("ic-pagination-item",{appearance:this.appearance,selected:t===this.currentPage,id:`pagination-item-${t}`,type:"page",page:t,disabled:this.disabled})));this.renderEndItems=()=>this.endItems.map((t=>e("ic-pagination-item",{appearance:this.appearance,selected:t===this.currentPage,id:`pagination-item-${t}`,type:"page",page:t,disabled:this.disabled})));this.renderMiddleItems=()=>this.midItems.map((t=>e("ic-pagination-item",{appearance:this.appearance,selected:t===this.currentPage,id:`pagination-item-${t}`,type:"page",page:t,disabled:this.disabled})));this.endEllipsis=false;this.endItems=[];this.midItems=[];this.startEllipsis=false;this.startItems=[];this.adjacentCount=1;this.appearance="default";this.boundaryCount=1;this.defaultPage=1;this.disabled=false;this.hideCurrentPage=false;this.hideFirstAndLastPageButton=false;this.label="Page";this.pages=undefined;this.type="simple";this.currentPage=this.defaultPage}watchNumberPagesHandler(){this.watchPageChangeHandler()}watchPageChangeHandler(){if(this.type==="simple"){return}this.startEllipsis=false;this.endEllipsis=false;this.startItems=[];this.endItems=[];this.midItems=[];const t=[];let i=0;const e=[];let s=this.pages;const a=[];let n;let o;let r=false;let l=false;if(this.pages<=this.boundaryCount*2+this.adjacentCount*2+3){this.startEllipsis=false;this.endEllipsis=false;for(let i=1;i<=this.pages;i++){t.push(i)}this.startItems=t;return}i=this.boundaryCount===0?1:this.boundaryCount;s=this.boundaryCount===0?this.pages:this.pages-this.boundaryCount+1;if(this.currentPage<=this.adjacentCount+this.boundaryCount+2){r=false;l=true;let t=2*this.adjacentCount+1;if(this.boundaryCount===0){t--}n=i+1;o=n+t}else{r=true;if(this.currentPage>this.pages-(this.adjacentCount+this.boundaryCount+2)){let t=2*this.adjacentCount+1;if(this.boundaryCount===0){t--}o=this.boundaryCount===0?this.pages-1:this.pages-this.boundaryCount;n=o-t}else{l=true;n=this.currentPage-this.adjacentCount;o=this.currentPage+this.adjacentCount}}if(this.boundaryCount>0||this.boundaryCount===0&&r===false){for(let e=1;e<=i;e++){t.push(e)}}if(this.boundaryCount>0||this.boundaryCount===0&&l===false){for(let t=s;t<=this.pages;t++){e.push(t)}}for(let t=n;t<=o;t++){a.push(t)}this.startEllipsis=r;this.endEllipsis=l;this.startItems=t;this.endItems=e;this.midItems=a}componentWillLoad(){this.watchPageChangeHandler();if(this.boundaryCount>2){this.boundaryCount=2}if(this.adjacentCount>2){this.adjacentCount=2}n(this.disabled,this.el)}componentDidLoad(){o([{prop:this.pages,propName:"pages"}],"Pagination")}paginationItemClickHandler(t){const i=t.detail.page;this.currentPage=i;this.icPageChange.emit({value:this.currentPage})}async setCurrentPage(t){if(typeof t==="number"&&t>0&&t<=this.pages){this.currentPage=t}else{console.error("Current page must be a number greater than zero but less than or equal to the total number of pages")}}render(){const{type:t,pages:i,currentPage:a,hideCurrentPage:n,disabled:o,hideFirstAndLastPageButton:r,label:l}=this;return e(s,null,t==="simple"&&e("nav",{class:{["disabled"]:o},role:"navigation","aria-label":"Pagination Navigation"},r?null:this.firstButton(),this.previousButton(),e("ic-pagination-item",{pages:i,appearance:this.appearance,type:"simple-current",page:a,label:l,class:{["hide-current-page"]:n}}),this.nextButton(),r?null:this.lastButton()),t==="complex"&&e("nav",{class:{["disabled"]:o},role:"navigation","aria-label":"Pagination Navigation"},r?null:this.firstButton(),this.previousButton(),this.renderStartItems(),this.startEllipsis&&this.renderStartEllipsis(),this.renderMiddleItems(),this.endEllipsis&&this.renderEndEllipsis(),this.renderEndItems(),this.nextButton(),r?null:this.lastButton()))}get el(){return a(this)}static get watchers(){return{pages:["watchNumberPagesHandler"],currentPage:["watchPageChangeHandler"]}}};p.style=h;export{p as ic_pagination};
+//# sourceMappingURL=p-389c3913.entry.js.map

package/dist/core/p-389c3913.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icPaginationCss","Pagination","this","handleClickFirst","currentPage","icPageChange","emit","value","handleClickPrevious","handleClickNext","handleClickLast","pages","firstButton","h","id","disableTooltip","appearance","onClick","class","disabled","variant","innerHTML","paginationFirstLast","previousButton","paginationNextPrevious","nextButton","lastButton","renderStartEllipsis","type","renderEndEllipsis","renderStartItems","startItems","map","page","selected","renderEndItems","endItems","renderMiddleItems","midItems","defaultPage","watchNumberPagesHandler","watchPageChangeHandler","startEllipsis","endEllipsis","startItemCount","endStart","midStart","midEnd","boundaryCount","adjacentCount","i","push","numItems","componentWillLoad","removeDisabledFalse","el","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","paginationItemClickHandler","ev","detail","async","console","error","render","hideCurrentPage","hideFirstAndLastPageButton","label","Host","role"],"sources":["./src/components/ic-pagination/ic-pagination.css?tag=ic-pagination&encapsulation=shadow","./src/components/ic-pagination/ic-pagination.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  box-sizing: border-box;\n  width: 100%;\n  display: flex;\n  justify-content: center;\n}\n\nnav {\n  width: 100%;\n  display: flex;\n  flex-flow: row wrap;\n  justify-content: flex-start;\n  align-items: center;\n}\n\nic-button {\n  cursor: pointer;\n}\n\nic-button.next-previous {\n  --icon-width: var(--ic-space-xs);\n  --icon-height: calc(var(--ic-space-xs) + var(--ic-space-xxxs));\n\n  padding: 0 var(--ic-space-xxs) 0 var(--ic-space-xxxs);\n}\n\nic-button.first-last {\n  --icon-width: calc(var(--ic-space-sm) + var(--ic-space-xxxs));\n  --icon-height: calc(var(--ic-space-xs) + var(--ic-space-xxxs));\n}\n\n.disabled {\n  color: var(--ic-architectural-200);\n  pointer-events: none;\n  cursor: none;\n  user-select: none;\n}\n\n.hide-current-page {\n  display: none;\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  Listen,\n  State,\n  Watch,\n  Event,\n  EventEmitter,\n  Method,\n} from \"@stencil/core\";\nimport paginationNextPrevious from \"../../assets/pagination-next-previous.svg\";\nimport paginationFirstLast from \"../../assets/pagination-first-last.svg\";\nimport { IcThemeForeground } from \"../../utils/types\";\nimport { IcPaginationTypes, IcChangeEventDetail } from \"./ic-pagination.types\";\nimport {\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-pagination\",\n  styleUrl: \"ic-pagination.css\",\n  shadow: true,\n})\nexport class Pagination {\n  @Element() el: HTMLIcPaginationElement;\n\n  @State() endEllipsis: boolean = false;\n  @State() endItems: number[] = [];\n  @State() midItems: number[] = [];\n  @State() startEllipsis: boolean = false;\n  @State() startItems: number[] = [];\n\n  /**\n   * The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n   */\n  @Prop({ mutable: true }) adjacentCount: number = 1;\n\n  /**\n   * The appearance of the pagination, e.g. dark, light or the default.\n   */\n  @Prop() appearance: IcThemeForeground = \"default\";\n\n  /**\n   * The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n   */\n  @Prop({ mutable: true }) boundaryCount: number = 1;\n\n  /**\n   * The default page to display.\n   */\n  @Prop() defaultPage: number = 1;\n\n  /**\n   * If `true`, the pagination will not allow interaction.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * If `true`, the current page of the simple pagination will not be displayed.\n   */\n  @Prop() hideCurrentPage: boolean = false;\n\n  /**\n   * If `true`, the first and last page buttons will not be displayed.\n   */\n  @Prop() hideFirstAndLastPageButton: boolean = false;\n\n  /**\n   * The label for the pagination item (applicable when simple pagination is being used).\n   */\n  @Prop() label: string = \"Page\";\n\n  /**\n   * The total number of pages.\n   */\n  @Prop() pages!: number;\n\n  @Watch(\"pages\")\n  watchNumberPagesHandler(): void {\n    this.watchPageChangeHandler();\n  }\n\n  /**\n   * The type of pagination to be used.\n   */\n  @Prop() type: IcPaginationTypes = \"simple\";\n\n  /**\n   * The current page displayed by the pagination.\n   */\n  @Prop({ mutable: true }) currentPage: number = this.defaultPage;\n\n  @Watch(\"currentPage\")\n  watchPageChangeHandler(): void {\n    if (this.type === \"simple\") {\n      return;\n    }\n\n    this.startEllipsis = false;\n    this.endEllipsis = false;\n    this.startItems = [];\n    this.endItems = [];\n    this.midItems = [];\n\n    const startItems = [];\n    let startItemCount = 0;\n    const endItems = [];\n    let endStart = this.pages;\n    const midItems = [];\n    let midStart;\n    let midEnd;\n    let startEllipsis = false;\n    let endEllipsis = false;\n\n    if (this.pages <= this.boundaryCount * 2 + this.adjacentCount * 2 + 3) {\n      this.startEllipsis = false;\n      this.endEllipsis = false;\n      for (let i = 1; i <= this.pages; i++) {\n        startItems.push(i);\n      }\n      this.startItems = startItems;\n      return;\n    }\n\n    startItemCount = this.boundaryCount === 0 ? 1 : this.boundaryCount;\n    endStart =\n      this.boundaryCount === 0\n        ? this.pages\n        : this.pages - this.boundaryCount + 1;\n\n    if (this.currentPage <= this.adjacentCount + this.boundaryCount + 2) {\n      startEllipsis = false;\n      endEllipsis = true;\n\n      let numItems = 2 * this.adjacentCount + 1;\n      if (this.boundaryCount === 0) {\n        numItems--;\n      }\n      midStart = startItemCount + 1;\n      midEnd = midStart + numItems;\n    } else {\n      startEllipsis = true;\n      if (\n        this.currentPage >\n        this.pages - (this.adjacentCount + this.boundaryCount + 2)\n      ) {\n        let numItems = 2 * this.adjacentCount + 1;\n        if (this.boundaryCount === 0) {\n          numItems--;\n        }\n        midEnd =\n          this.boundaryCount === 0\n            ? this.pages - 1\n            : this.pages - this.boundaryCount;\n        midStart = midEnd - numItems;\n      } else {\n        endEllipsis = true;\n        midStart = this.currentPage - this.adjacentCount;\n        midEnd = this.currentPage + this.adjacentCount;\n      }\n    }\n\n    //create array of start items\n    if (\n      this.boundaryCount > 0 ||\n      (this.boundaryCount === 0 && startEllipsis === false)\n    ) {\n      for (let i = 1; i <= startItemCount; i++) {\n        startItems.push(i);\n      }\n    }\n\n    //create array of end items\n    if (\n      this.boundaryCount > 0 ||\n      (this.boundaryCount === 0 && endEllipsis === false)\n    ) {\n      for (let i = endStart; i <= this.pages; i++) {\n        endItems.push(i);\n      }\n    }\n\n    //create array of mid items\n    for (let i = midStart; i <= midEnd; i++) {\n      midItems.push(i);\n    }\n\n    this.startEllipsis = startEllipsis;\n    this.endEllipsis = endEllipsis;\n    this.startItems = startItems;\n    this.endItems = endItems;\n    this.midItems = midItems;\n  }\n\n  /**\n   * Emitted when a page is selected.\n   */\n  @Event() icPageChange: EventEmitter<IcChangeEventDetail>;\n\n  componentWillLoad(): void {\n    this.watchPageChangeHandler();\n    if (this.boundaryCount > 2) {\n      this.boundaryCount = 2;\n    }\n    if (this.adjacentCount > 2) {\n      this.adjacentCount = 2;\n    }\n\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.pages, propName: \"pages\" }],\n      \"Pagination\"\n    );\n  }\n\n  @Listen(\"paginationItemClick\")\n  paginationItemClickHandler(ev: CustomEvent): void {\n    const page = ev.detail.page;\n    this.currentPage = page;\n    this.icPageChange.emit({ value: this.currentPage });\n  }\n\n  /**\n   * Sets the currently displayed page.\n   */\n  @Method()\n  async setCurrentPage(page: number): Promise<void> {\n    if (typeof page === \"number\" && page > 0 && page <= this.pages) {\n      this.currentPage = page;\n    } else {\n      console.error(\n        \"Current page must be a number greater than zero but less than or equal to the total number of pages\"\n      );\n    }\n  }\n\n  private handleClickFirst = () => {\n    this.currentPage = 1;\n    this.icPageChange.emit({ value: this.currentPage });\n  };\n\n  private handleClickPrevious = (): void => {\n    this.currentPage--;\n    this.icPageChange.emit({ value: this.currentPage });\n  };\n\n  private handleClickNext = (): void => {\n    this.currentPage++;\n    this.icPageChange.emit({ value: this.currentPage });\n  };\n\n  private handleClickLast = (): void => {\n    this.currentPage = this.pages;\n    this.icPageChange.emit({ value: this.currentPage });\n  };\n\n  // button rendering abstracted from component render methods for clarity\n  private firstButton = () => {\n    return (\n      <ic-button\n        id=\"first-page-button\"\n        aria-label=\"Go to first page\"\n        disableTooltip={true}\n        appearance={this.appearance}\n        onClick={this.handleClickFirst}\n        class=\"page-button first-last\"\n        disabled={this.currentPage === 1 || this.disabled}\n        variant=\"icon\"\n        innerHTML={paginationFirstLast}\n      />\n    );\n  };\n\n  private previousButton = () => {\n    return (\n      <ic-button\n        id=\"previous-page-button\"\n        aria-label=\"Go to previous page\"\n        disableTooltip={true}\n        appearance={this.appearance}\n        onClick={this.handleClickPrevious}\n        class=\"page-button next-previous flip\"\n        disabled={this.currentPage === 1 || this.disabled}\n        variant=\"icon\"\n        innerHTML={paginationNextPrevious}\n      />\n    );\n  };\n\n  private nextButton = () => {\n    return (\n      <ic-button\n        id=\"next-page-button\"\n        aria-label=\"Go to next page\"\n        disableTooltip={true}\n        appearance={this.appearance}\n        onClick={this.handleClickNext}\n        class=\"page-button next-previous\"\n        disabled={this.currentPage === this.pages || this.disabled}\n        variant=\"icon\"\n        innerHTML={paginationNextPrevious}\n      />\n    );\n  };\n\n  private lastButton = () => {\n    return (\n      <ic-button\n        id=\"last-page-button\"\n        aria-label=\"Go to last page\"\n        disableTooltip={true}\n        appearance={this.appearance}\n        onClick={this.handleClickLast}\n        class=\"page-button first-last flip\"\n        disabled={this.currentPage === this.pages || this.disabled}\n        variant=\"icon\"\n        innerHTML={paginationFirstLast}\n      />\n    );\n  };\n\n  private renderStartEllipsis = () => {\n    return (\n      <ic-pagination-item\n        appearance={this.appearance}\n        type=\"ellipsis\"\n        id=\"start-ellipsis\"\n        disabled={this.disabled}\n      />\n    );\n  };\n\n  private renderEndEllipsis = () => {\n    return (\n      <ic-pagination-item\n        appearance={this.appearance}\n        type=\"ellipsis\"\n        id=\"end-ellipsis\"\n        disabled={this.disabled}\n      />\n    );\n  };\n\n  private renderStartItems = () => {\n    return this.startItems.map((page: number) => {\n      return (\n        <ic-pagination-item\n          appearance={this.appearance}\n          selected={page === this.currentPage}\n          id={`pagination-item-${page}`}\n          type=\"page\"\n          page={page}\n          disabled={this.disabled}\n        />\n      );\n    });\n  };\n\n  private renderEndItems = () => {\n    return this.endItems.map((page: number) => {\n      return (\n        <ic-pagination-item\n          appearance={this.appearance}\n          selected={page === this.currentPage}\n          id={`pagination-item-${page}`}\n          type=\"page\"\n          page={page}\n          disabled={this.disabled}\n        />\n      );\n    });\n  };\n\n  private renderMiddleItems = () => {\n    return this.midItems.map((page: number) => {\n      return (\n        <ic-pagination-item\n          appearance={this.appearance}\n          selected={page === this.currentPage}\n          id={`pagination-item-${page}`}\n          type=\"page\"\n          page={page}\n          disabled={this.disabled}\n        />\n      );\n    });\n  };\n\n  render() {\n    const {\n      type,\n      pages,\n      currentPage,\n      hideCurrentPage,\n      disabled,\n      hideFirstAndLastPageButton,\n      label,\n    } = this;\n\n    return (\n      <Host>\n        {type === \"simple\" && (\n          <nav\n            class={{\n              [\"disabled\"]: disabled,\n            }}\n            role=\"navigation\"\n            aria-label=\"Pagination Navigation\"\n          >\n            {hideFirstAndLastPageButton ? null : this.firstButton()}\n            {this.previousButton()}\n            <ic-pagination-item\n              pages={pages}\n              appearance={this.appearance}\n              type=\"simple-current\"\n              page={currentPage}\n              label={label}\n              class={{ [\"hide-current-page\"]: hideCurrentPage }}\n            />\n            {this.nextButton()}\n            {hideFirstAndLastPageButton ? null : this.lastButton()}\n          </nav>\n        )}\n        {type === \"complex\" && (\n          <nav\n            class={{\n              [\"disabled\"]: disabled,\n            }}\n            role=\"navigation\"\n            aria-label=\"Pagination Navigation\"\n          >\n            {hideFirstAndLastPageButton ? null : this.firstButton()}\n            {this.previousButton()}\n            {this.renderStartItems()}\n            {this.startEllipsis && this.renderStartEllipsis()}\n            {this.renderMiddleItems()}\n            {this.endEllipsis && this.renderEndEllipsis()}\n            {this.renderEndItems()}\n            {this.nextButton()}\n            {hideFirstAndLastPageButton ? null : this.lastButton()}\n          </nav>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/{p-ad2477d8.entry.js → p-3adb1167.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as i}from"./p-5450cebf.js";const n='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media only screen and (max-width: 576px){:host{--section-container-margin:var(--ic-space-xs);--section-container-max-width:var(--ic-breakpoint-sm)}}@media only screen and (min-width: 577px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-md)}}@media only screen and (min-width: 769px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-lg)}}@media only screen and (min-width: 993px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-xl)}}@media only screen and (min-width: 1201px){:host{--section-container-margin:var(--ic-space-lg);--section-container-max-width:var(--ic-breakpoint-xl)}}:host{display:block;padding-top:var(--ic-space-md);padding-bottom:var(--ic-space-md);box-sizing:border-box}:host(.aligned-center){max-width:var(--section-container-max-width);margin-left:auto;margin-right:auto;padding-left:var(--section-container-margin);padding-right:var(--section-container-margin)}:host(.aligned-left){max-width:var(--section-container-max-width);margin-left:var(--section-container-margin);margin-right:auto;padding-right:var(--section-container-margin)}:host(.aligned-full-width){margin-left:var(--section-container-margin);margin-right:var(--section-container-margin)}:host(.vertical-padding){padding-top:var(--ic-space-md);padding-bottom:var(--ic-space-md)}:host(.no-vertical-padding){padding-top:0;padding-bottom:0}';const o=class{constructor(t){e(this,t);this.aligned="left";this.fullHeight=false}render(){const{aligned:e,fullHeight:n}=this;return t(i,{class:{["aligned-left"]:e==="left",["aligned-center"]:e==="center",["aligned-full-width"]:e==="full-width",["no-vertical-padding"]:n}},t("slot",null))}};o.style=n;export{o as ic_section_container};
-//# sourceMappingURL=p-ad2477d8.entry.js.map
+import{r as e,h as t,H as i}from"./p-69920d86.js";const n='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media only screen and (max-width: 576px){:host{--section-container-margin:var(--ic-space-xs);--section-container-max-width:var(--ic-breakpoint-sm)}}@media only screen and (min-width: 577px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-md)}}@media only screen and (min-width: 769px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-lg)}}@media only screen and (min-width: 993px){:host{--section-container-margin:var(--ic-space-md);--section-container-max-width:var(--ic-breakpoint-xl)}}@media only screen and (min-width: 1201px){:host{--section-container-margin:var(--ic-space-lg);--section-container-max-width:var(--ic-breakpoint-xl)}}:host{display:block;padding-top:var(--ic-space-md);padding-bottom:var(--ic-space-md);box-sizing:border-box}:host(.aligned-center){max-width:var(--section-container-max-width);margin-left:auto;margin-right:auto;padding-left:var(--section-container-margin);padding-right:var(--section-container-margin)}:host(.aligned-left){max-width:var(--section-container-max-width);margin-left:var(--section-container-margin);margin-right:auto;padding-right:var(--section-container-margin)}:host(.aligned-full-width){margin-left:var(--section-container-margin);margin-right:var(--section-container-margin)}:host(.vertical-padding){padding-top:var(--ic-space-md);padding-bottom:var(--ic-space-md)}:host(.no-vertical-padding){padding-top:0;padding-bottom:0}';const o=class{constructor(t){e(this,t);this.aligned="left";this.fullHeight=false}render(){const{aligned:e,fullHeight:n}=this;return t(i,{class:{["aligned-left"]:e==="left",["aligned-center"]:e==="center",["aligned-full-width"]:e==="full-width",["no-vertical-padding"]:n}},t("slot",null))}};o.style=n;export{o as ic_section_container};
+//# sourceMappingURL=p-3adb1167.entry.js.map

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

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

package/dist/core/p-43b529a5.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as i,H as a,g as s}from"./p-69920d86.js";import{a as e,O as r,P as l,Q as n,R as o,M as c}from"./p-dd980be4.js";import{a as p}from"./p-6f57b13c.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs)}ic-input-label.with-helper{margin-bottom:var(--ic-space-xxxs)}ic-input-label.readonly{color:var(--ic-color-tertiary-text)}ic-input-label .helpertext{margin-top:var(--ic-space-xxxs)}ic-input-label .helpertext-normal{color:var(--ic-color-secondary-text)}ic-input-label .helpertext-readonly{color:var(--ic-color-tertiary-text)}ic-input-label .readonly-label{color:var(--ic-color-secondary-text)}ic-input-label .error-label{color:var(--ic-status-error)}ic-input-label .dark{color:var(--ic-architectural-white)}";const h=class{constructor(i){t(this,i);this.dark=false;this.disabled=false;this.error=false;this.for=undefined;this.helperText="";this.label=undefined;this.readonly=false;this.required=false}componentDidLoad(){e([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:s,label:e,required:l,helperText:n,error:o,dark:c}=this;const p=l?e+" *":e;const d=s?`${p}`:i("label",{htmlFor:this.for},p);const h=r(this.for);return i(a,{class:{["disabled"]:t,["readonly"]:s,["with-helper"]:n!==""}},i("ic-typography",{variant:"label",class:{["readonly-label"]:s,["error-label"]:o&&!(s||t),["dark"]:c}},d),n!==""&&i("ic-typography",{variant:"caption",class:{["helpertext"]:true,["helpertext-normal"]:!t&&!s,["helpertext-readonly"]:s}},i("span",{id:h},n)))}};h.style=d;const u="ic-input-validation{width:var(--input-width, 20rem);margin-top:var(--ic-space-xs);display:flex}ic-input-validation.fullwidth{width:100%}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-status-success)}ic-input-validation span.icon-error>svg{fill:var(--ic-status-error)}ic-input-validation span.icon-warning>svg{fill:var(--ic-status-warning)}ic-input-validation .statustext{flex-grow:1}";const v={[p.Warning]:n,[p.Error]:o,[p.Success]:c};const m=class{constructor(i){t(this,i);this.ariaLiveMode="polite";this.for=undefined;this.fullWidth=false;this.message=undefined;this.status=""}componentDidLoad(){e([{prop:this.message,propName:"message"}],"Input Validation")}render(){const t=this.status!==""?v[this.status]:"";const s=l(this.for);return i(a,{class:{[this.status]:this.status!=="",["fullwidth"]:this.fullWidth}},t!==""&&i("span",{class:{["status-icon"]:true,[`icon-${this.status}`]:true},innerHTML:t}),i("ic-typography",{variant:"caption",class:"statustext"},i("span",{"aria-live":this.ariaLiveMode,id:s},this.message)),i("slot",{name:"validation-message-adornment"}))}get el(){return s(this)}};m.style=u;export{h as ic_input_label,m as ic_input_validation};
+//# sourceMappingURL=p-43b529a5.entry.js.map

package/dist/core/p-43b529a5.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icInputLabelCss","InputLabel","componentDidLoad","onComponentRequiredPropUndefined","prop","this","label","propName","render","disabled","readonly","required","helperText","error","dark","labelText","labelContent","h","htmlFor","for","id","getInputHelperTextID","Host","class","variant","icInputValidationCss","icon","IcInformationStatus","Warning","warningIcon","Error","errorIcon","Success","successIcon","InputValidation","message","displayIcon","status","getInputValidationTextID","fullWidth","innerHTML","ariaLiveMode","name"],"sources":["./src/components/ic-input-label/ic-input-label.css?tag=ic-input-label","./src/components/ic-input-label/ic-input-label.tsx","./src/components/ic-input-validation/ic-input-validation.css?tag=ic-input-validation","./src/components/ic-input-validation/ic-input-validation.tsx"],"sourcesContent":["ic-input-label {\n  margin-bottom: var(--ic-space-xs);\n}\n\nic-input-label.with-helper {\n  margin-bottom: var(--ic-space-xxxs);\n}\n\nic-input-label.readonly {\n  color: var(--ic-color-tertiary-text);\n}\n\nic-input-label .helpertext {\n  margin-top: var(--ic-space-xxxs);\n}\n\nic-input-label .helpertext-normal {\n  color: var(--ic-color-secondary-text);\n}\n\nic-input-label .helpertext-readonly {\n  color: var(--ic-color-tertiary-text);\n}\n\nic-input-label .readonly-label {\n  color: var(--ic-color-secondary-text);\n}\n\nic-input-label .error-label {\n  color: var(--ic-status-error);\n}\n\nic-input-label .dark {\n  color: var(--ic-architectural-white);\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  getInputHelperTextID,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-input-label\",\n  styleUrl: \"./ic-input-label.css\",\n})\nexport class InputLabel {\n  /**\n   * If `true`, the dark variant of the input label will be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * If `true`, the input label will display with error styling.\n   */\n  @Prop() error?: boolean = false;\n\n  /**\n   * The ID of the form element the label is bound to.\n   */\n  @Prop() for: string;\n\n  /**\n   * The helper text that will be displayed.\n   */\n  @Prop() helperText: string = \"\";\n\n  /**\n   * The text content of the label.\n   */\n  @Prop() label!: string;\n\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * If `true`, the input label will require a value.\n   */\n  @Prop() required: boolean = false;\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Input Label\"\n    );\n  }\n\n  render() {\n    const { disabled, readonly, label, required, helperText, error, dark } =\n      this;\n    const labelText = required ? label + \" *\" : label;\n    const labelContent = readonly ? (\n      `${labelText}`\n    ) : (\n      <label htmlFor={this.for}>{labelText}</label>\n    );\n\n    const id = getInputHelperTextID(this.for);\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: disabled,\n          [\"readonly\"]: readonly,\n          [\"with-helper\"]: helperText !== \"\",\n        }}\n      >\n        <ic-typography\n          variant=\"label\"\n          class={{\n            [\"readonly-label\"]: readonly,\n            [\"error-label\"]: error && !(readonly || disabled),\n            [\"dark\"]: dark,\n          }}\n        >\n          {labelContent}\n        </ic-typography>\n\n        {helperText !== \"\" && (\n          <ic-typography\n            variant=\"caption\"\n            class={{\n              [\"helpertext\"]: true,\n              [\"helpertext-normal\"]: !disabled && !readonly,\n              [\"helpertext-readonly\"]: readonly,\n            }}\n          >\n            <span id={id}>{helperText}</span>\n          </ic-typography>\n        )}\n      </Host>\n    );\n  }\n}\n","ic-input-validation {\n  width: var(--input-width, 20rem);\n  margin-top: var(--ic-space-xs);\n  display: flex;\n}\n\nic-input-validation.fullwidth {\n  width: 100%;\n}\n\nic-input-validation span.status-icon {\n  padding-right: var(--ic-space-xxs);\n}\n\nic-input-validation span.status-icon > svg {\n  height: 1.25rem;\n  width: 1.25rem;\n}\n\nic-input-validation span.icon-success > svg {\n  fill: var(--ic-status-success);\n}\n\nic-input-validation span.icon-error > svg {\n  fill: var(--ic-status-error);\n}\n\nic-input-validation span.icon-warning > svg {\n  fill: var(--ic-status-warning);\n}\n\nic-input-validation .statustext {\n  flex-grow: 1;\n}\n","import { Element, Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport errorIcon from \"../../assets/error-icon.svg\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon.svg\";\n\nimport {\n  getInputValidationTextID,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcAriaLiveModeVariants } from \"./ic-input-validation.types\";\n\nconst icon = {\n  [IcInformationStatus.Warning]: warningIcon,\n  [IcInformationStatus.Error]: errorIcon,\n  [IcInformationStatus.Success]: successIcon,\n};\n\n/**\n * @slot validation-message-adornment - Content will be placed to the right of the validation message.\n */\n@Component({\n  tag: \"ic-input-validation\",\n  styleUrl: \"ic-input-validation.css\",\n})\nexport class InputValidation {\n  @Element() el: HTMLIcInputValidationElement;\n\n  /**\n   *  The ARIA live mode to apply to the message.\n   */\n  @Prop() ariaLiveMode: IcAriaLiveModeVariants = \"polite\";\n\n  /**\n   * The ID of the form element the validation is bound to.\n   */\n  @Prop() for: string;\n\n  /**\n   *  If `true`, the input validation will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * The validation message to display.\n   */\n  @Prop() message!: string;\n\n  /**\n   * The status of the validation - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() status: IcInformationStatusOrEmpty = \"\";\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.message, propName: \"message\" }],\n      \"Input Validation\"\n    );\n  }\n\n  render() {\n    const displayIcon = this.status !== \"\" ? icon[this.status] : \"\";\n    const id = getInputValidationTextID(this.for);\n    return (\n      <Host\n        class={{\n          [this.status]: this.status !== \"\",\n          [\"fullwidth\"]: this.fullWidth,\n        }}\n      >\n        {displayIcon !== \"\" && (\n          <span\n            class={{\n              [\"status-icon\"]: true,\n              [`icon-${this.status}`]: true,\n            }}\n            innerHTML={displayIcon}\n          />\n        )}\n\n        <ic-typography variant=\"caption\" class=\"statustext\">\n          <span aria-live={this.ariaLiveMode} id={id}>\n            {this.message}\n          </span>\n        </ic-typography>\n\n        <slot name=\"validation-message-adornment\"></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oKAAA,MAAMA,EAAkB,6iB,MCWXC,EAAU,M,mCAII,M,cAKG,M,WAKF,M,mCAUG,G,mCAUD,M,cAKA,K,CAE5BC,mBACEC,EACE,CAAC,CAAEC,KAAMC,KAAKC,MAAOC,SAAU,UAC/B,c,CAIJC,SACE,MAAMC,SAAEA,EAAQC,SAAEA,EAAQJ,MAAEA,EAAKK,SAAEA,EAAQC,WAAEA,EAAUC,MAAEA,EAAKC,KAAEA,GAC9DT,KACF,MAAMU,EAAYJ,EAAWL,EAAQ,KAAOA,EAC5C,MAAMU,EAAeN,EAAQ,GACxBK,IAEHE,EAAA,SAAOC,QAASb,KAAKc,KAAMJ,GAG7B,MAAMK,EAAKC,EAAqBhB,KAAKc,KAErC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAC,YAAad,EACd,CAAC,YAAaC,EACd,CAAC,eAAgBE,IAAe,KAGlCK,EAAA,iBACEO,QAAQ,QACRD,MAAO,CACL,CAAC,kBAAmBb,EACpB,CAAC,eAAgBG,KAAWH,GAAYD,GACxC,CAAC,QAASK,IAGXE,GAGFJ,IAAe,IACdK,EAAA,iBACEO,QAAQ,UACRD,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,sBAAuBd,IAAaC,EACrC,CAAC,uBAAwBA,IAG3BO,EAAA,QAAMG,GAAIA,GAAKR,I,aCnG3B,MAAMa,EAAuB,whBCgB7B,MAAMC,EAAO,CACX,CAACC,EAAoBC,SAAUC,EAC/B,CAACF,EAAoBG,OAAQC,EAC7B,CAACJ,EAAoBK,SAAUC,G,MAUpBC,EAAe,M,2CAMqB,S,kCAUlB,M,mCAUgB,E,CAE7ChC,mBACEC,EACE,CAAC,CAAEC,KAAMC,KAAK8B,QAAS5B,SAAU,YACjC,mB,CAIJC,SACE,MAAM4B,EAAc/B,KAAKgC,SAAW,GAAKX,EAAKrB,KAAKgC,QAAU,GAC7D,MAAMjB,EAAKkB,EAAyBjC,KAAKc,KACzC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAClB,KAAKgC,QAAShC,KAAKgC,SAAW,GAC/B,CAAC,aAAchC,KAAKkC,YAGrBH,IAAgB,IACfnB,EAAA,QACEM,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,QAAQlB,KAAKgC,UAAW,MAE3BG,UAAWJ,IAIfnB,EAAA,iBAAeO,QAAQ,UAAUD,MAAM,cACrCN,EAAA,oBAAiBZ,KAAKoC,aAAcrB,GAAIA,GACrCf,KAAK8B,UAIVlB,EAAA,QAAMyB,KAAK,iC"}

package/dist/core/{p-8ffa00c9.entry.js → p-441e7d98.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as i}from"./p-5450cebf.js";const o='/*! 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{position:fixed;left:0;bottom:0;width:100%;height:var(--ic-space-lg);z-index:var(--ic-z-index-classification-banner)}:host(.inline){position:static;left:auto;bottom:auto}.classification-banner{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:var(--ic-space-xxxs) var(--ic-space-md)}.default{background-color:var(--ic-classification-not-set);color:var(--ic-classification-not-set-foreground)}.official,.official-sensitive{background-color:var(--ic-classification-official);color:var(--ic-classification-official-foreground)}.secret{background-color:var(--ic-classification-secret);color:var(--ic-classification-secret-foreground)}.top-secret{background-color:var(--ic-classification-top-secret);color:var(--ic-classification-top-secret-foreground)}.offscreen{position:absolute;left:-9999px;background-color:#fff;color:#000;text-transform:none}@media (forced-colors: active){.classification-banner{border:var(--ic-hc-border)}}';const n={default:"protective marking not set",official:"official","official-sensitive":"official sensitive",secret:"secret","top-secret":"top secret"};const a=class{constructor(t){e(this,t);this.additionalSelectors="";this.classification="default";this.country="uk";this.inline=false;this.upTo=false}render(){const{classification:e,inline:o,country:a,upTo:s,additionalSelectors:r}=this;return t(i,{class:{["inline"]:o}},t("banner",{"aria-label":"Protective marking",class:{["classification-banner"]:true,[`${e}`]:e}},e!=="default"?t("span",{class:"offscreen"},"The protective marking of this page is:"," "):null,t("ic-typography",{variant:"caption-uppercase"},e==="default"?n[e]:`${s?"up to":""} \n               ${a!==""?a:""} \n               ${n[e]} \n               ${r!==""?r:""}`)))}};a.style=o;export{a as ic_classification_banner};
-//# sourceMappingURL=p-8ffa00c9.entry.js.map
+import{r as e,h as t,H as i}from"./p-69920d86.js";const o='/*! 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{position:fixed;left:0;bottom:0;width:100%;height:var(--ic-space-lg);z-index:var(--ic-z-index-classification-banner)}:host(.inline){position:static;left:auto;bottom:auto}.classification-banner{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:var(--ic-space-xxxs) var(--ic-space-md)}.default{background-color:var(--ic-classification-not-set);color:var(--ic-classification-not-set-foreground)}.official,.official-sensitive{background-color:var(--ic-classification-official);color:var(--ic-classification-official-foreground)}.secret{background-color:var(--ic-classification-secret);color:var(--ic-classification-secret-foreground)}.top-secret{background-color:var(--ic-classification-top-secret);color:var(--ic-classification-top-secret-foreground)}.offscreen{position:absolute;left:-9999px;background-color:#fff;color:#000;text-transform:none}@media (forced-colors: active){.classification-banner{border:var(--ic-hc-border)}}';const n={default:"protective marking not set",official:"official","official-sensitive":"official sensitive",secret:"secret","top-secret":"top secret"};const a=class{constructor(t){e(this,t);this.additionalSelectors="";this.classification="default";this.country="uk";this.inline=false;this.upTo=false}render(){const{classification:e,inline:o,country:a,upTo:s,additionalSelectors:r}=this;return t(i,{class:{["inline"]:o}},t("banner",{"aria-label":"Protective marking",class:{["classification-banner"]:true,[`${e}`]:e}},e!=="default"?t("span",{class:"offscreen"},"The protective marking of this page is:"," "):null,t("ic-typography",{variant:"caption-uppercase"},e==="default"?n[e]:`${s?"up to":""} \n               ${a!==""?a:""} \n               ${n[e]} \n               ${r!==""?r:""}`)))}};a.style=o;export{a as ic_classification_banner};
+//# sourceMappingURL=p-441e7d98.entry.js.map

package/dist/core/p-441e7d98.entry.js.map

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

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

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

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

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

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

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