@ukic/web-components 2.1.0-beta.0 → 2.1.0-beta.1

package/dist/esm/ic-footer.entry.js.map

@@ -1 +1 @@
-{"file":"ic-footer.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-footer/ic-footer.css?tag=ic-footer&encapsulation=shadow","./src/components/ic-footer/ic-footer.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: block;\n}\n\n:host(.footer-sparse) {\n  --footer-links-padding: 24px 0;\n  --footer-compliance-padding: 24px 0 8px 0;\n  --footer-logo-margin-bottom: var(--ic-space-lg);\n  --footer-link-inner-flex-direction: row;\n}\n\n:host(.footer-small) {\n  --footer-links-padding: 0 0;\n  --footer-compliance-padding: 16px 0 8px;\n  --footer-logo-margin-bottom: var(--ic-space-md);\n  --footer-link-inner-flex-direction: column;\n}\n\n:host(.footer-light) {\n  --footer-theme-secondary: var(--ic-theme-secondary);\n  --footer-theme-tertiary: var(--ic-theme-tertiary);\n  --footer-keyline: var(--ic-keyline-lighten);\n}\n\n:host(.footer-dark) {\n  --footer-theme-secondary: var(--ic-theme-secondary-light);\n  --footer-theme-tertiary: var(--ic-theme-tertiary-light);\n  --footer-keyline: var(--ic-keyline-darken);\n}\n\n:host(.footer-small.footer-ungrouped) {\n  --footer-links-padding: var(--ic-space-md) 0 0 0;\n}\n\n/* Main inner footer element */\nfooter {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n/* Description */\n\n.footer-description {\n  background-color: var(--footer-theme-secondary);\n  color: var(--ic-theme-text);\n  border-bottom: var(--footer-keyline);\n}\n\n.footer-description-inner {\n  padding: 16px 0;\n}\n\n/* Links */\n\n.footer-links {\n  padding: var(--footer-links-padding);\n  background-color: var(--footer-theme-secondary);\n  color: var(--ic-theme-text);\n}\n\n.footer-links-inner {\n  display: flex;\n  flex-direction: var(--footer-link-inner-flex-direction);\n}\n\n/* Compliance */\n\n.footer-compliance {\n  background-color: var(--footer-theme-tertiary);\n  color: var(--ic-theme-text);\n}\n\n.footer-compliance-inner {\n  padding: var(--footer-compliance-padding);\n}\n\n.footer-logo {\n  margin-bottom: var(--footer-logo-margin-bottom);\n  display: flex;\n  gap: var(--ic-space-xxl);\n}\n\n.footer-logo > ::slotted() {\n  margin-right: var(--ic-space-md);\n}\n\n.footer-caption {\n  margin-bottom: var(--ic-space-md);\n}\n\n.classification-spacing {\n  margin-bottom: var(--ic-space-lg);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Prop,\n  State,\n  h,\n  Host,\n  Listen,\n} from \"@stencil/core\";\nimport { IC_DEVICE_SIZES } from \"../../utils/constants\";\nimport {\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  checkResizeObserver,\n  hasClassificationBanner,\n} from \"../../utils/helpers\";\nimport {\n  IcAlignment,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcFooterBreakpoints } from \"./ic-footer.types\";\n\n/**\n * @slot description - Content will be rendered at the top of the footer\n * @slot link - Content will be rendered between description and logos\n * @slot logo - Content will be rendered underneath footer links\n * @slot caption - Content will be rendered above Crown Copyright\n */\n\n@Component({\n  tag: \"ic-footer\",\n  styleUrl: \"ic-footer.css\",\n  shadow: true,\n})\nexport class Footer {\n  @Element() el: HTMLIcFooterElement;\n\n  /**\n   * Triggers on page resize and triggers style changes in footer links and link groups\n   */\n  @Event() icFooterResized: EventEmitter<void>;\n\n  /**\n   * The description displayed at the top of the footer\n   */\n  @Prop() description: string;\n\n  /**\n   * Sets the aligned parameter for the section containers used within the footer\n   */\n  @Prop() aligned?: IcAlignment = \"left\";\n\n  /**\n   * Sets the screen size breakpoint at which to switch to the small layout\n   */\n  @Prop() breakpoint?: IcFooterBreakpoints = \"medium\";\n\n  /**\n   * Sets the footer up to handle link groups instead of standalone links\n   */\n  @Prop() groupLinks?: boolean = false;\n\n  /**\n   * The caption displayed at the bottom of the footer\n   */\n  @Prop() caption: string;\n\n  /**\n   * Whether the footer displays the crown copyright at the bottom\n   */\n  @Prop() copyright: boolean = true;\n\n  @State() deviceSize: number = IC_DEVICE_SIZES.XL;\n\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n  private isSmall() {\n    const bp = this.breakpoint;\n\n    return bp === \"extra small\"\n      ? this.deviceSize < IC_DEVICE_SIZES.XS\n      : bp === \"small\"\n      ? this.deviceSize < IC_DEVICE_SIZES.S\n      : bp === \"medium\"\n      ? this.deviceSize < IC_DEVICE_SIZES.M\n      : bp === \"large\"\n      ? this.deviceSize < IC_DEVICE_SIZES.L\n      : bp === \"extra large\"\n      ? this.deviceSize < IC_DEVICE_SIZES.XL\n      : false;\n  }\n\n  @Listen(\"icThemeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  private resizeObserver: ResizeObserver;\n  private footerEl: HTMLElement;\n\n  private resizeObserverCallback = (currSize: number) => {\n    if (currSize !== this.deviceSize) {\n      this.deviceSize = currSize;\n    }\n    this.icFooterResized.emit();\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      const currSize = getCurrentDeviceSize();\n      this.resizeObserverCallback(currSize);\n    });\n\n    this.resizeObserver.observe(this.footerEl);\n  };\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n  }\n\n  disconnectedCallback(): void {\n    this.resizeObserver.disconnect();\n  }\n\n  render() {\n    const {\n      aligned,\n      caption,\n      copyright,\n      description,\n      groupLinks,\n      foregroundColor,\n    } = this;\n    const small = this.isSmall();\n\n    return (\n      <Host\n        class={{\n          footer: true,\n          [`footer-${small ? \"small\" : \"sparse\"}`]: true,\n          [`footer-${groupLinks ? \"grouped\" : \"ungrouped\"}`]: true,\n          [`footer-${foregroundColor}`]: true,\n          // Slots will be able to infer their own color\n          [IcThemeForegroundEnum.Dark]:\n            foregroundColor === IcThemeForegroundEnum.Dark,\n          [IcThemeForegroundEnum.Light]:\n            foregroundColor === IcThemeForegroundEnum.Light,\n        }}\n      >\n        <footer ref={(footerEl) => (this.footerEl = footerEl)}>\n          {/* Description */}\n          <div class=\"footer-description\">\n            <ic-section-container aligned={aligned} fullHeight={true}>\n              <div class=\"footer-description-inner\">\n                <ic-typography variant=\"body\">\n                  <slot name=\"description\">{description}</slot>\n                </ic-typography>\n              </div>\n            </ic-section-container>\n          </div>\n\n          {/* Links */}\n          <div class=\"footer-links\">\n            {groupLinks && small ? (\n              <div class=\"footer-links-inner\">\n                <slot name=\"link\" />\n              </div>\n            ) : (\n              <ic-section-container fullHeight aligned={aligned}>\n                <div class=\"footer-links-inner\">\n                  <slot name=\"link\" />\n                </div>\n              </ic-section-container>\n            )}\n          </div>\n\n          {/* Compliance (logo, caption, copyright) */}\n          <div class=\"footer-compliance\">\n            <ic-section-container aligned={aligned} fullHeight={true}>\n              <div class=\"footer-compliance-inner\">\n                <div class=\"footer-logo\">\n                  {/* Logo */}\n                  <slot name=\"logo\" />\n                </div>\n                <div class=\"footer-caption\">\n                  <ic-typography\n                    variant={\n                      this.deviceSize <= IC_DEVICE_SIZES.M ? \"caption\" : \"body\"\n                    }\n                  >\n                    <slot name=\"caption\">{caption}</slot>\n                  </ic-typography>\n                </div>\n                {copyright && (\n                  <div\n                    class={{\n                      [\"footer-copyright\"]: true,\n                      [\"classification-spacing\"]: hasClassificationBanner(),\n                    }}\n                  >\n                    <ic-typography\n                      variant={\n                        this.deviceSize <= IC_DEVICE_SIZES.M\n                          ? \"caption-uppercase\"\n                          : \"label-uppercase\"\n                      }\n                    >\n                      &copy; Crown Copyright\n                    </ic-typography>\n                  </div>\n                )}\n              </div>\n            </ic-section-container>\n          </div>\n        </footer>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-footer.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-footer/ic-footer.css?tag=ic-footer&encapsulation=shadow","./src/components/ic-footer/ic-footer.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: block;\n}\n\n:host(.footer-sparse) {\n  --footer-links-padding: 24px 0;\n  --footer-compliance-padding: 24px 0 8px 0;\n  --footer-logo-margin-bottom: var(--ic-space-lg);\n  --footer-link-inner-flex-direction: row;\n}\n\n:host(.footer-small) {\n  --footer-links-padding: 0 0;\n  --footer-compliance-padding: 16px 0 8px;\n  --footer-logo-margin-bottom: var(--ic-space-md);\n  --footer-link-inner-flex-direction: column;\n}\n\n:host(.footer-light) {\n  --footer-theme-secondary: var(--ic-theme-secondary);\n  --footer-theme-tertiary: var(--ic-theme-tertiary);\n  --footer-keyline: var(--ic-keyline-lighten);\n}\n\n:host(.footer-dark) {\n  --footer-theme-secondary: var(--ic-theme-secondary-light);\n  --footer-theme-tertiary: var(--ic-theme-tertiary-light);\n  --footer-keyline: var(--ic-keyline-darken);\n}\n\n:host(.footer-small.footer-ungrouped) {\n  --footer-links-padding: var(--ic-space-md) 0 0 0;\n}\n\n/* Main inner footer element */\nfooter {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n/* Description */\n\n.footer-description {\n  background-color: var(--footer-theme-secondary);\n  color: var(--ic-theme-text);\n  border-bottom: var(--footer-keyline);\n}\n\n.footer-description-inner {\n  padding: 16px 0;\n}\n\n/* Links */\n\n.footer-links {\n  padding: var(--footer-links-padding);\n  background-color: var(--footer-theme-secondary);\n  color: var(--ic-theme-text);\n}\n\n.footer-links-inner {\n  display: flex;\n  flex-direction: var(--footer-link-inner-flex-direction);\n}\n\n/* Compliance */\n\n.footer-compliance {\n  background-color: var(--footer-theme-tertiary);\n  color: var(--ic-theme-text);\n}\n\n.footer-compliance-inner {\n  padding: var(--footer-compliance-padding);\n}\n\n.footer-logo {\n  margin-bottom: var(--footer-logo-margin-bottom);\n  display: flex;\n  gap: var(--ic-space-xxl);\n}\n\n.footer-logo > ::slotted() {\n  margin-right: var(--ic-space-md);\n}\n\n.footer-caption {\n  margin-bottom: var(--ic-space-md);\n}\n\n.classification-spacing {\n  margin-bottom: var(--ic-space-lg);\n}\n\n@media (forced-colors: active) {\n  footer {\n    border-top: var(--ic-hc-border);\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Prop,\n  State,\n  h,\n  Host,\n  Listen,\n} from \"@stencil/core\";\nimport { IC_DEVICE_SIZES } from \"../../utils/constants\";\nimport {\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  checkResizeObserver,\n  hasClassificationBanner,\n} from \"../../utils/helpers\";\nimport {\n  IcAlignment,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcFooterBreakpoints } from \"./ic-footer.types\";\n\n/**\n * @slot description - Content will be rendered at the top of the footer\n * @slot link - Content will be rendered between description and logos\n * @slot logo - Content will be rendered underneath footer links\n * @slot caption - Content will be rendered above Crown Copyright\n */\n\n@Component({\n  tag: \"ic-footer\",\n  styleUrl: \"ic-footer.css\",\n  shadow: true,\n})\nexport class Footer {\n  @Element() el: HTMLIcFooterElement;\n\n  /**\n   * Triggers on page resize and triggers style changes in footer links and link groups\n   */\n  @Event() icFooterResized: EventEmitter<void>;\n\n  /**\n   * The description displayed at the top of the footer\n   */\n  @Prop() description: string;\n\n  /**\n   * Sets the aligned parameter for the section containers used within the footer\n   */\n  @Prop() aligned?: IcAlignment = \"left\";\n\n  /**\n   * Sets the screen size breakpoint at which to switch to the small layout\n   */\n  @Prop() breakpoint?: IcFooterBreakpoints = \"medium\";\n\n  /**\n   * Sets the footer up to handle link groups instead of standalone links\n   */\n  @Prop() groupLinks?: boolean = false;\n\n  /**\n   * The caption displayed at the bottom of the footer\n   */\n  @Prop() caption: string;\n\n  /**\n   * Whether the footer displays the crown copyright at the bottom\n   */\n  @Prop() copyright: boolean = true;\n\n  @State() deviceSize: number = IC_DEVICE_SIZES.XL;\n\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n  private isSmall() {\n    const bp = this.breakpoint;\n\n    return bp === \"extra small\"\n      ? this.deviceSize < IC_DEVICE_SIZES.XS\n      : bp === \"small\"\n      ? this.deviceSize < IC_DEVICE_SIZES.S\n      : bp === \"medium\"\n      ? this.deviceSize < IC_DEVICE_SIZES.M\n      : bp === \"large\"\n      ? this.deviceSize < IC_DEVICE_SIZES.L\n      : bp === \"extra large\"\n      ? this.deviceSize < IC_DEVICE_SIZES.XL\n      : false;\n  }\n\n  @Listen(\"icThemeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  private resizeObserver: ResizeObserver;\n  private footerEl: HTMLElement;\n\n  private resizeObserverCallback = (currSize: number) => {\n    if (currSize !== this.deviceSize) {\n      this.deviceSize = currSize;\n    }\n    this.icFooterResized.emit();\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      const currSize = getCurrentDeviceSize();\n      this.resizeObserverCallback(currSize);\n    });\n\n    this.resizeObserver.observe(this.footerEl);\n  };\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n  }\n\n  disconnectedCallback(): void {\n    this.resizeObserver.disconnect();\n  }\n\n  render() {\n    const {\n      aligned,\n      caption,\n      copyright,\n      description,\n      groupLinks,\n      foregroundColor,\n    } = this;\n    const small = this.isSmall();\n\n    return (\n      <Host\n        class={{\n          footer: true,\n          [`footer-${small ? \"small\" : \"sparse\"}`]: true,\n          [`footer-${groupLinks ? \"grouped\" : \"ungrouped\"}`]: true,\n          [`footer-${foregroundColor}`]: true,\n          // Slots will be able to infer their own color\n          [IcThemeForegroundEnum.Dark]:\n            foregroundColor === IcThemeForegroundEnum.Dark,\n          [IcThemeForegroundEnum.Light]:\n            foregroundColor === IcThemeForegroundEnum.Light,\n        }}\n      >\n        <footer ref={(footerEl) => (this.footerEl = footerEl)}>\n          {/* Description */}\n          <div class=\"footer-description\">\n            <ic-section-container aligned={aligned} fullHeight={true}>\n              <div class=\"footer-description-inner\">\n                <ic-typography variant=\"body\">\n                  <slot name=\"description\">{description}</slot>\n                </ic-typography>\n              </div>\n            </ic-section-container>\n          </div>\n\n          {/* Links */}\n          <div class=\"footer-links\">\n            {groupLinks && small ? (\n              <div class=\"footer-links-inner\">\n                <slot name=\"link\" />\n              </div>\n            ) : (\n              <ic-section-container fullHeight aligned={aligned}>\n                <div class=\"footer-links-inner\">\n                  <slot name=\"link\" />\n                </div>\n              </ic-section-container>\n            )}\n          </div>\n\n          {/* Compliance (logo, caption, copyright) */}\n          <div class=\"footer-compliance\">\n            <ic-section-container aligned={aligned} fullHeight={true}>\n              <div class=\"footer-compliance-inner\">\n                <div class=\"footer-logo\">\n                  {/* Logo */}\n                  <slot name=\"logo\" />\n                </div>\n                <div class=\"footer-caption\">\n                  <ic-typography\n                    variant={\n                      this.deviceSize <= IC_DEVICE_SIZES.M ? \"caption\" : \"body\"\n                    }\n                  >\n                    <slot name=\"caption\">{caption}</slot>\n                  </ic-typography>\n                </div>\n                {copyright && (\n                  <div\n                    class={{\n                      [\"footer-copyright\"]: true,\n                      [\"classification-spacing\"]: hasClassificationBanner(),\n                    }}\n                  >\n                    <ic-typography\n                      variant={\n                        this.deviceSize <= IC_DEVICE_SIZES.M\n                          ? \"caption-uppercase\"\n                          : \"label-uppercase\"\n                      }\n                    >\n                      &copy; Crown Copyright\n                    </ic-typography>\n                  </div>\n                )}\n              </div>\n            </ic-section-container>\n          </div>\n        </footer>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/ic-hero.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
 import { I as IcThemeForegroundEnum } from './types-dd515332.js';
-import { j as getThemeForegroundColor, s as slotHasContent, a as onComponentRequiredPropUndefined } from './helpers-e090fe7e.js';
+import { k as getThemeForegroundColor, s as slotHasContent, a as onComponentRequiredPropUndefined } from './helpers-3d41833c.js';
 
 const icHeroCss = "/*! 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;background-color:var(--ic-theme-tertiary);color:var(--ic-theme-text);--hero-heading-bottom-margin:var(--ic-space-md)}:host(.dark){background-color:var(--ic-theme-secondary)}:host(.has-background-image){background-repeat:no-repeat;background-position:right -100px;background-size:auto calc(100% + 100px);box-shadow:var(--ic-elevation-inset)}@media (prefers-reduced-motion){:host(.has-background-image){background-position:right -100px !important}}ic-typography.heading-bottom-spacing{margin-bottom:var(--hero-heading-bottom-margin)}.section-container{display:flex;align-items:center;height:100%}.left-container{padding:var(--ic-space-xl) 0}.left-container:not(.left-container-full-width){flex-basis:50%}.left-container-full-width{width:100%}.right-container{flex-basis:50%}.interaction-container{display:flex;gap:var(--ic-space-md);margin-top:var(--ic-space-lg)}.secondary-container{display:flex;flex-direction:column;justify-content:center;border-left:var(--ic-space-xxxs) solid var(--ic-theme-text)}.secondary-subheading{margin-top:var(--ic-space-xxs)}:host([content-aligned=\"left\"]) .left-container,:host([content-aligned=\"left\"]) .interaction-container{justify-content:flex-start;text-align:left}:host([content-aligned=\"center\"]) .left-container,:host([content-aligned=\"center\"]) .interaction-container{justify-content:center;text-align:center}@media (min-width: 992px){.left-container-full-width{width:66.6%}}@media (min-width: 1044px){:host,.section-container{min-height:208px}:host([small]),:host([small]) .section-container{min-height:173px}.left-container:not(.left-container-full-width){flex-basis:66.6%}.left-container{min-height:144px}.right-container{flex-basis:33.3%;margin-left:50px}.secondary-container{min-height:144px}.secondary-heading,.secondary-subheading{margin-left:63px}}@media (min-width: 801px) and (max-width: 1043px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:256px}:host([small]),:host([small]) .section-container{min-height:240px}:host([secondary-heading]),:host([secondary-heading]) .section-container{min-height:224px}.left-container{min-height:160px}.secondary-container{min-height:160px}.secondary-heading,.secondary-subheading{margin-left:94.75px}.right-container{margin-left:50px}}@media (min-width: 641px) and (max-width: 800px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:256px}:host([small]),:host([small]) .section-container{min-height:240px}:host([secondary-heading]),:host([secondary-heading]) .section-container{min-height:224px}.left-container{min-height:160px}.secondary-container{min-height:160px}.secondary-heading,.secondary-subheading{margin-left:34px}.right-container{margin-left:50px}}@media (min-width: 481px) and (max-width: 640px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:208px}:host([small]),:host([small]) .section-container{min-height:173px}:host([secondary-heading]),:host([secondary-heading]) .section-container{min-height:280px}:host([secondary-heading]) .section-container,:host([small]) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}.right-container{margin-bottom:40px}}@media (max-width: 480px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:192px}:host([small]),:host([small]) .section-container{min-height:173px}:host([secondary-heading]),:host([secondary-heading]) .section-container{min-height:264px}:host([secondary-heading]) .section-container,:host([small]) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}}";
 

package/dist/esm/ic-input-component-container_3.entry.js

@@ -1,11 +1,11 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-1500de1f.js';
 import { a as IcInformationStatus } from './types-dd515332.js';
 import { s as successIcon } from './success-icon-2f71b115.js';
-import { i as isSlotUsed, a as onComponentRequiredPropUndefined } from './helpers-e090fe7e.js';
+import { i as isSlotUsed, a as onComponentRequiredPropUndefined } from './helpers-3d41833c.js';
 import { C as Check } from './check-icon-53f1d9e5.js';
 import { c as createPopper } from './popper-f860750c.js';
 
-const icInputComponentContainerCss = "ic-input-component-container{display:flex;border:1px solid var(--border-color, var(--ic-architectural-400));border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-slow);height:40px;width:var(--input-width, 320px);padding:1px;background-color:var(--ic-architectural-white);box-sizing:border-box;position:relative;fill:var(--ic-architectural-400)}ic-input-component-container.fullwidth{width:100%}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:1px dashed var(--ic-architectural-200)}ic-input-component-container.readonly,ic-input-component-container.readonly:hover{border:none;padding:0}ic-input-component-container.error{border:var(--ic-space-xxxs) solid var(--ic-status-error);padding:0}ic-input-component-container.warning{border:var(--ic-space-xxxs) solid var(--ic-status-warning-mid);padding:0}ic-input-component-container.success{border:var(--ic-space-xxxs) solid var(--ic-status-success);padding:0}ic-input-component-container.small{height:var(--ic-space-xl)}ic-input-component-container.multiline{height:auto}ic-input-component-container .icon-container{margin-top:var(--ic-space-xxs);margin-left:7px;display:flex;align-items:center}ic-input-component-container.multiline .icon-container,ic-input-component-container.multiline.small .icon-container{margin-top:6px;display:block}ic-input-component-container.readonly .icon-container{margin-left:-5px}ic-input-component-container.disabled ::-moz-placeholder{display:none}ic-input-component-container.disabled ::placeholder{display:none}ic-input-component-container .inline-success{margin:var(--ic-space-xs) 6px;display:flex;align-items:center}ic-input-component-container.dark:hover{--border-color:var(--ic-architectural-400)}ic-input-component-container .inline-success>svg{fill:var(--ic-status-success)}ic-input-component-container:hover{border-color:var(--ic-action-dark-hover);color:var(--ic-action-dark-hover);--expand-icon-hover:var(--ic-action-dark-hover)}.focus-indicator{display:flex;width:100%;margin:-2px;padding:2px;border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast)}.focus-indicator:focus-within,.focus-indicator-enabled{box-shadow:var(--ic-border-focus)}.focus-indicator.dark:focus-within{box-shadow:var(--ic-border-focus)}.focus-indicator:focus-within input,.focus-indicator:focus-within textarea{outline:var(--ic-hc-focus-outline)}";
+const icInputComponentContainerCss = "ic-input-component-container{display:flex;border:1px solid var(--border-color, var(--ic-architectural-400));border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-slow);height:40px;width:var(--input-width, 320px);padding:1px;background-color:var(--ic-architectural-white);box-sizing:border-box;position:relative;fill:var(--ic-architectural-400);outline:none}ic-input-component-container.fullwidth{width:100%}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:1px dashed var(--ic-architectural-200)}ic-input-component-container.readonly,ic-input-component-container.readonly:hover{border:none;padding:0}ic-input-component-container.error{border:var(--ic-space-xxxs) solid var(--ic-status-error);padding:0}ic-input-component-container.warning{border:var(--ic-space-xxxs) solid var(--ic-status-warning-mid);padding:0}ic-input-component-container.success{border:var(--ic-space-xxxs) solid var(--ic-status-success);padding:0}ic-input-component-container.small{height:var(--ic-space-xl)}ic-input-component-container.multiline{height:auto}ic-input-component-container .icon-container{margin-top:var(--ic-space-xxs);margin-left:7px;display:flex;align-items:center}ic-input-component-container.multiline .icon-container,ic-input-component-container.multiline.small .icon-container{margin-top:6px;display:block}ic-input-component-container.readonly .icon-container{margin-left:-5px}ic-input-component-container.disabled ::-moz-placeholder{display:none}ic-input-component-container.disabled ::placeholder{display:none}ic-input-component-container .inline-success{margin:var(--ic-space-xs) 6px;display:flex;align-items:center}ic-input-component-container.dark:hover{--border-color:var(--ic-architectural-400)}ic-input-component-container .inline-success>svg{fill:var(--ic-status-success)}ic-input-component-container:hover{border-color:var(--ic-action-dark-hover);color:var(--ic-action-dark-hover);--expand-icon-hover:var(--ic-action-dark-hover)}.focus-indicator{display:flex;width:100%;margin:-2px;padding:2px;border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast)}.focus-indicator:focus-within,.focus-indicator-enabled{box-shadow:var(--ic-border-focus)}.focus-indicator.dark:focus-within{box-shadow:var(--ic-border-focus)}@media (forced-colors: active){ic-input-component-container,.focus-indicator{transition:none}ic-input-component-container:focus-within{border:1px solid Highlight;outline:2px solid Highlight}ic-input-component-container.disabled,ic-input-component-container.disabled:hover{border:1px dashed GrayText}}";
 
 const InputComponentContainer = class {
   constructor(hostRef) {
@@ -64,7 +64,7 @@ const InputContainer = class {
 };
 InputContainer.style = icInputContainerCss;
 
-const icMenuCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host([open]) .menu{transition:max-height var(--ic-transition-duration-slow)}}:host{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 320px);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-popup-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}:host(:not(.no-focus):focus-within){box-shadow:var(--ic-border-focus)}.menu{text-decoration:none;list-style-type:none;border:1px solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll{overflow-y:auto}.menu:focus-visible{outline:none}:host([open]){max-height:none;display:block}:host([open]) .menu{visibility:visible;max-height:322px}:host(.full-width){width:100%}.option{padding:8px 7px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}:host([small]) .option{padding:4px 7px}.option:last-child{border-radius:0 0 1px 1px}.option:first-child{border-radius:1px 1px 0 0}.option:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option:focus-visible{outline:var(--ic-hc-focus-outline)}.option:not(.disabled-option) .option-description{color:var(--ic-color-secondary-text)}.option-text-container{pointer-events:none}.check-icon{height:24px;margin-left:8px;pointer-events:none}.focused-option .check-icon *{fill:white}.option-group-title{padding:24px 7px 8px;color:var(--ic-color-tertiary-text)}:host([small]) .option-group-title{padding:12px 7px 4px}.last-recommended-option{border-bottom:1px solid var(--ic-architectural-400)}.disabled-option{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option,.focused-option .option-description{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}:host(.no-results) li{cursor:no-drop}:host(.no-results) li:hover{background-color:transparent}";
+const icMenuCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host([open]) .menu{transition:max-height var(--ic-transition-duration-slow)}}:host{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 320px);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-popup-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}:host(:not(.no-focus):focus-within){box-shadow:var(--ic-border-focus)}.menu{text-decoration:none;list-style-type:none;border:1px solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll{overflow-y:auto}.menu:focus-visible{outline:none}:host([open]){max-height:none;display:block}:host([open]) .menu{visibility:visible;max-height:322px}:host(.full-width){width:100%}.option{padding:8px 7px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}:host([small]) .option{padding:4px 7px}.option:last-child{border-radius:0 0 1px 1px}.option:first-child{border-radius:1px 1px 0 0}.option:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option:focus-visible{outline:var(--ic-hc-focus-outline)}.option:not(.disabled-option) .option-description{color:var(--ic-color-secondary-text)}.option-text-container{pointer-events:none}.check-icon{height:24px;margin-left:8px;pointer-events:none}.focused-option .check-icon *{fill:currentColor}.option-group-title{padding:24px 7px 8px;color:var(--ic-color-tertiary-text)}:host([small]) .option-group-title{padding:12px 7px 4px}.last-recommended-option{border-bottom:1px solid var(--ic-architectural-400)}.disabled-option{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option,.focused-option .option-description{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}:host(.no-results) li{cursor:no-drop}:host(.no-results) li:hover{background-color:transparent}@media (forced-colors: active){.focused-option:focus{outline:none;border:2px solid transparent}}";
 
 const Menu = class {
   constructor(hostRef) {

package/dist/esm/ic-input-component-container_3.entry.js.map

@@ -1 +1 @@
-{"file":"ic-input-component-container.ic-input-container.ic-menu.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-input-component-container/ic-input-component-container.css?tag=ic-input-component-container","./src/components/ic-input-component-container/ic-input-component-container.tsx","./src/components/ic-input-container/ic-input-container.css?tag=ic-input-container","./src/components/ic-input-container/ic-input-container.tsx","./src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=shadow","./src/components/ic-menu/ic-menu.tsx"],"sourcesContent":["ic-input-component-container {\n  /**\n   * @prop --border-color: Border colour of the input component container\n   */\n\n  display: flex;\n  border: 1px solid var(--border-color, var(--ic-architectural-400));\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-slow);\n  height: 40px;\n  width: var(--input-width, 320px);\n  padding: 1px;\n  background-color: var(--ic-architectural-white);\n  box-sizing: border-box;\n  position: relative;\n  fill: var(--ic-architectural-400);\n}\n\nic-input-component-container.fullwidth {\n  width: 100%;\n}\n\nic-input-component-container.disabled,\nic-input-component-container.disabled:hover {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\nic-input-component-container.readonly,\nic-input-component-container.readonly:hover {\n  border: none;\n  padding: 0;\n}\n\nic-input-component-container.error {\n  border: var(--ic-space-xxxs) solid var(--ic-status-error);\n  padding: 0;\n}\n\nic-input-component-container.warning {\n  border: var(--ic-space-xxxs) solid var(--ic-status-warning-mid);\n  padding: 0;\n}\n\nic-input-component-container.success {\n  border: var(--ic-space-xxxs) solid var(--ic-status-success);\n  padding: 0;\n}\n\nic-input-component-container.small {\n  height: var(--ic-space-xl);\n}\n\nic-input-component-container.multiline {\n  height: auto;\n}\n\nic-input-component-container .icon-container {\n  margin-top: var(--ic-space-xxs);\n  margin-left: 7px;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.multiline .icon-container,\nic-input-component-container.multiline.small .icon-container {\n  margin-top: 6px;\n  display: block;\n}\n\nic-input-component-container.readonly .icon-container {\n  margin-left: -5px;\n}\n\nic-input-component-container.disabled ::placeholder {\n  display: none;\n}\n\nic-input-component-container .inline-success {\n  margin: var(--ic-space-xs) 6px;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.dark:hover {\n  --border-color: var(--ic-architectural-400);\n}\n\nic-input-component-container .inline-success > svg {\n  fill: var(--ic-status-success);\n}\n\nic-input-component-container:hover {\n  border-color: var(--ic-action-dark-hover);\n  color: var(--ic-action-dark-hover);\n\n  --expand-icon-hover: var(--ic-action-dark-hover);\n}\n\n.focus-indicator {\n  display: flex;\n  width: 100%;\n  margin: -2px;\n  padding: 2px;\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-fast);\n}\n\n.focus-indicator:focus-within,\n.focus-indicator-enabled {\n  box-shadow: var(--ic-border-focus);\n}\n\n.focus-indicator.dark:focus-within {\n  box-shadow: var(--ic-border-focus);\n}\n\n.focus-indicator:focus-within input,\n.focus-indicator:focus-within textarea {\n  outline: var(--ic-hc-focus-outline);\n}","import { Component, Element, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot left-icon - Content will be placed to the left of the input.\n */\n@Component({\n  tag: \"ic-input-component-container\",\n  styleUrl: \"ic-input-component-container.css\",\n})\nexport class InputComponentContainer {\n  /**\n   * disabled\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * readonly\n   */\n  @Prop() readonly: boolean = false;\n  /**\n   * validationStatus\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n  /**\n   * small\n   */\n  @Prop() small: boolean = false;\n  /**\n   * multiLine\n   */\n  @Prop() multiLine: boolean = false;\n  /**\n   * validationInline\n   */\n  @Prop() validationInline: boolean = false;\n\n  /**\n   * Determines whether the dark variant of the input-component-container focus indicator should be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   *  If true then fill width of container\n   */\n  @Prop() fullWidth: boolean = false;\n\n  @Element() host: HTMLIcInputComponentContainerElement;\n\n  render() {\n    const {\n      small,\n      validationStatus,\n      disabled,\n      readonly,\n      multiLine,\n      fullWidth,\n      dark,\n      validationInline,\n    } = this;\n    const hasValidationStatus =\n      this.validationStatus !== \"\" && !this.disabled && !this.readonly\n        ? true\n        : false;\n    return (\n      <Host\n        class={{\n          [\"small\"]: small,\n          [validationStatus]: hasValidationStatus,\n          [\"disabled\"]: disabled,\n          [\"readonly\"]: readonly,\n          [\"multiline\"]: multiLine,\n          [\"fullwidth\"]: fullWidth,\n          [\"dark\"]: dark,\n        }}\n      >\n        <div\n          class={{\n            \"focus-indicator\": true,\n            dark: dark,\n          }}\n        >\n          {isSlotUsed(this.host, \"left-icon\") && (\n            <div\n              class={{\n                [\"icon-container\"]: true,\n              }}\n            >\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          <slot></slot>\n\n          {validationInline &&\n            validationStatus === IcInformationStatus.Success && (\n              <span\n                class={{\n                  [\"inline-success\"]: true,\n                }}\n                innerHTML={successIcon}\n              />\n            )}\n        </div>\n      </Host>\n    );\n  }\n}\n","ic-input-container .component-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"ic-input-container\",\n  styleUrl: \"ic-input-container.css\",\n})\nexport class InputContainer {\n  /**\n   * disabled\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * readonly\n   */\n  @Prop() readonly?: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            [\"component-container\"]: true,\n            [\"disabled\"]: this.disabled,\n            [\"readonly\"]: this.readonly,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalise.css\";\n\n@media (prefers-reduced-motion: no-preference) {\n  :host([open]) .menu {\n    transition: max-height var(--ic-transition-duration-slow);\n  }\n}\n\n:host {\n  border-radius: var(--ic-border-radius);\n  max-height: 0;\n  width: var(--input-width, 320px);\n  color: var(--ic-color-primary-text);\n  background-color: var(--ic-architectural-white);\n  position: relative;\n  z-index: var(--ic-z-index-popup-menu);\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.menu {\n  text-decoration: none;\n  list-style-type: none;\n  border: 1px solid var(--ic-architectural-400);\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  visibility: hidden;\n  max-height: 0;\n  overflow-y: hidden;\n}\n\n.menu-scroll {\n  overflow-y: auto;\n}\n\n.menu:focus-visible {\n  outline: none;\n}\n\n:host([open]) {\n  max-height: none;\n  display: block;\n}\n\n:host([open]) .menu {\n  visibility: visible;\n  max-height: 322px;\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\n.option {\n  padding: 8px 7px;\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n:host([small]) .option {\n  padding: 4px 7px;\n}\n\n.option:last-child {\n  border-radius: 0 0 1px 1px;\n}\n\n.option:first-child {\n  border-radius: 1px 1px 0 0;\n}\n\n.option:not(.disabled-option):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.option-text-container {\n  pointer-events: none;\n}\n\n.check-icon {\n  height: 24px;\n  margin-left: 8px;\n  pointer-events: none;\n}\n\n.focused-option .check-icon * {\n  fill: white;\n}\n\n.option-group-title {\n  padding: 24px 7px 8px;\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([small]) .option-group-title {\n  padding: 12px 7px 4px;\n}\n\n.last-recommended-option {\n  border-bottom: 1px solid var(--ic-architectural-400);\n}\n\n.disabled-option {\n  color: var(--ic-architectural-200);\n  cursor: default;\n  pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n  background-color: var(--ic-focus-blue) !important;\n  color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n  cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n  background-color: transparent;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Method,\n  Listen,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport { IcActivationTypes, IcMenuOption } from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n  IcOptionSelectEventDetail,\n  IcMenuChangeEventDetail,\n  IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\n\n@Component({\n  tag: \"ic-menu\",\n  styleUrl: \"ic-menu.css\",\n  shadow: true,\n})\nexport class Menu {\n  @Element() host: HTMLIcMenuElement;\n\n  /**\n   * Specify whether the menu is open.\n   */\n  @Prop({ reflect: true }) open!: boolean;\n\n  /**\n   * Provide the possible selection options.\n   */\n  @Prop() options!: IcMenuOption[];\n\n  /**\n   * Specify whether small styling is to be applied to the element.\n   */\n  @Prop({ reflect: true }) small?: boolean = false;\n\n  /**\n   * Id of the menu.\n   */\n  @Prop() menuId!: string;\n\n  /**\n   * The value of the currently selected option.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * Reference to the input element.\n   */\n  @Prop() inputEl!: HTMLElement;\n\n  /**\n   * @internal - set if ic-menu is nested inside another component\n   */\n  @Prop() parentEl?: HTMLElement;\n\n  /**\n   * Label for the input element.\n   */\n  @Prop() inputLabel!: string;\n\n  /**\n   * Reference to an anchor element the menu will position itself from when rendered.\n   */\n  @Prop() anchorEl!: HTMLElement;\n\n  /**\n   *  If true then fill width of container\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * @internal If true, autofocus on selected item when menu is open\n   */\n  @Prop() autoFocusOnSelected: boolean = true;\n\n  @State() keyboardNav: boolean = false;\n  @State() optionHighlighted: string;\n  @State() focusFromSearchKeypress: boolean = false;\n  @State() initialOptionsListRender: boolean = false;\n  @State() preventIncorrectTabOrder: boolean = false;\n\n  @Watch(\"options\")\n  watchOptionsHandler(): void {\n    this.ungroupedOptions = [];\n    this.loadUngroupedOptions();\n  }\n\n  /**\n   * Emitted when an option is selected.\n   */\n  @Event() optionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * Emitted when state of menu changes (i.e. open or close).\n   */\n  @Event() menuChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n  /**\n   * Emitted when an option has been highlighted\n   */\n  @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n  @Listen(\"icClear\", { target: \"document\" })\n  handleClearListener(): void {\n    this.optionHighlighted = \"\";\n  }\n\n  @Listen(\"icSubmitSearch\", { target: \"document\" })\n  handleSubmitSearch(): void {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.setInputValue(highlightedOptionIndex);\n  }\n\n  private menu: HTMLUListElement;\n  private ungroupedOptions: IcMenuOption[] = [];\n  private popperInstance: PopperInstance;\n\n  // Prevents menu re-opening immediately after it is closed on blur when clicking input\n  private preventClickOpen: boolean = false;\n\n  private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n    if (!open) this.popperInstance.destroy();\n    this.menuChange.emit({ open, focusInput });\n\n    if (!open && focusInput !== false) {\n      this.inputEl.focus();\n      this.preventClickOpen = false;\n    }\n  };\n\n  private setNextOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex + 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex + 1].value\n        ),\n      });\n    } else {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[0].value,\n        optionId: this.getOptionId(this.ungroupedOptions[0].value),\n      });\n    }\n  };\n\n  private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex - 1].value\n        ),\n      });\n    } else {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[this.ungroupedOptions.length - 1].value\n        ),\n      });\n    }\n  };\n\n  /**\n   * If menu is opened with the mouse, emit menuChange custom event.\n   */\n  @Method()\n  async handleClickOpen(): Promise<void> {\n    if (!this.preventClickOpen) {\n      this.menuChange.emit({ open: !this.open });\n      this.keyboardNav = false;\n    }\n    this.preventClickOpen = false;\n  }\n\n  /**\n   * Used alongside activationType\n   * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n   * @param {KeyboardEvent} event - keyboard event\n   */\n  @Method()\n  async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n    this.keyboardNav = false;\n\n    if (this.activationType === \"automatic\") {\n      this.autoSetInputValueKeyboardOpen(event);\n    } else {\n      this.keyboardNav = true;\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  }\n\n  /**\n   * @internal Used to highlight the first option in the menu.\n   */\n  @Method()\n  async handleSetFirstOption(): Promise<void> {\n    this.setHighlightedOption(0);\n  }\n\n  private arrowBehaviour = (event: KeyboardEvent): void => {\n    event.preventDefault();\n    this.handleMenuChange(true);\n  };\n\n  private setHighlightedOption = (highlightedIndex: number): void => {\n    this.optionHighlighted = this.options[highlightedIndex].value || undefined;\n  };\n\n  private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl?.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setNextOptionValue(selectedOptionIndex);\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setPreviousOptionValue(selectedOptionIndex);\n        break;\n      case \" \":\n      case \"Enter\":\n        if ((event.target as HTMLElement).id !== \"clear-button\") {\n          this.handleMenuChange(true);\n        }\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.menuOptionId.emit({ optionId: undefined });\n\n    const getOptionId = (index: number): string =>\n      Array.from(this.host.shadowRoot.querySelectorAll(\"li\"))[index].id;\n\n    const isSearchBar = this.parentEl.tagName === \"IC-SEARCH-BAR\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.arrowBehaviour(event);\n        if (highlightedOptionIndex < this.options.length - 1) {\n          this.setHighlightedOption(highlightedOptionIndex + 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex + 1),\n          });\n        } else {\n          this.setHighlightedOption(0);\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"ArrowUp\":\n        this.arrowBehaviour(event);\n        if (\n          highlightedOptionIndex <= 0 ||\n          highlightedOptionIndex > this.options.length + 1\n        ) {\n          this.setHighlightedOption(this.options.length - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(this.options.length - 1),\n          });\n        } else {\n          this.setHighlightedOption(highlightedOptionIndex - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex - 1),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \" \":\n      case \"Enter\":\n        event.preventDefault();\n        this.setInputValue(highlightedOptionIndex);\n        break;\n      case \"Escape\":\n        this.handleMenuChange(false);\n        this.menuOptionId.emit({ optionId: undefined });\n        break;\n      case \"Shift\":\n      case \"Tab\":\n        this.preventIncorrectTabOrder = true;\n        break;\n      case \"Backspace\":\n        if (isSearchBar) {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n      default:\n        if (isSearchBar && event.key !== \"Tab\") {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n    }\n  };\n\n  private setInputValue = (highlightedOptionIndex: number) => {\n    if (this.options[highlightedOptionIndex]) {\n      this.optionSelect.emit({\n        value: this.options[highlightedOptionIndex]?.value,\n      });\n      this.optionHighlighted = undefined;\n      this.menuOptionId.emit({ optionId: undefined });\n    }\n    this.handleMenuChange(false);\n  };\n\n  private handleOptionClick = (event: Event): void => {\n    const { value, label } = (event.target as HTMLLIElement).dataset;\n    this.optionSelect.emit({ value, label });\n    this.handleMenuChange(false);\n  };\n\n  private handleBlur = (event: FocusEvent): void => {\n    if (event.relatedTarget !== this.inputEl) {\n      if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n        this.handleMenuChange(false, false);\n      }\n    } else {\n      this.handleMenuChange(false);\n      this.preventClickOpen = true;\n    }\n  };\n\n  private handleMenuKeyDown = (event: KeyboardEvent) => {\n    if (this.activationType === \"automatic\") {\n      this.autoSetValueOnMenuKeyDown(event);\n    }\n  };\n\n  private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n    event.cancelBubble = true;\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        this.setPreviousOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"ArrowDown\":\n        event.preventDefault();\n        this.setNextOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"Home\":\n        this.optionSelect.emit({\n          value: this.ungroupedOptions[0].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"End\":\n        this.optionSelect.emit({\n          value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \" \":\n      case \"Enter\":\n      case \"Escape\":\n        this.handleMenuChange(false);\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      case \"Shift\":\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private handleMenuKeyUp = (event: KeyboardEvent): void => {\n    if (event.key === \"Tab\" && event.shiftKey) {\n      this.preventClickOpen = false;\n    }\n  };\n\n  private getOptionId = (value: string): string => {\n    return `${this.menuId}-${value}`;\n  };\n\n  private getOptionAriaLabel = (\n    option: IcMenuOption,\n    parentOption: IcMenuOption\n  ): string => {\n    let ariaLabel = option.label;\n\n    if (option.description) {\n      ariaLabel = `${ariaLabel}, ${option.description}`;\n    }\n\n    if (parentOption) {\n      return `${ariaLabel}, ${parentOption.label} group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    return options.sort((optionA, optionB) =>\n      optionA.recommended && !optionB.recommended ? -1 : 0\n    );\n  };\n\n  private isManualMode = this.activationType === \"manual\";\n\n  private scrollToSelected = (menu: HTMLUListElement) => {\n    const selectedOption = menu.querySelector(\n      \".option[aria-selected]\"\n    ) as HTMLElement;\n\n    if (selectedOption) {\n      const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n      if (\n        elTop > menu.scrollTop + menu.offsetHeight ||\n        elTop < menu.scrollTop + menu.offsetHeight\n      ) {\n        menu.scrollTop = selectedOption.offsetTop;\n      }\n      selectedOption.focus();\n    }\n  };\n\n  private loadUngroupedOptions = () => {\n    if (this.options.length > 0) {\n      this.options.map((option) => {\n        if (option.children) {\n          option.children.map(\n            (option) => !option.disabled && this.ungroupedOptions.push(option)\n          );\n        } else if (!option.disabled) {\n          this.ungroupedOptions.push(option);\n        }\n      });\n    }\n    this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n  };\n\n  connectedCallback(): void {\n    if (this.parentEl?.tagName === \"IC-SEARCH-BAR\") {\n      this.setHighlightedOption(0);\n      this.initialOptionsListRender = true;\n    }\n  }\n\n  componentWillLoad(): void {\n    this.loadUngroupedOptions();\n  }\n\n  componentDidLoad(): void {\n    let optionsHeight = 0;\n    this.host.shadowRoot\n      .querySelectorAll(\".option\")\n      .forEach((option) => (optionsHeight += option.clientHeight));\n    if (optionsHeight > 320) {\n      this.menu.classList.add(\"menu-scroll\");\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.open, propName: \"open\" },\n        { prop: this.options, propName: \"options\" },\n        { prop: this.menuId, propName: \"menu-id\" },\n        { prop: this.inputLabel, propName: \"input-label\" },\n        //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n      ],\n      \"Menu\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.open) {\n      this.popperInstance = createPopper(this.anchorEl, this.host, {\n        placement: \"bottom\",\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 7],\n            },\n          },\n          {\n            name: \"flip\",\n            options: {\n              fallbackPlacements: [\"top\"],\n              rootBoundary: \"viewport\",\n            },\n          },\n        ],\n      });\n    }\n  }\n\n  componentDidUpdate(): void {\n    const inputValueInOptions: boolean = this.options.some(\n      (option) => option.value === this.value\n    );\n\n    const optionHighlightedIsSet =\n      this.optionHighlighted !== null &&\n      this.optionHighlighted !== undefined &&\n      this.optionHighlighted !== \"\";\n\n    if (this.open && this.options.length !== 0) {\n      if (\n        this.value &&\n        this.keyboardNav &&\n        inputValueInOptions &&\n        this.autoFocusOnSelected\n      ) {\n        this.scrollToSelected(this.menu);\n      } else if (\n        this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n        this.inputEl.tagName !== \"INPUT\"\n      ) {\n        this.menu.focus();\n      } else if (\n        optionHighlightedIsSet &&\n        !this.focusFromSearchKeypress &&\n        !this.preventIncorrectTabOrder\n      ) {\n        const highlightedEl = this.host.shadowRoot.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement;\n\n        if (highlightedEl) {\n          highlightedEl.focus();\n        }\n      }\n    }\n  }\n\n  private displayOption = (\n    option: IcMenuOption,\n    index?: number,\n    parentOption?: IcMenuOption\n  ): HTMLLIElement => {\n    const { open, value } = this;\n\n    return (\n      <li\n        id={this.getOptionId(option.value)}\n        class={{\n          option: true,\n          \"focused-option\": this.isManualMode\n            ? (this.keyboardNav || this.initialOptionsListRender) &&\n              option.value === this.optionHighlighted\n            : this.keyboardNav && option.value === value,\n          \"last-recommended-option\":\n            option.recommended &&\n            this.options[index + 1] &&\n            !this.options[index + 1].recommended,\n          \"disabled-option\": option.disabled,\n        }}\n        role=\"option\"\n        tabindex={\n          open &&\n          (option.value === value || option.value === this.optionHighlighted) &&\n          this.keyboardNav\n            ? \"0\"\n            : \"-1\"\n        }\n        aria-label={this.getOptionAriaLabel(option, parentOption)}\n        aria-selected={option.value === value}\n        aria-disabled={option.disabled ? \"true\" : \"false\"}\n        onClick={this.handleOptionClick}\n        onBlur={this.handleBlur}\n        onMouseDown={(event) => event.preventDefault()}\n        data-value={option.value}\n        data-label={option.label}\n      >\n        <div class=\"option-text-container\">\n          <ic-typography variant=\"body\" aria-hidden=\"true\">\n            <p>{option.label}</p>\n          </ic-typography>\n          {option.description && (\n            <ic-typography\n              id={`${this.getOptionId(option.value)}-description`}\n              class=\"option-description\"\n              variant=\"caption\"\n              aria-hidden=\"true\"\n            >\n              <p>{option.description}</p>\n            </ic-typography>\n          )}\n        </div>\n        {option.value === value &&\n          this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n            <span class=\"check-icon\" innerHTML={Check} />\n          )}\n      </li>\n    );\n  };\n\n  render() {\n    const { inputLabel, options, menuId, value, fullWidth } = this;\n\n    return (\n      <Host\n        class={{\n          \"full-width\": fullWidth,\n          \"no-focus\": this.inputEl?.tagName === \"INPUT\",\n        }}\n      >\n        {options.length !== 0 && (\n          <ul\n            id={menuId}\n            class=\"menu\"\n            role=\"listbox\"\n            aria-label={inputLabel}\n            aria-activedescendant={\n              value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n            }\n            tabindex={\n              open && !this.keyboardNav && this.inputEl?.tagName !== \"INPUT\"\n                ? \"0\"\n                : \"-1\"\n            }\n            ref={(el) => (this.menu = el)}\n            onKeyDown={this.handleMenuKeyDown}\n            onKeyUp={this.handleMenuKeyUp}\n            onBlur={this.handleBlur}\n          >\n            {this.getSortedOptions(options).map((option, index) => {\n              if (option.children) {\n                if (option.children.length > 0) {\n                  return (\n                    <div>\n                      <ic-typography\n                        class=\"option-group-title\"\n                        role=\"presentation\"\n                        variant=\"subtitle-small\"\n                      >\n                        <p>{option.label}</p>\n                      </ic-typography>\n                      {option.children.map((childOption) =>\n                        this.displayOption(childOption, index, option)\n                      )}\n                    </div>\n                  );\n                } else {\n                  return null;\n                }\n              } else {\n                return this.displayOption(option, index);\n              }\n            })}\n          </ul>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-input-component-container.ic-input-container.ic-menu.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-input-component-container/ic-input-component-container.css?tag=ic-input-component-container","./src/components/ic-input-component-container/ic-input-component-container.tsx","./src/components/ic-input-container/ic-input-container.css?tag=ic-input-container","./src/components/ic-input-container/ic-input-container.tsx","./src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=shadow","./src/components/ic-menu/ic-menu.tsx"],"sourcesContent":["ic-input-component-container {\n  /**\n   * @prop --border-color: Border colour of the input component container\n   */\n\n  display: flex;\n  border: 1px solid var(--border-color, var(--ic-architectural-400));\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-slow);\n  height: 40px;\n  width: var(--input-width, 320px);\n  padding: 1px;\n  background-color: var(--ic-architectural-white);\n  box-sizing: border-box;\n  position: relative;\n  fill: var(--ic-architectural-400);\n  outline: none;\n}\n\nic-input-component-container.fullwidth {\n  width: 100%;\n}\n\nic-input-component-container.disabled,\nic-input-component-container.disabled:hover {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\nic-input-component-container.readonly,\nic-input-component-container.readonly:hover {\n  border: none;\n  padding: 0;\n}\n\nic-input-component-container.error {\n  border: var(--ic-space-xxxs) solid var(--ic-status-error);\n  padding: 0;\n}\n\nic-input-component-container.warning {\n  border: var(--ic-space-xxxs) solid var(--ic-status-warning-mid);\n  padding: 0;\n}\n\nic-input-component-container.success {\n  border: var(--ic-space-xxxs) solid var(--ic-status-success);\n  padding: 0;\n}\n\nic-input-component-container.small {\n  height: var(--ic-space-xl);\n}\n\nic-input-component-container.multiline {\n  height: auto;\n}\n\nic-input-component-container .icon-container {\n  margin-top: var(--ic-space-xxs);\n  margin-left: 7px;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.multiline .icon-container,\nic-input-component-container.multiline.small .icon-container {\n  margin-top: 6px;\n  display: block;\n}\n\nic-input-component-container.readonly .icon-container {\n  margin-left: -5px;\n}\n\nic-input-component-container.disabled ::placeholder {\n  display: none;\n}\n\nic-input-component-container .inline-success {\n  margin: var(--ic-space-xs) 6px;\n  display: flex;\n  align-items: center;\n}\n\nic-input-component-container.dark:hover {\n  --border-color: var(--ic-architectural-400);\n}\n\nic-input-component-container .inline-success > svg {\n  fill: var(--ic-status-success);\n}\n\nic-input-component-container:hover {\n  border-color: var(--ic-action-dark-hover);\n  color: var(--ic-action-dark-hover);\n\n  --expand-icon-hover: var(--ic-action-dark-hover);\n}\n\n.focus-indicator {\n  display: flex;\n  width: 100%;\n  margin: -2px;\n  padding: 2px;\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-easing-transition-fast);\n}\n\n.focus-indicator:focus-within,\n.focus-indicator-enabled {\n  box-shadow: var(--ic-border-focus);\n}\n\n.focus-indicator.dark:focus-within {\n  box-shadow: var(--ic-border-focus);\n}\n\n@media (forced-colors: active) {\n  /* Styles here only apply to Forced Colors Mode */\n  ic-input-component-container,\n  .focus-indicator {\n    transition: none;\n  }\n\n  ic-input-component-container:focus-within {\n    border: 1px solid Highlight;\n    outline: 2px solid Highlight;\n  }\n\n  ic-input-component-container.disabled,\n  ic-input-component-container.disabled:hover {\n    border: 1px dashed GrayText;\n  }\n}\n","import { Component, Element, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot left-icon - Content will be placed to the left of the input.\n */\n@Component({\n  tag: \"ic-input-component-container\",\n  styleUrl: \"ic-input-component-container.css\",\n})\nexport class InputComponentContainer {\n  /**\n   * disabled\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * readonly\n   */\n  @Prop() readonly: boolean = false;\n  /**\n   * validationStatus\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n  /**\n   * small\n   */\n  @Prop() small: boolean = false;\n  /**\n   * multiLine\n   */\n  @Prop() multiLine: boolean = false;\n  /**\n   * validationInline\n   */\n  @Prop() validationInline: boolean = false;\n\n  /**\n   * Determines whether the dark variant of the input-component-container focus indicator should be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   *  If true then fill width of container\n   */\n  @Prop() fullWidth: boolean = false;\n\n  @Element() host: HTMLIcInputComponentContainerElement;\n\n  render() {\n    const {\n      small,\n      validationStatus,\n      disabled,\n      readonly,\n      multiLine,\n      fullWidth,\n      dark,\n      validationInline,\n    } = this;\n    const hasValidationStatus =\n      this.validationStatus !== \"\" && !this.disabled && !this.readonly\n        ? true\n        : false;\n    return (\n      <Host\n        class={{\n          [\"small\"]: small,\n          [validationStatus]: hasValidationStatus,\n          [\"disabled\"]: disabled,\n          [\"readonly\"]: readonly,\n          [\"multiline\"]: multiLine,\n          [\"fullwidth\"]: fullWidth,\n          [\"dark\"]: dark,\n        }}\n      >\n        <div\n          class={{\n            \"focus-indicator\": true,\n            dark: dark,\n          }}\n        >\n          {isSlotUsed(this.host, \"left-icon\") && (\n            <div\n              class={{\n                [\"icon-container\"]: true,\n              }}\n            >\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          <slot></slot>\n\n          {validationInline &&\n            validationStatus === IcInformationStatus.Success && (\n              <span\n                class={{\n                  [\"inline-success\"]: true,\n                }}\n                innerHTML={successIcon}\n              />\n            )}\n        </div>\n      </Host>\n    );\n  }\n}\n","ic-input-container .component-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"ic-input-container\",\n  styleUrl: \"ic-input-container.css\",\n})\nexport class InputContainer {\n  /**\n   * disabled\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * readonly\n   */\n  @Prop() readonly?: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            [\"component-container\"]: true,\n            [\"disabled\"]: this.disabled,\n            [\"readonly\"]: this.readonly,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"../../global/normalise.css\";\n\n@media (prefers-reduced-motion: no-preference) {\n  :host([open]) .menu {\n    transition: max-height var(--ic-transition-duration-slow);\n  }\n}\n\n:host {\n  border-radius: var(--ic-border-radius);\n  max-height: 0;\n  width: var(--input-width, 320px);\n  color: var(--ic-color-primary-text);\n  background-color: var(--ic-architectural-white);\n  position: relative;\n  z-index: var(--ic-z-index-popup-menu);\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.menu {\n  text-decoration: none;\n  list-style-type: none;\n  border: 1px solid var(--ic-architectural-400);\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  visibility: hidden;\n  max-height: 0;\n  overflow-y: hidden;\n}\n\n.menu-scroll {\n  overflow-y: auto;\n}\n\n.menu:focus-visible {\n  outline: none;\n}\n\n:host([open]) {\n  max-height: none;\n  display: block;\n}\n\n:host([open]) .menu {\n  visibility: visible;\n  max-height: 322px;\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\n.option {\n  padding: 8px 7px;\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n:host([small]) .option {\n  padding: 4px 7px;\n}\n\n.option:last-child {\n  border-radius: 0 0 1px 1px;\n}\n\n.option:first-child {\n  border-radius: 1px 1px 0 0;\n}\n\n.option:not(.disabled-option):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.option-text-container {\n  pointer-events: none;\n}\n\n.check-icon {\n  height: 24px;\n  margin-left: 8px;\n  pointer-events: none;\n}\n\n.focused-option .check-icon * {\n  fill: currentColor;\n}\n\n.option-group-title {\n  padding: 24px 7px 8px;\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([small]) .option-group-title {\n  padding: 12px 7px 4px;\n}\n\n.last-recommended-option {\n  border-bottom: 1px solid var(--ic-architectural-400);\n}\n\n.disabled-option {\n  color: var(--ic-architectural-200);\n  cursor: default;\n  pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n  background-color: var(--ic-focus-blue) !important;\n  color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n  cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n  background-color: transparent;\n}\n\n@media (forced-colors: active) {\n  .focused-option:focus {\n    outline: none;\n    border: 2px solid transparent;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Method,\n  Listen,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport { IcActivationTypes, IcMenuOption } from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n  IcOptionSelectEventDetail,\n  IcMenuChangeEventDetail,\n  IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\n\n@Component({\n  tag: \"ic-menu\",\n  styleUrl: \"ic-menu.css\",\n  shadow: true,\n})\nexport class Menu {\n  @Element() host: HTMLIcMenuElement;\n\n  /**\n   * Specify whether the menu is open.\n   */\n  @Prop({ reflect: true }) open!: boolean;\n\n  /**\n   * Provide the possible selection options.\n   */\n  @Prop() options!: IcMenuOption[];\n\n  /**\n   * Specify whether small styling is to be applied to the element.\n   */\n  @Prop({ reflect: true }) small?: boolean = false;\n\n  /**\n   * Id of the menu.\n   */\n  @Prop() menuId!: string;\n\n  /**\n   * The value of the currently selected option.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * Reference to the input element.\n   */\n  @Prop() inputEl!: HTMLElement;\n\n  /**\n   * @internal - set if ic-menu is nested inside another component\n   */\n  @Prop() parentEl?: HTMLElement;\n\n  /**\n   * Label for the input element.\n   */\n  @Prop() inputLabel!: string;\n\n  /**\n   * Reference to an anchor element the menu will position itself from when rendered.\n   */\n  @Prop() anchorEl!: HTMLElement;\n\n  /**\n   *  If true then fill width of container\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * @internal If true, autofocus on selected item when menu is open\n   */\n  @Prop() autoFocusOnSelected: boolean = true;\n\n  @State() keyboardNav: boolean = false;\n  @State() optionHighlighted: string;\n  @State() focusFromSearchKeypress: boolean = false;\n  @State() initialOptionsListRender: boolean = false;\n  @State() preventIncorrectTabOrder: boolean = false;\n\n  @Watch(\"options\")\n  watchOptionsHandler(): void {\n    this.ungroupedOptions = [];\n    this.loadUngroupedOptions();\n  }\n\n  /**\n   * Emitted when an option is selected.\n   */\n  @Event() optionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * Emitted when state of menu changes (i.e. open or close).\n   */\n  @Event() menuChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n  /**\n   * Emitted when an option has been highlighted\n   */\n  @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n  @Listen(\"icClear\", { target: \"document\" })\n  handleClearListener(): void {\n    this.optionHighlighted = \"\";\n  }\n\n  @Listen(\"icSubmitSearch\", { target: \"document\" })\n  handleSubmitSearch(): void {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.setInputValue(highlightedOptionIndex);\n  }\n\n  private menu: HTMLUListElement;\n  private ungroupedOptions: IcMenuOption[] = [];\n  private popperInstance: PopperInstance;\n\n  // Prevents menu re-opening immediately after it is closed on blur when clicking input\n  private preventClickOpen: boolean = false;\n\n  private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n    if (!open) this.popperInstance.destroy();\n    this.menuChange.emit({ open, focusInput });\n\n    if (!open && focusInput !== false) {\n      this.inputEl.focus();\n      this.preventClickOpen = false;\n    }\n  };\n\n  private setNextOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex + 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex + 1].value\n        ),\n      });\n    } else {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[0].value,\n        optionId: this.getOptionId(this.ungroupedOptions[0].value),\n      });\n    }\n  };\n\n  private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex - 1].value\n        ),\n      });\n    } else {\n      this.optionSelect.emit({\n        value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[this.ungroupedOptions.length - 1].value\n        ),\n      });\n    }\n  };\n\n  /**\n   * If menu is opened with the mouse, emit menuChange custom event.\n   */\n  @Method()\n  async handleClickOpen(): Promise<void> {\n    if (!this.preventClickOpen) {\n      this.menuChange.emit({ open: !this.open });\n      this.keyboardNav = false;\n    }\n    this.preventClickOpen = false;\n  }\n\n  /**\n   * Used alongside activationType\n   * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n   * @param {KeyboardEvent} event - keyboard event\n   */\n  @Method()\n  async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n    this.keyboardNav = false;\n\n    if (this.activationType === \"automatic\") {\n      this.autoSetInputValueKeyboardOpen(event);\n    } else {\n      this.keyboardNav = true;\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  }\n\n  /**\n   * @internal Used to highlight the first option in the menu.\n   */\n  @Method()\n  async handleSetFirstOption(): Promise<void> {\n    this.setHighlightedOption(0);\n  }\n\n  private arrowBehaviour = (event: KeyboardEvent): void => {\n    event.preventDefault();\n    this.handleMenuChange(true);\n  };\n\n  private setHighlightedOption = (highlightedIndex: number): void => {\n    this.optionHighlighted = this.options[highlightedIndex].value || undefined;\n  };\n\n  private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl?.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setNextOptionValue(selectedOptionIndex);\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setPreviousOptionValue(selectedOptionIndex);\n        break;\n      case \" \":\n      case \"Enter\":\n        if ((event.target as HTMLElement).id !== \"clear-button\") {\n          this.handleMenuChange(true);\n        }\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.menuOptionId.emit({ optionId: undefined });\n\n    const getOptionId = (index: number): string =>\n      Array.from(this.host.shadowRoot.querySelectorAll(\"li\"))[index].id;\n\n    const isSearchBar = this.parentEl.tagName === \"IC-SEARCH-BAR\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.arrowBehaviour(event);\n        if (highlightedOptionIndex < this.options.length - 1) {\n          this.setHighlightedOption(highlightedOptionIndex + 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex + 1),\n          });\n        } else {\n          this.setHighlightedOption(0);\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"ArrowUp\":\n        this.arrowBehaviour(event);\n        if (\n          highlightedOptionIndex <= 0 ||\n          highlightedOptionIndex > this.options.length + 1\n        ) {\n          this.setHighlightedOption(this.options.length - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(this.options.length - 1),\n          });\n        } else {\n          this.setHighlightedOption(highlightedOptionIndex - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex - 1),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \" \":\n      case \"Enter\":\n        event.preventDefault();\n        this.setInputValue(highlightedOptionIndex);\n        break;\n      case \"Escape\":\n        this.handleMenuChange(false);\n        this.menuOptionId.emit({ optionId: undefined });\n        break;\n      case \"Shift\":\n      case \"Tab\":\n        this.preventIncorrectTabOrder = true;\n        break;\n      case \"Backspace\":\n        if (isSearchBar) {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n      default:\n        if (isSearchBar && event.key !== \"Tab\") {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n    }\n  };\n\n  private setInputValue = (highlightedOptionIndex: number) => {\n    if (this.options[highlightedOptionIndex]) {\n      this.optionSelect.emit({\n        value: this.options[highlightedOptionIndex]?.value,\n      });\n      this.optionHighlighted = undefined;\n      this.menuOptionId.emit({ optionId: undefined });\n    }\n    this.handleMenuChange(false);\n  };\n\n  private handleOptionClick = (event: Event): void => {\n    const { value, label } = (event.target as HTMLLIElement).dataset;\n    this.optionSelect.emit({ value, label });\n    this.handleMenuChange(false);\n  };\n\n  private handleBlur = (event: FocusEvent): void => {\n    if (event.relatedTarget !== this.inputEl) {\n      if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n        this.handleMenuChange(false, false);\n      }\n    } else {\n      this.handleMenuChange(false);\n      this.preventClickOpen = true;\n    }\n  };\n\n  private handleMenuKeyDown = (event: KeyboardEvent) => {\n    if (this.activationType === \"automatic\") {\n      this.autoSetValueOnMenuKeyDown(event);\n    }\n  };\n\n  private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n    event.cancelBubble = true;\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        this.setPreviousOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"ArrowDown\":\n        event.preventDefault();\n        this.setNextOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"Home\":\n        this.optionSelect.emit({\n          value: this.ungroupedOptions[0].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"End\":\n        this.optionSelect.emit({\n          value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \" \":\n      case \"Enter\":\n      case \"Escape\":\n        this.handleMenuChange(false);\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      case \"Shift\":\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private handleMenuKeyUp = (event: KeyboardEvent): void => {\n    if (event.key === \"Tab\" && event.shiftKey) {\n      this.preventClickOpen = false;\n    }\n  };\n\n  private getOptionId = (value: string): string => {\n    return `${this.menuId}-${value}`;\n  };\n\n  private getOptionAriaLabel = (\n    option: IcMenuOption,\n    parentOption: IcMenuOption\n  ): string => {\n    let ariaLabel = option.label;\n\n    if (option.description) {\n      ariaLabel = `${ariaLabel}, ${option.description}`;\n    }\n\n    if (parentOption) {\n      return `${ariaLabel}, ${parentOption.label} group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    return options.sort((optionA, optionB) =>\n      optionA.recommended && !optionB.recommended ? -1 : 0\n    );\n  };\n\n  private isManualMode = this.activationType === \"manual\";\n\n  private scrollToSelected = (menu: HTMLUListElement) => {\n    const selectedOption = menu.querySelector(\n      \".option[aria-selected]\"\n    ) as HTMLElement;\n\n    if (selectedOption) {\n      const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n      if (\n        elTop > menu.scrollTop + menu.offsetHeight ||\n        elTop < menu.scrollTop + menu.offsetHeight\n      ) {\n        menu.scrollTop = selectedOption.offsetTop;\n      }\n      selectedOption.focus();\n    }\n  };\n\n  private loadUngroupedOptions = () => {\n    if (this.options.length > 0) {\n      this.options.map((option) => {\n        if (option.children) {\n          option.children.map(\n            (option) => !option.disabled && this.ungroupedOptions.push(option)\n          );\n        } else if (!option.disabled) {\n          this.ungroupedOptions.push(option);\n        }\n      });\n    }\n    this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n  };\n\n  connectedCallback(): void {\n    if (this.parentEl?.tagName === \"IC-SEARCH-BAR\") {\n      this.setHighlightedOption(0);\n      this.initialOptionsListRender = true;\n    }\n  }\n\n  componentWillLoad(): void {\n    this.loadUngroupedOptions();\n  }\n\n  componentDidLoad(): void {\n    let optionsHeight = 0;\n    this.host.shadowRoot\n      .querySelectorAll(\".option\")\n      .forEach((option) => (optionsHeight += option.clientHeight));\n    if (optionsHeight > 320) {\n      this.menu.classList.add(\"menu-scroll\");\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.open, propName: \"open\" },\n        { prop: this.options, propName: \"options\" },\n        { prop: this.menuId, propName: \"menu-id\" },\n        { prop: this.inputLabel, propName: \"input-label\" },\n        //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n      ],\n      \"Menu\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.open) {\n      this.popperInstance = createPopper(this.anchorEl, this.host, {\n        placement: \"bottom\",\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 7],\n            },\n          },\n          {\n            name: \"flip\",\n            options: {\n              fallbackPlacements: [\"top\"],\n              rootBoundary: \"viewport\",\n            },\n          },\n        ],\n      });\n    }\n  }\n\n  componentDidUpdate(): void {\n    const inputValueInOptions: boolean = this.options.some(\n      (option) => option.value === this.value\n    );\n\n    const optionHighlightedIsSet =\n      this.optionHighlighted !== null &&\n      this.optionHighlighted !== undefined &&\n      this.optionHighlighted !== \"\";\n\n    if (this.open && this.options.length !== 0) {\n      if (\n        this.value &&\n        this.keyboardNav &&\n        inputValueInOptions &&\n        this.autoFocusOnSelected\n      ) {\n        this.scrollToSelected(this.menu);\n      } else if (\n        this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n        this.inputEl.tagName !== \"INPUT\"\n      ) {\n        this.menu.focus();\n      } else if (\n        optionHighlightedIsSet &&\n        !this.focusFromSearchKeypress &&\n        !this.preventIncorrectTabOrder\n      ) {\n        const highlightedEl = this.host.shadowRoot.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement;\n\n        if (highlightedEl) {\n          highlightedEl.focus();\n        }\n      }\n    }\n  }\n\n  private displayOption = (\n    option: IcMenuOption,\n    index?: number,\n    parentOption?: IcMenuOption\n  ): HTMLLIElement => {\n    const { open, value } = this;\n\n    return (\n      <li\n        id={this.getOptionId(option.value)}\n        class={{\n          option: true,\n          \"focused-option\": this.isManualMode\n            ? (this.keyboardNav || this.initialOptionsListRender) &&\n              option.value === this.optionHighlighted\n            : this.keyboardNav && option.value === value,\n          \"last-recommended-option\":\n            option.recommended &&\n            this.options[index + 1] &&\n            !this.options[index + 1].recommended,\n          \"disabled-option\": option.disabled,\n        }}\n        role=\"option\"\n        tabindex={\n          open &&\n          (option.value === value || option.value === this.optionHighlighted) &&\n          this.keyboardNav\n            ? \"0\"\n            : \"-1\"\n        }\n        aria-label={this.getOptionAriaLabel(option, parentOption)}\n        aria-selected={option.value === value}\n        aria-disabled={option.disabled ? \"true\" : \"false\"}\n        onClick={this.handleOptionClick}\n        onBlur={this.handleBlur}\n        onMouseDown={(event) => event.preventDefault()}\n        data-value={option.value}\n        data-label={option.label}\n      >\n        <div class=\"option-text-container\">\n          <ic-typography variant=\"body\" aria-hidden=\"true\">\n            <p>{option.label}</p>\n          </ic-typography>\n          {option.description && (\n            <ic-typography\n              id={`${this.getOptionId(option.value)}-description`}\n              class=\"option-description\"\n              variant=\"caption\"\n              aria-hidden=\"true\"\n            >\n              <p>{option.description}</p>\n            </ic-typography>\n          )}\n        </div>\n        {option.value === value &&\n          this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n            <span class=\"check-icon\" innerHTML={Check} />\n          )}\n      </li>\n    );\n  };\n\n  render() {\n    const { inputLabel, options, menuId, value, fullWidth } = this;\n\n    return (\n      <Host\n        class={{\n          \"full-width\": fullWidth,\n          \"no-focus\": this.inputEl?.tagName === \"INPUT\",\n        }}\n      >\n        {options.length !== 0 && (\n          <ul\n            id={menuId}\n            class=\"menu\"\n            role=\"listbox\"\n            aria-label={inputLabel}\n            aria-activedescendant={\n              value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n            }\n            tabindex={\n              open && !this.keyboardNav && this.inputEl?.tagName !== \"INPUT\"\n                ? \"0\"\n                : \"-1\"\n            }\n            ref={(el) => (this.menu = el)}\n            onKeyDown={this.handleMenuKeyDown}\n            onKeyUp={this.handleMenuKeyUp}\n            onBlur={this.handleBlur}\n          >\n            {this.getSortedOptions(options).map((option, index) => {\n              if (option.children) {\n                if (option.children.length > 0) {\n                  return (\n                    <div>\n                      <ic-typography\n                        class=\"option-group-title\"\n                        role=\"presentation\"\n                        variant=\"subtitle-small\"\n                      >\n                        <p>{option.label}</p>\n                      </ic-typography>\n                      {option.children.map((childOption) =>\n                        this.displayOption(childOption, index, option)\n                      )}\n                    </div>\n                  );\n                } else {\n                  return null;\n                }\n              } else {\n                return this.displayOption(option, index);\n              }\n            })}\n          </ul>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/ic-input-label_2.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { a as onComponentRequiredPropUndefined, G as getInputHelperTextID, H as getInputValidationTextID } from './helpers-e090fe7e.js';
+import { a as onComponentRequiredPropUndefined, J as getInputHelperTextID, K as getInputValidationTextID } from './helpers-3d41833c.js';
 import { a as IcInformationStatus } from './types-dd515332.js';
 import { w as warningIcon, e as errorIcon } from './error-icon-6046a380.js';
 import { s as successIcon } from './success-icon-2f71b115.js';

package/dist/esm/ic-link.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { F as getThemeFromContext, l as inheritAttributes, m as IC_INHERITED_ARIA } from './helpers-e090fe7e.js';
+import { b as getThemeFromContext, m as inheritAttributes, n as IC_INHERITED_ARIA } from './helpers-3d41833c.js';
 import { I as IcThemeForegroundEnum } from './types-dd515332.js';
 
 const OpenInNew = `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"/></svg>`;

package/dist/esm/ic-navigation-button.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { j as getThemeForegroundColor, l as inheritAttributes, a as onComponentRequiredPropUndefined, m as IC_INHERITED_ARIA } from './helpers-e090fe7e.js';
+import { k as getThemeForegroundColor, m as inheritAttributes, a as onComponentRequiredPropUndefined, n as IC_INHERITED_ARIA } from './helpers-3d41833c.js';
 import { I as IcThemeForegroundEnum } from './types-dd515332.js';
 
 const icNavigationButtonCss = "/*! 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;margin-right:var(--ic-space-xs);list-style:none}:host(.in-side-menu){margin-right:0}";

package/dist/esm/ic-navigation-group.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { D as DEVICE_SIZES, j as getThemeForegroundColor, g as getCurrentDeviceSize, n as getNavItemParentDetails } from './helpers-e090fe7e.js';
+import { D as DEVICE_SIZES, k as getThemeForegroundColor, g as getCurrentDeviceSize, p as getNavItemParentDetails } from './helpers-3d41833c.js';
 import { c as chevronIcon } from './chevron-icon-5b38c60a.js';
 import './types-dd515332.js';
 

package/dist/esm/ic-navigation-item.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { D as DEVICE_SIZES, j as getThemeForegroundColor, p as getParentElementType, g as getCurrentDeviceSize, n as getNavItemParentDetails } from './helpers-e090fe7e.js';
+import { D as DEVICE_SIZES, k as getThemeForegroundColor, q as getParentElementType, g as getCurrentDeviceSize, p as getNavItemParentDetails } from './helpers-3d41833c.js';
 import { c as chevronIcon } from './chevron-icon-5b38c60a.js';
 import './types-dd515332.js';
 

package/dist/esm/ic-navigation-menu.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { q as getSlotContent, C as getSlot, i as isSlotUsed } from './helpers-e090fe7e.js';
+import { t as getSlotContent, G as getSlot, i as isSlotUsed } from './helpers-3d41833c.js';
 import './types-dd515332.js';
 
 const icNavigationMenuCss = ":host{display:block}.popout-modal{position:absolute;top:0;right:0;bottom:0;left:0}.popout-menu{position:fixed;top:0;right:0;width:256px;bottom:0;background-color:var(--ic-architectural-20);color:var(--ic-color-primary-text);box-shadow:var(--ic-elevation-overlay);overflow-y:auto;overflow-x:hidden;z-index:calc(var(--ic-z-index-overlay) / 2)}:host(.inline) .popout-menu{position:absolute}.menu-close-button-container{position:relative;left:190px;padding:var(--ic-space-md) 0}.nav-group-first{padding-bottom:0}.menu-buttons-container{padding:var(--ic-space-sm) 0;border-bottom:1px solid var(--ic-architectural-200)}.menu-buttons-container-nav-item-above{margin-top:var(--ic-space-md);border-top:1px solid var(--ic-architectural-200)}.menu-status-version-container{display:inline-flex;margin:var(--ic-space-md) var(--ic-space-md) var(--ic-space-xl)}.menu-status{background-color:var(--ic-architectural-500);color:var(--ic-color-white-text);border-radius:80px;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) var(--ic-space-sm);margin-right:var(--ic-space-xs)}.menu-version{border-radius:16px;background-color:var(--ic-architectural-100);padding:var(--ic-space-xxs) var(--ic-space-sm)}.menu-status-text,.menu-version-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90px}.navigation-landmark-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden}";

package/dist/esm/ic-page-header.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { g as getCurrentDeviceSize, D as DEVICE_SIZES, c as checkResizeObserver, i as isSlotUsed } from './helpers-e090fe7e.js';
+import { g as getCurrentDeviceSize, D as DEVICE_SIZES, c as checkResizeObserver, i as isSlotUsed } from './helpers-3d41833c.js';
 import './types-dd515332.js';
 
 const icPageHeaderCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}:host(.sticky){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay)}header{background-color:var(--ic-architectural-40)}header.border-bottom{border-bottom:1px solid var(--ic-architectural-300)}header.tabs{padding-top:var(--ic-space-md)}.breadcrumb-area{margin-bottom:var(--ic-space-md)}.main-content{display:grid;grid-template-columns:auto 1fr;grid-template-areas:\"title-area action-area\"\n    \"input-area action-area\";-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md);justify-content:space-between;width:100%}.title-area{display:flex;flex-direction:column;flex:1;min-width:304px;grid-area:title-area}.header-content{display:flex;align-items:center;width:100%;flex-wrap:wrap;row-gap:var(--ic-space-xs);-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md)}.heading{display:inline-block;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.subheading.small{margin-top:var(--ic-space-xs)}.action-area{display:flex;gap:var(--ic-space-md);flex-flow:row wrap;justify-self:end;justify-content:flex-end;height:-moz-fit-content;height:fit-content;grid-area:action-area}.input-area,.navigation-area{margin-top:var(--ic-space-md);width:100%}.tabs-slot{display:flex;overflow-x:auto;padding:8px;margin:-8px}.input-area{grid-area:input-area}@media screen and (max-width: 576px){::slotted(ic-text-field){--input-width:100%;max-width:320px}.main-content{grid-template-areas:\"title-area\"\n      \"action-area\"\n      \"input-area\";justify-content:flex-start}.title-area{min-width:0}.action-area{min-width:100%;margin-top:var(--ic-space-md);justify-content:start}}@media screen and (min-width: 992px){:host(.sticky-desktop){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay)}}";

package/dist/esm/ic-radio-group.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { a as onComponentRequiredPropUndefined, d as renderHiddenInput, h as hasValidationStatus } from './helpers-e090fe7e.js';
+import { a as onComponentRequiredPropUndefined, e as renderHiddenInput, j as hasValidationStatus } from './helpers-3d41833c.js';
 import './types-dd515332.js';
 
 const icRadioGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}";

package/dist/esm/ic-radio-option.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1500de1f.js';
-import { q as getSlotContent, b as addFormResetListener, a as onComponentRequiredPropUndefined, r as removeFormResetListener } from './helpers-e090fe7e.js';
+import { t as getSlotContent, d as addFormResetListener, a as onComponentRequiredPropUndefined, r as removeFormResetListener } from './helpers-3d41833c.js';
 import './types-dd515332.js';
 
-const icRadioOptionCss = "/*! 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;margin-bottom:var(--ic-space-sm);width:-moz-fit-content;width:fit-content}:host([small]){margin-bottom:10px}:host([additional-field-display=\"static\"]) ::slotted(ic-textfield){margin-top:var(--ic-space-xs);margin-left:var(--ic-space-xl)}:host([disabled]){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}.container input:focus-visible{outline:var(--ic-hc-focus-outline)}.container{display:inline-flex;position:relative;cursor:pointer;align-items:center;gap:var(--ic-space-xs);margin-left:5px}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:20px;width:20px;background-color:transparent;border:1px solid #a7acb3;border-radius:50%;transition:var(--ic-easing-transition-fast)}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 4px var(--ic-action-default-bg-hover);border:1px solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:1px solid var(--ic-action-default-active);box-shadow:0 0 0 4px var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:2px solid var(--ic-action-default-active);box-shadow:0 0 0 4px var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:2px solid var(--ic-action-default);margin:-1px;margin-bottom:1px}.container input:checked:disabled~.checkmark{background-color:transparent;border:2px solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:1px dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:2px solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:\"\";position:absolute;display:none;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--ic-action-default)}.radio-label{font-size:16px;font-weight:400;margin-left:var(--ic-space-sm)}.addition-field-wrapper{margin-left:44px}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 3px;border-bottom:2px solid var(--ic-action-default);border-left:2px solid var(--ic-action-default);margin-left:-1px}.dynamic-container{display:flex;position:relative;margin-left:var(--ic-space-md);margin-top:6px;gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:5px;margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}";
+const icRadioOptionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:flex;flex-direction:column;margin-bottom:var(--ic-space-sm);width:-moz-fit-content;width:fit-content}:host([small]){margin-bottom:10px}:host([additional-field-display=\"static\"]) ::slotted(ic-textfield){margin-top:var(--ic-space-xs);margin-left:var(--ic-space-xl)}:host([disabled]){color:var(--ic-architectural-200)}.container input:focus+span.checkmark,:host(:focus) .container input:checked+span.checkmark{box-shadow:var(--ic-border-focus)}.container{display:inline-flex;position:relative;cursor:pointer;align-items:center;margin-left:var(--ic-space-xxs)}.container.disabled,.container.disabled input:disabled{cursor:default}.container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:absolute;cursor:pointer;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);border-radius:50%;border:none}.checkmark{display:block;position:relative;top:0;left:0;height:20px;width:20px;background-color:transparent;border:1px solid #a7acb3;border-radius:50%;transition:var(--ic-easing-transition-fast);margin:0 1px}.container input:checked~.checkmark::after{display:inline-block}.container:hover input~.checkmark{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 4px var(--ic-action-default-bg-hover);border:1px solid var(--ic-action-default)}.container:active input~.checkmark{background-color:var(--ic-action-default-bg-active);border:1px solid var(--ic-action-default-active);box-shadow:0 0 0 4px var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark{background-color:var(--ic-action-default-bg-active);border:2px solid var(--ic-action-default-active);box-shadow:0 0 0 4px var(--ic-action-default-bg-active)}.container:active input:checked~.checkmark::after{background-color:var(--ic-action-default-active)}.container input:checked~.checkmark{border:2px solid var(--ic-action-default);margin:0}.container input:checked:disabled~.checkmark{background-color:transparent;border:2px solid var(--ic-architectural-200)}.container input:disabled~.checkmark{border:1px dashed var(--ic-architectural-200)}.container input:disabled~.checkmark::after{background:var(--ic-architectural-200)}.container:hover input:disabled~.checkmark{background-color:transparent;box-shadow:none;border:2px solid none}.container:active input:disabled~.checkmark::after{background-color:var(--ic-architectural-200)}.container .checkmark::after{content:\"\";position:absolute;display:none;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--ic-action-default)}.radio-label{font-size:16px;font-weight:400;margin-left:var(--ic-space-sm)}.addition-field-wrapper{margin-left:44px}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 3px;border-bottom:2px solid var(--ic-action-default);border-left:2px solid var(--ic-action-default);margin-left:-1px}.dynamic-container{display:flex;position:relative;margin-left:var(--ic-space-md);margin-top:6px;gap:var(--ic-space-xs)}.dynamic-container.hidden{display:none}.dynamic-text{color:var(--ic-action-default);margin-top:5px;margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.container input:checked~.checkmark,.container:active input:checked~.checkmark{border-color:Highlight}.container input:checked~.checkmark::after,.container:active input:checked~.checkmark::after{background-color:Highlight}.container input:disabled~.checkmark,.container input:checked:disabled~.checkmark{border-color:GrayText}.container input:disabled~.checkmark::after,.container:active input:disabled~.checkmark::after{background-color:GrayText}}";
 
 const RadioOption = class {
   constructor(hostRef) {

package/dist/esm/ic-radio-option.entry.js.map

@@ -1 +1 @@
-{"file":"ic-radio-option.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: block;\n  margin-bottom: var(--ic-space-sm);\n  width: fit-content;\n}\n\n:host([small]) {\n  margin-bottom: 10px;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-textfield) {\n  margin-top: var(--ic-space-xs);\n  margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled  */\n:host([disabled]) {\n  color: var(--ic-architectural-200);\n}\n\n/* Focus states */\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n}\n\n.container input:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n/* The container */\n.container {\n  display: inline-flex;\n  position: relative;\n  cursor: pointer;\n  align-items: center;\n  gap: var(--ic-space-xs);\n  margin-left: 5px;\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n  cursor: default;\n}\n\n/* Hide the browser's default radio button */\n.container input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  display: inline-block;\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  border-radius: 50%;\n  border: none;\n}\n\n/* Create a custom radio button */\n.checkmark {\n  display: block;\n  position: relative;\n  top: 0;\n  left: 0;\n  height: 20px;\n  width: 20px;\n  background-color: transparent;\n  border: 1px solid #a7acb3;\n  border-radius: 50%;\n  transition: var(--ic-easing-transition-fast);\n}\n\n/* Show the indicator (dot/circle) when checked */\n.container input:checked ~ .checkmark::after {\n  display: inline-block;\n}\n\n/* On mouse-over, add a light blue background color */\n.container:hover input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-hover);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n  border: 1px solid var(--ic-action-default);\n}\n\n/* When pressed, adds the active colours */\n.container:active input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 1px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed, adds the active colours */\n.container:active input:checked ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 2px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed and selected, adds the active colours */\n.container:active input:checked ~ .checkmark::after {\n  background-color: var(--ic-action-default-active);\n}\n\n/* When the radio button is checked */\n.container input:checked ~ .checkmark {\n  border: 2px solid var(--ic-action-default);\n  margin: -1px;\n  margin-bottom: 1px;\n}\n\n/* When the radio button is checked and disabled */\n.container input:checked:disabled ~ .checkmark {\n  background-color: transparent;\n  border: 2px solid var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark::after {\n  background: var(--ic-architectural-200);\n}\n\n/* On mouse-over inactive */\n.container:hover input:disabled ~ .checkmark {\n  background-color: transparent;\n  box-shadow: none;\n  border: 2px solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n  background-color: var(--ic-architectural-200);\n}\n\n/* Style the indicator (dot/circle) */\n.container .checkmark::after {\n  content: \"\";\n  position: absolute;\n  display: none;\n  top: 2px;\n  left: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: var(--ic-action-default);\n}\n\n.radio-label {\n  font-size: 16px;\n  font-weight: 400;\n  margin-left: var(--ic-space-sm);\n}\n\n.addition-field-wrapper {\n  margin-left: 44px;\n}\n\n/* The line */\n.branch-corner {\n  color: var(--ic-action-default);\n  height: var(--ic-space-md);\n  width: var(--ic-space-xl);\n  border-radius: 0 0 0 3px;\n  border-bottom: 2px solid var(--ic-action-default);\n  border-left: 2px solid var(--ic-action-default);\n  margin-left: -1px;\n}\n\n/* The dynamic container */\n.dynamic-container {\n  display: flex;\n  position: relative;\n  margin-left: var(--ic-space-md);\n  margin-top: 6px;\n  gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n  display: none;\n}\n\n.dynamic-text {\n  color: var(--ic-action-default);\n  margin-top: 5px;\n  margin-bottom: var(--ic-space-xs);\n  border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n  ::slotted(ic-text-field) {\n    --input-width: 100%;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Watch,\n  State,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n  getSlotContent,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n  tag: \"ic-radio-option\",\n  styleUrl: \"ic-radio-option.css\",\n  shadow: true,\n})\nexport class RadioOption {\n  private radioElement: HTMLInputElement;\n  /**\n   * Determines whether the radio should be in selected state.\n   */\n  @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n  /**\n   * Determines whether the radio should be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label?: string;\n  /**\n   * Provide a value for the input.\n   */\n  @Prop({ mutable: true }) value!: string;\n  /**\n   * Provide a name for the input.\n   */\n  @Prop() name: string;\n  /**\n   * Provide a group label for the input.\n   */\n  @Prop() groupLabel: string;\n  /**\n   * Provide a text prop for the dynamic text.\n   */\n  @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n  /** Determines type of additional text field in relation to radio option */\n\n  @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n    \"static\";\n\n  @State() initiallySelected = this.selected;\n\n  @Element() host: HTMLIcRadioOptionElement;\n\n  /**\n   * Emitted when radio is checked\n   */\n  @Event() icCheck!: EventEmitter<void>;\n\n  /**\n   * Emitted when a radio is selected.\n   */\n  @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n  @Watch(\"selected\")\n  selectedChangeHandler(selected: boolean): void {\n    if (selected) {\n      this.handleClick();\n    }\n  }\n\n  private defaultRadioValue: string = \"\";\n  private skipFocus = false;\n\n  private handleClick = () => {\n    if (!this.disabled) {\n      if (this.skipFocus === false) {\n        this.radioElement.focus();\n      }\n      this.skipFocus = false;\n\n      if (this.hasAdditionalField) {\n        const textfield = this.host.querySelector(\"ic-text-field\");\n        this.value =\n          textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n      }\n\n      this.radioOptionSelect.emit({\n        value: this.value,\n      });\n    }\n  };\n\n  private swallowClick = (event: MouseEvent) => {\n    event.stopPropagation();\n  };\n\n  private hasAdditionalField: boolean = false;\n  componentWillLoad(): void {\n    const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n    if (additonalFieldContent !== null) {\n      this.hasAdditionalField = true;\n      const Element = additonalFieldContent[0] as HTMLElement;\n      if (Element.tagName === \"IC-TEXT-FIELD\") {\n        const textField = Element as HTMLIcTextFieldElement;\n        textField.hiddenInput = false;\n      }\n    }\n\n    this.defaultRadioValue = this.value;\n\n    addFormResetListener(this.host, this.handleFormReset);\n  }\n\n  private handleFormReset = (): void => {\n    this.skipFocus = true;\n    this.selected = this.initiallySelected;\n  };\n\n  @Listen(\"icChange\")\n  textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n    const textFieldValue = event.detail.value;\n\n    if (this.selected) {\n      if (textFieldValue !== \"\") {\n        this.value = event.detail.value;\n        this.radioOptionSelect.emit({\n          value: this.value,\n        });\n      } else {\n        this.value = this.defaultRadioValue;\n        this.radioOptionSelect.emit({\n          value: this.defaultRadioValue,\n        });\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.value, propName: \"value\" }],\n      \"Radio Option\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.additionalFieldDisplay === \"static\") {\n      const textfield = this.host.querySelector(\"ic-text-field\");\n      if (!this.selected) {\n        textfield && textfield.setAttribute(\"disabled\", \"\");\n      } else {\n        textfield && textfield.removeAttribute(\"disabled\");\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.host, this.handleFormReset);\n  }\n\n  render() {\n    const id = `ic-radio-option-${\n      this.label !== undefined ? this.label : this.value\n    }-${this.groupLabel}`;\n\n    return (\n      <Host onClick={this.handleClick}>\n        <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n          <input\n            role=\"radio\"\n            tabindex={this.selected ? \"0\" : \"-1\"}\n            type=\"radio\"\n            name={this.name}\n            id={id}\n            value={this.value}\n            disabled={this.disabled ? true : null}\n            checked={this.selected}\n            ref={(el) => (this.radioElement = el)}\n          ></input>\n          <span class=\"checkmark\"></span>\n          <ic-typography class=\"radio-label\" variant=\"body\">\n            <label htmlFor={id}>{this.label}</label>\n          </ic-typography>\n        </div>\n\n        {this.hasAdditionalField && (\n          <div\n            onClick={this.swallowClick}\n            class={{\n              \"dynamic-container\": true,\n              hidden:\n                this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n            }}\n          >\n            {this.additionalFieldDisplay === \"dynamic\" && (\n              <div class=\"branch-corner\"></div>\n            )}\n            <div>\n              {this.additionalFieldDisplay === \"dynamic\" && (\n                <ic-typography variant=\"caption\">\n                  <p class=\"dynamic-text\">{this.dynamicText}</p>\n                </ic-typography>\n              )}\n              <div\n                class={{\n                  \"addition-field-wrapper\":\n                    this.additionalFieldDisplay === \"static\",\n                }}\n              >\n                <slot name=\"additional-field\"></slot>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-radio-option.entry.js","mappings":";;;;AAAA,MAAM,gBAAgB,GAAG,+gMAA+gM;;MCyB3hM,WAAW;;;;;IAyDd,sBAAiB,GAAW,EAAE,CAAC;IAC/B,cAAS,GAAG,KAAK,CAAC;IAElB,gBAAW,GAAG;MACpB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;QAClB,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK,EAAE;UAC5B,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAC;SAC3B;QACD,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QAEvB,IAAI,IAAI,CAAC,kBAAkB,EAAE;UAC3B,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;UAC3D,IAAI,CAAC,KAAK;YACR,SAAS,CAAC,KAAK,KAAK,EAAE,GAAG,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,CAAC;SACrE;QAED,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;UAC1B,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;OACJ;KACF,CAAC;IAEM,iBAAY,GAAG,CAAC,KAAiB;MACvC,KAAK,CAAC,eAAe,EAAE,CAAC;KACzB,CAAC;IAEM,uBAAkB,GAAY,KAAK,CAAC;IAkBpC,oBAAe,GAAG;MACxB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;MACtB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,iBAAiB,CAAC;KACxC,CAAC;oBAnG2D,KAAK;oBAIrC,KAAK;;;;;uBAoBJ,4CAA4C;kCAKxE,QAAQ;6BAEmB,IAAI,CAAC,QAAQ;;EAe1C,qBAAqB,CAAC,QAAiB;IACrC,IAAI,QAAQ,EAAE;MACZ,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;GACF;EA6BD,iBAAiB;IACf,MAAM,qBAAqB,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,kBAAkB,CAAC,CAAC;IAE5E,IAAI,qBAAqB,KAAK,IAAI,EAAE;MAClC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;MAC/B,MAAM,OAAO,GAAG,qBAAqB,CAAC,CAAC,CAAgB,CAAC;MACxD,IAAI,OAAO,CAAC,OAAO,KAAK,eAAe,EAAE;QACvC,MAAM,SAAS,GAAG,OAAiC,CAAC;QACpD,SAAS,CAAC,WAAW,GAAG,KAAK,CAAC;OAC/B;KACF;IAED,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC;IAEpC,oBAAoB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;GACvD;EAQD,qBAAqB,CAAC,KAAqC;IACzD,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IAE1C,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,cAAc,KAAK,EAAE,EAAE;QACzB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAChC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;UAC1B,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;OACJ;WAAM;QACL,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,CAAC;QACpC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;UAC1B,KAAK,EAAE,IAAI,CAAC,iBAAiB;SAC9B,CAAC,CAAC;OACJ;KACF;GACF;EAED,gBAAgB;IACd,gCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EACzC,cAAc,CACf,CAAC;GACH;EAED,kBAAkB;IAChB,IAAI,IAAI,CAAC,sBAAsB,KAAK,QAAQ,EAAE;MAC5C,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;MAC3D,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;QAClB,SAAS,IAAI,SAAS,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;OACrD;WAAM;QACL,SAAS,IAAI,SAAS,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;OACpD;KACF;GACF;EAED,oBAAoB;IAClB,uBAAuB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;GAC1D;EAED,MAAM;IACJ,MAAM,EAAE,GAAG,mBACT,IAAI,CAAC,KAAK,KAAK,SAAS,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAC/C,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;IAEtB,QACE,EAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,WAAW,IAC7B,WAAK,KAAK,EAAE,EAAE,CAAC,WAAW,GAAG,IAAI,EAAE,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,EAAE,IAC9D,aACE,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,IAAI,EACpC,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,IAAI,EACrC,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,GAC9B,EACT,YAAM,KAAK,EAAC,WAAW,GAAQ,EAC/B,qBAAe,KAAK,EAAC,aAAa,EAAC,OAAO,EAAC,MAAM,IAC/C,aAAO,OAAO,EAAE,EAAE,IAAG,IAAI,CAAC,KAAK,CAAS,CAC1B,CACZ,EAEL,IAAI,CAAC,kBAAkB,KACtB,WACE,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,KAAK,EAAE;QACL,mBAAmB,EAAE,IAAI;QACzB,MAAM,EACJ,IAAI,CAAC,sBAAsB,KAAK,SAAS,IAAI,CAAC,IAAI,CAAC,QAAQ;OAC9D,IAEA,IAAI,CAAC,sBAAsB,KAAK,SAAS,KACxC,WAAK,KAAK,EAAC,eAAe,GAAO,CAClC,EACD,eACG,IAAI,CAAC,sBAAsB,KAAK,SAAS,KACxC,qBAAe,OAAO,EAAC,SAAS,IAC9B,SAAG,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,WAAW,CAAK,CAChC,CACjB,EACD,WACE,KAAK,EAAE;QACL,wBAAwB,EACtB,IAAI,CAAC,sBAAsB,KAAK,QAAQ;OAC3C,IAED,YAAM,IAAI,EAAC,kBAAkB,GAAQ,CACjC,CACF,CACF,CACP,CACI,EACP;GACH;;;;;;;;;;","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: var(--ic-space-sm);\n  width: fit-content;\n}\n\n:host([small]) {\n  margin-bottom: 10px;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-textfield) {\n  margin-top: var(--ic-space-xs);\n  margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled  */\n:host([disabled]) {\n  color: var(--ic-architectural-200);\n}\n\n/* Focus states */\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n  box-shadow: var(--ic-border-focus);\n}\n\n/* The container */\n.container {\n  display: inline-flex;\n  position: relative;\n  cursor: pointer;\n  align-items: center;\n  margin-left: var(--ic-space-xxs);\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n  cursor: default;\n}\n\n/* Hide the browser's default radio button */\n.container input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  display: inline-block;\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  border-radius: 50%;\n  border: none;\n}\n\n/* Create a custom radio button */\n.checkmark {\n  display: block;\n  position: relative;\n  top: 0;\n  left: 0;\n  height: 20px;\n  width: 20px;\n  background-color: transparent;\n  border: 1px solid #a7acb3;\n  border-radius: 50%;\n  transition: var(--ic-easing-transition-fast);\n  margin: 0 1px;\n}\n\n/* Show the indicator (dot/circle) when checked */\n.container input:checked ~ .checkmark::after {\n  display: inline-block;\n}\n\n/* On mouse-over, add a light blue background color */\n.container:hover input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-hover);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n  border: 1px solid var(--ic-action-default);\n}\n\n/* When pressed, adds the active colours */\n.container:active input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 1px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed, adds the active colours */\n.container:active input:checked ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 2px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed and selected, adds the active colours */\n.container:active input:checked ~ .checkmark::after {\n  background-color: var(--ic-action-default-active);\n}\n\n/* When the radio button is checked */\n.container input:checked ~ .checkmark {\n  border: 2px solid var(--ic-action-default);\n  margin: 0;\n}\n\n/* When the radio button is checked and disabled */\n.container input:checked:disabled ~ .checkmark {\n  background-color: transparent;\n  border: 2px solid var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark::after {\n  background: var(--ic-architectural-200);\n}\n\n/* On mouse-over inactive */\n.container:hover input:disabled ~ .checkmark {\n  background-color: transparent;\n  box-shadow: none;\n  border: 2px solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n  background-color: var(--ic-architectural-200);\n}\n\n/* Style the indicator (dot/circle) */\n.container .checkmark::after {\n  content: \"\";\n  position: absolute;\n  display: none;\n  top: 2px;\n  left: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: var(--ic-action-default);\n}\n\n.radio-label {\n  font-size: 16px;\n  font-weight: 400;\n  margin-left: var(--ic-space-sm);\n}\n\n.addition-field-wrapper {\n  margin-left: 44px;\n}\n\n/* The line */\n.branch-corner {\n  color: var(--ic-action-default);\n  height: var(--ic-space-md);\n  width: var(--ic-space-xl);\n  border-radius: 0 0 0 3px;\n  border-bottom: 2px solid var(--ic-action-default);\n  border-left: 2px solid var(--ic-action-default);\n  margin-left: -1px;\n}\n\n/* The dynamic container */\n.dynamic-container {\n  display: flex;\n  position: relative;\n  margin-left: var(--ic-space-md);\n  margin-top: 6px;\n  gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n  display: none;\n}\n\n.dynamic-text {\n  color: var(--ic-action-default);\n  margin-top: 5px;\n  margin-bottom: var(--ic-space-xs);\n  border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n  ::slotted(ic-text-field) {\n    --input-width: 100%;\n  }\n}\n\n@media (forced-colors: active) {\n  /* Styles here only apply to Forced Colors Mode */\n\n  .container input:checked ~ .checkmark,\n  .container:active input:checked ~ .checkmark {\n    border-color: Highlight;\n  }\n\n  .container input:checked ~ .checkmark::after,\n  .container:active input:checked ~ .checkmark::after {\n    background-color: Highlight;\n  }\n\n  .container input:disabled ~ .checkmark,\n  .container input:checked:disabled ~ .checkmark {\n    border-color: GrayText;\n  }\n\n  .container input:disabled ~ .checkmark::after,\n  .container:active input:disabled ~ .checkmark::after {\n    background-color: GrayText;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Watch,\n  State,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n  getSlotContent,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n  tag: \"ic-radio-option\",\n  styleUrl: \"ic-radio-option.css\",\n  shadow: true,\n})\nexport class RadioOption {\n  private radioElement: HTMLInputElement;\n  /**\n   * Determines whether the radio should be in selected state.\n   */\n  @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n  /**\n   * Determines whether the radio should be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label?: string;\n  /**\n   * Provide a value for the input.\n   */\n  @Prop({ mutable: true }) value!: string;\n  /**\n   * Provide a name for the input.\n   */\n  @Prop() name: string;\n  /**\n   * Provide a group label for the input.\n   */\n  @Prop() groupLabel: string;\n  /**\n   * Provide a text prop for the dynamic text.\n   */\n  @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n  /** Determines type of additional text field in relation to radio option */\n\n  @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n    \"static\";\n\n  @State() initiallySelected = this.selected;\n\n  @Element() host: HTMLIcRadioOptionElement;\n\n  /**\n   * Emitted when radio is checked\n   */\n  @Event() icCheck!: EventEmitter<void>;\n\n  /**\n   * Emitted when a radio is selected.\n   */\n  @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n  @Watch(\"selected\")\n  selectedChangeHandler(selected: boolean): void {\n    if (selected) {\n      this.handleClick();\n    }\n  }\n\n  private defaultRadioValue: string = \"\";\n  private skipFocus = false;\n\n  private handleClick = () => {\n    if (!this.disabled) {\n      if (this.skipFocus === false) {\n        this.radioElement.focus();\n      }\n      this.skipFocus = false;\n\n      if (this.hasAdditionalField) {\n        const textfield = this.host.querySelector(\"ic-text-field\");\n        this.value =\n          textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n      }\n\n      this.radioOptionSelect.emit({\n        value: this.value,\n      });\n    }\n  };\n\n  private swallowClick = (event: MouseEvent) => {\n    event.stopPropagation();\n  };\n\n  private hasAdditionalField: boolean = false;\n  componentWillLoad(): void {\n    const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n    if (additonalFieldContent !== null) {\n      this.hasAdditionalField = true;\n      const Element = additonalFieldContent[0] as HTMLElement;\n      if (Element.tagName === \"IC-TEXT-FIELD\") {\n        const textField = Element as HTMLIcTextFieldElement;\n        textField.hiddenInput = false;\n      }\n    }\n\n    this.defaultRadioValue = this.value;\n\n    addFormResetListener(this.host, this.handleFormReset);\n  }\n\n  private handleFormReset = (): void => {\n    this.skipFocus = true;\n    this.selected = this.initiallySelected;\n  };\n\n  @Listen(\"icChange\")\n  textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n    const textFieldValue = event.detail.value;\n\n    if (this.selected) {\n      if (textFieldValue !== \"\") {\n        this.value = event.detail.value;\n        this.radioOptionSelect.emit({\n          value: this.value,\n        });\n      } else {\n        this.value = this.defaultRadioValue;\n        this.radioOptionSelect.emit({\n          value: this.defaultRadioValue,\n        });\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.value, propName: \"value\" }],\n      \"Radio Option\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.additionalFieldDisplay === \"static\") {\n      const textfield = this.host.querySelector(\"ic-text-field\");\n      if (!this.selected) {\n        textfield && textfield.setAttribute(\"disabled\", \"\");\n      } else {\n        textfield && textfield.removeAttribute(\"disabled\");\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.host, this.handleFormReset);\n  }\n\n  render() {\n    const id = `ic-radio-option-${\n      this.label !== undefined ? this.label : this.value\n    }-${this.groupLabel}`;\n\n    return (\n      <Host onClick={this.handleClick}>\n        <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n          <input\n            role=\"radio\"\n            tabindex={this.selected ? \"0\" : \"-1\"}\n            type=\"radio\"\n            name={this.name}\n            id={id}\n            value={this.value}\n            disabled={this.disabled ? true : null}\n            checked={this.selected}\n            ref={(el) => (this.radioElement = el)}\n          ></input>\n          <span class=\"checkmark\"></span>\n          <ic-typography class=\"radio-label\" variant=\"body\">\n            <label htmlFor={id}>{this.label}</label>\n          </ic-typography>\n        </div>\n\n        {this.hasAdditionalField && (\n          <div\n            onClick={this.swallowClick}\n            class={{\n              \"dynamic-container\": true,\n              hidden:\n                this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n            }}\n          >\n            {this.additionalFieldDisplay === \"dynamic\" && (\n              <div class=\"branch-corner\"></div>\n            )}\n            <div>\n              {this.additionalFieldDisplay === \"dynamic\" && (\n                <ic-typography variant=\"caption\">\n                  <p class=\"dynamic-text\">{this.dynamicText}</p>\n                </ic-typography>\n              )}\n              <div\n                class={{\n                  \"addition-field-wrapper\":\n                    this.additionalFieldDisplay === \"static\",\n                }}\n              >\n                <slot name=\"additional-field\"></slot>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}