@ukic/web-components 2.2.0 → 2.4.0

package/dist/core/p-68fda79a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icStepCss","Step","stepTypeChangeHandler","this","variant","stepType","current","render","ariaLabel","stepStatus","toUpperCase","slice","compactStepStyling","statusIcon","h","class","innerHTML","checkIcon","warningIcon","compactStep","size","stepNum","progress","stepTitle","lastStepNum","stepSubtitle","undefined","lastStep","nextStepTitle","icon","partialBar","finalStep","el","parentElement","classList","contains","defaultStep","Host","role"],"sources":["src/components/ic-step/ic-step.css?tag=ic-step&encapsulation=shadow","src/components/ic-step/ic-step.tsx"],"sourcesContent":["/* SHARED STYLING */\n:host {\n  display: flex;\n  flex: auto;\n}\n\n.step {\n  display: flex;\n  flex: 1 1 0;\n}\n\n.step-icon {\n  display: flex;\n  justify-content: center;\n}\n\n.step-title,\n.step-subtitle,\n.step-status,\n.next-step {\n  white-space: pre-line;\n}\n\n.visually-hidden {\n  position: absolute;\n  left: -625rem;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n}\n\n/* COMPACT STEP STYLING */\n:host(.compact) {\n  column-gap: var(--ic-space-sm);\n\n  --compact-step-inner-color: var(--ic-status-info);\n  --compact-step-circular-line-width: var(--ic-space-xxs);\n}\n\n:host(.compact) .step {\n  column-gap: var(--ic-space-sm);\n}\n\n:host(.compact) .step:not(.current) {\n  display: none;\n  opacity: 0;\n  visibility: hidden;\n}\n\n.compact-step-progress-indicator {\n  margin: var(--ic-space-xs) 0 0;\n}\n\n:host(.compact) .step-title-area {\n  display: flex;\n  flex-direction: column;\n  width: 14.25rem;\n}\n\n.info-line {\n  display: flex;\n  column-gap: var(--ic-space-xs);\n}\n\n.step-status {\n  display: flex;\n  color: var(--ic-color-secondary-text);\n  column-gap: var(--ic-space-xxxs);\n}\n\n.compact-step-completed .step-status {\n  color: var(--ic-status-success);\n}\n\n.compact-step-disabled :is(.step-title, .step-status) {\n  color: var(--ic-color-tertiary-text);\n}\n\n.step-num {\n  color: var(--ic-color-secondary-text);\n  white-space: nowrap;\n}\n\n:host(.compact) .step-icon {\n  margin: var(--ic-space-xxxs);\n}\n\n:host(.compact) .step-icon svg {\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n}\n\n/* DEFAULT STEP STYLING */\n:host(.default) .step {\n  flex-direction: column;\n}\n\n:host(.default.last-step) {\n  flex-grow: initial;\n}\n\n.step-top {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  align-self: flex-start;\n  height: 2.5rem;\n}\n\n:host(.default) .step-icon {\n  border-radius: 50%;\n}\n\n.step-icon-inner {\n  width: var(--ic-space-xl);\n  height: var(--ic-space-xl);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n}\n\n:host(.default) .current {\n  color: var(--ic-status-info);\n}\n\n:host(.default) .step-title-area {\n  margin: var(--ic-space-xs) 0;\n  padding-right: var(--ic-space-xs);\n  width: 100%;\n}\n\n:host(.default) .step-title,\n.step-subtitle {\n  width: fit-content;\n}\n\n.step-subtitle {\n  color: var(--ic-color-tertiary-text);\n}\n\n.current .step-subtitle {\n  color: var(--ic-color-primary-text);\n}\n\n:host(.default) .completed {\n  color: var(--ic-status-success);\n}\n\n.active .step-icon-inner {\n  box-shadow: inset var(--ic-architectural-200) 0 0 0 0.125rem;\n}\n\n.current .step-icon-inner {\n  background-color: var(--ic-status-info);\n  color: white;\n}\n\n.disabled {\n  color: var(--ic-architectural-200);\n}\n\n.disabled .step-icon-inner {\n  border: var(--ic-space-1px) dashed var(--ic-architectural-200);\n  width: calc(var(--ic-space-xl) - var(--ic-space-xxxs));\n  height: calc(var(--ic-space-xl) - var(--ic-space-xxxs));\n}\n\n.disabled .step-title-area {\n  color: var(--ic-color-tertiary-text);\n}\n\n.completed .step-icon-inner {\n  background: var(--ic-status-success);\n  box-shadow: inset var(--ic-status-success) 0 0 0 var(--ic-space-xxxs);\n  border-radius: 100%;\n}\n\n:host(.default) .current .step-icon {\n  border: var(--ic-space-xxxs) solid var(--ic-status-info);\n  padding: var(--ic-space-xxxs);\n  margin: 0 calc(-1 * var(--ic-space-xxxs));\n\n  /* compensating for the circle being bigger than other steps */\n}\n\n.step-connect {\n  height: var(--ic-space-xxxs);\n  background-color: var(--ic-architectural-200);\n  margin: 0 var(--ic-space-xs);\n  border-radius: var(--ic-space-xxs);\n  width: 100%;\n}\n\n.aligned-full-width.step-connect {\n  min-width: 6.25rem;\n  width: 100%;\n}\n\n.disabled .step-connect {\n  height: 0;\n  background-color: rgb(0 0 0 / 0%);\n  border-top: 0.125rem dashed var(--ic-architectural-200);\n  border-radius: 0;\n}\n\n.completed .step-connect {\n  background-color: var(--ic-status-success);\n}\n\n.step-connect-inner {\n  width: 70%;\n  display: flex;\n  flex: auto;\n  height: var(--ic-space-xxxs);\n  border-radius: var(--ic-space-xxs);\n  background-color: var(--ic-status-info);\n}\n\n.step-icon-inner .check-icon {\n  padding-top: var(--ic-space-xxs);\n}\n\n.step-icon-inner .check-icon svg {\n  width: var(--ic-space-md);\n  height: auto;\n}\n\n.step-icon-inner .check-icon > svg > path {\n  fill: var(--ic-color-white-text);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  /* COMPACT STEP */\n  .compact-step-disabled :is(.step-title, .step-status) {\n    color: GrayText;\n  }\n\n  /* DEFAULT STEP */\n  .step-connect:not(.disabled .step-connect) {\n    border: var(--ic-hc-border);\n  }\n\n  .active .step-icon-inner,\n  .completed .step-icon-inner,\n  .current .step-icon-inner {\n    forced-color-adjust: none;\n    box-shadow: inset canvastext 0 0 0 0.125rem;\n    background-color: transparent;\n    color: canvastext;\n  }\n\n  :host(.default) .current .step-icon {\n    padding: 0;\n    border: none;\n  }\n\n  .disabled,\n  .disabled .step-title-area {\n    color: GrayText;\n  }\n\n  .step-connect-inner,\n  .completed .step-connect {\n    background-color: canvastext;\n  }\n\n  .step-icon-inner .check-icon > svg > path {\n    fill: canvastext;\n  }\n}\n","import { Component, Host, h, Prop, Element, Watch } from \"@stencil/core\";\nimport checkIcon from \"../../assets/check-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon-outline.svg\";\nimport { IcStepVariants, IcStepStatuses, IcStepTypes } from \"./ic-step.types\";\n\n@Component({\n  tag: \"ic-step\",\n  styleUrl: \"ic-step.css\",\n  shadow: true,\n})\nexport class Step {\n  @Element() el: HTMLIcStepElement;\n\n  /**\n   * @internal If a compact stepper is being used, this sets the styling of the step.\n   */\n  @Prop() compactStepStyling?: IcStepTypes;\n\n  /**\n   * @internal If `true`, and a compact stepper  is being used, the current step will be the only step in view.\n   */\n  @Prop({ mutable: true }) current?: boolean = false;\n\n  /**\n   * @internal If `true`, the step will be marked as being the last one in the series. This is managed by ic-stepper.\n   */\n  @Prop() lastStep!: boolean;\n\n  /**\n   * @internal The step number of the final step. This is managed by ic-stepper.\n   */\n  @Prop() lastStepNum?: number;\n\n  /**\n   * @internal The name of the next step. This is managed by ic-stepper.\n   */\n  @Prop() nextStepTitle?: string;\n\n  /**\n   * @internal The progress of the next step, calculated by dividing the current step number by the total number of steps. This is managed by ic-stepper.\n   */\n  @Prop() progress?: number;\n\n  /**\n   * @internal The step number, managed by ic-stepper.\n   */\n  @Prop() stepNum?: number;\n\n  /**\n   * The status of the step. Use this prop to display a status message on the step if it is required or optional.\n   */\n  @Prop() stepStatus?: IcStepStatuses;\n\n  /**\n   * Additional information about the step. Use this prop to override the default step status messaging displayed when selecting a step type or step status.\n   */\n  @Prop() stepSubtitle?: string;\n\n  /**\n   * The title of the step within the stepper.\n   */\n  @Prop() stepTitle?: string;\n\n  /**\n   * @internal The variant of the step. This is managed by ic-stepper.\n   */\n  @Prop() variant!: IcStepVariants;\n\n  /**\n   * The state of the step within the stepper.\n   */\n  @Prop() stepType?: IcStepTypes = \"active\";\n\n  @Watch(\"stepType\")\n  stepTypeChangeHandler(): void {\n    if (this.variant === \"compact\" && this.stepType === \"current\") {\n      this.current = true;\n    } else {\n      this.current = false;\n    }\n  }\n\n  render() {\n    // ARIA LABEL\n    let ariaLabel = \"\";\n\n    if (this.stepType === \"completed\") {\n      ariaLabel = \". Completed step\";\n    } else if (this.stepType === \"disabled\") {\n      ariaLabel = \". Non-required step\";\n    } else if (this.stepStatus === \"required\") {\n      ariaLabel = \". Required step\";\n    } else if (this.stepStatus === \"optional\") {\n      ariaLabel = \". Optional step\";\n    }\n\n    // STEP STATUS\n    let stepStatus;\n    if (this.stepStatus) {\n      stepStatus = this.stepStatus[0].toUpperCase() + this.stepStatus.slice(1);\n    }\n\n    // STEP TYPE\n    let stepType;\n    if (\n      this.stepType === \"disabled\" ||\n      this.compactStepStyling === \"disabled\"\n    ) {\n      stepType = \"Not required\";\n    } else if (this.compactStepStyling === \"completed\") {\n      stepType = \"Completed\";\n    }\n\n    // STATUS ICON FOR COMPACT STEP\n    let statusIcon;\n    if (\n      this.stepType === \"completed\" ||\n      this.compactStepStyling === \"completed\"\n    ) {\n      statusIcon = (\n        <span\n          class=\"check-icon step-icon\"\n          aria-hidden=\"true\"\n          innerHTML={checkIcon}\n        ></span>\n      );\n    } else if (\n      this.stepType === \"disabled\" ||\n      this.compactStepStyling === \"disabled\"\n    ) {\n      statusIcon = (\n        <span\n          class=\"warning-icon step-icon\"\n          aria-hidden=\"true\"\n          innerHTML={warningIcon}\n        ></span>\n      );\n    }\n\n    // COMPACT STEP COMPONENT\n    const compactStep = (\n      <div\n        class={{\n          [\"step\"]: true,\n          [\"current\"]: this.current,\n          [`compact-step-${this.compactStepStyling}`]:\n            !!this.compactStepStyling,\n        }}\n      >\n        <ic-loading-indicator\n          class={{\n            \"compact-step-progress-indicator\": true,\n            \"not-required\":\n              this.stepType === \"disabled\" ||\n              this.compactStepStyling === \"disabled\",\n          }}\n          aria-hidden=\"true\"\n          size=\"small\"\n          inner-label={this.stepNum}\n          progress={this.progress}\n        ></ic-loading-indicator>\n        <div class=\"step-title-area\">\n          <ic-typography variant=\"h4\" class=\"step-title\">\n            {this.stepTitle}\n          </ic-typography>\n          <div class=\"info-line\">\n            <ic-typography variant=\"caption\" class=\"step-num\">\n              {`${this.stepNum} of ${this.lastStepNum}`}\n              <span class=\"visually-hidden\"> steps</span>\n            </ic-typography>\n            {(this.stepSubtitle ||\n              this.stepType === \"completed\" ||\n              this.stepType === \"disabled\" ||\n              (this.variant === \"compact\" &&\n                !!this.compactStepStyling &&\n                this.compactStepStyling !== \"active\") ||\n              !!this.stepStatus) && (\n              <div class=\"step-status\">\n                {statusIcon !== undefined && statusIcon}\n                {(this.stepSubtitle || stepType) && (\n                  <ic-typography variant=\"caption\">\n                    {this.stepSubtitle !== null &&\n                    this.stepSubtitle !== undefined\n                      ? this.stepSubtitle\n                      : this.stepType === \"disabled\" ||\n                        (this.variant === \"compact\" &&\n                          this.compactStepStyling === \"disabled\") ||\n                        this.stepType === \"completed\" ||\n                        (this.variant === \"compact\" &&\n                          this.compactStepStyling === \"completed\")\n                      ? stepType\n                      : this.stepStatus && stepStatus}\n                  </ic-typography>\n                )}\n              </div>\n            )}\n          </div>\n          {this.lastStep ? (\n            <ic-typography variant=\"subtitle-small\" class=\"next-step\">\n              Last step\n            </ic-typography>\n          ) : (\n            this.nextStepTitle !== undefined && (\n              <ic-typography variant=\"subtitle-small\" class=\"next-step\">\n                Next<span class=\"visually-hidden\"> step is</span>:{\" \"}\n                {this.nextStepTitle}\n              </ic-typography>\n            )\n          )}\n        </div>\n      </div>\n    );\n\n    // ICON FOR DEFAULT STEP\n    let icon;\n    if (this.stepType !== \"completed\") {\n      icon = (\n        <ic-typography variant=\"subtitle-small\">\n          <span class=\"step-icon-inner\" aria-hidden=\"true\">\n            {this.stepNum}\n          </span>\n        </ic-typography>\n      );\n    } else {\n      icon = (\n        <div class=\"step-icon-inner\" aria-hidden=\"true\">\n          <span class=\"check-icon\" innerHTML={checkIcon}></span>\n        </div>\n      );\n    }\n\n    // STEP CONNECT FOR DEFAULT STEP\n    const partialBar = this.stepType === \"current\" && (\n      <div class=\"step-connect-inner\"></div>\n    );\n\n    const finalStep = !this.lastStep && (\n      <div\n        class={{\n          [\"step-connect\"]: true,\n          [\"aligned-full-width\"]:\n            this.el.parentElement.classList.contains(\"default\") &&\n            !this.el.parentElement.classList.contains(\"aligned-left\"),\n        }}\n      >\n        {partialBar}\n      </div>\n    );\n\n    // DEFAULT STEP COMPONENT\n    const defaultStep = (\n      <div\n        class={{\n          [\"step\"]: true,\n          [`${this.stepType}`]: true,\n        }}\n      >\n        <div class=\"step-top\">\n          <div class=\"step-icon\">{icon}</div>\n          {finalStep}\n        </div>\n        {(this.stepTitle || this.stepSubtitle || this.stepStatus) && (\n          <div class=\"step-title-area\">\n            {this.stepTitle && (\n              <ic-typography variant=\"subtitle-large\" class=\"step-title\">\n                {this.stepTitle}\n              </ic-typography>\n            )}\n            {this.stepTitle && (this.stepSubtitle || this.stepStatus) && (\n              <ic-typography variant=\"caption\" class=\"step-subtitle\">\n                {this.stepSubtitle !== null && this.stepSubtitle !== undefined\n                  ? this.stepSubtitle\n                  : stepStatus}\n              </ic-typography>\n            )}\n          </div>\n        )}\n      </div>\n    );\n\n    return (\n      <Host\n        role=\"listitem\"\n        aria-label={`Step ${this.stepNum}${ariaLabel}`}\n        aria-current={(this.current || this.stepType === \"current\") && \"step\"}\n        class={{\n          [\"aligned-full-width\"]:\n            this.el.parentElement.classList.contains(\"default\") &&\n            !this.el.parentElement.classList.contains(\"aligned-left\"),\n          [`${this.variant}`]: true,\n        }}\n      >\n        {this.variant === \"compact\" ? compactStep : defaultStep}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/{p-892d9d9f.entry.js → p-7194c255.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,c as e,h as t,g as a}from"./p-69920d86.js";import{r as o,a as s,i as r}from"./p-5dd0b02e.js";import"./p-6f57b13c.js";const c=`<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59L13.59 5L15 6.41L11.41 10L15 13.59Z" fill="currentColor"/>\n</svg>\n`;const n='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block}.chip{display:flex;padding:var(--ic-space-xxs);font-size:0.875rem;border-radius:var(--ic-space-md);text-align:left;text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative}.chip.small{padding:var(--ic-space-xxxs);border-radius:calc(var(--ic-space-md) - var(--ic-space-xxxs))}.chip.large{padding:var(--ic-space-xs);border-radius:calc(var(--ic-space-md) + var(--ic-space-xxs))}.label{padding:0 var(--ic-space-xs)}.chip.hovered:not(:focus-within){background-color:var(--ic-architectural-300)}.chip:focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);z-index:1}.chip.outline.hovered:not(:focus-within){background-color:var(--ic-action-dark-bg-hover)}ic-tooltip:focus-within{z-index:1}.filled{background-color:var(--ic-architectural-200);color:black;border:none}.filled.disabled{background-color:var(--ic-architectural-100)}.outline{color:var(--ic-architectural-900);border:var(--ic-space-1px) solid var(--ic-architectural-900);padding:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.outline.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.outline.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.outline.disabled{border:var(--ic-border-disabled);background:none}.chip.disabled ic-typography{color:var(--ic-architectural-200)}.dismiss-icon{border:none;border-radius:50%;padding:0;background:none;cursor:pointer;margin:var(--ic-space-xxxs);height:calc(var(--ic-space-lg) - var(--ic-space-xxs));width:calc(var(--ic-space-lg) - var(--ic-space-xxs))}.dismiss-icon:focus{outline:var(--ic-hc-focus-outline)}.dismiss-icon[disabled]{pointer-events:none;color:var(--ic-architectural-200)}.icon{padding:var(--ic-space-xxxs);box-sizing:border-box}.icon,ic-tooltip{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chip.disabled path,.chip.disabled ::slotted(svg){fill:var(--ic-architectural-200)}@media (forced-colors: active){.chip{border:var(--ic-hc-border)}.filled.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.filled{padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}.filled.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.chip.disabled{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.chip.disabled ic-typography{color:GrayText}.chip.disabled path,.chip.disabled ::slotted(svg){fill:GrayText}.chip:focus-within{outline:none;border-color:Highlight}}';const l=class{constructor(t){i(this,t);this.dismiss=e(this,"dismiss",7);this.icDismiss=e(this,"icDismiss",7);this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.mouseEnterHandler=()=>{this.isHovered=true};this.mouseLeaveHandler=()=>{this.isHovered=false};this.isHovered=false;this.visible=true;this.appearance="filled";this.disabled=false;this.dismissible=false;this.label=undefined;this.size="default"}componentWillLoad(){o(this.disabled,this.el)}componentDidLoad(){var i;this.dismissible&&((i=this.el.shadowRoot.querySelector("span.ic-tooltip-label"))===null||i===void 0?void 0:i.setAttribute("aria-hidden","true"));s([{prop:this.label,propName:"label"}],"Chip")}handleClick(){this.visible=!this.visible}async setFocus(){if(this.el.shadowRoot.querySelector("button")){this.el.shadowRoot.querySelector("button").focus()}}render(){const{label:i,appearance:e,size:a,dismissible:o,visible:s,disabled:n,isHovered:l}=this;return s&&t("div",{class:{["chip"]:true,[`${e}`]:true,[`${a}`]:true,["disabled"]:n,["dismissible"]:o,["hovered"]:l}},r(this.el,"icon")&&t("div",{class:"icon"},t("slot",{name:"icon"})),t("ic-typography",{variant:"label","apply-vertical-margins":false,class:"label"},t("span",null,i)),o&&t("ic-tooltip",{label:"Dismiss",target:"dismiss-icon",class:{["tooltip-disabled"]:n}},t("button",{id:"dismiss-icon",class:{["dismiss-icon"]:true},"aria-label":`Dismiss ${i} chip`,disabled:n,tabindex:n?-1:0,onClick:this.dismissAction,onMouseEnter:this.mouseEnterHandler,onMouseLeave:this.mouseLeaveHandler,innerHTML:c})))}static get delegatesFocus(){return true}get el(){return a(this)}};l.style=n;export{l as ic_chip};
-//# sourceMappingURL=p-892d9d9f.entry.js.map
+import{r as i,c as e,h as t,g as a}from"./p-18068237.js";import{r as o,a as s,i as r}from"./p-ebe76390.js";import"./p-613aa265.js";const c=`<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59L13.59 5L15 6.41L11.41 10L15 13.59Z" fill="currentColor"/>\n</svg>\n`;const n='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block}.chip{display:flex;padding:var(--ic-space-xxs);font-size:0.875rem;border-radius:var(--ic-space-md);text-align:left;text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative}.chip.small{padding:var(--ic-space-xxxs);border-radius:calc(var(--ic-space-md) - var(--ic-space-xxxs))}.chip.large{padding:var(--ic-space-xs);border-radius:calc(var(--ic-space-md) + var(--ic-space-xxs))}.label{padding:0 var(--ic-space-xs)}.chip.hovered:not(:focus-within){background-color:var(--ic-architectural-300)}.chip:focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);z-index:1}.chip.outline.hovered:not(:focus-within){background-color:var(--ic-action-dark-bg-hover)}ic-tooltip:focus-within{z-index:1}.filled{background-color:var(--ic-architectural-200);color:black;border:none}.filled.disabled{background-color:var(--ic-architectural-100)}.outline{color:var(--ic-architectural-900);border:var(--ic-space-1px) solid var(--ic-architectural-900);padding:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.outline.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.outline.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.outline.disabled{border:var(--ic-border-disabled);background:none}.chip.disabled ic-typography{color:var(--ic-architectural-200)}.dismiss-icon{border:none;border-radius:50%;padding:0;background:none;cursor:pointer;margin:var(--ic-space-xxxs);height:calc(var(--ic-space-lg) - var(--ic-space-xxs));width:calc(var(--ic-space-lg) - var(--ic-space-xxs))}.dismiss-icon:focus{outline:var(--ic-hc-focus-outline)}.dismiss-icon[disabled]{pointer-events:none;color:var(--ic-architectural-200)}.icon{padding:var(--ic-space-xxxs);box-sizing:border-box}.icon,ic-tooltip{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chip.disabled path,.chip.disabled ::slotted(svg){fill:var(--ic-architectural-200)}@media (forced-colors: active){.chip{border:var(--ic-hc-border)}.filled.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.filled{padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}.filled.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.chip.disabled{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.chip.disabled ic-typography{color:GrayText}.chip.disabled path,.chip.disabled ::slotted(svg){fill:GrayText}.chip:focus-within{outline:none;border-color:Highlight}}';const l=class{constructor(t){i(this,t);this.dismiss=e(this,"dismiss",7);this.icDismiss=e(this,"icDismiss",7);this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.mouseEnterHandler=()=>{this.isHovered=true};this.mouseLeaveHandler=()=>{this.isHovered=false};this.isHovered=false;this.visible=true;this.appearance="filled";this.disabled=false;this.dismissible=false;this.label=undefined;this.size="default"}componentWillLoad(){o(this.disabled,this.el)}componentDidLoad(){var i;this.dismissible&&((i=this.el.shadowRoot.querySelector("span.ic-tooltip-label"))===null||i===void 0?void 0:i.setAttribute("aria-hidden","true"));s([{prop:this.label,propName:"label"}],"Chip")}handleClick(){this.visible=!this.visible}async setFocus(){if(this.el.shadowRoot.querySelector("button")){this.el.shadowRoot.querySelector("button").focus()}}render(){const{label:i,appearance:e,size:a,dismissible:o,visible:s,disabled:n,isHovered:l}=this;return s&&t("div",{class:{["chip"]:true,[`${e}`]:true,[`${a}`]:true,["disabled"]:n,["dismissible"]:o,["hovered"]:l}},r(this.el,"icon")&&t("div",{class:"icon"},t("slot",{name:"icon"})),t("ic-typography",{variant:"label","apply-vertical-margins":false,class:"label"},t("span",null,i)),o&&t("ic-tooltip",{label:"Dismiss",target:"dismiss-icon",class:{["tooltip-disabled"]:n}},t("button",{id:"dismiss-icon",class:{["dismiss-icon"]:true},"aria-label":`Dismiss ${i} chip`,disabled:n,tabindex:n?-1:0,onClick:this.dismissAction,onMouseEnter:this.mouseEnterHandler,onMouseLeave:this.mouseLeaveHandler,innerHTML:c})))}static get delegatesFocus(){return true}get el(){return a(this)}};l.style=n;export{l as ic_chip};
+//# sourceMappingURL=p-7194c255.entry.js.map

package/dist/core/p-7194c255.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icChipCss","Chip","this","dismissAction","dismiss","emit","icDismiss","mouseEnterHandler","isHovered","mouseLeaveHandler","componentWillLoad","removeDisabledFalse","disabled","el","componentDidLoad","dismissible","_a","shadowRoot","querySelector","setAttribute","onComponentRequiredPropUndefined","prop","label","propName","handleClick","visible","setFocus","focus","render","appearance","size","h","class","isSlotUsed","name","variant","target","id","tabindex","onClick","onMouseEnter","onMouseLeave","innerHTML","dismissIcon"],"sources":["src/components/ic-chip/ic-chip.css?tag=ic-chip&encapsulation=shadow","src/components/ic-chip/ic-chip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: inline-block;\n}\n\n.chip {\n  display: flex;\n  padding: var(--ic-space-xxs);\n  font-size: 0.875rem;\n  border-radius: var(--ic-space-md);\n  text-align: left;\n  text-decoration: none;\n  transition: var(--ic-easing-transition-fast);\n  position: relative;\n}\n\n.chip.small {\n  padding: var(--ic-space-xxxs);\n  border-radius: calc(var(--ic-space-md) - var(--ic-space-xxxs));\n}\n\n.chip.large {\n  padding: var(--ic-space-xs);\n  border-radius: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n.label {\n  padding: 0 var(--ic-space-xs);\n}\n\n.chip.hovered:not(:focus-within) {\n  background-color: var(--ic-architectural-300);\n}\n\n.chip:focus-within {\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n  z-index: 1;\n}\n\n.chip.outline.hovered:not(:focus-within) {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\nic-tooltip:focus-within {\n  z-index: 1;\n}\n\n.filled {\n  background-color: var(--ic-architectural-200);\n  color: black;\n  border: none;\n}\n\n.filled.disabled {\n  background-color: var(--ic-architectural-100);\n}\n\n.outline {\n  color: var(--ic-architectural-900);\n  border: var(--ic-space-1px) solid var(--ic-architectural-900);\n  padding: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.outline.small {\n  padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n}\n\n.outline.large {\n  padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n.outline.disabled {\n  border: var(--ic-border-disabled);\n  background: none;\n}\n\n.chip.disabled ic-typography {\n  color: var(--ic-architectural-200);\n}\n\n.dismiss-icon {\n  border: none;\n  border-radius: 50%;\n  padding: 0;\n  background: none;\n  cursor: pointer;\n  margin: var(--ic-space-xxxs);\n  height: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n  width: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n}\n\n.dismiss-icon:focus {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.dismiss-icon[disabled] {\n  pointer-events: none;\n  color: var(--ic-architectural-200);\n}\n\n.icon {\n  padding: var(--ic-space-xxxs);\n  box-sizing: border-box;\n}\n\n.icon,\nic-tooltip {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.chip.disabled path,\n.chip.disabled ::slotted(svg) {\n  fill: var(--ic-architectural-200);\n}\n\n@media (forced-colors: active) {\n  .chip {\n    border: var(--ic-hc-border);\n  }\n\n  .filled.small {\n    padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n  }\n\n  .filled {\n    padding: calc(var(--ic-space-xxxs) + var(--ic-space-1px));\n  }\n\n  .filled.large {\n    padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n  }\n\n  .chip.disabled {\n    appearance: none;\n    border-color: GrayText;\n  }\n\n  .chip.disabled ic-typography {\n    color: GrayText;\n  }\n\n  .chip.disabled path,\n  .chip.disabled ::slotted(svg) {\n    fill: GrayText;\n  }\n\n  .chip:focus-within {\n    outline: none;\n    border-color: Highlight;\n  }\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Listen,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n} from \"@stencil/core\";\nimport {\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcChipAppearance } from \"./ic-chip.types\";\nimport { IcSizes } from \"../../utils/types\";\nimport dismissIcon from \"../../assets/dismiss-icon.svg\";\n\n/**\n * @slot icon - Content will be rendered at the start of the chip.\n */\n@Component({\n  tag: \"ic-chip\",\n  styleUrl: \"ic-chip.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Chip {\n  @Element() el: HTMLIcChipElement;\n\n  @State() isHovered: boolean = false;\n  @State() visible: boolean = true;\n\n  /**\n   * The emphasis of the chip.\n   */\n  @Prop() appearance?: IcChipAppearance = \"filled\";\n\n  /**\n   * If `true`, the chip will appear disabled.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * If `true`, the chip will have a close button at the end to dismiss it.\n   */\n  @Prop() dismissible?: boolean = false;\n\n  /**\n   * The text rendered within the chip.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The size of the chip.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * @deprecated This event should not be used anymore. Use icDismiss instead.\n   */\n  @Event() dismiss: EventEmitter<void>;\n\n  /**\n   * Is emitted when the user dismisses the chip.\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    this.dismissible &&\n      this.el.shadowRoot\n        .querySelector(\"span.ic-tooltip-label\")\n        ?.setAttribute(\"aria-hidden\", \"true\");\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Chip\"\n    );\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleClick(): void {\n    this.visible = !this.visible;\n  }\n\n  /**\n   * Sets focus on the chip.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el.shadowRoot.querySelector(\"button\")) {\n      this.el.shadowRoot.querySelector(\"button\").focus();\n    }\n  }\n\n  private dismissAction = (): void => {\n    this.dismiss.emit();\n    this.icDismiss.emit();\n  };\n\n  private mouseEnterHandler = (): void => {\n    this.isHovered = true;\n  };\n\n  private mouseLeaveHandler = (): void => {\n    this.isHovered = false;\n  };\n\n  render() {\n    const {\n      label,\n      appearance,\n      size,\n      dismissible,\n      visible,\n      disabled,\n      isHovered,\n    } = this;\n\n    return (\n      visible && (\n        <div\n          class={{\n            [\"chip\"]: true,\n            [`${appearance}`]: true,\n            [`${size}`]: true,\n            [\"disabled\"]: disabled,\n            [\"dismissible\"]: dismissible,\n            [\"hovered\"]: isHovered,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && (\n            <div class=\"icon\">\n              <slot name=\"icon\" />\n            </div>\n          )}\n          <ic-typography\n            variant=\"label\"\n            apply-vertical-margins={false}\n            class=\"label\"\n          >\n            <span>{label}</span>\n          </ic-typography>\n          {dismissible && (\n            <ic-tooltip\n              label=\"Dismiss\"\n              target=\"dismiss-icon\"\n              class={{ [\"tooltip-disabled\"]: disabled }}\n            >\n              <button\n                id=\"dismiss-icon\"\n                class={{\n                  [\"dismiss-icon\"]: true,\n                }}\n                aria-label={`Dismiss ${label} chip`}\n                disabled={disabled}\n                tabindex={disabled ? -1 : 0}\n                onClick={this.dismissAction}\n                onMouseEnter={this.mouseEnterHandler}\n                onMouseLeave={this.mouseLeaveHandler}\n                innerHTML={dismissIcon}\n              ></button>\n            </ic-tooltip>\n          )}\n        </div>\n      )\n    );\n  }\n}\n"],"mappings":"0cAAA,MAAMA,EAAY,8tJ,MC8BLC,EAAI,M,+FAuEPC,KAAAC,cAAgB,KACtBD,KAAKE,QAAQC,OACbH,KAAKI,UAAUD,MAAM,EAGfH,KAAAK,kBAAoB,KAC1BL,KAAKM,UAAY,IAAI,EAGfN,KAAAO,kBAAoB,KAC1BP,KAAKM,UAAY,KAAK,E,eA9EM,M,aACF,K,gBAKY,S,cAKX,M,iBAKG,M,+BAUP,S,CAYzB,iBAAAE,GACEC,EAAoBT,KAAKU,SAAUV,KAAKW,G,CAG1C,gBAAAC,G,MACEZ,KAAKa,eACHC,EAAAd,KAAKW,GAAGI,WACLC,cAAc,4BAAwB,MAAAF,SAAA,SAAAA,EACrCG,aAAa,cAAe,SAClCC,EACE,CAAC,CAAEC,KAAMnB,KAAKoB,MAAOC,SAAU,UAC/B,O,CAKJ,WAAAC,GACEtB,KAAKuB,SAAWvB,KAAKuB,O,CAOvB,cAAMC,GACJ,GAAIxB,KAAKW,GAAGI,WAAWC,cAAc,UAAW,CAC9ChB,KAAKW,GAAGI,WAAWC,cAAc,UAAUS,O,EAiB/C,MAAAC,GACE,MAAMN,MACJA,EAAKO,WACLA,EAAUC,KACVA,EAAIf,YACJA,EAAWU,QACXA,EAAOb,SACPA,EAAQJ,UACRA,GACEN,KAEJ,OACEuB,GACEM,EAAA,OACEC,MAAO,CACL,CAAC,QAAS,KACV,CAAC,GAAGH,KAAe,KACnB,CAAC,GAAGC,KAAS,KACb,CAAC,YAAalB,EACd,CAAC,eAAgBG,EACjB,CAAC,WAAYP,IAGdyB,EAAW/B,KAAKW,GAAI,SACnBkB,EAAA,OAAKC,MAAM,QACTD,EAAA,QAAMG,KAAK,UAGfH,EAAA,iBACEI,QAAQ,QAAO,yBACS,MACxBH,MAAM,SAEND,EAAA,YAAOT,IAERP,GACCgB,EAAA,cACET,MAAM,UACNc,OAAO,eACPJ,MAAO,CAAE,CAAC,oBAAqBpB,IAE/BmB,EAAA,UACEM,GAAG,eACHL,MAAO,CACL,CAAC,gBAAiB,MACnB,aACW,WAAWV,SACvBV,SAAUA,EACV0B,SAAU1B,GAAY,EAAI,EAC1B2B,QAASrC,KAAKC,cACdqC,aAActC,KAAKK,kBACnBkC,aAAcvC,KAAKO,kBACnBiC,UAAWC,K"}

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

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as s,H as e,g as a}from"./p-18068237.js";import{y as h,w as n,e as o,n as l,r,d as c,a as d,f as u,j as p,k as f,z as b,p as v}from"./p-ebe76390.js";import{I as m,a as g}from"./p-613aa265.js";const w=`<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">\n<path d="M7 9.5L12 14.5L17 9.5H7Z" fill="currentColor" />\n</svg>\n`;const x=`<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">\n<path d="M12.6666 4.27334L11.7266 3.33334L7.99998 7.06001L4.27331 3.33334L3.33331 4.27334L7.05998 8.00001L3.33331 11.7267L4.27331 12.6667L7.99998 8.94001L11.7266 12.6667L12.6666 11.7267L8.93998 8.00001L12.6666 4.27334Z" fill="currentColor" />\n</svg>\n`;const y='/*! 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:relative}:host(.full-width){width:100%}ic-input-component-container:hover{--border-color:var(--ic-action-dark-hover)}ic-input-component-container:active{--border-color:var(--ic-action-dark-active);color:var(--ic-action-dark-active)}ic-input-component-container.menu-open{--border-color:var(--ic-architectural-400);color:var(--ic-action-dark)}ic-input-validation .status-icon,ic-input-validation .statustext{visibility:visible}ic-input-validation.menu-open .status-icon,ic-input-validation.menu-open .statustext{visibility:hidden;transition:visibility 0s}ic-input-label{margin-bottom:var(--ic-space-xs) !important}select{border:0;border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);color:var(--ic-color-primary-text);line-height:1.5rem;letter-spacing:0.005rem;width:100%;height:100%;padding-left:0.375rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 0.375rem center;background-image:url("data:image/svg+xml;utf8,<svg fill=\'black\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>")}select option,.select-option-selected{color:var(--ic-color-primary-text)}select:disabled{color:var(--ic-architectural-200);background-image:url("data:image/svg+xml;utf8,<svg fill=\'grey\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>")}select:focus{border:0;outline:0}select:not([disabled]){cursor:pointer}.select-container{width:100%;display:flex;align-items:center;position:relative}.select-input{width:100%;height:100%;padding:0 0.375rem;display:flex;cursor:pointer;align-items:center;justify-content:space-between;background:none;border:none}.select-input:focus{outline:var(--ic-hc-focus-outline)}:host(:not(.disabled)) ic-input-component-container:hover .select-input{background-color:var(--ic-architectural-white)}.select-input[disabled]{pointer-events:none}:host(.searchable) .select-input{cursor:auto}.searchable-select-container{align-items:center;display:flex;width:100%;position:relative}.expand-icon{height:var(--ic-space-lg);padding-left:var(--ic-space-xs);color:var(--ic-action-dark)}.expand-icon>svg{display:inline-block;width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.disabled) .expand-icon,:host(.disabled) .expand-icon>svg>path{color:var(--ic-architectural-200)}:host(.searchable) .expand-icon{padding-left:var(--ic-space-xxs);height:2.25rem}:host(.searchable) .expand-icon>svg{height:2.25rem;padding:0 0.375rem}:host(.searchable:not(.disabled)) .expand-icon>svg{cursor:pointer}.expand-icon-open{color:var(--ic-action-dark)}.expand-icon-filled{color:var(--ic-action-dark)}.expand-icon-open,:host(.searchable) .expand-icon-open{transform:rotateX(180deg)}:host(.disabled) .value-text,.placeholder{color:var(--ic-color-tertiary-text)}.select-input-end{display:flex;align-items:center}.clear-button-container{display:flex;gap:var(--ic-space-xxs);padding-left:2.375rem}:host(.small) .clear-button-container{padding-left:1.875rem}.divider{width:var(--ic-space-1px);background-color:var(--ic-architectural-400);margin:var(--ic-space-xxs) 0;border-radius:var(--ic-space-1px);height:var(--ic-space-lg)}:host(.small) .divider{height:var(--ic-space-md)}.clear-button{position:absolute;right:2.75rem;border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow);border-radius:0.25rem}.clear-button:focus *{fill:white}.searchable-select-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:var(--ic-space-1px);overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:var(--ic-space-1px)}';let k=0;const z=class{constructor(s){i(this,s);this.icBlur=t(this,"icBlur",7);this.icChange=t(this,"icChange",7);this.icClear=t(this,"icClear",7);this.icFocus=t(this,"icFocus",7);this.icInput=t(this,"icInput",7);this.icOptionSelect=t(this,"icOptionSelect",7);this.icRetryLoad=t(this,"icRetryLoad",7);this.hasSetDefaultValue=false;this.inheritedAttributes={};this.initialOptionsEmpty=false;this.inputId=`ic-select-input-${k++}`;this.menuId=`${this.inputId}-menu`;this.searchableMenuItemSelected=false;this.ungroupedOptions=[];this.handleRetry=i=>{var t;if(i.detail.keyPressed)(t=this.searchableSelectElement)===null||t===void 0?void 0:t.focus();this.blurredBecauseButtonPressed=true;this.retryButtonClick=true;this.hasSetDefaultValue=true;this.icRetryLoad.emit({value:this.hiddenInputValue})};this.emitIcChange=i=>{if(!this.searchable){this.value=i}clearTimeout(this.debounceIcChange);this.debounceIcChange=window.setTimeout((()=>{this.icChange.emit({value:i})}),this.currDebounce)};this.emitImmediateIcChange=i=>{this.value=i;clearTimeout(this.debounceIcChange);this.icChange.emit({value:i})};this.deduplicateOptions=i=>{const t=[];const s=[];let e;i.forEach((i=>{if(i.children){e=[];i.children.forEach((i=>{if(t.includes(i.value)){console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${i.value}) which has been removed.`)}else{t.push(i.value);e.push(i)}}));const a=Object.assign(Object.assign({},i),{children:e});s.push(a)}else{if(t.includes(i.value)){console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${i.value}) which has been removed.`)}else{t.push(i.value);s.push(i)}}}));return s};this.setOptionsValuesFromLabels=()=>{if(this.options.length>0&&this.options.map){this.options.map((i=>{if(!i.value){i.value=i.label}}))}};this.setUngroupedOptions=i=>{this.ungroupedOptions=i.detail.options};this.setTextColor=()=>{if(this.nativeSelectElement.selectedIndex===0){this.nativeSelectElement.className="placeholder"}else{this.nativeSelectElement.className="select-option-selected"}};this.setMenuChange=i=>{if(this.open!==i){this.open=i}};this.getLabelFromValue=i=>h(i,this.uniqueOptions);this.getFilteredChildMenuOptions=i=>{let t=i.children;if(this.searchable){t=n(i.children,this.includeDescriptionsInSearch,this.searchableSelectInputValue,this.searchMatchPosition)}else{t=n(i.children,false,this.pressedCharacters,"start")}const s=Object.assign({},i);s.children=t;return s};this.handleNativeSelectChange=()=>{this.icOptionSelect.emit({value:this.nativeSelectElement.value});this.emitImmediateIcChange(this.nativeSelectElement.value);this.setTextColor()};this.handleCustomSelectChange=i=>{if(this.searchable&&i.detail.label===this.emptyOptionListText){this.searchableSelectElement.focus();return}if(this.searchable){this.value=i.detail.value;this.searchableMenuItemSelected=true;if(this.value===this.currValue){this.searchableSelectInputValue=this.getLabelFromValue(this.value)}this.inputValueToFilter=null;this.hiddenInputValue=this.getValueFromLabel(this.searchableSelectInputValue)}this.ariaActiveDescendant=i.detail.optionId;this.icOptionSelect.emit({value:i.detail.value});this.emitIcChange(i.detail.value)};this.handleMenuChange=i=>{this.open=i.detail.open;this.pressedCharacters="";this.searchable&&this.handleFocusIndicatorDisplay()};this.handleMenuKeyPress=i=>{i.cancelBubble=true;this.handleCharacterKeyDown(i.detail.key)};this.handleMenuValueChange=i=>{this.value=i.detail.value};this.handleFocusIndicatorDisplay=()=>{const i=this.host.shadowRoot.querySelector(".focus-indicator");if(this.open){i.classList.add("focus-indicator-enabled")}else{i.classList.remove("focus-indicator-enabled")}};this.handleMouseDown=i=>{if(!this.open){i.preventDefault()}};this.isExternalFiltering=()=>this.searchable&&this.disableFilter;this.handleClick=i=>{if(!this.open){if(this.isExternalFiltering()){this.menu.options=this.filteredOptions}else if(!this.hasTimedOut&&!this.loading&&(!this.searchable||this.searchableMenuItemSelected)){this.noOptions=null;this.menu.options=this.uniqueOptions}}if(i.detail!==0){this.menu.handleClickOpen()}};this.handleExpandIconMouseDown=i=>{if(!this.disabled){i.preventDefault();this.searchableSelectElement.focus();this.handleClick(i)}};this.handleClear=i=>{i.stopPropagation();this.hasTimedOut=false;clearTimeout(this.timeoutTimer);this.noOptions=null;this.emitImmediateIcChange(null);this.icClear.emit();if(this.searchable){this.searchableSelectElement.value=null;this.searchableSelectInputValue=null;this.filteredOptions=this.uniqueOptions;this.hiddenInputValue=null;this.searchableSelectElement.focus()}else{this.customSelectElement.focus()}};this.handleCharacterKeyDown=i=>{if(this.open&&i===" "&&this.pressedCharacters.length===0&&!this.hasTimedOut&&!this.loading){this.setMenuChange(false)}if(i.length===1&&!this.searchable){window.clearTimeout(this.characterKeyPressTimer);this.characterKeyPressTimer=window.setTimeout((()=>this.pressedCharacters=""),1e3);this.pressedCharacters+=i;this.handleFilter();if(!this.noOptions){this.emitImmediateIcChange(this.filteredOptions[0].value)}}else{this.pressedCharacters=""}};this.handleNativeSelectKeyDown=i=>{if(i.key!=="Escape"&&i.key!=="Tab"||this.open){i.cancelBubble=true}this.handleCharacterKeyDown(i.key)};this.handleKeyDown=i=>{if(i.key!=="Escape"&&i.key!=="Tab"||this.open){i.cancelBubble=true}const t=i.key==="ArrowDown"||i.key==="ArrowUp";if(!this.open){if(this.isExternalFiltering()&&(i.key==="Enter"||t)){this.menu.options=this.filteredOptions}else{if(!this.hasTimedOut){this.noOptions=null;this.menu.options=this.uniqueOptions}}}if(this.open&&i.key==="Enter"){this.setMenuChange(false)}else{if(!(t&&this.noOptions!==null)){if(!(i.key===" "&&this.pressedCharacters.length>0)){this.menu.handleKeyboardOpen(i)}this.handleCharacterKeyDown(i.key)}}};this.handleClearButtonFocus=()=>{this.clearButtonFocused=true};this.handleClearButtonBlur=i=>{var t;const s=(t=this.menu)===null||t===void 0?void 0:t.querySelector("#retry-button");if(!(this.searchableSelectElement&&i.relatedTarget===this.searchableSelectElement)&&!(s&&i.relatedTarget===s)){this.setMenuChange(false);this.handleFocusIndicatorDisplay()}this.clearButtonFocused=false};this.handleFilter=()=>{const i=this.deduplicateOptions(this.searchable?[...this.uniqueOptions]:this.ungroupedOptions);let t=false;let s=[];i.map((i=>{if(i.children)t=true}));let e;if(this.searchable){e=n(i,this.includeDescriptionsInSearch,this.inputValueToFilter,this.searchMatchPosition);this.searchableMenuItemSelected=false}else{e=n(i,false,this.pressedCharacters,"start")}if(!t){s=e}else{i.map((i=>{if(this.includeGroupTitlesInSearch){if(e.indexOf(i)!==-1){s.push(i)}else{s.push(this.getFilteredChildMenuOptions(i))}}else{s.push(this.getFilteredChildMenuOptions(i))}}))}let a=false;if(t){a=true;s.map((i=>{if(i.children.length>0){a=false}}))}const h=[{label:this.emptyOptionListText,value:""}];if(s.length>0&&!a){this.noOptions=null;this.filteredOptions=s}else{this.noOptions=h;this.filteredOptions=this.noOptions}};this.triggerLoading=()=>{this.hasTimedOut=false;this.noOptions=[{label:this.loadingLabel,value:"",loading:true}];if(this.filteredOptions!==this.noOptions&&this.searchable){this.filteredOptions=this.noOptions}else if(this.uniqueOptions!==this.noOptions&&!this.searchable){this.uniqueOptions=this.noOptions}if(this.timeout){this.timeoutTimer=window.setTimeout((()=>{this.loading=false;this.hasTimedOut=true;this.noOptions=[{label:this.loadingErrorLabel,value:"",timedOut:true}];this.filteredOptions=this.noOptions;if(!this.searchable)this.uniqueOptions=this.noOptions}),this.timeout)}};this.getValueFromLabel=i=>{var t;return(t=this.uniqueOptions.find((t=>t.label===i)))===null||t===void 0?void 0:t.value};this.handleSearchableSelectInput=i=>{this.searchableSelectInputValue=i.target.value;this.icInput.emit({value:this.searchableSelectInputValue});this.emitIcChange(this.searchableSelectInputValue);this.hiddenInputValue=this.searchableSelectInputValue;this.inputValueToFilter=this.searchableSelectInputValue;this.setMenuChange(true);if(!this.disableFilter){this.handleFilter();this.debounceAriaLiveUpdate()}};this.updateSearchableSelectResultAriaLive=()=>{const i=this.host.shadowRoot.querySelector(".searchable-select-results-status");if(i){if(this.noOptions!==null){i.innerText=this.emptyOptionListText}else{i.innerText=""}}};this.getDefaultValue=i=>this.getLabelFromValue(i)||i||null;this.onFocus=()=>{this.icFocus.emit()};this.onBlur=i=>{var t;const s=i.relatedTarget;if(s!==null&&s.tagName==="UL"&&s.className.includes("menu")){return}const e=(t=this.menu)===null||t===void 0?void 0:t.querySelector("#retry-button");const a=this.searchable&&i.relatedTarget!==this.menu&&!Array.from(this.menu.querySelectorAll("[role='option']")).includes(i.relatedTarget)&&!(this.clearButton&&i.relatedTarget===this.clearButton)&&!(e&&i.relatedTarget===e);if(a){if(!this.retryButtonClick){this.setMenuChange(false)}this.handleFocusIndicatorDisplay()}this.retryButtonClick=false;this.icBlur.emit()};this.onTimeoutBlur=i=>{if(i.detail.ev.relatedTarget!==this.searchableSelectElement&&!this.blurredBecauseButtonPressed){this.setMenuChange(false);this.handleFocusIndicatorDisplay();this.icBlur.emit()}this.blurredBecauseButtonPressed=false};this.handleFormReset=()=>{this.value=this.initialValue;if(this.searchable){this.searchableSelectInputValue=this.getDefaultValue(this.value);this.hiddenInputValue=this.value}};this.ariaActiveDescendant=undefined;this.clearButtonFocused=false;this.debounceIcChange=undefined;this.hiddenInputValue=undefined;this.noOptions=null;this.open=false;this.pressedCharacters="";this.searchableSelectInputValue=null;this.charactersUntilSuggestions=0;this.disabled=false;this.disableFilter=false;this.emptyOptionListText="No results found";this.fullWidth=false;this.helperText="";this.hideLabel=false;this.includeDescriptionsInSearch=false;this.includeGroupTitlesInSearch=false;this.label=undefined;this.loadingErrorLabel="Loading Error";this.loadingLabel="Loading...";this.name=this.inputId;this.placeholder="Select an option";this.readonly=false;this.required=false;this.searchable=false;this.searchMatchPosition="anywhere";this.showClearButton=false;this.small=false;this.timeout=undefined;this.validationStatus="";this.validationText="";this.loading=false;this.options=[];this.filteredOptions=this.options;this.uniqueOptions=this.options;this.debounce=0;this.currDebounce=this.debounce;this.value=undefined;this.initialValue=this.value;this.inputValueToFilter=this.value;this.currValue=this.value}loadingHandler(i){i&&this.triggerLoading()}watchOptionsHandler(){if(!this.hasTimedOut){this.loading=false;clearTimeout(this.timeoutTimer);if(this.isExternalFiltering()){if(this.options.length>0){this.setOptionsValuesFromLabels();this.noOptions=null;this.uniqueOptions=this.deduplicateOptions(this.options);this.filteredOptions=this.uniqueOptions}else{this.noOptions=[{label:this.emptyOptionListText,value:""}];this.uniqueOptions=this.noOptions;this.filteredOptions=this.noOptions}this.updateSearchableSelectResultAriaLive();this.setDefaultValue()}else{this.setOptionsValuesFromLabels();this.uniqueOptions=this.deduplicateOptions(this.options);this.filteredOptions=this.uniqueOptions;if(this.initialOptionsEmpty){this.setDefaultValue();this.initialOptionsEmpty=false}}}else{if(!this.searchable)this.options=this.noOptions}}debounceChangedHandler(i){this.updateOnChangeDebounce(i)}valueChangedHandler(){if(this.value!==this.currValue){this.currValue=this.value}if(this.searchable){this.searchableSelectInputValue=this.getLabelFromValue(this.currValue)||this.currValue}}disconnectedCallback(){o(this.host,this.handleFormReset)}componentWillLoad(){this.inheritedAttributes=l(this.host,[...v,"tabindex","title"]);r(this.disabled,this.host);this.setOptionsValuesFromLabels();c(this.host,this.handleFormReset);if(!this.options.length){this.initialOptionsEmpty=true}else{this.setDefaultValue();this.uniqueOptions=this.deduplicateOptions(this.options)}}componentDidLoad(){d([{prop:this.label,propName:"label"}],"Select");if(this.loading){this.triggerLoading()}this.hiddenInputValue=this.searchable&&this.currValue}componentDidRender(){if(this.nativeSelectElement&&!this.disabled){this.setTextColor()}}async setFocus(){if(this.nativeSelectElement){this.nativeSelectElement.focus()}else if(this.customSelectElement){this.customSelectElement.focus()}else if(this.searchableSelectElement){this.searchableSelectElement.focus()}}updateOnChangeDebounce(i){if(this.currDebounce!==i){this.currDebounce=i}}debounceAriaLiveUpdate(){clearTimeout(this.debounceAria);window.setTimeout((()=>{this.updateSearchableSelectResultAriaLive()}),800)}setDefaultValue(){if(!this.hasSetDefaultValue&&this.currValue){this.searchableSelectInputValue=this.getDefaultValue(this.currValue);this.initialValue=this.currValue;this.hasSetDefaultValue=true}}render(){const{small:i,disabled:t,fullWidth:a,helperText:h,hideLabel:n,label:o,menuId:l,name:r,options:c,placeholder:d,readonly:v,required:y,searchable:k,showClearButton:z,validationStatus:L,validationText:C,currValue:M}=this;const T=k&&(this.loading||this.hasTimedOut||this.noOptions!==null&&this.noOptions[0]&&this.noOptions[0].label===this.emptyOptionListText);const H=this.searchable?this.hiddenInputValue:M;u(true,this.host,r,H,t);const B=L===g.Error?"true":"false";const j=p(this.inputId,h!=="",f(this.validationStatus,this.disabled)).trim();return s(e,{class:{disabled:t,searchable:k,small:i,"full-width":a},onBlur:this.onBlur},s("ic-input-container",{readonly:v},!n&&s("ic-input-label",{for:this.inputId,label:o,helperText:h,required:y,disabled:t,readonly:v}),s("ic-input-component-container",{ref:i=>this.anchorEl=i,class:{"menu-open":this.open},small:i,fullWidth:a,disabled:t,readonly:v,validationStatus:L},v?s("ic-typography",null,s("p",null,this.getLabelFromValue(M))):b()?s("select",Object.assign({ref:i=>this.nativeSelectElement=i,disabled:t,onChange:this.handleNativeSelectChange,required:y,id:this.inputId,"aria-label":o,"aria-describedby":j,"aria-invalid":B,onBlur:this.onBlur,onFocus:this.onFocus,onKeyDown:this.handleNativeSelectKeyDown},this.inheritedAttributes),s("option",{value:"",selected:true,disabled:!z},d),c.map((i=>{if(i.children){return s("optgroup",{label:i.label},i.children.map((i=>s("option",{value:i.value,disabled:i.disabled,selected:i.value===M},i.label))))}else{return s("option",{value:i.value,disabled:i.disabled,selected:i.value===M},i.label)}}))):k?s("div",{class:"searchable-select-container"},s("input",{class:"select-input",role:"combobox",autocomplete:"off","aria-label":o,"aria-describedby":j,"aria-activedescendant":this.ariaActiveDescendant,"aria-autocomplete":"list","aria-expanded":this.open?"true":"false","aria-invalid":B,"aria-required":y?"true":"false","aria-controls":l,ref:i=>this.searchableSelectElement=i,id:this.inputId,value:this.searchableSelectInputValue,placeholder:d,disabled:t,onInput:this.handleSearchableSelectInput,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onFocus:this.onFocus,onBlur:this.onBlur}),this.searchableSelectInputValue&&(z||k)&&s("div",{class:"clear-button-container"},s("ic-button",{id:"clear-button",ref:i=>this.clearButton=i,"aria-label":this.searchableSelectInputValue&&M===null?"Clear input":"Clear selection",class:"clear-button",innerHTML:x,onClick:this.handleClear,onFocus:this.handleClearButtonFocus,onBlur:this.handleClearButtonBlur,size:i?"small":"default",variant:"icon",appearance:this.clearButtonFocused?m.Light:m.Dark}),s("div",{class:"divider"})),s("span",{onMouseDown:this.handleExpandIconMouseDown,class:{"expand-icon":true,"expand-icon-open":this.open,"expand-icon-filled":!(M==null||M==="")},innerHTML:w,"aria-hidden":"true"}),s("div",{"aria-live":"polite",role:"status",class:"searchable-select-results-status"})):s("div",{class:"select-container"},s("button",{class:"select-input",ref:i=>this.customSelectElement=i,id:this.inputId,"aria-label":`${o}, ${this.getLabelFromValue(M)||d}${y?", required":""}`,"aria-describedby":j,"aria-invalid":B,"aria-haspopup":"listbox","aria-expanded":this.open?"true":"false","aria-owns":l,"aria-controls":l,disabled:t,onBlur:this.onBlur,onFocus:this.onFocus,onClick:this.handleClick,onMouseDown:this.handleMouseDown,onKeyDown:this.handleKeyDown},s("ic-typography",{variant:"body",class:{"value-text":true,placeholder:this.getLabelFromValue(M)===undefined}},s("p",null,this.getLabelFromValue(M)||d)),s("div",{class:"select-input-end"},M&&z&&s("div",{class:"divider"}),s("span",{class:{"expand-icon":true,"expand-icon-open":this.open,"expand-icon-filled":!(M==null||M==="")},innerHTML:w,"aria-hidden":"true"}))),M&&z&&s("ic-button",{id:"clear-button","aria-label":"Clear selection",class:"clear-button",innerHTML:x,onClick:this.handleClear,onFocus:this.handleClearButtonFocus,onBlur:this.handleClearButtonBlur,size:i?"small":"default",variant:"icon",appearance:this.clearButtonFocused?m.Light:m.Dark}))),!b()&&s("ic-menu",{class:{"no-results":T},ref:i=>this.menu=i,inputEl:k?this.searchableSelectElement:this.customSelectElement,inputLabel:o,anchorEl:this.anchorEl,small:i,menuId:l,open:this.open,options:k?this.filteredOptions:this.uniqueOptions,value:M,fullWidth:a,onMenuStateChange:this.handleMenuChange,onMenuOptionSelect:this.handleCustomSelectChange,onMenuKeyPress:this.handleMenuKeyPress,onMenuValueChange:this.handleMenuValueChange,onUngroupedOptionsSet:this.setUngroupedOptions,onRetryButtonClicked:this.handleRetry,parentEl:this.host,onTimeoutBlur:this.onTimeoutBlur,activationType:this.searchable?"manual":"automatic"}),f(this.validationStatus,this.disabled)&&s("ic-input-validation",{class:{"menu-open":this.open},ariaLiveMode:"polite",status:L,message:C,for:this.inputId})))}static get delegatesFocus(){return true}get host(){return a(this)}static get watchers(){return{loading:["loadingHandler"],options:["watchOptionsHandler"],debounce:["debounceChangedHandler"],value:["valueChangedHandler"]}}};z.style=y;export{z as ic_select};
+//# sourceMappingURL=p-77266738.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["icSelectCss","inputIds","Select","this","hasSetDefaultValue","inheritedAttributes","initialOptionsEmpty","inputId","menuId","searchableMenuItemSelected","ungroupedOptions","handleRetry","ev","detail","keyPressed","_a","searchableSelectElement","focus","blurredBecauseButtonPressed","retryButtonClick","icRetryLoad","emit","value","hiddenInputValue","emitIcChange","searchable","clearTimeout","debounceIcChange","window","setTimeout","icChange","currDebounce","emitImmediateIcChange","deduplicateOptions","options","uniqueValues","dedupedOptions","dedupedChildren","forEach","option","children","child","includes","console","warn","label","push","modifiedParent","Object","assign","setOptionsValuesFromLabels","length","map","setUngroupedOptions","event","setTextColor","nativeSelectElement","selectedIndex","className","setMenuChange","open","getLabelFromValue","uniqueOptions","getFilteredChildMenuOptions","getFilteredMenuOptions","includeDescriptionsInSearch","searchableSelectInputValue","searchMatchPosition","pressedCharacters","newOption","handleNativeSelectChange","icOptionSelect","handleCustomSelectChange","emptyOptionListText","currValue","inputValueToFilter","getValueFromLabel","ariaActiveDescendant","optionId","handleMenuChange","handleFocusIndicatorDisplay","handleMenuKeyPress","cancelBubble","handleCharacterKeyDown","key","handleMenuValueChange","focusIndicator","host","shadowRoot","querySelector","classList","add","remove","handleMouseDown","preventDefault","isExternalFiltering","disableFilter","handleClick","menu","filteredOptions","hasTimedOut","loading","noOptions","handleClickOpen","handleExpandIconMouseDown","disabled","handleClear","stopPropagation","timeoutTimer","icClear","customSelectElement","characterKeyPressTimer","handleFilter","handleNativeSelectKeyDown","handleKeyDown","isArrowKey","handleKeyboardOpen","handleClearButtonFocus","clearButtonFocused","handleClearButtonBlur","retryButton","relatedTarget","isGrouped","newFilteredOptions","menuOptionsFiltered","includeGroupTitlesInSearch","indexOf","noChildOptionsWhenFiltered","triggerLoading","loadingLabel","timeout","loadingErrorLabel","timedOut","find","handleSearchableSelectInput","target","icInput","debounceAriaLiveUpdate","updateSearchableSelectResultAriaLive","searchableSelectResultsStatusEl","innerText","getDefaultValue","onFocus","icFocus","onBlur","tagName","isSearchableAndNoFocusedInternalElements","Array","from","querySelectorAll","clearButton","icBlur","onTimeoutBlur","handleFormReset","initialValue","debounce","loadingHandler","newValue","watchOptionsHandler","setDefaultValue","debounceChangedHandler","updateOnChangeDebounce","valueChangedHandler","disconnectedCallback","removeFormResetListener","componentWillLoad","inheritAttributes","IC_INHERITED_ARIA","removeDisabledFalse","addFormResetListener","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","componentDidRender","setFocus","debounceAria","render","small","fullWidth","helperText","hideLabel","name","placeholder","readonly","required","showClearButton","validationStatus","validationText","noOptionSelect","inputValue","renderHiddenInput","invalid","IcInformationStatus","Error","describedBy","getInputDescribedByText","hasValidationStatus","trim","h","Host","class","for","ref","el","anchorEl","isMobileOrTablet","onChange","id","onKeyDown","selected","role","autocomplete","onInput","onClick","innerHTML","Clear","size","variant","appearance","IcThemeForegroundEnum","Light","Dark","onMouseDown","Expand","undefined","inputEl","inputLabel","onMenuStateChange","onMenuOptionSelect","onMenuKeyPress","onMenuValueChange","onUngroupedOptionsSet","onRetryButtonClicked","parentEl","activationType","ariaLiveMode","status","message"],"sources":["src/components/ic-select/ic-select.css?tag=ic-select&encapsulation=shadow","src/components/ic-select/ic-select.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --input-width: Width of the input field\n * @prop --ic-z-index-menu: z-index of select menu\n */\n\n:host {\n  position: relative;\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\nic-input-component-container:hover {\n  --border-color: var(--ic-action-dark-hover);\n}\n\nic-input-component-container:active {\n  --border-color: var(--ic-action-dark-active);\n\n  color: var(--ic-action-dark-active);\n}\n\nic-input-component-container.menu-open {\n  --border-color: var(--ic-architectural-400);\n\n  color: var(--ic-action-dark);\n}\n\nic-input-validation .status-icon,\nic-input-validation .statustext {\n  visibility: visible;\n}\n\nic-input-validation.menu-open .status-icon,\nic-input-validation.menu-open .statustext {\n  visibility: hidden;\n  transition: visibility 0s;\n}\n\nic-input-label {\n  margin-bottom: var(--ic-space-xs) !important;\n}\n\nselect {\n  border: 0;\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  color: var(--ic-color-primary-text);\n  line-height: 1.5rem;\n  letter-spacing: 0.005rem;\n  width: 100%;\n  height: 100%;\n  padding-left: 0.375rem;\n  appearance: none;\n  background-repeat: no-repeat;\n  background-position: right 0.375rem center;\n  background-image: url(\"data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\");\n}\n\nselect option,\n.select-option-selected {\n  color: var(--ic-color-primary-text);\n}\n\nselect:disabled {\n  color: var(--ic-architectural-200);\n  background-image: url(\"data:image/svg+xml;utf8,<svg fill='grey' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\");\n}\n\nselect:focus {\n  border: 0;\n  outline: 0;\n}\n\nselect:not([disabled]) {\n  cursor: pointer;\n}\n\n.select-container {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.select-input {\n  width: 100%;\n  height: 100%;\n  padding: 0 0.375rem;\n  display: flex;\n  cursor: pointer;\n  align-items: center;\n  justify-content: space-between;\n  background: none;\n  border: none;\n}\n\n.select-input:focus {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(:not(.disabled)) ic-input-component-container:hover .select-input {\n  background-color: var(--ic-architectural-white);\n}\n\n.select-input[disabled] {\n  pointer-events: none;\n}\n\n:host(.searchable) .select-input {\n  cursor: auto;\n}\n\n.searchable-select-container {\n  align-items: center;\n  display: flex;\n  width: 100%;\n  position: relative;\n}\n\n.expand-icon {\n  height: var(--ic-space-lg);\n  padding-left: var(--ic-space-xs);\n  color: var(--ic-action-dark);\n}\n\n.expand-icon > svg {\n  display: inline-block;\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n:host(.disabled) .expand-icon,\n:host(.disabled) .expand-icon > svg > path {\n  color: var(--ic-architectural-200);\n}\n\n:host(.searchable) .expand-icon {\n  padding-left: var(--ic-space-xxs);\n  height: 2.25rem;\n}\n\n:host(.searchable) .expand-icon > svg {\n  height: 2.25rem;\n  padding: 0 0.375rem;\n}\n\n:host(.searchable:not(.disabled)) .expand-icon > svg {\n  cursor: pointer;\n}\n\n.expand-icon-open {\n  color: var(--ic-action-dark);\n}\n\n.expand-icon-filled {\n  color: var(--ic-action-dark);\n}\n\n.expand-icon-open,\n:host(.searchable) .expand-icon-open {\n  transform: rotateX(180deg);\n}\n\n:host(.disabled) .value-text,\n.placeholder {\n  color: var(--ic-color-tertiary-text);\n}\n\n.select-input-end {\n  display: flex;\n  align-items: center;\n}\n\n.clear-button-container {\n  display: flex;\n  gap: var(--ic-space-xxs);\n  padding-left: 2.375rem;\n}\n\n:host(.small) .clear-button-container {\n  padding-left: 1.875rem;\n}\n\n.divider {\n  width: var(--ic-space-1px);\n  background-color: var(--ic-architectural-400);\n  margin: var(--ic-space-xxs) 0;\n  border-radius: var(--ic-space-1px);\n  height: var(--ic-space-lg);\n}\n\n:host(.small) .divider {\n  height: var(--ic-space-md);\n}\n\n.clear-button {\n  position: absolute;\n  right: 2.75rem;\n  border-radius: var(--ic-border-radius);\n  transition: box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus {\n  background-color: var(--ic-focus-blue);\n  box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow);\n  border-radius: 0.25rem;\n}\n\n.clear-button:focus * {\n  fill: white;\n}\n\n.searchable-select-results-status {\n  border: 0;\n  clip: rect(0, 0, 0, 0, 0);\n  height: var(--ic-space-1px);\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: var(--ic-space-1px);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  h,\n  State,\n  Watch,\n} from \"@stencil/core\";\n\nimport {\n  getInputDescribedByText,\n  getLabelFromValue,\n  hasValidationStatus,\n  inheritAttributes,\n  onComponentRequiredPropUndefined,\n  renderHiddenInput,\n  isMobileOrTablet,\n  getFilteredMenuOptions,\n  addFormResetListener,\n  removeFormResetListener,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n  IcThemeForegroundEnum,\n  IcMenuOption,\n  IcSearchMatchPositions,\n  IcValueEventDetail,\n} from \"../../utils/types\";\nimport Expand from \"./assets/Expand.svg\";\nimport Clear from \"./assets/Clear.svg\";\nimport { IcOptionSelectEventDetail } from \"../ic-menu/ic-menu.types\";\n\nlet inputIds = 0;\n\n@Component({\n  tag: \"ic-select\",\n  styleUrl: \"ic-select.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Select {\n  private anchorEl: HTMLElement;\n  private blurredBecauseButtonPressed: boolean;\n  private characterKeyPressTimer: number;\n  private clearButton: HTMLIcButtonElement;\n  private customSelectElement: HTMLButtonElement;\n  private debounceAria: number;\n  private hasSetDefaultValue = false;\n  private hasTimedOut: boolean;\n  private inheritedAttributes: { [k: string]: unknown } = {};\n  private initialOptionsEmpty = false;\n  private inputId = `ic-select-input-${inputIds++}`;\n  private menu: HTMLIcMenuElement;\n  private menuId = `${this.inputId}-menu`;\n  private nativeSelectElement: HTMLSelectElement;\n  private retryButtonClick: boolean;\n  private searchableMenuItemSelected: boolean = false;\n  private searchableSelectElement: HTMLInputElement;\n  private timeoutTimer: number;\n  private ungroupedOptions: IcMenuOption[] = [];\n\n  @Element() host!: HTMLIcSelectElement;\n\n  @State() ariaActiveDescendant: string;\n  @State() clearButtonFocused: boolean = false;\n  @State() debounceIcChange: number;\n  @State() hiddenInputValue: string;\n  @State() noOptions: IcMenuOption[] = null;\n  @State() open: boolean = false;\n  @State() pressedCharacters: string = \"\";\n  @State() searchableSelectInputValue: string = null;\n\n  /**\n   * @deprecated This prop should not be used anymore.\n   */\n  @Prop() charactersUntilSuggestions?: number = 0;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop({ reflect: true }) disabled?: boolean = false;\n\n  /**\n   * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.\n   */\n  @Prop() disableFilter?: boolean = false;\n\n  /**\n   * The text displayed when there are no options in the option list.\n   */\n  @Prop() emptyOptionListText = \"No results found\";\n\n  /**\n   * If `true`, the select element will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText?: string = \"\";\n\n  /**\n   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * If `true`, descriptions of options will be included when filtering options in a searchable select. Only applies to built in filtering.\n   */\n  @Prop() includeDescriptionsInSearch?: boolean = false;\n\n  /**\n   * If `true`, group titles of grouped options will be included when filtering options in a searchable select. Only applies to built in filtering.\n   */\n  @Prop() includeGroupTitlesInSearch?: boolean = false;\n\n  /**\n   * The label for the select.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The message displayed when external loading times out.\n   */\n  @Prop() loadingErrorLabel?: string = \"Loading Error\";\n\n  /**\n   * The message displayed whilst the options are being loaded externally.\n   */\n  @Prop() loadingLabel?: string = \"Loading...\";\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name?: string = this.inputId;\n\n  /**\n   * The placeholder value to be displayed.\n   */\n  @Prop() placeholder?: string = \"Select an option\";\n\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly?: boolean = false;\n\n  /**\n   * If `true`, the select will require a value.\n   */\n  @Prop() required?: boolean = false;\n\n  /**\n   * If `true`, a searchable variant of the select will be displayed which can be typed in to filter options.\n   */\n  @Prop() searchable?: boolean = false;\n\n  /**\n   * Whether the search string of the searchable select should match the start of or anywhere in the options. Only applies to built in filtering.\n   */\n  @Prop() searchMatchPosition?: IcSearchMatchPositions = \"anywhere\";\n\n  /**\n   * If `true`, a button which clears the select input when clicked will be displayed. The button will always appear on the searchable select.\n   */\n  @Prop() showClearButton?: boolean = false;\n\n  /**\n   * If `true`, the small styling will be applied to the select.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * If using external filtering, set a timeout for when loading takes too long.\n   */\n  @Prop() timeout?: number;\n\n  /**\n   * The validation status - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus?: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The text to display as the validation message.\n   */\n  @Prop() validationText?: string = \"\";\n\n  /**\n   * If `true`, the loading state will be triggered when fetching options asyncronously.\n   */\n  @Prop({ mutable: true }) loading?: boolean = false;\n\n  @Watch(\"loading\")\n  loadingHandler(newValue: boolean): void {\n    newValue && this.triggerLoading();\n  }\n\n  /**\n   * The possible selection options.\n   */\n  @Prop() options?: IcMenuOption[] = [];\n  @State() filteredOptions: IcMenuOption[] = this.options;\n  @State() uniqueOptions: IcMenuOption[] = this.options;\n\n  @Watch(\"options\")\n  watchOptionsHandler(): void {\n    if (!this.hasTimedOut) {\n      this.loading = false;\n      clearTimeout(this.timeoutTimer);\n      if (this.isExternalFiltering()) {\n        if (this.options.length > 0) {\n          this.setOptionsValuesFromLabels();\n          this.noOptions = null;\n          this.uniqueOptions = this.deduplicateOptions(this.options);\n          this.filteredOptions = this.uniqueOptions;\n        } else {\n          this.noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n          this.uniqueOptions = this.noOptions;\n          this.filteredOptions = this.noOptions;\n        }\n        this.updateSearchableSelectResultAriaLive();\n        this.setDefaultValue();\n      } else {\n        this.setOptionsValuesFromLabels();\n        this.uniqueOptions = this.deduplicateOptions(this.options);\n        this.filteredOptions = this.uniqueOptions;\n        if (this.initialOptionsEmpty) {\n          this.setDefaultValue();\n          this.initialOptionsEmpty = false;\n        }\n      }\n    } else {\n      if (!this.searchable) this.options = this.noOptions;\n    }\n  }\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop() debounce?: number = 0;\n  @State() currDebounce = this.debounce;\n\n  @Watch(\"debounce\")\n  debounceChangedHandler(newValue: number): void {\n    this.updateOnChangeDebounce(newValue);\n  }\n\n  /**\n   * The value of the select, reflected by the value of the currently selected option. For the searchable variant, the value is also reflected by the user input.\n   */\n  @Prop({ mutable: true }) value?: string;\n  @State() initialValue = this.value;\n  @State() inputValueToFilter = this.value;\n  @State() currValue = this.value;\n\n  @Watch(\"value\")\n  valueChangedHandler(): void {\n    if (this.value !== this.currValue) {\n      this.currValue = this.value;\n    }\n\n    if (this.searchable) {\n      this.searchableSelectInputValue =\n        this.getLabelFromValue(this.currValue) || this.currValue;\n    }\n  }\n\n  /**\n   * Emitted when the select loses focus.\n   */\n  @Event() icBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the value changes.\n   */\n  @Event() icChange!: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when the clear button is clicked.\n   */\n  @Event() icClear!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select gains focus.\n   */\n  @Event() icFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when an option is highlighted within the menu.\n   * Highlighting a menu item will also trigger an `icChange/onIcChange` due to the value being updated.\n   */\n  @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * Emitted when the 'retry loading' button is clicked for a searchable variant.\n   */\n  @Event() icRetryLoad: EventEmitter<IcValueEventDetail>;\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.host, this.handleFormReset);\n  }\n\n  componentWillLoad(): void {\n    this.inheritedAttributes = inheritAttributes(this.host, [\n      ...IC_INHERITED_ARIA,\n      \"tabindex\",\n      \"title\",\n    ]);\n\n    removeDisabledFalse(this.disabled, this.host);\n\n    this.setOptionsValuesFromLabels();\n\n    addFormResetListener(this.host, this.handleFormReset);\n\n    if (!this.options.length) {\n      this.initialOptionsEmpty = true;\n    } else {\n      this.setDefaultValue();\n      this.uniqueOptions = this.deduplicateOptions(this.options);\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Select\"\n    );\n\n    if (this.loading) {\n      this.triggerLoading();\n    }\n    this.hiddenInputValue = this.searchable && this.currValue;\n  }\n\n  componentDidRender(): void {\n    if (this.nativeSelectElement && !this.disabled) {\n      this.setTextColor();\n    }\n  }\n\n  /**\n   * Sets focus on the input box.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.nativeSelectElement) {\n      this.nativeSelectElement.focus();\n    } else if (this.customSelectElement) {\n      this.customSelectElement.focus();\n    } else if (this.searchableSelectElement) {\n      this.searchableSelectElement.focus();\n    }\n  }\n\n  private handleRetry = (ev: CustomEvent<IcValueEventDetail>) => {\n    if (ev.detail.keyPressed) this.searchableSelectElement?.focus();\n    this.blurredBecauseButtonPressed = true;\n    this.retryButtonClick = true;\n    this.hasSetDefaultValue = true;\n    this.icRetryLoad.emit({ value: this.hiddenInputValue });\n  };\n\n  private updateOnChangeDebounce(newValue: number) {\n    if (this.currDebounce !== newValue) {\n      this.currDebounce = newValue;\n    }\n  }\n\n  private emitIcChange = (value: string) => {\n    if (!this.searchable) {\n      this.value = value;\n    }\n\n    clearTimeout(this.debounceIcChange);\n    this.debounceIcChange = window.setTimeout(() => {\n      this.icChange.emit({ value: value });\n    }, this.currDebounce);\n  };\n\n  private emitImmediateIcChange = (value: string) => {\n    this.value = value;\n    clearTimeout(this.debounceIcChange);\n    this.icChange.emit({ value: value });\n  };\n\n  /**\n   * Processes the provided array of IcMenuOptions, removing duplicates and reporting them with a console.warn\n   * @param options array of IcMenuOptions\n   * @returns a new options object, with all entries possessing a duplicate 'value' field removed\n   */\n  private deduplicateOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    const uniqueValues: string[] = [];\n    const dedupedOptions: IcMenuOption[] = [];\n    let dedupedChildren: IcMenuOption[];\n\n    options.forEach((option: IcMenuOption) => {\n      if (option.children) {\n        //If an option has children, we will loop through them\n        dedupedChildren = [];\n        option.children.forEach((child) => {\n          if (uniqueValues.includes(child.value)) {\n            console.warn(\n              `ic-select with label ${this.label} was populated with duplicate option (value: ${child.value}) which has been removed.`\n            );\n          } else {\n            uniqueValues.push(child.value);\n            dedupedChildren.push(child);\n          }\n        });\n        // construct a modified option, inserting the deduplicated children alongside the original information\n        const modifiedParent: IcMenuOption = {\n          ...option,\n          children: dedupedChildren,\n        };\n        dedupedOptions.push(modifiedParent);\n      } else {\n        // If an option does not have children, assess to see if it's value has been included already\n        if (uniqueValues.includes(option.value)) {\n          console.warn(\n            `ic-select with label ${this.label} was populated with duplicate option (value: ${option.value}) which has been removed.`\n          );\n        } else {\n          uniqueValues.push(option.value);\n          dedupedOptions.push(option);\n        }\n      }\n    });\n    return dedupedOptions;\n  };\n\n  /**\n   * Loop through options array and for all options with no value, infer it from the label\n   */\n  private setOptionsValuesFromLabels = (): void => {\n    if (this.options.length > 0 && this.options.map) {\n      this.options.map((option) => {\n        if (!option.value) {\n          option.value = option.label;\n        }\n      });\n    }\n  };\n\n  private setUngroupedOptions = (event: CustomEvent): void => {\n    this.ungroupedOptions = event.detail.options;\n  };\n\n  private setTextColor = (): void => {\n    if (this.nativeSelectElement.selectedIndex === 0) {\n      this.nativeSelectElement.className = \"placeholder\";\n    } else {\n      this.nativeSelectElement.className = \"select-option-selected\";\n    }\n  };\n\n  private setMenuChange = (open: boolean) => {\n    if (this.open !== open) {\n      this.open = open;\n    }\n  };\n\n  private getLabelFromValue = (value: string): string | undefined => {\n    return getLabelFromValue(value, this.uniqueOptions);\n  };\n\n  private getFilteredChildMenuOptions = (option: IcMenuOption) => {\n    let children = option.children;\n\n    if (this.searchable) {\n      children = getFilteredMenuOptions(\n        option.children,\n        this.includeDescriptionsInSearch,\n        this.searchableSelectInputValue,\n        this.searchMatchPosition\n      );\n    } else {\n      children = getFilteredMenuOptions(\n        option.children,\n        false,\n        this.pressedCharacters,\n        \"start\"\n      );\n    }\n\n    const newOption = { ...option };\n    newOption.children = children;\n    return newOption;\n  };\n\n  private handleNativeSelectChange = (): void => {\n    this.icOptionSelect.emit({ value: this.nativeSelectElement.value });\n    this.emitImmediateIcChange(this.nativeSelectElement.value);\n    this.setTextColor();\n  };\n\n  private handleCustomSelectChange = (event: CustomEvent): void => {\n    if (this.searchable && event.detail.label === this.emptyOptionListText) {\n      this.searchableSelectElement.focus();\n      return;\n    }\n\n    if (this.searchable) {\n      this.value = event.detail.value;\n      this.searchableMenuItemSelected = true;\n\n      // After editing the input, if selecting the same option as before, set the input value to label again\n      if (this.value === this.currValue) {\n        this.searchableSelectInputValue = this.getLabelFromValue(this.value);\n      }\n\n      this.inputValueToFilter = null;\n      this.hiddenInputValue = this.getValueFromLabel(\n        this.searchableSelectInputValue\n      );\n    }\n\n    this.ariaActiveDescendant = event.detail.optionId;\n    this.icOptionSelect.emit({ value: event.detail.value });\n    this.emitIcChange(event.detail.value);\n  };\n\n  private handleMenuChange = (event: CustomEvent): void => {\n    this.open = event.detail.open;\n    this.pressedCharacters = \"\";\n\n    this.searchable && this.handleFocusIndicatorDisplay();\n  };\n\n  // clears the debounce delay when navigating the menu with arrow keys etc\n  // to prevent delay in change event, which should only occur when typing in input\n  private handleMenuKeyPress = (ev: CustomEvent): void => {\n    ev.cancelBubble = true;\n    this.handleCharacterKeyDown(ev.detail.key);\n  };\n\n  private handleMenuValueChange = (ev: CustomEvent): void => {\n    this.value = ev.detail.value;\n  };\n\n  private handleFocusIndicatorDisplay = () => {\n    const focusIndicator =\n      this.host.shadowRoot.querySelector(\".focus-indicator\");\n\n    if (this.open) {\n      focusIndicator.classList.add(\"focus-indicator-enabled\");\n    } else {\n      focusIndicator.classList.remove(\"focus-indicator-enabled\");\n    }\n  };\n\n  private handleMouseDown = (event: Event): void => {\n    if (!this.open) {\n      event.preventDefault();\n    }\n  };\n\n  private isExternalFiltering = (): boolean =>\n    this.searchable && this.disableFilter;\n\n  private handleClick = (event: MouseEvent): void => {\n    if (!this.open) {\n      if (this.isExternalFiltering()) {\n        this.menu.options = this.filteredOptions;\n      } else if (\n        !this.hasTimedOut &&\n        !this.loading &&\n        (!this.searchable || this.searchableMenuItemSelected)\n      ) {\n        this.noOptions = null;\n        this.menu.options = this.uniqueOptions;\n      }\n    }\n\n    if (event.detail !== 0) {\n      this.menu.handleClickOpen();\n    }\n  };\n\n  private handleExpandIconMouseDown = (event: MouseEvent) => {\n    if (!this.disabled) {\n      event.preventDefault();\n      this.searchableSelectElement.focus();\n      this.handleClick(event);\n    }\n  };\n\n  private handleClear = (event: Event): void => {\n    event.stopPropagation();\n    this.hasTimedOut = false;\n    clearTimeout(this.timeoutTimer);\n    this.noOptions = null;\n    this.emitImmediateIcChange(null);\n    this.icClear.emit();\n\n    if (this.searchable) {\n      this.searchableSelectElement.value = null;\n      this.searchableSelectInputValue = null;\n      this.filteredOptions = this.uniqueOptions;\n      this.hiddenInputValue = null;\n      this.searchableSelectElement.focus();\n    } else {\n      this.customSelectElement.focus();\n    }\n  };\n\n  private handleCharacterKeyDown = (key: string) => {\n    // Only close menu when space is pressed if not being used alongside character keys to quickly select options\n    if (\n      this.open &&\n      key === \" \" &&\n      this.pressedCharacters.length === 0 &&\n      !this.hasTimedOut &&\n      !this.loading\n    ) {\n      this.setMenuChange(false);\n    }\n\n    if (key.length === 1 && !this.searchable) {\n      window.clearTimeout(this.characterKeyPressTimer);\n      this.characterKeyPressTimer = window.setTimeout(\n        () => (this.pressedCharacters = \"\"),\n        1000\n      );\n\n      this.pressedCharacters += key;\n      this.handleFilter();\n\n      if (!this.noOptions) {\n        this.emitImmediateIcChange(this.filteredOptions[0].value);\n      }\n    } else {\n      this.pressedCharacters = \"\";\n    }\n  };\n\n  private handleNativeSelectKeyDown = (event: KeyboardEvent) => {\n    if ((event.key !== \"Escape\" && event.key !== \"Tab\") || this.open) {\n      event.cancelBubble = true;\n    }\n    this.handleCharacterKeyDown(event.key);\n  };\n\n  private handleKeyDown = (event: KeyboardEvent): void => {\n    if ((event.key !== \"Escape\" && event.key !== \"Tab\") || this.open) {\n      event.cancelBubble = true;\n    }\n    const isArrowKey = event.key === \"ArrowDown\" || event.key === \"ArrowUp\";\n\n    if (!this.open) {\n      if (this.isExternalFiltering() && (event.key === \"Enter\" || isArrowKey)) {\n        this.menu.options = this.filteredOptions;\n      } else {\n        if (!this.hasTimedOut) {\n          this.noOptions = null;\n          this.menu.options = this.uniqueOptions;\n        }\n      }\n    }\n\n    if (this.open && event.key === \"Enter\") {\n      this.setMenuChange(false);\n    } else {\n      if (!(isArrowKey && this.noOptions !== null)) {\n        if (!(event.key === \" \" && this.pressedCharacters.length > 0)) {\n          // Keyboard events get passed onto ic-menu\n          this.menu.handleKeyboardOpen(event);\n        }\n        this.handleCharacterKeyDown(event.key);\n      }\n    }\n  };\n\n  private handleClearButtonFocus = (): void => {\n    this.clearButtonFocused = true;\n  };\n\n  private handleClearButtonBlur = (ev: FocusEvent): void => {\n    const retryButton = this.menu?.querySelector(\"#retry-button\");\n    if (\n      !(\n        this.searchableSelectElement &&\n        ev.relatedTarget === this.searchableSelectElement\n      ) &&\n      !(retryButton && ev.relatedTarget === retryButton)\n    ) {\n      this.setMenuChange(false);\n      this.handleFocusIndicatorDisplay();\n    }\n    this.clearButtonFocused = false;\n  };\n\n  private handleFilter = (): void => {\n    const options = this.deduplicateOptions(\n      this.searchable ? [...this.uniqueOptions] : this.ungroupedOptions\n    );\n\n    let isGrouped = false;\n    let newFilteredOptions: IcMenuOption[] = [];\n\n    options.map((option) => {\n      if (option.children) isGrouped = true;\n    });\n\n    let menuOptionsFiltered: IcMenuOption[];\n\n    if (this.searchable) {\n      menuOptionsFiltered = getFilteredMenuOptions(\n        options,\n        this.includeDescriptionsInSearch,\n        this.inputValueToFilter,\n        this.searchMatchPosition\n      );\n      this.searchableMenuItemSelected = false;\n    } else {\n      menuOptionsFiltered = getFilteredMenuOptions(\n        options,\n        false,\n        this.pressedCharacters,\n        \"start\"\n      );\n    }\n\n    if (!isGrouped) {\n      newFilteredOptions = menuOptionsFiltered;\n    } else {\n      options.map((option) => {\n        if (this.includeGroupTitlesInSearch) {\n          if (menuOptionsFiltered.indexOf(option) !== -1) {\n            newFilteredOptions.push(option);\n          } else {\n            newFilteredOptions.push(this.getFilteredChildMenuOptions(option));\n          }\n        } else {\n          newFilteredOptions.push(this.getFilteredChildMenuOptions(option));\n        }\n      });\n    }\n\n    let noChildOptionsWhenFiltered = false;\n\n    if (isGrouped) {\n      noChildOptionsWhenFiltered = true;\n      newFilteredOptions.map((option) => {\n        if (option.children.length > 0) {\n          noChildOptionsWhenFiltered = false;\n        }\n      });\n    }\n\n    const noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n\n    if (newFilteredOptions.length > 0 && !noChildOptionsWhenFiltered) {\n      this.noOptions = null;\n      this.filteredOptions = newFilteredOptions;\n    } else {\n      this.noOptions = noOptions;\n      this.filteredOptions = this.noOptions;\n    }\n  };\n\n  /**\n   * Put the select component into loading state.\n   * Replace options with the loading message. If timeout is enabled, set the timeout and once passed, replace options with the loading error message\n   */\n  private triggerLoading = () => {\n    this.hasTimedOut = false;\n    this.noOptions = [{ label: this.loadingLabel, value: \"\", loading: true }];\n    if (this.filteredOptions !== this.noOptions && this.searchable) {\n      this.filteredOptions = this.noOptions;\n    } else if (this.uniqueOptions !== this.noOptions && !this.searchable) {\n      this.uniqueOptions = this.noOptions;\n    }\n    if (this.timeout) {\n      this.timeoutTimer = window.setTimeout(() => {\n        this.loading = false;\n        this.hasTimedOut = true;\n        this.noOptions = [\n          { label: this.loadingErrorLabel, value: \"\", timedOut: true },\n        ];\n        this.filteredOptions = this.noOptions;\n        if (!this.searchable) this.uniqueOptions = this.noOptions;\n      }, this.timeout);\n    }\n  };\n\n  private getValueFromLabel = (label: string): string | undefined => {\n    return this.uniqueOptions.find((option) => option.label === label)?.value;\n  };\n\n  private handleSearchableSelectInput = (event: Event): void => {\n    this.searchableSelectInputValue = (event.target as HTMLInputElement).value;\n    this.icInput.emit({ value: this.searchableSelectInputValue });\n    this.emitIcChange(this.searchableSelectInputValue);\n\n    this.hiddenInputValue = this.searchableSelectInputValue;\n    this.inputValueToFilter = this.searchableSelectInputValue;\n    this.setMenuChange(true);\n\n    if (!this.disableFilter) {\n      this.handleFilter();\n      this.debounceAriaLiveUpdate();\n    }\n  };\n\n  private updateSearchableSelectResultAriaLive = (): void => {\n    const searchableSelectResultsStatusEl = this.host.shadowRoot.querySelector(\n      \".searchable-select-results-status\"\n    ) as HTMLDivElement;\n\n    if (searchableSelectResultsStatusEl) {\n      if (this.noOptions !== null) {\n        searchableSelectResultsStatusEl.innerText = this.emptyOptionListText;\n      } else {\n        searchableSelectResultsStatusEl.innerText = \"\";\n      }\n    }\n  };\n\n  private debounceAriaLiveUpdate() {\n    clearTimeout(this.debounceAria);\n\n    window.setTimeout(() => {\n      this.updateSearchableSelectResultAriaLive();\n    }, 800);\n  }\n\n  private getDefaultValue = (value: string): string | null =>\n    this.getLabelFromValue(value) || value || null;\n\n  private setDefaultValue() {\n    if (!this.hasSetDefaultValue && this.currValue) {\n      this.searchableSelectInputValue = this.getDefaultValue(this.currValue);\n      this.initialValue = this.currValue;\n      this.hasSetDefaultValue = true;\n    }\n  }\n\n  private onFocus = (): void => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = (event: FocusEvent): void => {\n    const target = event.relatedTarget as HTMLElement;\n    if (\n      target !== null &&\n      target.tagName === \"UL\" &&\n      target.className.includes(\"menu\")\n    ) {\n      return;\n    }\n\n    const retryButton = this.menu?.querySelector(\"#retry-button\");\n    const isSearchableAndNoFocusedInternalElements =\n      this.searchable &&\n      event.relatedTarget !== this.menu &&\n      !Array.from(this.menu.querySelectorAll(\"[role='option']\")).includes(\n        event.relatedTarget as Element\n      ) &&\n      !(this.clearButton && event.relatedTarget === this.clearButton) &&\n      !(retryButton && event.relatedTarget === retryButton);\n\n    if (isSearchableAndNoFocusedInternalElements) {\n      if (!this.retryButtonClick) {\n        this.setMenuChange(false);\n      }\n      this.handleFocusIndicatorDisplay();\n    }\n\n    this.retryButtonClick = false;\n    this.icBlur.emit();\n  };\n\n  private onTimeoutBlur = (ev: CustomEvent) => {\n    if (\n      (ev.detail.ev as FocusEvent).relatedTarget !==\n        this.searchableSelectElement &&\n      !this.blurredBecauseButtonPressed\n    ) {\n      this.setMenuChange(false);\n      this.handleFocusIndicatorDisplay();\n      this.icBlur.emit();\n    }\n    this.blurredBecauseButtonPressed = false;\n  };\n\n  private handleFormReset = (): void => {\n    this.value = this.initialValue;\n    if (this.searchable) {\n      this.searchableSelectInputValue = this.getDefaultValue(this.value);\n      this.hiddenInputValue = this.value;\n    }\n  };\n\n  render() {\n    const {\n      small,\n      disabled,\n      fullWidth,\n      helperText,\n      hideLabel,\n      label,\n      menuId,\n      name,\n      options,\n      placeholder,\n      readonly,\n      required,\n      searchable,\n      showClearButton,\n      validationStatus,\n      validationText,\n      currValue,\n    } = this;\n\n    const noOptionSelect =\n      searchable &&\n      (this.loading ||\n        this.hasTimedOut ||\n        (this.noOptions !== null &&\n          this.noOptions[0] &&\n          this.noOptions[0].label === this.emptyOptionListText));\n    const inputValue = this.searchable ? this.hiddenInputValue : currValue;\n\n    renderHiddenInput(true, this.host, name, inputValue, disabled);\n\n    const invalid =\n      validationStatus === IcInformationStatus.Error ? \"true\" : \"false\";\n\n    const describedBy = getInputDescribedByText(\n      this.inputId,\n      helperText !== \"\",\n      hasValidationStatus(this.validationStatus, this.disabled)\n    ).trim();\n\n    return (\n      <Host\n        class={{\n          disabled: disabled,\n          searchable: searchable,\n          small: small,\n          \"full-width\": fullWidth,\n        }}\n        onBlur={this.onBlur}\n      >\n        <ic-input-container readonly={readonly}>\n          {!hideLabel && (\n            <ic-input-label\n              for={this.inputId}\n              label={label}\n              helperText={helperText}\n              required={required}\n              disabled={disabled}\n              readonly={readonly}\n            ></ic-input-label>\n          )}\n          <ic-input-component-container\n            ref={(el) => (this.anchorEl = el)}\n            class={{ \"menu-open\": this.open }}\n            small={small}\n            fullWidth={fullWidth}\n            disabled={disabled}\n            readonly={readonly}\n            validationStatus={validationStatus}\n          >\n            {readonly ? (\n              <ic-typography>\n                <p>{this.getLabelFromValue(currValue)}</p>\n              </ic-typography>\n            ) : isMobileOrTablet() ? (\n              <select\n                ref={(el) => (this.nativeSelectElement = el)}\n                disabled={disabled}\n                onChange={this.handleNativeSelectChange}\n                required={required}\n                id={this.inputId}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                onKeyDown={this.handleNativeSelectKeyDown}\n                {...this.inheritedAttributes}\n              >\n                <option value=\"\" selected disabled={!showClearButton}>\n                  {placeholder}\n                </option>\n                {options.map((option) => {\n                  if (option.children) {\n                    return (\n                      <optgroup label={option.label}>\n                        {option.children.map((option) => (\n                          <option\n                            value={option.value}\n                            disabled={option.disabled}\n                            selected={option.value === currValue}\n                          >\n                            {option.label}\n                          </option>\n                        ))}\n                      </optgroup>\n                    );\n                  } else {\n                    return (\n                      <option\n                        value={option.value}\n                        disabled={option.disabled}\n                        selected={option.value === currValue}\n                      >\n                        {option.label}\n                      </option>\n                    );\n                  }\n                })}\n              </select>\n            ) : searchable ? (\n              <div class=\"searchable-select-container\">\n                <input\n                  class=\"select-input\"\n                  role=\"combobox\"\n                  autocomplete=\"off\"\n                  aria-label={label}\n                  aria-describedby={describedBy}\n                  aria-activedescendant={this.ariaActiveDescendant}\n                  aria-autocomplete=\"list\"\n                  aria-expanded={this.open ? \"true\" : \"false\"}\n                  aria-invalid={invalid}\n                  aria-required={required ? \"true\" : \"false\"}\n                  aria-controls={menuId}\n                  ref={(el) => (this.searchableSelectElement = el)}\n                  id={this.inputId}\n                  value={this.searchableSelectInputValue}\n                  placeholder={placeholder}\n                  disabled={disabled}\n                  onInput={this.handleSearchableSelectInput}\n                  onClick={this.handleClick}\n                  onKeyDown={this.handleKeyDown}\n                  onFocus={this.onFocus}\n                  onBlur={this.onBlur}\n                ></input>\n                {this.searchableSelectInputValue &&\n                  (showClearButton || searchable) && (\n                    <div class=\"clear-button-container\">\n                      <ic-button\n                        id=\"clear-button\"\n                        ref={(el) => (this.clearButton = el)}\n                        aria-label={\n                          this.searchableSelectInputValue && currValue === null\n                            ? \"Clear input\"\n                            : \"Clear selection\"\n                        }\n                        class=\"clear-button\"\n                        innerHTML={Clear}\n                        onClick={this.handleClear}\n                        onFocus={this.handleClearButtonFocus}\n                        onBlur={this.handleClearButtonBlur}\n                        size={small ? \"small\" : \"default\"}\n                        variant=\"icon\"\n                        appearance={\n                          this.clearButtonFocused\n                            ? IcThemeForegroundEnum.Light\n                            : IcThemeForegroundEnum.Dark\n                        }\n                      ></ic-button>\n                      <div class=\"divider\"></div>\n                    </div>\n                  )}\n                <span\n                  onMouseDown={this.handleExpandIconMouseDown}\n                  class={{\n                    \"expand-icon\": true,\n                    \"expand-icon-open\": this.open,\n                    \"expand-icon-filled\": !(\n                      currValue == null || currValue === \"\"\n                    ),\n                  }}\n                  innerHTML={Expand}\n                  aria-hidden=\"true\"\n                />\n                <div\n                  aria-live=\"polite\"\n                  role=\"status\"\n                  class=\"searchable-select-results-status\"\n                ></div>\n              </div>\n            ) : (\n              <div class=\"select-container\">\n                <button\n                  class=\"select-input\"\n                  ref={(el) => (this.customSelectElement = el)}\n                  id={this.inputId}\n                  aria-label={`${label}, ${\n                    this.getLabelFromValue(currValue) || placeholder\n                  }${required ? \", required\" : \"\"}`}\n                  aria-describedby={describedBy}\n                  aria-invalid={invalid}\n                  aria-haspopup=\"listbox\"\n                  aria-expanded={this.open ? \"true\" : \"false\"}\n                  aria-owns={menuId}\n                  aria-controls={menuId}\n                  disabled={disabled}\n                  onBlur={this.onBlur}\n                  onFocus={this.onFocus}\n                  onClick={this.handleClick}\n                  onMouseDown={this.handleMouseDown}\n                  onKeyDown={this.handleKeyDown}\n                >\n                  <ic-typography\n                    variant=\"body\"\n                    class={{\n                      \"value-text\": true,\n                      placeholder:\n                        this.getLabelFromValue(currValue) === undefined,\n                    }}\n                  >\n                    <p>{this.getLabelFromValue(currValue) || placeholder}</p>\n                  </ic-typography>\n                  <div class=\"select-input-end\">\n                    {currValue && showClearButton && (\n                      <div class=\"divider\"></div>\n                    )}\n                    <span\n                      class={{\n                        \"expand-icon\": true,\n                        \"expand-icon-open\": this.open,\n                        \"expand-icon-filled\": !(\n                          currValue == null || currValue === \"\"\n                        ),\n                      }}\n                      innerHTML={Expand}\n                      aria-hidden=\"true\"\n                    />\n                  </div>\n                </button>\n                {currValue && showClearButton && (\n                  <ic-button\n                    id=\"clear-button\"\n                    aria-label=\"Clear selection\"\n                    class=\"clear-button\"\n                    innerHTML={Clear}\n                    onClick={this.handleClear}\n                    onFocus={this.handleClearButtonFocus}\n                    onBlur={this.handleClearButtonBlur}\n                    size={small ? \"small\" : \"default\"}\n                    variant=\"icon\"\n                    appearance={\n                      this.clearButtonFocused\n                        ? IcThemeForegroundEnum.Light\n                        : IcThemeForegroundEnum.Dark\n                    }\n                  ></ic-button>\n                )}\n              </div>\n            )}\n          </ic-input-component-container>\n          {!isMobileOrTablet() && (\n            <ic-menu\n              class={{\n                \"no-results\": noOptionSelect,\n              }}\n              ref={(el) => (this.menu = el)}\n              inputEl={\n                searchable\n                  ? this.searchableSelectElement\n                  : this.customSelectElement\n              }\n              inputLabel={label}\n              anchorEl={this.anchorEl}\n              small={small}\n              menuId={menuId}\n              open={this.open}\n              options={searchable ? this.filteredOptions : this.uniqueOptions}\n              value={currValue}\n              fullWidth={fullWidth}\n              onMenuStateChange={this.handleMenuChange}\n              onMenuOptionSelect={this.handleCustomSelectChange}\n              onMenuKeyPress={this.handleMenuKeyPress}\n              onMenuValueChange={this.handleMenuValueChange}\n              onUngroupedOptionsSet={this.setUngroupedOptions}\n              onRetryButtonClicked={this.handleRetry}\n              parentEl={this.host}\n              onTimeoutBlur={this.onTimeoutBlur}\n              activationType={this.searchable ? \"manual\" : \"automatic\"}\n            ></ic-menu>\n          )}\n          {hasValidationStatus(this.validationStatus, this.disabled) && (\n            <ic-input-validation\n              class={{ \"menu-open\": this.open }}\n              ariaLiveMode=\"polite\"\n              status={validationStatus}\n              message={validationText}\n              for={this.inputId}\n            ></ic-input-validation>\n          )}\n        </ic-input-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/{p-d2215b72.entry.js → p-7be2b1fd.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as i,H as e,g as s}from"./p-69920d86.js";import{N as o,u as r,c as a}from"./p-5dd0b02e.js";import{I as n}from"./p-6f57b13c.js";const l=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M13.0875 6.175L11.9125 5L6.91251 10L11.9125 15L13.0875 13.825L9.27084 10L13.0875 6.175Z"/>\n</svg>`;const c=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M8.08748 5L6.91248 6.175L10.7291 10L6.91248 13.825L8.08748 15L13.0875 10L8.08748 5Z"/>\n</svg>`;const h='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{--border-bottom-color:var(--ic-architectural-300);--splitter-color:var(--ic-architectural-100);display:flex;max-width:100%}:host(.light){--splitter-color:var(--ic-keyline-lighten-rgb)}:host(.dark){--splitter-color:var(--ic-keyline-darken-rgb)}::slotted(*){overflow-x:scroll;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;margin:calc(var(--ic-space-xs) * -1) !important;padding:var(--ic-space-xs) !important}:host(.visible) ::slotted(*){margin:calc(var(--ic-space-xs) * -1) 0 !important;padding:var(--ic-space-xs) !important}.tabs-container::-webkit-scrollbar{display:none}.scroll-container-left,.scroll-container-right{display:flex}.scroll-container-left{margin-left:var(--ic-space-xxs)}.scroll-container-right{margin-right:var(--ic-space-xxs)}.hidden{display:none}.scroll-arrow{margin:var(--ic-space-xxs) 0 var(--ic-space-xs) 0}.disabled .ic-tooltip-container{display:none !important}.scroll-splitter-left,.scroll-splitter-right{display:flex;height:var(--ic-space-lg);width:var(--ic-space-1px);margin-top:var(--ic-space-xs);border-radius:var(--ic-space-1px);background-color:var(--splitter-color)}.scroll-splitter-left{margin-left:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.scroll-splitter-right{margin-right:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.disabled .scroll-splitter-left,.disabled .scroll-splitter-right{background-color:transparent}.disabled ic-button>svg{color:var(--ic-keyline-darken-rgb)}:host(.dark) .disabled ic-button>svg,:host(.light) .disabled ic-button>svg{color:var(--splitter-color) !important}';const d=200;const p=class{constructor(i){t(this,i);this.buttonStateSet=false;this.focusHandler=t=>{this.itemFocusHandler(Array.from(this.items).indexOf(t.target))};this.resizeObserverCallback=()=>{if(this.el.clientWidth>=this.itemsContainerEl.scrollWidth){this.itemOverflow=false}else{this.itemOverflow=o(this.itemsContainerEl)}if(this.itemOverflow){this.lastItemVisible=this.itemsContainerEl.offsetWidth+this.itemsContainerEl.scrollLeft>=this.itemsContainerEl.scrollWidth}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.itemsContainerEl)};this.scrollLeft=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()-1)};this.scrollRight=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()+1)};this.longScrollRight=()=>{this.scrollRight();this.scrollDelay=window.setTimeout(this.longScrollRight,d)};this.longScrollLeft=()=>{this.scrollLeft();this.scrollDelay=window.setTimeout(this.longScrollLeft,d)};this.leftArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollLeft,d)};this.rightArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollRight,d)};this.arrowMouseUpHandler=()=>{window.clearTimeout(this.scrollDelay)};this.getCurrentLeftItem=()=>{const t=this.itemOffsets.findIndex((t=>t>Math.round(this.itemsContainerEl.scrollLeft)));return t<0?0:t};this.scrollHandler=()=>{window.clearTimeout(this.isScrolling);this.isScrolling=window.setTimeout(this.scrollStopped,50)};this.scrollStopped=()=>{const t=Math.round(this.itemsContainerEl.scrollLeft);if(this.buttonStateSet===false){this.firstItemVisible=t===0;this.lastItemVisible=this.itemsContainerEl.offsetWidth+t>=this.itemsContainerEl.scrollWidth}this.buttonStateSet=false};this.firstItemVisible=true;this.itemOverflow=false;this.lastItemVisible=false;this.appearance="default"}componentWillLoad(){this.itemsContainerEl=this.el.children[0];this.itemsContainerEl.addEventListener("scroll",this.scrollHandler);this.items=r(this.itemsContainerEl)||Array.from(this.itemsContainerEl.children);this.items.forEach((t=>{if(t.addEventListener){t.addEventListener("focus",this.focusHandler)}}))}componentDidLoad(){let t=0;this.itemOffsets=this.items.map((i=>{t+=i.offsetWidth;return t}));a(this.runResizeObserver);const i=Array.from(this.el.shadowRoot.querySelectorAll("div"));["mouseup","mouseleave"].forEach((t=>{i.forEach((i=>i.addEventListener(t,this.arrowMouseUpHandler)))}))}disconnectedCallback(){if(this.resizeObserver!==undefined){this.resizeObserver.disconnect()}const t=Array.from(this.el.shadowRoot.querySelectorAll("div"));["mouseup","mouseleave"].forEach((i=>{t.forEach((t=>t.removeEventListener(i,this.arrowMouseUpHandler)))}));this.items.forEach((t=>{if(t.removeEventListener){t.removeEventListener("focus",this.focusHandler)}}));this.itemsContainerEl.removeEventListener("scroll",this.scrollHandler)}async scrollItemIntoView(t){this.firstItemVisible=t<=0;const i=t<=0?0:this.itemOffsets[t-1];this.lastItemVisible=this.itemsContainerEl.offsetWidth+i>=this.itemsContainerEl.scrollWidth;this.buttonStateSet=true;this.itemsContainerEl.scrollLeft=i}itemFocusHandler(t){if(this.itemOverflow){this.scrollItemIntoView(t)}}render(){const{appearance:t,firstItemVisible:s,lastItemVisible:o,itemOverflow:r}=this;return i(e,{class:{["visible"]:r,["dark"]:this.appearance===n.Dark,["light"]:this.appearance===n.Light}},i("div",{"aria-hidden":"true",class:{["scroll-container-left"]:true,["hidden"]:!r,["disabled"]:s},role:"tab"},i("ic-button",{class:"scroll-arrow",variant:"icon","aria-label":"Scroll left",appearance:t,innerHTML:l,disabled:s,tabindex:"-1",onClick:this.scrollLeft,onMouseDown:this.leftArrowMouseDownHandler}),i("span",{class:"scroll-splitter-left"})),i("slot",null),i("div",{"aria-hidden":"true",class:{["scroll-container-right"]:true,["hidden"]:!r,["disabled"]:o},role:"tab"},i("span",{class:"scroll-splitter-right"}),i("ic-button",{class:"scroll-arrow",variant:"icon","aria-label":"Scroll right",appearance:t,innerHTML:c,disabled:o,tabindex:"-1",onClick:this.scrollRight,onMouseDown:this.rightArrowMouseDownHandler})))}get el(){return s(this)}};p.style=h;export{p as ic_horizontal_scroll};
-//# sourceMappingURL=p-d2215b72.entry.js.map
+import{r as t,h as i,H as e,g as s}from"./p-18068237.js";import{N as o,u as r,c as a}from"./p-ebe76390.js";import{I as n}from"./p-613aa265.js";const l=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M13.0875 6.175L11.9125 5L6.91251 10L11.9125 15L13.0875 13.825L9.27084 10L13.0875 6.175Z"/>\n</svg>`;const c=`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">\n  <path d="M8.08748 5L6.91248 6.175L10.7291 10L6.91248 13.825L8.08748 15L13.0875 10L8.08748 5Z"/>\n</svg>`;const h='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{--border-bottom-color:var(--ic-architectural-300);--splitter-color:var(--ic-architectural-100);display:flex;max-width:100%}:host(.light){--splitter-color:var(--ic-keyline-lighten-rgb)}:host(.dark){--splitter-color:var(--ic-keyline-darken-rgb)}::slotted(*){overflow-x:scroll;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;margin:calc(var(--ic-space-xs) * -1) !important;padding:var(--ic-space-xs) !important}:host(.visible) ::slotted(*){margin:calc(var(--ic-space-xs) * -1) 0 !important;padding:var(--ic-space-xs) !important}.tabs-container::-webkit-scrollbar{display:none}.scroll-container-left,.scroll-container-right{display:flex}.scroll-container-left{margin-left:var(--ic-space-xxs)}.scroll-container-right{margin-right:var(--ic-space-xxs)}.hidden{display:none}.scroll-arrow{margin:var(--ic-space-xxs) 0 var(--ic-space-xs) 0}.disabled .ic-tooltip-container{display:none !important}.scroll-splitter-left,.scroll-splitter-right{display:flex;height:var(--ic-space-lg);width:var(--ic-space-1px);margin-top:var(--ic-space-xs);border-radius:var(--ic-space-1px);background-color:var(--splitter-color)}.scroll-splitter-left{margin-left:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.scroll-splitter-right{margin-right:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.disabled .scroll-splitter-left,.disabled .scroll-splitter-right{background-color:transparent}.disabled ic-button>svg{color:var(--ic-keyline-darken-rgb)}:host(.dark) .disabled ic-button>svg,:host(.light) .disabled ic-button>svg{color:var(--splitter-color) !important}';const d=200;const p=class{constructor(i){t(this,i);this.buttonStateSet=false;this.focusHandler=t=>{this.itemFocusHandler(Array.from(this.items).indexOf(t.target))};this.resizeObserverCallback=()=>{if(this.el.clientWidth>=this.itemsContainerEl.scrollWidth){this.itemOverflow=false}else{this.itemOverflow=o(this.itemsContainerEl)}if(this.itemOverflow){this.lastItemVisible=this.itemsContainerEl.offsetWidth+this.itemsContainerEl.scrollLeft>=this.itemsContainerEl.scrollWidth}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.itemsContainerEl)};this.scrollLeft=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()-1)};this.scrollRight=()=>{this.scrollItemIntoView(this.getCurrentLeftItem()+1)};this.longScrollRight=()=>{this.scrollRight();this.scrollDelay=window.setTimeout(this.longScrollRight,d)};this.longScrollLeft=()=>{this.scrollLeft();this.scrollDelay=window.setTimeout(this.longScrollLeft,d)};this.leftArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollLeft,d)};this.rightArrowMouseDownHandler=t=>{t.preventDefault();this.scrollDelay=window.setTimeout(this.longScrollRight,d)};this.arrowMouseUpHandler=()=>{window.clearTimeout(this.scrollDelay)};this.getCurrentLeftItem=()=>{const t=this.itemOffsets.findIndex((t=>t>Math.round(this.itemsContainerEl.scrollLeft)));return t<0?0:t};this.scrollHandler=()=>{window.clearTimeout(this.isScrolling);this.isScrolling=window.setTimeout(this.scrollStopped,50)};this.scrollStopped=()=>{const t=Math.round(this.itemsContainerEl.scrollLeft);if(this.buttonStateSet===false){this.firstItemVisible=t===0;this.lastItemVisible=this.itemsContainerEl.offsetWidth+t>=this.itemsContainerEl.scrollWidth}this.buttonStateSet=false};this.firstItemVisible=true;this.itemOverflow=false;this.lastItemVisible=false;this.appearance="default"}componentWillLoad(){this.itemsContainerEl=this.el.children[0];this.itemsContainerEl.addEventListener("scroll",this.scrollHandler);this.items=r(this.itemsContainerEl)||Array.from(this.itemsContainerEl.children);this.items.forEach((t=>{if(t.addEventListener){t.addEventListener("focus",this.focusHandler)}}))}componentDidLoad(){let t=0;this.itemOffsets=this.items.map((i=>{t+=i.offsetWidth;return t}));a(this.runResizeObserver);const i=Array.from(this.el.shadowRoot.querySelectorAll("div"));["mouseup","mouseleave"].forEach((t=>{i.forEach((i=>i.addEventListener(t,this.arrowMouseUpHandler)))}))}disconnectedCallback(){if(this.resizeObserver!==undefined){this.resizeObserver.disconnect()}const t=Array.from(this.el.shadowRoot.querySelectorAll("div"));["mouseup","mouseleave"].forEach((i=>{t.forEach((t=>t.removeEventListener(i,this.arrowMouseUpHandler)))}));this.items.forEach((t=>{if(t.removeEventListener){t.removeEventListener("focus",this.focusHandler)}}));this.itemsContainerEl.removeEventListener("scroll",this.scrollHandler)}async scrollItemIntoView(t){this.firstItemVisible=t<=0;const i=t<=0?0:this.itemOffsets[t-1];this.lastItemVisible=this.itemsContainerEl.offsetWidth+i>=this.itemsContainerEl.scrollWidth;this.buttonStateSet=true;this.itemsContainerEl.scrollLeft=i}itemFocusHandler(t){if(this.itemOverflow){this.scrollItemIntoView(t)}}render(){const{appearance:t,firstItemVisible:s,lastItemVisible:o,itemOverflow:r}=this;return i(e,{class:{["visible"]:r,["dark"]:this.appearance===n.Dark,["light"]:this.appearance===n.Light}},i("div",{"aria-hidden":"true",class:{["scroll-container-left"]:true,["hidden"]:!r,["disabled"]:s},role:"tab"},i("ic-button",{class:"scroll-arrow",variant:"icon","aria-label":"Scroll left",appearance:t,innerHTML:l,disabled:s,tabindex:"-1",onClick:this.scrollLeft,onMouseDown:this.leftArrowMouseDownHandler}),i("span",{class:"scroll-splitter-left"})),i("slot",null),i("div",{"aria-hidden":"true",class:{["scroll-container-right"]:true,["hidden"]:!r,["disabled"]:o},role:"tab"},i("span",{class:"scroll-splitter-right"}),i("ic-button",{class:"scroll-arrow",variant:"icon","aria-label":"Scroll right",appearance:t,innerHTML:c,disabled:o,tabindex:"-1",onClick:this.scrollRight,onMouseDown:this.rightArrowMouseDownHandler})))}get el(){return s(this)}};p.style=h;export{p as ic_horizontal_scroll};
+//# sourceMappingURL=p-7be2b1fd.entry.js.map

package/dist/core/p-7be2b1fd.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icHorizontalScrollCss","SCROLL_DELAY_MS","HorizontalScroll","this","buttonStateSet","focusHandler","event","itemFocusHandler","Array","from","items","indexOf","target","resizeObserverCallback","el","clientWidth","itemsContainerEl","scrollWidth","itemOverflow","elementOverflowsX","lastItemVisible","offsetWidth","scrollLeft","runResizeObserver","resizeObserver","ResizeObserver","observe","scrollItemIntoView","getCurrentLeftItem","scrollRight","longScrollRight","scrollDelay","window","setTimeout","longScrollLeft","leftArrowMouseDownHandler","e","preventDefault","rightArrowMouseDownHandler","arrowMouseUpHandler","clearTimeout","index","itemOffsets","findIndex","Math","round","scrollHandler","isScrolling","scrollStopped","firstItemVisible","componentWillLoad","children","addEventListener","getSlotElements","forEach","item","componentDidLoad","runningTotal","map","checkResizeObserver","scrollArrows","shadowRoot","querySelectorAll","arrow","disconnectedCallback","undefined","disconnect","removeEventListener","itemPosition","newScrollPos","render","appearance","h","Host","class","IcThemeForegroundEnum","Dark","Light","role","variant","innerHTML","LeftArrow","disabled","tabindex","onClick","onMouseDown","RightArrow"],"sources":["src/components/ic-horizontal-scroll/ic-horizontal-scroll.css?tag=ic-horizontal-scroll&encapsulation=shadow","src/components/ic-horizontal-scroll/ic-horizontal-scroll.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  --border-bottom-color: var(--ic-architectural-300);\n  --splitter-color: var(--ic-architectural-100);\n\n  display: flex;\n  max-width: 100%;\n}\n\n:host(.light) {\n  --splitter-color: var(--ic-keyline-lighten-rgb);\n}\n\n:host(.dark) {\n  --splitter-color: var(--ic-keyline-darken-rgb);\n}\n\n/* Slotted items container element */\n::slotted(*) {\n  overflow-x: scroll;\n  overflow-y: hidden;\n  scroll-behavior: smooth;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  margin: calc(var(--ic-space-xs) * -1) !important;\n  padding: var(--ic-space-xs) !important;\n}\n\n:host(.visible) ::slotted(*) {\n  margin: calc(var(--ic-space-xs) * -1) 0 !important;\n  padding: var(--ic-space-xs) !important;\n}\n\n.tabs-container::-webkit-scrollbar {\n  display: none;\n}\n\n.scroll-container-left,\n.scroll-container-right {\n  display: flex;\n}\n\n.scroll-container-left {\n  margin-left: var(--ic-space-xxs);\n}\n\n.scroll-container-right {\n  margin-right: var(--ic-space-xxs);\n}\n\n.hidden {\n  display: none;\n}\n\n.scroll-arrow {\n  margin: var(--ic-space-xxs) 0 var(--ic-space-xs) 0;\n}\n\n.disabled .ic-tooltip-container {\n  display: none !important;\n}\n\n.scroll-splitter-left,\n.scroll-splitter-right {\n  display: flex;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-1px);\n  margin-top: var(--ic-space-xs);\n  border-radius: var(--ic-space-1px);\n  background-color: var(--splitter-color);\n}\n\n.scroll-splitter-left {\n  margin-left: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.scroll-splitter-right {\n  margin-right: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.disabled .scroll-splitter-left,\n.disabled .scroll-splitter-right {\n  background-color: transparent;\n}\n\n.disabled ic-button > svg {\n  color: var(--ic-keyline-darken-rgb);\n}\n\n:host(.dark) .disabled ic-button > svg,\n:host(.light) .disabled ic-button > svg {\n  color: var(--splitter-color) !important;\n}\n","import {\n  Component,\n  Element,\n  h,\n  Host,\n  State,\n  Method,\n  Prop,\n} from \"@stencil/core\";\n\nimport LeftArrow from \"./assets/left-arrow.svg\";\nimport RightArrow from \"./assets/right-arrow.svg\";\nimport { getSlotElements } from \"../../utils/helpers\";\n\nimport { checkResizeObserver, elementOverflowsX } from \"../../utils/helpers\";\nimport { IcThemeForeground, IcThemeForegroundEnum } from \"../../utils/types\";\n\nconst SCROLL_DELAY_MS = 200;\n\n@Component({\n  tag: \"ic-horizontal-scroll\",\n  styleUrl: \"./ic-horizontal-scroll.css\",\n  shadow: true,\n})\nexport class HorizontalScroll {\n  private buttonStateSet: boolean = false;\n  private isScrolling: number;\n  private itemOffsets: number[];\n  private items: HTMLElement[];\n  private itemsContainerEl: HTMLElement;\n  private resizeObserver: ResizeObserver;\n  private scrollDelay: number;\n\n  @Element() el: HTMLIcHorizontalScrollElement;\n\n  @State() firstItemVisible: boolean = true;\n  @State() itemOverflow: boolean = false;\n  @State() lastItemVisible: boolean = false;\n\n  /**\n   * The appearance of the horizontal scroll, e.g. dark, light or the default.\n   */\n  @Prop() appearance?: IcThemeForeground = \"default\";\n\n  componentWillLoad(): void {\n    this.itemsContainerEl = this.el.children[0] as HTMLElement;\n    this.itemsContainerEl.addEventListener(\"scroll\", this.scrollHandler);\n\n    this.items = (getSlotElements(this.itemsContainerEl) ||\n      Array.from(this.itemsContainerEl.children)) as HTMLElement[];\n    this.items.forEach((item) => {\n      if (item.addEventListener) {\n        item.addEventListener(\"focus\", this.focusHandler);\n      }\n    });\n  }\n\n  componentDidLoad(): void {\n    let runningTotal = 0;\n    this.itemOffsets = this.items.map((item) => {\n      runningTotal += item.offsetWidth;\n      return runningTotal;\n    });\n\n    checkResizeObserver(this.runResizeObserver);\n\n    // Add event listener to scroll containers as mouse events are not fired on disabled elements (ic-button's <button>)\n    // 'mouseleave' needed in case the user moves their mouse while holding the arrow buttons\n    // - 'mouseup' otherwise not detected and scrolling not stopped\n    const scrollArrows = Array.from(\n      this.el.shadowRoot.querySelectorAll(\"div\")\n    ) as HTMLElement[];\n    [\"mouseup\", \"mouseleave\"].forEach((event) => {\n      scrollArrows.forEach((arrow) =>\n        arrow.addEventListener(event, this.arrowMouseUpHandler)\n      );\n    });\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== undefined) {\n      this.resizeObserver.disconnect();\n    }\n\n    const scrollArrows = Array.from(\n      this.el.shadowRoot.querySelectorAll(\"div\")\n    ) as HTMLElement[];\n    [\"mouseup\", \"mouseleave\"].forEach((event) => {\n      scrollArrows.forEach((arrow) =>\n        arrow.removeEventListener(event, this.arrowMouseUpHandler)\n      );\n    });\n\n    this.items.forEach((item) => {\n      if (item.removeEventListener) {\n        item.removeEventListener(\"focus\", this.focusHandler);\n      }\n    });\n\n    this.itemsContainerEl.removeEventListener(\"scroll\", this.scrollHandler);\n  }\n\n  /**\n   * @internal if side scrolling enabled, scrolls the specified item into view.\n   */\n  @Method()\n  async scrollItemIntoView(itemPosition: number): Promise<void> {\n    this.firstItemVisible = itemPosition <= 0;\n    const newScrollPos =\n      itemPosition <= 0 ? 0 : this.itemOffsets[itemPosition - 1];\n    this.lastItemVisible =\n      this.itemsContainerEl.offsetWidth + newScrollPos >=\n      this.itemsContainerEl.scrollWidth;\n    this.buttonStateSet = true;\n    this.itemsContainerEl.scrollLeft = newScrollPos;\n  }\n\n  private focusHandler = (event: FocusEvent) => {\n    this.itemFocusHandler(\n      Array.from(this.items).indexOf(event.target as HTMLElement)\n    );\n  };\n\n  private itemFocusHandler(itemPosition: number): void {\n    if (this.itemOverflow) {\n      this.scrollItemIntoView(itemPosition);\n    }\n  }\n\n  private resizeObserverCallback = () => {\n    if (this.el.clientWidth >= this.itemsContainerEl.scrollWidth) {\n      this.itemOverflow = false;\n    } else {\n      this.itemOverflow = elementOverflowsX(this.itemsContainerEl);\n    }\n\n    if (this.itemOverflow) {\n      this.lastItemVisible =\n        this.itemsContainerEl.offsetWidth + this.itemsContainerEl.scrollLeft >=\n        this.itemsContainerEl.scrollWidth;\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback();\n    });\n    this.resizeObserver.observe(this.itemsContainerEl);\n  };\n\n  private scrollLeft = () => {\n    this.scrollItemIntoView(this.getCurrentLeftItem() - 1);\n  };\n\n  private scrollRight = () => {\n    this.scrollItemIntoView(this.getCurrentLeftItem() + 1);\n  };\n\n  private longScrollRight = () => {\n    this.scrollRight();\n    this.scrollDelay = window.setTimeout(this.longScrollRight, SCROLL_DELAY_MS);\n  };\n\n  private longScrollLeft = () => {\n    this.scrollLeft();\n    this.scrollDelay = window.setTimeout(this.longScrollLeft, SCROLL_DELAY_MS);\n  };\n\n  private leftArrowMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    this.scrollDelay = window.setTimeout(this.longScrollLeft, SCROLL_DELAY_MS);\n  };\n\n  private rightArrowMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    this.scrollDelay = window.setTimeout(this.longScrollRight, SCROLL_DELAY_MS);\n  };\n\n  private arrowMouseUpHandler = () => {\n    window.clearTimeout(this.scrollDelay);\n  };\n\n  private getCurrentLeftItem = (): number => {\n    const index = this.itemOffsets.findIndex(\n      (el) => el > Math.round(this.itemsContainerEl.scrollLeft)\n    );\n    return index < 0 ? 0 : index;\n  };\n\n  private scrollHandler = () => {\n    window.clearTimeout(this.isScrolling);\n    // Set a timeout to run after scrolling ends\n    this.isScrolling = window.setTimeout(this.scrollStopped, 50);\n  };\n\n  private scrollStopped = () => {\n    // If scrollItemIntoView has been called, the button states will already be set\n    // Can't just handle it here as it causes strange jumping behaviour in positioning\n    const scrollLeft = Math.round(this.itemsContainerEl.scrollLeft);\n    if (this.buttonStateSet === false) {\n      this.firstItemVisible = scrollLeft === 0;\n      this.lastItemVisible =\n        this.itemsContainerEl.offsetWidth + scrollLeft >=\n        this.itemsContainerEl.scrollWidth;\n    }\n    this.buttonStateSet = false;\n  };\n\n  render() {\n    const { appearance, firstItemVisible, lastItemVisible, itemOverflow } =\n      this;\n\n    return (\n      <Host\n        class={{\n          [\"visible\"]: itemOverflow,\n          [\"dark\"]: this.appearance === IcThemeForegroundEnum.Dark,\n          [\"light\"]: this.appearance === IcThemeForegroundEnum.Light,\n        }}\n      >\n        <div\n          aria-hidden=\"true\"\n          class={{\n            [\"scroll-container-left\"]: true,\n            [\"hidden\"]: !itemOverflow,\n            [\"disabled\"]: firstItemVisible,\n          }}\n          role=\"tab\"\n        >\n          <ic-button\n            class=\"scroll-arrow\"\n            variant=\"icon\"\n            aria-label=\"Scroll left\"\n            appearance={appearance}\n            innerHTML={LeftArrow}\n            disabled={firstItemVisible}\n            tabindex=\"-1\"\n            onClick={this.scrollLeft}\n            onMouseDown={this.leftArrowMouseDownHandler}\n          ></ic-button>\n          <span class=\"scroll-splitter-left\"></span>\n        </div>\n        <slot></slot>\n        <div\n          aria-hidden=\"true\"\n          class={{\n            [\"scroll-container-right\"]: true,\n            [\"hidden\"]: !itemOverflow,\n            [\"disabled\"]: lastItemVisible,\n          }}\n          role=\"tab\"\n        >\n          <span class=\"scroll-splitter-right\"></span>\n          <ic-button\n            class=\"scroll-arrow\"\n            variant=\"icon\"\n            aria-label=\"Scroll right\"\n            appearance={appearance}\n            innerHTML={RightArrow}\n            disabled={lastItemVisible}\n            tabindex=\"-1\"\n            onClick={this.scrollRight}\n            onMouseDown={this.rightArrowMouseDownHandler}\n          ></ic-button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6jBAAA,MAAMA,EAAwB,44HCiB9B,MAAMC,EAAkB,I,MAOXC,EAAgB,M,yBACnBC,KAAAC,eAA0B,MA4F1BD,KAAAE,aAAgBC,IACtBH,KAAKI,iBACHC,MAAMC,KAAKN,KAAKO,OAAOC,QAAQL,EAAMM,QACtC,EASKT,KAAAU,uBAAyB,KAC/B,GAAIV,KAAKW,GAAGC,aAAeZ,KAAKa,iBAAiBC,YAAa,CAC5Dd,KAAKe,aAAe,K,KACf,CACLf,KAAKe,aAAeC,EAAkBhB,KAAKa,iB,CAG7C,GAAIb,KAAKe,aAAc,CACrBf,KAAKiB,gBACHjB,KAAKa,iBAAiBK,YAAclB,KAAKa,iBAAiBM,YAC1DnB,KAAKa,iBAAiBC,W,GAIpBd,KAAAoB,kBAAoB,KAC1BpB,KAAKqB,eAAiB,IAAIC,gBAAe,KACvCtB,KAAKU,wBAAwB,IAE/BV,KAAKqB,eAAeE,QAAQvB,KAAKa,iBAAiB,EAG5Cb,KAAAmB,WAAa,KACnBnB,KAAKwB,mBAAmBxB,KAAKyB,qBAAuB,EAAE,EAGhDzB,KAAA0B,YAAc,KACpB1B,KAAKwB,mBAAmBxB,KAAKyB,qBAAuB,EAAE,EAGhDzB,KAAA2B,gBAAkB,KACxB3B,KAAK0B,cACL1B,KAAK4B,YAAcC,OAAOC,WAAW9B,KAAK2B,gBAAiB7B,EAAgB,EAGrEE,KAAA+B,eAAiB,KACvB/B,KAAKmB,aACLnB,KAAK4B,YAAcC,OAAOC,WAAW9B,KAAK+B,eAAgBjC,EAAgB,EAGpEE,KAAAgC,0BAA6BC,IACnCA,EAAEC,iBACFlC,KAAK4B,YAAcC,OAAOC,WAAW9B,KAAK+B,eAAgBjC,EAAgB,EAGpEE,KAAAmC,2BAA8BF,IACpCA,EAAEC,iBACFlC,KAAK4B,YAAcC,OAAOC,WAAW9B,KAAK2B,gBAAiB7B,EAAgB,EAGrEE,KAAAoC,oBAAsB,KAC5BP,OAAOQ,aAAarC,KAAK4B,YAAY,EAG/B5B,KAAAyB,mBAAqB,KAC3B,MAAMa,EAAQtC,KAAKuC,YAAYC,WAC5B7B,GAAOA,EAAK8B,KAAKC,MAAM1C,KAAKa,iBAAiBM,cAEhD,OAAOmB,EAAQ,EAAI,EAAIA,CAAK,EAGtBtC,KAAA2C,cAAgB,KACtBd,OAAOQ,aAAarC,KAAK4C,aAEzB5C,KAAK4C,YAAcf,OAAOC,WAAW9B,KAAK6C,cAAe,GAAG,EAGtD7C,KAAA6C,cAAgB,KAGtB,MAAM1B,EAAasB,KAAKC,MAAM1C,KAAKa,iBAAiBM,YACpD,GAAInB,KAAKC,iBAAmB,MAAO,CACjCD,KAAK8C,iBAAmB3B,IAAe,EACvCnB,KAAKiB,gBACHjB,KAAKa,iBAAiBK,YAAcC,GACpCnB,KAAKa,iBAAiBC,W,CAE1Bd,KAAKC,eAAiB,KAAK,E,sBA1KQ,K,kBACJ,M,qBACG,M,gBAKK,S,CAEzC,iBAAA8C,GACE/C,KAAKa,iBAAmBb,KAAKW,GAAGqC,SAAS,GACzChD,KAAKa,iBAAiBoC,iBAAiB,SAAUjD,KAAK2C,eAEtD3C,KAAKO,MAAS2C,EAAgBlD,KAAKa,mBACjCR,MAAMC,KAAKN,KAAKa,iBAAiBmC,UACnChD,KAAKO,MAAM4C,SAASC,IAClB,GAAIA,EAAKH,iBAAkB,CACzBG,EAAKH,iBAAiB,QAASjD,KAAKE,a,KAK1C,gBAAAmD,GACE,IAAIC,EAAe,EACnBtD,KAAKuC,YAAcvC,KAAKO,MAAMgD,KAAKH,IACjCE,GAAgBF,EAAKlC,YACrB,OAAOoC,CAAY,IAGrBE,EAAoBxD,KAAKoB,mBAKzB,MAAMqC,EAAepD,MAAMC,KACzBN,KAAKW,GAAG+C,WAAWC,iBAAiB,QAEtC,CAAC,UAAW,cAAcR,SAAShD,IACjCsD,EAAaN,SAASS,GACpBA,EAAMX,iBAAiB9C,EAAOH,KAAKoC,sBACpC,G,CAIL,oBAAAyB,GACE,GAAI7D,KAAKqB,iBAAmByC,UAAW,CACrC9D,KAAKqB,eAAe0C,Y,CAGtB,MAAMN,EAAepD,MAAMC,KACzBN,KAAKW,GAAG+C,WAAWC,iBAAiB,QAEtC,CAAC,UAAW,cAAcR,SAAShD,IACjCsD,EAAaN,SAASS,GACpBA,EAAMI,oBAAoB7D,EAAOH,KAAKoC,sBACvC,IAGHpC,KAAKO,MAAM4C,SAASC,IAClB,GAAIA,EAAKY,oBAAqB,CAC5BZ,EAAKY,oBAAoB,QAAShE,KAAKE,a,KAI3CF,KAAKa,iBAAiBmD,oBAAoB,SAAUhE,KAAK2C,c,CAO3D,wBAAMnB,CAAmByC,GACvBjE,KAAK8C,iBAAmBmB,GAAgB,EACxC,MAAMC,EACJD,GAAgB,EAAI,EAAIjE,KAAKuC,YAAY0B,EAAe,GAC1DjE,KAAKiB,gBACHjB,KAAKa,iBAAiBK,YAAcgD,GACpClE,KAAKa,iBAAiBC,YACxBd,KAAKC,eAAiB,KACtBD,KAAKa,iBAAiBM,WAAa+C,C,CAS7B,gBAAA9D,CAAiB6D,GACvB,GAAIjE,KAAKe,aAAc,CACrBf,KAAKwB,mBAAmByC,E,EAmF5B,MAAAE,GACE,MAAMC,WAAEA,EAAUtB,iBAAEA,EAAgB7B,gBAAEA,EAAeF,aAAEA,GACrDf,KAEF,OACEqE,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,WAAYxD,EACb,CAAC,QAASf,KAAKoE,aAAeI,EAAsBC,KACpD,CAAC,SAAUzE,KAAKoE,aAAeI,EAAsBE,QAGvDL,EAAA,qBACc,OACZE,MAAO,CACL,CAAC,yBAA0B,KAC3B,CAAC,WAAYxD,EACb,CAAC,YAAa+B,GAEhB6B,KAAK,OAELN,EAAA,aACEE,MAAM,eACNK,QAAQ,OAAM,aACH,cACXR,WAAYA,EACZS,UAAWC,EACXC,SAAUjC,EACVkC,SAAS,KACTC,QAASjF,KAAKmB,WACd+D,YAAalF,KAAKgC,4BAEpBqC,EAAA,QAAME,MAAM,0BAEdF,EAAA,aACAA,EAAA,qBACc,OACZE,MAAO,CACL,CAAC,0BAA2B,KAC5B,CAAC,WAAYxD,EACb,CAAC,YAAaE,GAEhB0D,KAAK,OAELN,EAAA,QAAME,MAAM,0BACZF,EAAA,aACEE,MAAM,eACNK,QAAQ,OAAM,aACH,eACXR,WAAYA,EACZS,UAAWM,EACXJ,SAAU9D,EACV+D,SAAS,KACTC,QAASjF,KAAK0B,YACdwD,YAAalF,KAAKmC,8B"}

package/dist/core/p-831b0f3f.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as a,g as r}from"./p-18068237.js";import{c as s}from"./p-f074ef5b.js";import{V as n,i as o}from"./p-ebe76390.js";import{I as l}from"./p-613aa265.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}.container{min-height:3.5rem;border-radius:var(--ic-border-radius);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-status-unknown-light)}.container-info{background-color:var(--ic-status-info-light)}.container-warning{background-color:var(--ic-status-warning-light)}.container-error{background-color:var(--ic-status-error-light)}.container-success{background-color:var(--ic-status-success-light)}.alert-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}.divider-neutral{background-color:var(--ic-status-unknown)}.divider-info{background-color:var(--ic-status-info)}.divider-warning{background-color:var(--ic-status-warning)}.divider-error{background-color:var(--ic-status-error)}.divider-success{background-color:var(--ic-status-success)}.alert-icon{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}.alert-icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}.icon-neutral>svg{fill:var(--ic-status-unknown)}:host([variant="info"]) .alert-icon svg{fill:var(--ic-status-info)}:host([variant="warning"]) .alert-icon svg{fill:var(--ic-status-warning)}:host([variant="error"]) .alert-icon svg{fill:var(--ic-status-error)}:host([variant="success"]) .alert-icon svg{fill:var(--ic-status-success)}.alert-content{display:flex;align-items:center;margin-left:0.625rem;width:100%}.alert-message{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1}.alert-message-title-above{display:inline;font-size:0}.alert-title{margin-right:var(--ic-space-xs)}.alert-title-above{white-space:normal}.alert-action-container{margin-right:var(--ic-space-xs);display:flex;align-items:center}.dismiss-icon{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}.dismiss-icon:hover{cursor:pointer}@media (max-width: 628px){.alert-content{display:flex;flex-direction:column;align-items:flex-start}.alert-message{display:flex;flex-direction:column;align-items:flex-start}.alert-title{white-space:normal}.alert-action-container{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){.container{border:var(--ic-hc-border)}}';const d=class{constructor(i){e(this,i);this.dismiss=t(this,"dismiss",7);this.icDismiss=t(this,"icDismiss",7);this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.alertTitleWrap=false;this.visible=true;this.announced=true;this.dismissible=false;this.heading="";this.message=undefined;this.titleAbove=false;this.variant="neutral"}componentDidLoad(){this.alertTitleShouldWrap()}handleClick(){this.visible=!this.visible}alertTitleShouldWrap(){var e;const t=(e=this.el.shadowRoot.querySelector(".alert-title"))===null||e===void 0?void 0:e.clientHeight;if(t>24)this.alertTitleWrap=true}render(){const{variant:e,heading:t,message:r,titleAbove:c,dismissible:d,announced:u,visible:m}=this;return m&&i(a,{role:u&&"alert",class:{[l.Dark]:true}},i("div",{class:{["container"]:true,[`container-${e}`]:true}},i("div",{class:"alert-icon-container"},i("div",{class:{["divider"]:true,[`divider-${e}`]:true}}),i("span",{class:{["alert-icon"]:true,["svg-container"]:true,[`icon-${e}`]:true},innerHTML:n[e].icon})),i("div",{class:"alert-content"},i("div",{class:{["alert-message"]:true,["alert-message-title-above"]:c||this.alertTitleWrap}},t&&i("ic-typography",{class:{["alert-title"]:true,["alert-title-above"]:c||this.alertTitleWrap},variant:"subtitle-large"},i("p",null,t)),i("slot",{name:"message"},i("ic-typography",{variant:"body"},r))),o(this.el,"action")&&i("div",{class:"alert-action-container"},i("slot",{name:"action"}))),i("div",{class:"dismiss-icon-container"},d&&i("ic-button",{class:{["svg-container"]:true,["dismiss-icon"]:true},innerHTML:s,onClick:this.dismissAction,variant:"icon",appearance:l.Dark,title:"dismiss"}))))}get el(){return r(this)}};d.style=c;export{d as ic_alert};
+//# sourceMappingURL=p-831b0f3f.entry.js.map

package/dist/core/p-831b0f3f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icAlertCss","Alert","this","dismissAction","dismiss","emit","icDismiss","componentDidLoad","alertTitleShouldWrap","handleClick","visible","titleHeight","_a","el","shadowRoot","querySelector","clientHeight","alertTitleWrap","render","variant","heading","message","titleAbove","dismissible","announced","h","Host","role","class","IcThemeForegroundEnum","Dark","innerHTML","VARIANT_ICONS","icon","name","isSlotUsed","closeIcon","onClick","appearance","title"],"sources":["src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\n.container {\n  min-height: 3.5rem;\n  border-radius: var(--ic-border-radius);\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.container-neutral {\n  background-color: var(--ic-status-unknown-light);\n}\n\n.container-info {\n  background-color: var(--ic-status-info-light);\n}\n\n.container-warning {\n  background-color: var(--ic-status-warning-light);\n}\n\n.container-error {\n  background-color: var(--ic-status-error-light);\n}\n\n.container-success {\n  background-color: var(--ic-status-success-light);\n}\n\n.alert-icon-container {\n  height: 100%;\n  display: flex;\n  align-items: center;\n}\n\n.divider {\n  height: 100%;\n  width: var(--ic-space-xs);\n  border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n  position: absolute;\n}\n\n.divider-neutral {\n  background-color: var(--ic-status-unknown);\n}\n\n.divider-info {\n  background-color: var(--ic-status-info);\n}\n\n.divider-warning {\n  background-color: var(--ic-status-warning);\n}\n\n.divider-error {\n  background-color: var(--ic-status-error);\n}\n\n.divider-success {\n  background-color: var(--ic-status-success);\n}\n\n.alert-icon {\n  height: var(--ic-space-lg);\n  width: 1.375rem;\n  margin-left: 1.125rem;\n}\n\n.alert-icon > svg {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  display: inline-block;\n}\n\n.icon-neutral > svg {\n  fill: var(--ic-status-unknown);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n  fill: var(--ic-status-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n  fill: var(--ic-status-warning);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n  fill: var(--ic-status-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n  fill: var(--ic-status-success);\n}\n\n.alert-content {\n  display: flex;\n  align-items: center;\n  margin-left: 0.625rem;\n  width: 100%;\n}\n\n.alert-message {\n  display: flex;\n  align-items: center;\n  padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n  flex: 1;\n}\n\n.alert-message-title-above {\n  display: inline;\n  font-size: 0;\n}\n\n.alert-title {\n  margin-right: var(--ic-space-xs);\n}\n\n.alert-title-above {\n  white-space: normal;\n}\n\n.alert-action-container {\n  margin-right: var(--ic-space-xs);\n  display: flex;\n  align-items: center;\n}\n\n.dismiss-icon {\n  margin-right: var(--ic-space-xxxs);\n  margin-left: -0.375rem;\n  padding: 0.375rem;\n  border: none;\n  border-radius: 50%;\n  background-color: inherit;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.dismiss-icon:hover {\n  cursor: pointer;\n}\n\n@media (max-width: 628px) {\n  .alert-content {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-message {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-title {\n    white-space: normal;\n  }\n\n  .alert-action-container {\n    margin-bottom: var(--ic-space-xs);\n  }\n}\n\n@media (forced-colors: active) {\n  .container {\n    border: var(--ic-hc-border);\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  State,\n  Listen,\n  Prop,\n  h,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\nimport { IcThemeForegroundEnum, IcStatusVariants } from \"../../utils/types\";\nimport { VARIANT_ICONS } from \"../../utils/constants\";\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the right of the message.\n */\n@Component({\n  tag: \"ic-alert\",\n  styleUrl: \"ic-alert.css\",\n  shadow: true,\n})\nexport class Alert {\n  @Element() el: HTMLIcAlertElement;\n\n  @State() alertTitleWrap: boolean = false;\n  @State() visible: boolean = true;\n\n  /**\n   * If `true`, the alert will have the 'alert' ARIA role and will be announced to screen readers.\n   */\n  @Prop() announced?: boolean = true;\n\n  /**\n   * If `true`, the alert will have a close icon at the end to dismiss it.\n   */\n  @Prop() dismissible?: boolean = false;\n\n  /**\n   * The optional title to display at the start of the alert.\n   */\n  @Prop() heading?: string = \"\";\n\n  /**\n   * The main body message of the alert.\n   */\n  @Prop() message?: string;\n\n  /**\n   * If `true`, the title and message will appear above and below instead of inline.\n   */\n  @Prop() titleAbove?: boolean = false;\n\n  /**\n   * The variant of the alert which will be rendered.\n   */\n  @Prop() variant?: IcStatusVariants = \"neutral\";\n\n  /**\n   * @deprecated This event should not be used anymore. Use icDismiss instead.\n   */\n  @Event() dismiss: EventEmitter<void>;\n\n  /**\n   * Is emitted when the user dismisses the alert.\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  componentDidLoad(): void {\n    this.alertTitleShouldWrap();\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleClick(): void {\n    this.visible = !this.visible;\n  }\n\n  private dismissAction = (): void => {\n    this.dismiss.emit();\n    this.icDismiss.emit();\n  };\n\n  private alertTitleShouldWrap() {\n    const titleHeight =\n      this.el.shadowRoot.querySelector(\".alert-title\")?.clientHeight;\n    if (titleHeight > 24) this.alertTitleWrap = true;\n  }\n\n  render() {\n    const {\n      variant,\n      heading,\n      message,\n      titleAbove,\n      dismissible,\n      announced,\n      visible,\n    } = this;\n\n    return (\n      visible && (\n        <Host\n          role={announced && \"alert\"}\n          class={{\n            [IcThemeForegroundEnum.Dark]: true,\n          }}\n        >\n          <div\n            class={{\n              [\"container\"]: true,\n              [`container-${variant}`]: true,\n            }}\n          >\n            <div class=\"alert-icon-container\">\n              <div\n                class={{\n                  [\"divider\"]: true,\n                  [`divider-${variant}`]: true,\n                }}\n              ></div>\n              <span\n                class={{\n                  [\"alert-icon\"]: true,\n                  [\"svg-container\"]: true,\n                  [`icon-${variant}`]: true,\n                }}\n                innerHTML={VARIANT_ICONS[variant].icon}\n              ></span>\n            </div>\n            <div class=\"alert-content\">\n              <div\n                class={{\n                  [\"alert-message\"]: true,\n                  [\"alert-message-title-above\"]:\n                    titleAbove || this.alertTitleWrap,\n                }}\n              >\n                {heading && (\n                  <ic-typography\n                    class={{\n                      [\"alert-title\"]: true,\n                      [\"alert-title-above\"]: titleAbove || this.alertTitleWrap,\n                    }}\n                    variant=\"subtitle-large\"\n                  >\n                    <p>{heading}</p>\n                  </ic-typography>\n                )}\n                <slot name=\"message\">\n                  <ic-typography variant=\"body\">{message}</ic-typography>\n                </slot>\n              </div>\n              {isSlotUsed(this.el, \"action\") && (\n                <div class=\"alert-action-container\">\n                  <slot name=\"action\" />\n                </div>\n              )}\n            </div>\n            <div class=\"dismiss-icon-container\">\n              {dismissible && (\n                <ic-button\n                  class={{\n                    [\"svg-container\"]: true,\n                    [\"dismiss-icon\"]: true,\n                  }}\n                  innerHTML={closeIcon}\n                  onClick={this.dismissAction}\n                  variant=\"icon\"\n                  appearance={IcThemeForegroundEnum.Dark}\n                  title=\"dismiss\"\n                ></ic-button>\n              )}\n            </div>\n          </div>\n        </Host>\n      )\n    );\n  }\n}\n"],"mappings":"mLAAA,MAAMA,EAAa,stJ,MCyBNC,EAAK,M,+FAuDRC,KAAAC,cAAgB,KACtBD,KAAKE,QAAQC,OACbH,KAAKI,UAAUD,MAAM,E,oBAtDY,M,aACP,K,eAKE,K,iBAKE,M,aAKL,G,uCAUI,M,aAKM,S,CAYrC,gBAAAE,GACEL,KAAKM,sB,CAIP,WAAAC,GACEP,KAAKQ,SAAWR,KAAKQ,O,CAQf,oBAAAF,G,MACN,MAAMG,GACJC,EAAAV,KAAKW,GAAGC,WAAWC,cAAc,mBAAe,MAAAH,SAAA,SAAAA,EAAEI,aACpD,GAAIL,EAAc,GAAIT,KAAKe,eAAiB,I,CAG9C,MAAAC,GACE,MAAMC,QACJA,EAAOC,QACPA,EAAOC,QACPA,EAAOC,WACPA,EAAUC,YACVA,EAAWC,UACXA,EAASd,QACTA,GACER,KAEJ,OACEQ,GACEe,EAACC,EAAI,CACHC,KAAMH,GAAa,QACnBI,MAAO,CACL,CAACC,EAAsBC,MAAO,OAGhCL,EAAA,OACEG,MAAO,CACL,CAAC,aAAc,KACf,CAAC,aAAaT,KAAY,OAG5BM,EAAA,OAAKG,MAAM,wBACTH,EAAA,OACEG,MAAO,CACL,CAAC,WAAY,KACb,CAAC,WAAWT,KAAY,QAG5BM,EAAA,QACEG,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,iBAAkB,KACnB,CAAC,QAAQT,KAAY,MAEvBY,UAAWC,EAAcb,GAASc,QAGtCR,EAAA,OAAKG,MAAM,iBACTH,EAAA,OACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,6BACCN,GAAcpB,KAAKe,iBAGtBG,GACCK,EAAA,iBACEG,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,qBAAsBN,GAAcpB,KAAKe,gBAE5CE,QAAQ,kBAERM,EAAA,SAAIL,IAGRK,EAAA,QAAMS,KAAK,WACTT,EAAA,iBAAeN,QAAQ,QAAQE,KAGlCc,EAAWjC,KAAKW,GAAI,WACnBY,EAAA,OAAKG,MAAM,0BACTH,EAAA,QAAMS,KAAK,aAIjBT,EAAA,OAAKG,MAAM,0BACRL,GACCE,EAAA,aACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,gBAAiB,MAEpBG,UAAWK,EACXC,QAASnC,KAAKC,cACdgB,QAAQ,OACRmB,WAAYT,EAAsBC,KAClCS,MAAM,c"}

package/dist/core/{p-2ae7687a.entry.js → p-83e535de.entry.js}

@@ -1,2 +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
+import{r as t,c as e,h as s,H as a,g as n}from"./p-18068237.js";import{I as i}from"./p-613aa265.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:n}=this;return s(a,{class:{["ic-tab-panel-light"]:n===i.Light},role:"tabpanel",hidden:t!==undefined&&e!==undefined?!(t===e):true},s("div",null,s("slot",null)))}get host(){return n(this)}};d.style=c;export{d as ic_tab_panel};
+//# sourceMappingURL=p-83e535de.entry.js.map

package/dist/core/p-83e535de.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,6EA2B9C,iBAAAC,GACEC,KAAKC,gBAAgBC,KAAKF,KAAKG,K,CAGjC,oBAAAC,GACE,MAAMC,EAAaC,SAASC,cAC1B,6BAA6BP,KAAKQ,cAEpC,GAAIH,EAAY,CACdA,EAAWI,mB,EAIf,MAAAC,GACE,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-441e7d98.entry.js → p-85dd5e5b.entry.js}

@@ -1,2 +1,2 @@
-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
+import{r as e,h as t,H as i}from"./p-18068237.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-85dd5e5b.entry.js.map

package/dist/core/p-85dd5e5b.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,CAEzB,MAAAC,GACE,MAAMC,eAAEA,EAAcC,OAAEA,EAAMC,QAAEA,EAAOC,KAAEA,EAAIC,oBAAEA,GAAwBC,KAEvE,OACEC,EAACC,EAAI,CAACC,MAAO,CAAE,CAAC,UAAWP,IACzBK,EAAA,uBACa,qBACXE,MAAO,CACL,CAAC,yBAA0B,KAC3B,CAAC,GAAGR,KAAmBA,IAGxBA,IAAmB,UAClBM,EAAA,QAAME,MAAM,aAAW,0CACmB,KAExC,KACJF,EAAA,iBAAeG,QAAQ,qBACpBT,IAAmB,UAChBN,EAAmBM,GACnB,GAAGG,EAAO,QAAU,uBACnBD,IAAY,GAAKA,EAAU,uBAC3BR,EAAmBM,uBACnBI,IAAwB,GAAKA,EAAsB,O"}