{"version":3,"sources":["components/ads-checkbox/ads-checkbox.tsx","components/ads-checkbox/ads-checkbox.scss?tag=ads-checkbox&encapsulation=shadow","components/core/global/pipeline.ts","components/core/utils/pipeline.ts","components/core/utils/components.ts","utils/imageHelper.tsx","utils/breakpointHelper.ts","utils/resizeHelper.ts","utils/DOMHelper.ts","../node_modules/@fortawesome/pro-regular-svg-icons/faXmark.js","../node_modules/@fortawesome/pro-regular-svg-icons/faTimes.js"],"names":["AdsCheckbox","setChecked","checked","isCheckedInternal","handleCheckboxChange","evt","readonly","disabled","checkToggle","emit","undefined","checkToggleHandler","handleCheckboxFocus","checkFocus","id","identifier","checkFocusHandler","handleCheckboxBlur","checkBlur","checkBlurHandler","handleCheckboxKeyDown","key","preventDefault","getTooltipPosition","isReversed","el","RIGHT","LEFT","this","setAttribute","component","newValue","Promise","resolve","Pipeline.addComponent","Pipeline.removeComponent","inputAttributes","name","tabIndex","required","class","type","checkboxClasses","push","classList","contains","labelText","label","childNodes","length","labelClasses","labelAttributes","role","toString","srLabel","$contentEls","join","data","svgPathData","height","width","reverse","onBlur","onFocus","onKeyDown","onClick","$tooltipEl","tooltip","theme","onOpenChange","target","position","text","helperLabel","helperText","htmlFor","$elements","renderContentContainer","renderInputElement","add","window","pipeline","set","tagName","toLowerCase","config","getBoolean","trackEvent","COMPONENT_REGISTER","componentId","environment","version","host","location","err","console","log","sendCustomEvent","addComponent","Pipeline.add","removeComponent","delete","Pipeline.remove","generateId","namespace","generateRandomString","Math","random","substr","getClassFromSize","size","MEDIUM","SMALL","getClassFromLevel","level","PRIMARY","SECONDARY","TERTIARY","getMediaQueryBreakpointClassUp","bp","getMediaQueryBreakpointClassDown","showErrorMessage","message","ADS_CONSOLE_ERROR","warn","generateSVGImage","icon","className","xmlns","viewBox","d","MediaTypes","getBreakpointInPixels","breakpoint","parseInt","breakpoints","mediaQueryLists","addMatchMedia","mediaType","listenerFunction","foundMatchMedia","find","m","media","newMatchMedia","matchMedia","addEventListener","removeMatchMedia","removeEventListener","callbacks","onresize","map","cb","timeout","callback","setTimeout","duration","subscribeToWindowResize","timeoutDuration","unSubscribeToWindowResize","index","findIndex","clearTimeout","splice","getContentFromSlotElementsRecursively","slotElements","reduce","acc","currentValue","assignedElements","isElementChildOfComponent","componentEl","element","maxIterations","tmpElement","parentElement","getAttribute","getSlottedElements","slotName","selector","Array","from","shadowRoot","querySelectorAll","slotElement","assignedNodes","flat","getAllElementsWithSlotAttribute","filter","getIsElementDescendantOfElement","el1","el2","getParentInDom","assignedSlot","getRootNode","currentIteration","currentParent","getIsElementRTL","elem","RTL","document","documentElement","LTR","getHtmlDirObserver","onDirMutationCallback","obs","MutationObserver","mutationList","htmlDirMutation","ml","nodeName","attributeName","observe","attributes","childList","subtree","Object","defineProperty","exports","value","aliases","prefix","iconName","definition","source","unicode"],"mappings":"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","file":"static/js/11.ffa0f5bb.chunk.js","sourcesContent":["/* eslint-disable @stencil/own-props-must-be-private */\n\nimport { Component, Element, Event, EventEmitter, Fragment, Method, Prop, State, VNode, Watch, h } from '@stencil/core';\n\nimport * as Pipeline from '../core/utils/pipeline';\nimport { BaseComponent } from '../core/interfaces/BaseComponent';\nimport { CheckBlurEvent, CheckBlurHandler, CheckFocusEvent, CheckFocusHandler, CheckToggleEvent, CheckToggleHandler } from './ads-checkbox.types';\nimport { Positions, Theme } from '../core/types/globalTypes';\nimport { generateId } from '../core/utils/components';\nimport { generateSVGImage, getIsElementRTL, isNullOrUndefined, isNullOrUndefinedOrEmpty } from 'utils/index';\nimport { height, svgPathData, width } from '@fortawesome/pro-regular-svg-icons/faTimes';\n\n/**\n * Checkboxes are used to toggling single or multiple options on or off. The checkbox list contains options that are not mutually exclusive, and the default state should be unchecked. The text labels on check boxes are sentence case capitalized.\n * @tag `<ads-checkbox>`\n * @slot - Content rendered as the label text\n * @example\n * <ads-checkbox>Default</ads-checkbox>\n * <ads-checkbox checked>Checked</ads-checkbox>\n * <ads-checkbox disabled>Disabled</ads-checkbox>\n * <ads-checkbox checked disabled>Checked + Disabled</ads-checkbox>\n * <ads-checkbox readonly>Readonly</ads-checkbox>\n * <ads-checkbox checked readonly>Checked + Readonly</ads-checkbox>\n * <ads-checkbox class=\"is-reversed\">Reversed</ads-checkbox>\n * <ads-checkbox class=\"is-small\">Small</ads-checkbox>\n */\n@Component({\n  tag: 'ads-checkbox',\n  styleUrl: 'ads-checkbox.scss',\n  shadow: true,\n})\nexport class AdsCheckbox implements BaseComponent {\n  /**\n   * @hidden\n   */\n  public component: string;\n\n  constructor() {\n    this.el.setAttribute('id', this.identifier || generateId('ads-checkbox'));\n    this.component = 'ads-checkbox';\n  }\n\n  @Element() private el: HTMLAdsCheckboxElement;\n\n  /**\n   * @hidden\n   */\n  @State() isCheckedInternal = false;\n\n  /**\n   * The unique identifier (optional)\n   */\n  @Prop({ attribute: 'id' }) identifier?: string;\n\n  /**\n   * The theme for this component instance (optional)\n   * Values: \"default\", \"dark\"\n   */\n  @Prop({ reflect: true }) theme?: Theme;\n\n  /**\n   * Whether or not the checkbox is checked (optional)\n   */\n  @Prop({ reflect: true }) checked?: boolean;\n\n  /**\n   * Whether or not the checkbox is readonly (optional)\n   * @default false\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * Whether or not the checkbox is required (optional)\n   * @default false\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /**\n   * The checkbox label (optional)\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The value for the aria-label of the checkbox, only used if the `label` property is not provided (optional)\n   */\n  @Prop({ reflect: true }) srLabel?: string;\n\n  /**\n   * The checkbox name (optional)\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * The checkbox tooltip (optional)\n   */\n  @Prop({ reflect: true }) tooltip?: string;\n\n  /**\n   * The checkbox helper text (optional)\n   */\n  @Prop({ reflect: true }) helperText?: string;\n\n  /**\n   * Whether or not the toggle is disabled (optional)\n   * @default false\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Callback function triggered on checkbox change (optional)<br/>\n   * Usage: `document.querySelector('ads-checkbox').checkToggleHandler = ({evt: Event, checked: boolean}) => {};`\n   */\n  @Prop() checkToggleHandler?: CheckToggleHandler;\n\n  /**\n   * Callback function triggered on checkbox focus (optional)<br/>\n   * Usage: `document.querySelector('ads-checkbox').checkFocusHandler = ({evt: Event, id: string}) => {};`\n   */\n  @Prop() checkFocusHandler?: CheckFocusHandler;\n\n  /**\n   * Emits the `checkToggle` custom event.<br/>\n   * Usage: `document.querySelector('ads-checkbox').addEventListener('checkToggle', function({evt: Event, checked: boolean}) { });`\n   * @event\n   */\n  @Event({ bubbles: false }) checkToggle: EventEmitter<CheckToggleEvent>;\n\n  /**\n   * Emits the `checkBlur` custom event.<br/>\n   * Usage: `document.querySelector('ads-checkbox').addEventListener('checkBlur', function({evt: Event, id: string}) { });`\n   * @event\n   */\n  @Event({ bubbles: false }) checkBlur: EventEmitter<CheckBlurEvent>;\n\n  /**\n   * Callback function triggered on checkbox blur\n   * Usage: document.querySelector('ads-checkbox').checkBlurHandler = ({evt: Event, id: string}) => {};`\n   */\n  @Prop() checkBlurHandler?: CheckBlurHandler;\n\n  /**\n   * Emits the `checkFocus` custom event.<br/>\n   * Usage: `document.querySelector('ads-checkbox').addEventListener('checkFocus', function(evt, id) { });`\n   * @event\n   */\n  @Event({ bubbles: false }) checkFocus: EventEmitter<CheckFocusEvent>;\n\n  /**\n   * Handle identifier property changes\n   * @param {string} newValue The new value for \"identifier\"\n   * @hidden\n   */\n  @Watch('identifier')\n  handleIdentifierChange(newValue: string): void {\n    this.el.setAttribute('id', newValue || generateId('ads-checkbox'));\n  }\n\n  /**\n   * Watch for checked prop change\n   * @param {boolean}   newValue  The new value for 'checked'\n   * @private\n   * @hidden\n   */\n  @Watch('checked')\n  onCheckedChange(newValue: boolean): void {\n    if (typeof newValue === 'boolean') {\n      this.setChecked(newValue);\n    }\n  }\n\n  /**\n   * Returns value of checkbox\n   * @return {Promise<boolean>}  The checkbox value\n   */\n  @Method()\n  value(): Promise<boolean> {\n    return Promise.resolve(this.isCheckedInternal);\n  }\n\n  /**\n   * Sets internal state of checkbox\n   * @param {boolean} checked the checkbox state\n   */\n  private setChecked = (checked: boolean): void => {\n    this.isCheckedInternal = checked;\n  };\n\n  /**\n   * Handle change events\n   * @param {Event} evt   The original change event\n   * @return {void}\n   * @private\n   * @hidden\n   */\n  private handleCheckboxChange = (evt: Event): void => {\n    if (this.readonly || this.disabled) {\n      return;\n    }\n    this.checkToggle.emit({ evt, checked: !this.isCheckedInternal });\n\n    if (this.checkToggleHandler !== undefined) {\n      this.checkToggleHandler({ evt, checked: !this.isCheckedInternal });\n    }\n    if (typeof this.checked !== 'boolean') {\n      this.setChecked(!this.isCheckedInternal);\n    }\n  };\n\n  /**\n   * Handle focus events\n   * @param {FocusEvent}   evt   The original focus event\n   * @return {void}\n   * @private\n   * @hidden\n   */\n  private handleCheckboxFocus = (evt: FocusEvent): void => {\n    if (this.disabled) {\n      return;\n    }\n    this.checkFocus.emit({ evt, id: this.identifier });\n    if (this.checkFocusHandler !== undefined) {\n      this.checkFocusHandler({ evt, id: this.identifier });\n    }\n  };\n\n  /**\n   * Handle blur events\n   * @param {Event} evt   The original blur event\n   * @return {void}\n   * @private\n   * @hidden\n   */\n  private handleCheckboxBlur = (evt: FocusEvent): void => {\n    if (this.disabled) {\n      return;\n    }\n    this.checkBlur.emit({ evt, id: this.identifier });\n    if (this.checkBlurHandler !== undefined) {\n      this.checkBlurHandler({ evt, id: this.identifier });\n    }\n  };\n\n  /**\n   * Handle key up events\n   * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/checkbox_role#Keyboard_interactions\n   * @param  {KeyboardEvent}    evt   The original keyboard event\n   * @return {void}\n   * @private\n   * @hidden\n   */\n  private handleCheckboxKeyDown = (evt: KeyboardEvent): void => {\n    if (evt.key === 'Enter' || evt.key === ' ') {\n      evt.preventDefault();\n      this.handleCheckboxChange(evt);\n    }\n  };\n\n  protected componentWillLoad(): void {\n    if (this.checked === true || this.checked === false) {\n      this.setChecked(this.checked);\n    }\n  }\n\n  protected componentDidLoad(): void {\n    Pipeline.addComponent(this.el);\n  }\n\n  protected disconnectedCallback(): void {\n    Pipeline.removeComponent(this.el);\n  }\n\n  /**\n   * Handle rendering the input element\n   * @returns {HTMLElement} the input element for the checkbox\n   */\n  private renderInputElement(): HTMLElement {\n    const inputAttributes: {\n      id: string;\n      name: string;\n      tabIndex: number;\n      'aria-hidden': string;\n      checked?: boolean;\n      disabled?: boolean;\n      readonly?: boolean;\n      required?: boolean;\n    } = {\n      id: `ads:checkbox:${this.identifier}:input`,\n      name: this.name,\n      tabIndex: -1,\n      'aria-hidden': 'true',\n    };\n\n    if (this.isCheckedInternal) {\n      inputAttributes['checked'] = true;\n    }\n    if (this.disabled) {\n      inputAttributes['disabled'] = true;\n    }\n    if (this.readonly) {\n      inputAttributes['readonly'] = true;\n    }\n    if (this.required) {\n      inputAttributes['required'] = true;\n    }\n\n    return (<input {...inputAttributes} class=\"c-checkbox__input\" type=\"checkbox\" />) as HTMLElement;\n  }\n\n  /**\n   * Handle rendering the label and cross elements\n   * @param {boolean} isReversed Whether the content is reversed\n   * @returns {VNode} the label and cross elements for the checkbox\n   */\n  private renderContentContainer(isReversed: boolean): VNode {\n    const checkboxClasses = ['c-checkbox__box'];\n    if (isReversed) {\n      checkboxClasses.push('is-reversed');\n    }\n    if (this.isCheckedInternal) {\n      checkboxClasses.push('is-checked');\n    }\n    if (this.disabled) {\n      checkboxClasses.push('is-disabled');\n    }\n    if (this.readonly) {\n      checkboxClasses.push('is-readonly');\n    }\n    if (this.el.classList.contains('is-small')) {\n      checkboxClasses.push('is-small');\n    }\n    const labelText = !isNullOrUndefinedOrEmpty(this.label) ? this.label : this.el.childNodes.length > 0 ? ((<slot />) as HTMLElement) : null;\n    const labelClasses = ['c-checkbox__label'];\n    if (this.required) {\n      labelClasses.push('is-required');\n    }\n\n    // Generate the label\n    const labelAttributes = {\n      tabIndex: this.disabled ? -1 : 0,\n      role: 'checkbox',\n      'aria-checked': this.isCheckedInternal.toString(),\n      'aria-labelledby': !isNullOrUndefined(labelText) ? `ads:checkbox:${this.identifier}:label` : null,\n      'aria-label': isNullOrUndefined(labelText) ? (!isNullOrUndefined(this.srLabel) ? this.srLabel : null) : null,\n      'aria-readonly': this.readonly.toString(),\n      'aria-required': this.required.toString(),\n    };\n\n    const $contentEls = [\n      !isNullOrUndefined(labelText)\n        ? ((\n            <span class={labelClasses.join(' ')} aria-hidden=\"true\" id={`ads:checkbox:${this.identifier}:label`}>\n              {labelText}\n            </span>\n          ) as HTMLElement)\n        : null,\n      <span class=\"c-checkbox__cross\" role=\"presentation\">\n        {generateSVGImage({ data: svgPathData, height, width })}\n      </span>,\n    ];\n\n    if (isReversed) {\n      $contentEls.reverse();\n    }\n\n    return (\n      <div\n        class={checkboxClasses.join(' ')}\n        {...labelAttributes}\n        onBlur={this.handleCheckboxBlur}\n        onFocus={this.handleCheckboxFocus}\n        onKeyDown={this.handleCheckboxKeyDown}\n        onClick={this.handleCheckboxChange}\n      >\n        {$contentEls}\n      </div>\n    ) as VNode;\n  }\n  private getTooltipPosition = (isReversed: boolean) =>\n    isReversed ? (!getIsElementRTL(this.el) ? Positions.LEFT : Positions.RIGHT) : !getIsElementRTL(this.el) ? Positions.RIGHT : Positions.LEFT;\n\n  protected render(): VNode {\n    const isReversed = this.el.classList.contains('is-reversed');\n\n    // Generate the tooltip\n    const $tooltipEl = !isNullOrUndefinedOrEmpty(this.tooltip)\n      ? ((\n          <ads-tooltip\n            theme={this.theme}\n            class=\"c-checkbox__tooltip\"\n            /* eslint-disable */\n            onOpenChange={(evt) => ((evt.target as HTMLAdsTooltipElement).position = this.getTooltipPosition(isReversed))}\n            /* eslint-enable */\n            text={this.tooltip}\n            position={this.getTooltipPosition(isReversed)}\n          />\n        ) as HTMLElement)\n      : null;\n\n    // Generate the helper text\n    const helperLabel = !isNullOrUndefinedOrEmpty(this.helperText)\n      ? ((\n          <div class={`c-checkbox__helper ${this.el.classList.contains('is-small') ? 'is-small' : ''}`}>\n            <label htmlFor={this.name}>{this.helperText}</label>\n          </div>\n        ) as HTMLElement)\n      : null;\n\n    const $elements = [this.renderContentContainer(isReversed), $tooltipEl, this.renderInputElement()];\n    isReversed ? $elements.reverse() : null;\n\n    return (\n      <Fragment>\n        <div id={`ads:checkbox:${this.identifier}`} class=\"c-checkbox\">\n          {$elements}\n        </div>\n        {helperLabel}\n      </Fragment>\n    ) as VNode;\n  }\n}\n","@import 'core';\n\n/**\n * @prop --ads-checkbox-background-color: Default background color\n * @prop --ads-checkbox-background-color-disabled: Disabled background color\n * @prop --ads-checkbox-background-color-readonly: Readonly background color\n *\n * @prop --ads-checkbox-border-color: Default border color\n * @prop --ads-checkbox-border-color-checked: Checked border color\n * @prop --ads-checkbox-border-color-disabled: Disabled border color\n * @prop --ads-checkbox-border-color-readonly: Readonly border color\n *\n * @prop --ads-checkbox-cross-color-checked: Default cross color\n * @prop --ads-checkbox-cross-color-hover: Hovered cross color\n * @prop --ads-checkbox-cross-color-disabled: Disabled cross color\n * @prop --ads-checkbox-cross-color-readonly: Readonly cross color\n *\n * @prop --ads-checkbox-margin-left: Default margin-left\n * @prop --ads-checkbox-margin-right: Default margin-right\n *\n * @prop --ads-checkbox-helper-offset-margin: Helper offset margin\n * @prop --ads-checkbox-helper-offset-small-margin: Helper small offset margin\n *\n * @prop --ads-checkbox-label-color: Default label color\n * @prop --ads-checkbox-label-color-hover: Hovered label color\n * @prop --ads-checkbox-label-color-required: Required label color\n * @prop --ads-checkbox-label-margin-left: Default label margin-left\n * @prop --ads-checkbox-label-margin-right: Default label margin-right\n * @prop --ads-checkbox-label-text-align: Default label text-align\n */\n\n$ads-checkbox-border-color: #a3a8ae;\n$ads-checkbox-size-default: 22px;\n$ads-checkbox-size-small: 16px;\n\n:host {\n  display: inline-block;\n}\n\n:host([theme='default']) .c-checkbox {\n  // Background\n\n  --ads-checkbox-background-color: #{$ads-checkbox-background-color};\n  --ads-checkbox-background-color-disabled: #{$ads-checkbox-background-color-disabled};\n  --ads-checkbox-background-color-readonly: #{$ads-checkbox-background-color-readonly};\n\n  // Border\n\n  --ads-checkbox-border-color: #{$ads-checkbox-border-color};\n  --ads-checkbox-border-color-checked: #{$ads-checkbox-border-color-checked};\n  --ads-checkbox-border-color-disabled: #{$ads-checkbox-border-color-disabled};\n  --ads-checkbox-border-color-readonly: #{$ads-checkbox-border-color-readonly};\n\n  // Cross\n\n  --ads-checkbox-cross-color-checked: #{$ads-checkbox-cross-color-checked};\n  --ads-checkbox-cross-color-hover: #{$ads-checkbox-cross-color-hover};\n  --ads-checkbox-cross-color-disabled: #{$ads-checkbox-cross-color-disabled};\n  --ads-checkbox-cross-color-readonly: #{$ads-checkbox-cross-color-readonly};\n\n  // Label\n\n  --ads-checkbox-label-color: #{$ads-checkbox-label-color};\n  --ads-checkbox-label-color-hover: #{$ads-checkbox-label-color-hover};\n  --ads-checkbox-label-color-required: #{$ads-checkbox-label-color-required};\n}\n\n:host([theme='dark']) .c-checkbox {\n  // Background\n\n  --ads-checkbox-background-color: #{$ads-checkbox-background-color-dark};\n  --ads-checkbox-background-color-disabled: #{$ads-checkbox-background-color-disabled-dark};\n  --ads-checkbox-background-color-readonly: #{$ads-checkbox-background-color-readonly-dark};\n\n  // Border\n\n  --ads-checkbox-border-color: #{$ads-checkbox-border-color-dark};\n  --ads-checkbox-border-color-checked: #{$ads-checkbox-border-color-checked-dark};\n  --ads-checkbox-border-color-disabled: #{$ads-checkbox-border-color-disabled-dark};\n  --ads-checkbox-border-color-readonly: #{$ads-checkbox-border-color-readonly-dark};\n\n  // Cross\n\n  --ads-checkbox-cross-color-checked: #{$ads-checkbox-cross-color-checked-dark};\n  --ads-checkbox-cross-color-hover: #{$ads-checkbox-cross-color-hover-dark};\n  --ads-checkbox-cross-color-disabled: #{$ads-checkbox-cross-color-disabled-dark};\n  --ads-checkbox-cross-color-readonly: #{$ads-checkbox-cross-color-readonly-dark};\n\n  // Label\n\n  --ads-checkbox-label-color: #{$ads-checkbox-label-color-dark};\n  --ads-checkbox-label-color-hover: #{$ads-checkbox-label-color-hover-dark};\n  --ads-checkbox-label-color-required: #{$ads-checkbox-label-color-required-dark};\n}\n\n:host([dir='ltr']) {\n  @include ads-vars-component-checkbox-ltr;\n}\n\n:host([dir='rtl']) {\n  @include ads-vars-component-checkbox-rtl;\n}\n\n:host(:first-child) {\n  * {\n    box-sizing: border-box;\n  }\n}\n\n.c-checkbox {\n  align-items: center;\n  display: inline-flex;\n  font-family: var(--ads-font-family);\n  font-size: unset;\n  margin-left: var(--ads-checkbox-margin-left, $ads-checkbox-margin-left-ltr);\n  margin-right: var(--ads-checkbox-margin-right, $ads-checkbox-margin-right-ltr);\n\n  &__box {\n    cursor: pointer;\n    display: inline-flex;\n    flex-direction: row-reverse;\n    margin: 5px 0;\n  }\n\n  &__cross {\n    align-items: center;\n    display: flex;\n    height: var(--ads-checkbox-size-normal, $ads-checkbox-size-normal);\n    justify-content: center;\n    position: relative;\n    top: 1px;\n    width: var(--ads-checkbox-size-normal, $ads-checkbox-size-normal);\n\n    &::before {\n      background-color: var(--ads-checkbox-background-color, $ads-checkbox-background-color);\n      border-color: var(--ads-checkbox-border-color, $ads-checkbox-border-color);\n      border-radius: 2px;\n      border-style: solid;\n      border-width: $ads-checkbox-border-width;\n      box-sizing: border-box;\n      content: '';\n      display: block;\n      height: inherit;\n      position: relative;\n      width: inherit;\n    }\n\n    svg {\n      display: none;\n      height: 98%;\n      position: absolute;\n      width: 98%;\n    }\n  }\n\n  &__box:not(.is-readonly):not(.is-disabled):hover &__cross,\n  &__box.is-checked &__cross {\n    svg {\n      display: block;\n    }\n  }\n\n  &__box:not(.is-readonly):not(.is-disabled):not(.is-checked) {\n    > .c-checkbox__label:hover {\n      color: var(--ads-checkbox-label-color-hover, $ads-checkbox-label-color-hover);\n      fill: var(--ads-checkbox-label-color-hover, $ads-checkbox-label-color-hover);\n    }\n\n    &:hover .c-checkbox__cross {\n      svg {\n        fill: var(--ads-checkbox-cross-color-hover, $ads-checkbox-cross-color-hover);\n      }\n    }\n  }\n\n  &__box.is-checked .c-checkbox__cross {\n    &::before {\n      border-color: var(--ads-checkbox-border-color-checked, $ads-checkbox-border-color-checked);\n    }\n\n    svg {\n      color: var(--ads-checkbox-cross-color-checked, $ads-checkbox-cross-color-checked);\n      fill: var(--ads-checkbox-cross-color-checked, $ads-checkbox-cross-color-checked);\n    }\n  }\n\n  &__box.is-readonly .c-checkbox__cross {\n    &::before {\n      background-color: var(--ads-checkbox-background-color-readonly, $ads-checkbox-background-color-readonly);\n      border-color: var(--ads-checkbox-border-color-readonly, $ads-checkbox-border-color-readonly);\n    }\n\n    svg {\n      fill: var(--ads-checkbox-cross-color-readonly, $ads-checkbox-cross-color-readonly);\n    }\n  }\n\n  &__box.is-disabled .c-checkbox__cross {\n    &::before {\n      background-color: var(--ads-checkbox-background-color-disabled, $ads-checkbox-background-color-disabled);\n      border-color: var(--ads-checkbox-border-color-disabled, $ads-checkbox-border-color-disabled);\n    }\n\n    svg {\n      fill: var(--ads-checkbox-cross-color-disabled, $ads-checkbox-cross-color-disabled);\n    }\n  }\n\n  &__box.is-readonly,\n  &__box.is-disabled {\n    cursor: default;\n  }\n\n  &__box > &__label {\n    color: var(--ads-checkbox-label-color, $ads-checkbox-label-color);\n    font-family: var(--ads-font-family);\n    margin-left: var(--ads-checkbox-label-margin-left, $ads-checkbox-label-margin-left-ltr);\n    margin-right: var(--ads-checkbox-label-margin-right, $ads-checkbox-label-margin-right-ltr);\n\n    &:empty {\n      margin-left: 0;\n      margin-right: 0;\n    }\n  }\n\n  &__box.is-reversed &__label:not(:empty) {\n    text-align: right;\n    // Variables flipped to support reversed variant\n    margin-left: var(--ads-checkbox-label-margin-right, $ads-checkbox-label-margin-right-ltr);\n    margin-right: var(--ads-checkbox-label-margin-left, $ads-checkbox-label-margin-left-ltr);\n  }\n\n  &__label.is-required::after {\n    color: var(--ads-checkbox-label-color-required, $ads-checkbox-label-color-required);\n    content: '*';\n    margin: 0 2px;\n  }\n\n  &__box.is-small &__cross {\n    height: var(--ads-checkbox-size-small, $ads-checkbox-size-small);\n    top: 3px;\n    width: var(--ads-checkbox-size-small, $ads-checkbox-size-small);\n  }\n\n  &__box:hover.is-small &__cross,\n  &__box.is-small &__cross {\n    &::before {\n      height: var(--ads-checkbox-size-small, $ads-checkbox-size-small);\n      width: var(--ads-checkbox-size-small, $ads-checkbox-size-small);\n    }\n\n    svg {\n      font-size: var(--ads-checkbox-size-small, $ads-checkbox-size-small);\n    }\n  }\n\n  &__input {\n    border: 0;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n  }\n\n  &__tooltip {\n    height: auto;\n    margin: 0 5px;\n    width: auto;\n  }\n\n  &__helper {\n    color: var(--arm-dark-grey);\n    font-size: 0.7rem;\n    margin: var(--ads-checkbox-helper-offset-margin, $ads-checkbox-helper-offset-margin-ltr);\n\n    &.is-small {\n      margin: var(--ads-checkbox-helper-offset-small-margin, $ads-checkbox-helper-offset-small-margin-ltr);\n    }\n  }\n}\n","import { EventTypes, environment, version } from './AppInsights/constants';\nimport { WindowGlobal } from '../types/globalTypes';\n\n/**\n * Send custom event to AppInsights\n * @param  {string} component   The reference to the component\n * @returns {void}\n * @hidden\n */\nconst sendCustomEvent = (component: HTMLElement): void => {\n  try {\n    (window as WindowGlobal)['AppInsights'].trackEvent(\n      {\n        name: EventTypes.COMPONENT_REGISTER,\n      },\n      {\n        component: component.tagName.toLowerCase(),\n        componentId: component.id,\n        environment,\n        version,\n        host: window.location.host,\n      }\n    );\n  } catch (err) {\n    // eslint-disable-next-line no-console\n    console.log('[APP INSIGHTS] Could not send event', err);\n  }\n};\n\n/**\n * Add the component to the pipeline and send component events to AppInsights\n * @param   {HTMLElement} component  The component element\n * @returns {void}\n * @hidden\n */\nexport function add(component: HTMLElement): void {\n  (window as WindowGlobal)['ArmDesignSystem'].pipeline.set(component.id, component.tagName.toLowerCase());\n\n  // Disable sending events to AppInsights during unit tests\n  if (!(window as WindowGlobal)['ArmDesignSystem'].config.getBoolean('_isTesting')) {\n    sendCustomEvent(component);\n  }\n}\n\n/**\n * Remove the component from the pipeline\n * @param   {HTMLElement} component  The component element\n * @returns {void}\n * @hidden\n */\nexport function remove(component: HTMLElement): void {\n  (window as WindowGlobal)['ArmDesignSystem'].pipeline.delete(component.id);\n}\n","import * as Pipeline from '../global/pipeline';\n\n/**\n * Add a component to the ADS pipeline\n * @param  {HTMLElement} component   The component element\n * @return {void}\n */\nexport const addComponent = (component: HTMLElement): void => {\n  Pipeline.add(component);\n};\n\n/**\n * Remove a component from the ADS pipeline\n * @param  {HTMLElement} component   The component element\n * @return {void}\n */\nexport const removeComponent = (component: HTMLElement): void => {\n  Pipeline.remove(component);\n};\n","import { Breakpoint, ButtonLevel, ButtonLevels, ButtonSize, ButtonSizes, WindowGlobal } from '../types/globalTypes';\nimport { EventTypes, environment, version } from '../global/AppInsights/constants';\n\nexport type ShadowRootLegacy = ShadowRoot & { tagName: string };\n\n/**\n * Generates a unique component ID\n * @param   {string}  namespace   The unique id's namespace (e.g. ads)\n * @returns {string}              A generated random id (e.g. ads-1234)\n */\nexport const generateId = (namespace = 'ads'): string => {\n  return `${namespace}-${generateRandomString()}`;\n};\n\n/**\n * Generates a randon string\n * @returns {string}              A generated random string\n */\nexport const generateRandomString = (): string => {\n  return Math.random().toString(36).substr(2, 16);\n};\n\n/**\n * Generates a size class based on a button size\n * @param {ButtonSize}  size    The size of the button (e.g. ButtonSizes.SMALL)\n * @returns {string}            The button size class (e.g. 'is-small')\n */\nexport const getClassFromSize = (size: ButtonSize): string => {\n  switch (size) {\n    case ButtonSizes.MEDIUM:\n      return 'is-medium';\n    case ButtonSizes.SMALL:\n      return 'is-small';\n    default:\n      return '';\n  }\n};\n\n/**\n * Generates a level class based on button a level\n * @param {ButtonLevel} level   The level of the button (e.g. ButtonLevels.PRIMARY)\n * @returns {string}            The button level class (e.g. 'is-primary')\n */\nexport const getClassFromLevel = (level: ButtonLevel): string => {\n  switch (level) {\n    case ButtonLevels.PRIMARY:\n      return 'is-primary';\n    case ButtonLevels.SECONDARY:\n      return 'is-secondary';\n    case ButtonLevels.TERTIARY:\n      return 'is-tertiary';\n    default:\n      return '';\n  }\n};\n\n/**\n * Given a breakpoint it will return the appropriate class for the media-queries (breakpoints-up).\n * @param {Breakpoint} bp The breakpoint.\n * @returns {string} The class.\n */\nexport const getMediaQueryBreakpointClassUp = (bp: Breakpoint): string => `${bp.toString()}-up`;\n\n/**\n * Given a breakpoint it will return the appropriate class for the media-queries (breakpoints-down).\n * @param {Breakpoint} bp The breakpoint.\n * @returns {string} The class.\n */\nexport const getMediaQueryBreakpointClassDown = (bp: Breakpoint): string => `${bp.toString()}-down`;\n\n/**\n * Display an ADS warning with the given message\n * @param {string}  message       The error message to show\n * @param {string}  component     The reference to the component\n * @returns {void}\n */\nexport const showErrorMessage = (message: string, component: HTMLElement): void => {\n  try {\n    (window as WindowGlobal)['AppInsights'].trackEvent(\n      {\n        name: EventTypes.ADS_CONSOLE_ERROR as string,\n      },\n      {\n        component: component.tagName.toLowerCase(),\n        componentId: component.id,\n        message: message,\n        environment,\n        version,\n        host: window.location.host,\n      }\n    );\n  } catch (err) {\n    // eslint-disable-next-line no-console\n    console.log('[APP INSIGHTS] Could not send console error', err);\n  }\n  // eslint-disable-next-line no-console\n  console.warn(`ADS-Warning: ${message}`);\n};\n","import { SVGIconData } from '../components/core/interfaces/Icon';\nimport { h } from '@stencil/core';\n\n/**\n * Generates an SVG image\n * @param   {IconData}       icon        The SVG image properties\n * @param   {string}            className   The SVG image class name\n * @returns {HTMLElement}                   The generated SVG image\n */\nexport const generateSVGImage = (icon: SVGIconData, className?: string): HTMLElement => {\n  return (\n    <svg class={className ? className : null} xmlns=\"http://www.w3.org/2000/svg\" viewBox={`0 0 ${icon.width} ${icon.height}`}>\n      <path d={icon.data} />\n    </svg>\n  ) as HTMLElement;\n};\n","import { Breakpoint } from '../components/core/types/globalTypes';\nimport { isNullOrUndefined } from './collection';\nimport config from './../styles/settings/configs/breakpoints-config.json';\n\n/**\n * Match media types\n */\nexport enum MediaTypes {\n  minWidth = 'min-width',\n  maxWidth = 'max-width',\n}\n\n/**\n * Returns the list all of breakpoint keys\n * @returns {Breakpoint[]} The list of breakpoints\n */\nexport const getBreakpoints = (): Breakpoint[] => Object.keys(config.breakpoints) as Breakpoint[];\n\n/**\n * Returns the breakpoint in pixels\n * @param {Breakpoint} breakpoint The breakpoint\n * @returns {number} The breakpoint value in pixels\n */\nexport const getBreakpointInPixels = (breakpoint: Breakpoint): number => parseInt(config.breakpoints[breakpoint], 10);\n\n/**\n * Returns the breakpoint key for given pixels\n * @param {number} pixels The pixels of the breakpoint\n * @returns {Breakpoint} The breakpoint key\n */\nexport const getBreakpointFromPixels = (pixels: number): Breakpoint =>\n  Object.keys(config.breakpoints)[\n    Object.values(config.breakpoints)\n      .map((bp) => parseInt(bp, 10))\n      .findIndex((bpPixels) => bpPixels === pixels)\n  ] as Breakpoint;\n\nconst mediaQueryLists: MediaQueryList[] = [];\n\n/**\n * Adds matchMedia to window with the given properties.\n * @param {MediaTypes} mediaType The type of media\n * @param {Sizes} breakpoint The media size\n * @param {Function} listenerFunction Callback function for the listener\n */\nexport const addMatchMedia = (\n  mediaType: MediaTypes,\n  breakpoint: Breakpoint,\n  listenerFunction: (this: MediaQueryList, ev: MediaQueryListEvent) => unknown\n): void => {\n  const foundMatchMedia = mediaQueryLists.find((m) => m.media === `(${mediaType}: ${config.breakpoints[breakpoint]})`);\n  if (!isNullOrUndefined(foundMatchMedia)) {\n    foundMatchMedia.addEventListener('change', listenerFunction);\n  } else {\n    const newMatchMedia = window.matchMedia(`(${mediaType}: ${config.breakpoints[breakpoint]})`);\n    mediaQueryLists.push(newMatchMedia);\n    newMatchMedia.addEventListener('change', listenerFunction);\n  }\n};\n\n/**\n * Removes matchMedia from window with the given properties.\n * @param {MediaTypes} mediaType The type of media\n * @param {Sizes} breakpoint The media size\n * @param {Function} listenerFunction Callback function to be removed from the listener\n */\nexport const removeMatchMedia = (\n  mediaType: MediaTypes,\n  breakpoint: Breakpoint,\n  listenerFunction: (this: MediaQueryList, ev: MediaQueryListEvent) => unknown\n): void => {\n  mediaQueryLists.find((m) => m.media === `(${mediaType}: ${config.breakpoints[breakpoint]})`)?.removeEventListener('change', listenerFunction);\n};\n\n/**\n * Matches the current window with the given media type and breakpoint\n * @param {MediaTypes} mediaType The media type\n * @param {Breakpoint} breakpoint The breakpoint\n * @returns {boolean} True if it matches, false otherwise\n */\nexport const mediaMatchingBreakpoint = (mediaType: MediaTypes, breakpoint: Breakpoint): boolean => {\n  const foundMatchMedia = mediaQueryLists.find((m) => m.media === `(${mediaType}: ${config.breakpoints[breakpoint]})`);\n  if (!isNullOrUndefined(foundMatchMedia)) {\n    return foundMatchMedia.matches;\n  }\n  const newMatchMedia = window.matchMedia(`(${mediaType}: ${config.breakpoints[breakpoint]})`);\n  mediaQueryLists.push(newMatchMedia);\n  return newMatchMedia.matches;\n};\n","import { isNullOrUndefined } from './collection';\n\ninterface ResizeCallback {\n  callback: () => void;\n  duration: number;\n  timeout?: NodeJS.Timeout;\n}\n\nconst defaultTimeout = 50;\n\nconst callbacks: ResizeCallback[] = [];\n\nwindow.onresize = () => {\n  callbacks.map((cb: ResizeCallback) => {\n    if (isNullOrUndefined(cb.timeout)) {\n      cb.callback();\n      cb.timeout = setTimeout(() => {\n        cb.timeout = null;\n      }, cb.duration);\n    }\n  });\n};\n\n/**\n * Subscribe to the resize listener\n * @param {function} callback The callback function to run on resize\n * @param {number} timeoutDuration The throttle timeout duration\n */\nexport const subscribeToWindowResize = (callback: () => void, timeoutDuration: number = defaultTimeout): void => {\n  callbacks.push({ callback, duration: timeoutDuration });\n};\n\n/**\n * Unsubscribe to the resize listener\n * @param {function} callback The callback function to unsubscribe\n */\nexport const unSubscribeToWindowResize = (callback: () => void): void => {\n  const index = callbacks.findIndex((cb: ResizeCallback) => cb.callback === callback);\n  if (index >= 0) {\n    if (!isNullOrUndefined(callbacks[index].timeout)) {\n      clearTimeout(callbacks[index].timeout);\n    }\n    callbacks.splice(index, 1);\n  }\n};\n","import { Directions } from '../components/core/types/globalTypes';\nimport { isNullOrUndefined } from './collection';\n\n/**\n * Goes through the provided list of elements recursively and returns the underlying content from slot elements\n * @param {HTMLElement[]} slotElements  A list of elements to go through\n * @returns {HTMLElement[]}             The underlying content\n */\nexport const getContentFromSlotElementsRecursively = (slotElements: HTMLElement[]): HTMLElement[] => {\n  return slotElements.reduce((acc: HTMLElement[], currentValue) => {\n    if (currentValue.tagName && currentValue.tagName.toLowerCase() === 'slot') {\n      const tmpSlotElement = currentValue as HTMLSlotElement;\n      return getContentFromSlotElementsRecursively(tmpSlotElement.assignedElements() as HTMLElement[]);\n    }\n    acc.push(currentValue);\n    return acc;\n  }, []);\n};\n\n/**\n * Going up the chain of elements, it will return true if the given element is a child of the root node and false if it sits under an other (slotted) element\n * @param {HTMLElement} componentEl     The root element (parent)\n * @param {HTMLElement} element         The element in question\n * @param {number} maxIterations        Optional. Number of steps to find the parent. Default: 10\n * @returns {boolean}                   Whether or not the given element is a child of the root node\n */\nconst isElementChildOfComponent = (componentEl: HTMLElement, element: HTMLElement, maxIterations = 10): boolean => {\n  {\n    let tmpElement = element;\n    for (let index = 0; index < maxIterations; index++) {\n      if (tmpElement.parentElement === componentEl) {\n        return true;\n      }\n      if (!tmpElement.parentElement || tmpElement.parentElement.getAttribute('slot')) {\n        return false;\n      }\n\n      tmpElement = tmpElement.parentElement;\n    }\n  }\n};\n\n/**\n * Returns the content elements of the slots within a component\n * If browser doesn't support slots, it will return all the elements that are assigned to the space where the slot should be\n * @param {HTMLElement} element         The parent element\n * @param {string} slotName             Optional slot name for filtering results\n * @returns {Element[]}                 The content elements of the slots within a component\n */\nexport const getSlottedElements = (element: HTMLElement, slotName = ''): Element[] => {\n  const selector = slotName ? `slot[name=${slotName}]` : 'slot';\n\n  return getContentFromSlotElementsRecursively(\n    Array.from(element.shadowRoot.querySelectorAll(selector))\n      .map((slotElement: HTMLSlotElement) => slotElement.assignedNodes() as HTMLElement[])\n      .flat()\n  );\n};\n\n/**\n * Returns all the child elements within a slot property, regardless of them being in an actual slot or not\n * @param {HTMLElement} element         The parent element\n * @param {string} slotName             Optional slot name for filtering results\n * @returns {Element[]}                 The child elements within a slot\n */\nexport const getAllElementsWithSlotAttribute = (element: HTMLElement, slotName = ''): Element[] => {\n  const selector = slotName ? `[slot=${slotName}]` : '[slot]';\n  return Array.from(element.querySelectorAll(selector)).filter((el: HTMLElement) => isElementChildOfComponent(element, el));\n};\n\n/**\n * Going up the chain of elements, it returns the first element with the given attribute\n * @param {HTMLElement} el              The src element\n * @param {string} attribute            The attribute to look for\n * @param {string} attributeValue       The attribute value to look for\n * @param {number} maxIterations        Max iterations. Default 10\n * @returns {HTMLElement}               The first element with the given attribute\n */\nexport const getFirstParentWithAttribute = (el: HTMLElement, attribute: string, attributeValue: string, maxIterations = 10): HTMLElement => {\n  if (el.getAttribute(attribute) === attributeValue) {\n    return el;\n  }\n  let currentEl = el;\n  let currentIteration = 0;\n  while (currentEl && currentEl.parentElement && currentIteration <= maxIterations) {\n    const parentAttr = currentEl.parentElement.getAttribute(attribute);\n    if (parentAttr && parentAttr.toString().toLowerCase() === attributeValue.toString().toLowerCase()) {\n      return currentEl.parentElement;\n    }\n    currentEl = currentEl.parentElement;\n    currentIteration++;\n  }\n  return null;\n};\n\n/**\n * Starting from the given element, goes upwards in the dom accounting for slots and shadowRoot, it will return if the given element sits under an other element\n * @param {Element} el1 The descendant element\n * @param {Element} el2 The parent element\n * @param {number} maxIterations max iterations. Default = 20\n * @returns {boolean} True if element one is a descendant (in the DOM) of element two\n */\nexport const getIsElementDescendantOfElement = (el1: Element, el2: Element, maxIterations = 20): boolean => {\n  const getParentInDom = (el: Element): Element => {\n    // if it's under a slot, go to the slot\n    if (el.assignedSlot) {\n      return el.assignedSlot;\n      // if not under slot get the normal parent\n    } else if (el.parentElement) {\n      return el.parentElement;\n      // if there is no parent try and find the shadowroot host that contains the element\n    } else if (el.getRootNode()) {\n      const rootNode = el.getRootNode() as ShadowRoot;\n      return rootNode.host;\n    }\n  };\n\n  let currentIteration = 0;\n  let currentParent: Element = getParentInDom(el1);\n\n  while (currentParent && currentIteration <= maxIterations) {\n    if (currentParent === el2) {\n      return true;\n    }\n    currentParent = getParentInDom(currentParent);\n    currentIteration++;\n  }\n  return false;\n};\n\n/**\n * Given an element, calculate whether it should render in RTL mode\n * @param {Element} elem The element in question\n * @returns {boolean} Whether the element should render in RTL mode\n */\nexport const getIsElementRTL = (elem: Element): boolean => {\n  return (\n    elem.getAttribute('dir') === Directions.RTL ||\n    (document.documentElement.getAttribute('dir') === Directions.RTL && elem.getAttribute('dir') !== Directions.LTR)\n  );\n};\n\n/**\n * Sets a MutationObserver to detect dir change on the HTML element\n * @param {Function} onDirMutationCallback Callback to be executed when dir changes\n * @returns {MutationObserver} The mutation observer obj\n */\nexport const getHtmlDirObserver = (onDirMutationCallback: (htmlDirMutation?: MutationRecord) => void): MutationObserver => {\n  const config = { attributes: true, childList: false, subtree: false };\n  const obs = new MutationObserver((mutationList) => {\n    const htmlDirMutation = mutationList.find((ml) => ml.target.nodeName.toLowerCase() === 'html' && ml.attributeName === 'dir');\n    if (!isNullOrUndefined(htmlDirMutation)) {\n      onDirMutationCallback(htmlDirMutation);\n    }\n  });\n  obs.observe(document.documentElement, config);\n  return obs;\n};\n","'use strict';\nObject.defineProperty(exports, '__esModule', { value: true });\nvar prefix = 'far';\nvar iconName = 'xmark';\nvar width = 384;\nvar height = 512;\nvar aliases = [128473,10005,10006,10060,215,\"close\",\"multiply\",\"remove\",\"times\"];\nvar unicode = 'f00d';\nvar svgPathData = 'M345 137c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-119 119L73 103c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l119 119L39 375c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l119-119L311 409c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-119-119L345 137z';\n\nexports.definition = {\n  prefix: prefix,\n  iconName: iconName,\n  icon: [\n    width,\n    height,\n    aliases,\n    unicode,\n    svgPathData\n  ]};\n\nexports.faXmark = exports.definition;\nexports.prefix = prefix;\nexports.iconName = iconName;\nexports.width = width;\nexports.height = height;\nexports.ligatures = aliases;\nexports.unicode = unicode;\nexports.svgPathData = svgPathData;\nexports.aliases = aliases;","'use strict';\nObject.defineProperty(exports, '__esModule', { value: true });\nvar source = require('./faXmark');\nexports.definition = {\n  prefix: source.prefix,\n  iconName: source.iconName,\n  icon: [\n    source.width,\n    source.height,\n    source.aliases,\n    source.unicode,\n    source.svgPathData\n  ]};\n\nexports.faTimes = exports.definition;\nexports.prefix = source.prefix;\nexports.iconName = source.iconName;\nexports.width = source.width;\nexports.height = source.height;\nexports.ligatures = source.aliases;\nexports.unicode = source.unicode;\nexports.svgPathData = source.svgPathData;\nexports.aliases = source.aliases;"],"sourceRoot":""}