@carbon/web-components 2.57.0 → 2.58.0

package/es/components/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/select/select.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, query, queryAll } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport FormMixin from '../../globals/mixins/form';\nimport { filter } from '../../globals/internal/collection-helpers';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport styles from './select.scss?lit';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Select box.\n *\n * @element cds-select\n * @fires cds-select-selected\n *   The name of the custom event fired after an item is selected.\n * @slot helper-text - The helper text.\n * @slot label-text - The label text.\n * @slot validity-message - The validity message. If present and non-empty, this input shows the UI of its invalid state.\n */\n@customElement(`${prefix}-select`)\nclass CDSSelect extends FormMixin(LitElement) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * The mutation observer DOM mutation.\n   */\n  private _observerMutation: MutationObserver | null = null;\n\n  /**\n   * The `value` for placeholder `<option>`.\n   */\n  private _placeholderItemValue = `__${prefix}-select-placeholder_${Math.random()\n    .toString(36)\n    .slice(2)}`;\n\n  /**\n   * The select box.\n   */\n  @query('select')\n  private _selectNode!: HTMLSelectElement;\n\n  /**\n   * Select all <option> nodes with `selected` attribute\n   */\n  @queryAll(`.${prefix}--select-option[selected]`)\n  private _selectedOptionNodes!: HTMLOptionElement[];\n\n  /**\n   * Specify whether the textarea is fluid or not\n   */\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput({ target }: Event) {\n    const { value } = target as HTMLSelectElement;\n    this.value = value;\n    const { eventSelect } = this.constructor as typeof CDSSelect;\n    this.dispatchEvent(\n      new CustomEvent(eventSelect, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          value,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles DOM mutation of `<cds-select-item>` or `<cds-select-item-group>` put in `<cds-select>`, or their changes.\n   * In such event, `<cds-select>` creates the corresponding `<option>` and `<optgroup>`, respectively, into shadow DOM,\n   * with `._renderItems()`.\n   * Doing so allows the shadow DOM style of `<cds-select>` to control the style of the `<option>` and `<optgroup>`,\n   * notably the disabled ones.\n   */\n  private _handleMutation = () => {\n    this.requestUpdate();\n  };\n\n  /**\n   * @param element The parent element containing pseudo `<optgroup>`/`<option>`.\n   * @returns The template containing child `<optgroup>`/`<option>` that will be rendered to shadow DOM.\n   */\n  private _renderItems(element: CDSSelect | HTMLOptGroupElement) {\n    const { selectorItem, selectorLeafItem } = this\n      .constructor as typeof CDSSelect;\n    // Harvests attributes from `<cds-select-item>` and `<cds-select-item-group>`.\n    // Does not use properties to avoid delay in attribute to property mapping, which runs in custom element reaction cycle:\n    // https://html.spec.whatwg.org/multipage/custom-elements.html#custom-element-reactions\n    return html`\n      ${filter(\n        element.childNodes,\n        (item) =>\n          item.nodeType === Node.ELEMENT_NODE &&\n          (item as Element).matches(selectorItem)\n      ).map((item) => {\n        const disabled = item.hasAttribute('disabled');\n        const label = item.getAttribute('label');\n        const selected = item.hasAttribute('selected');\n        const value = item.getAttribute('value');\n        const { textContent } = item;\n        return item.matches(selectorLeafItem)\n          ? html`\n              <option\n                class=\"${prefix}--select-option\"\n                ?disabled=\"${disabled}\"\n                label=\"${ifNonEmpty(label)}\"\n                ?selected=\"${selected}\"\n                value=\"${ifDefined(value)}\">\n                ${textContent}\n              </option>\n            `\n          : html`\n              <optgroup\n                class=\"${prefix}--select-optgroup\"\n                ?disabled=\"${disabled}\"\n                label=\"${ifDefined(label)}\">\n                ${this._renderItems(item)}\n              </optgroup>\n            `;\n      })}\n    `;\n  }\n\n  _handleFormdata(event: FormDataEvent) {\n    const { formData } = event;\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleAILabelSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelect).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelect).slugItem\n            )\n          : false\n      );\n\n    this._hasAILabel = Boolean(hasContent);\n    this.setAttribute('slug', `${this._hasAILabel}`);\n    (hasContent[0] as HTMLElement).setAttribute('size', 'mini');\n    this.requestUpdate();\n  }\n\n  /**\n   * The count of child `<option>`s.\n   * If the placeholder is in effect, it includes the `<option>` for the placeholder.\n   */\n  get length() {\n    return this._selectNode.length;\n  }\n\n  /**\n   * The child `<option>`s.\n   */\n  get options() {\n    return this._selectNode.options;\n  }\n\n  /**\n   * This form control's type.\n   */\n  get type() {\n    return this._selectNode.type;\n  }\n\n  /**\n   * Sets the select to be focussed automatically on page load. Defaults to false\n   */\n  @property({ type: Boolean })\n  autofocus = false;\n\n  /**\n   * Controls the disabled state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\n\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * ID to link the `label` and `select`\n   */\n  @property()\n  id = 'select';\n\n  /**\n   * Specify if the currently value is invalid.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * Message which is displayed if the value is invalid.\n   */\n  @property({ attribute: 'invalid-text' })\n  invalidText = '';\n\n  /**\n   * Specify if the currently value is warn.\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Message which is displayed if the value is warn.\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText = '';\n\n  /**\n   * Specify if you want to disable the default label styling\n   */\n  @property({ type: Boolean, attribute: 'label-styles-disable' })\n  labelStylesDisable = false;\n\n  /**\n   * Specify whether you want the inline version of this control\n   */\n  @property({ type: Boolean, reflect: true })\n  inline = false;\n\n  /**\n   * `true` to enable multiple selection.\n   */\n  @property({ type: Boolean })\n  get multiple() {\n    return false;\n  }\n\n  /**\n   * Name for the select in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the select against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the select has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Controls the readonly state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The special validity message for `required`.\n   */\n  @property({ attribute: 'required-validity-message' })\n  requiredValidityMessage = 'Please fill out this field.';\n\n  /**\n   * The selected index.\n   */\n  @property({ type: Number })\n  get selectedIndex() {\n    return this._selectNode?.selectedIndex;\n  }\n\n  set selectedIndex(value) {\n    this._selectNode.selectedIndex = value;\n    this.value = this._selectNode.value;\n  }\n\n  /**\n   * The input box size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  /**\n   * The value of the text area.\n   */\n  @property({ reflect: true })\n  value = '';\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._observerMutation = new MutationObserver(this._handleMutation);\n    this._observerMutation.observe(this, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this._observerMutation) {\n      this._observerMutation.disconnect();\n      this._observerMutation = null;\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('value')) {\n      const { value, _placeholderItemValue: placeholderItemValue } = this;\n      // Ensures setting the `value` after rendering child `<option>`s/`<optgroup>`s when there is a change in `value`,\n      // given reflecting `value` requires child `<option>`s/`<optgroup>`s being there beforehand\n\n      const lastOption =\n        this._selectedOptionNodes?.[this._selectedOptionNodes?.length - 1]?.[\n          'value'\n        ];\n\n      if (value) {\n        this._selectNode.value = value;\n      } else if (lastOption) {\n        this._selectNode.value = lastOption;\n      } else {\n        this._selectNode.value = placeholderItemValue;\n      }\n    }\n\n    const label = this.shadowRoot?.querySelector(\"slot[name='ai-label']\");\n\n    if (label) {\n      if ((label as HTMLSlotElement).assignedNodes()?.length) {\n        this._selectNode?.classList.add(\n          `${prefix}--select-input-has--ai-label`\n        );\n      }\n\n      label?.classList.toggle(\n        `${prefix}--slug--revert`,\n        this.querySelector(`${prefix}-ai-label`)?.hasAttribute('revert-active')\n      );\n    } else {\n      this.shadowRoot\n        ?.querySelector(\"slot[name='slug']\")\n        ?.classList.toggle(\n          `${prefix}--slug--revert`,\n          this.querySelector(`${prefix}-slug`)?.hasAttribute('revert-active')\n        );\n    }\n  }\n\n  render() {\n    const {\n      disabled,\n      helperText,\n      hideLabel,\n      id,\n      inline,\n      invalid,\n      invalidText,\n      labelStylesDisable,\n      labelText,\n      placeholder,\n      readonly,\n      size,\n      warn,\n      warnText,\n      value,\n      _placeholderItemValue: placeholderItemValue,\n      _handleInput: handleInput,\n      _handleAILabelSlotChange: handleAILabelSlotChange,\n    } = this;\n\n    const normalizedProps: {\n      disabled: boolean;\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      disabled: !readonly && disabled,\n      invalid: !readonly && !disabled && invalid,\n      warn: !readonly && !invalid && !disabled && warn,\n    };\n\n    const inputClasses = classMap({\n      [`${prefix}--select-input`]: true,\n      [`${prefix}--select-input--${size}`]: size !== undefined,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: !labelStylesDisable,\n      [`${prefix}--label--disabled`]: normalizedProps.disabled,\n      [`${prefix}--visually-hidden`]: hideLabel,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: normalizedProps.disabled,\n    });\n\n    const supplementalText = helperText\n      ? html`\n          <div id=\"helper-text\" class=\"${helperTextClasses}\">\n            <slot name=\"helper-text\"> ${helperText} </slot>\n          </div>\n        `\n      : null;\n\n    const errorText =\n      normalizedProps.invalid || normalizedProps.warn\n        ? html` <div id=\"error-text\" class=\"${prefix}--form-requirement\">\n            ${normalizedProps.invalid ? invalidText : warnText}\n          </div>`\n        : null;\n\n    let describedBy: string | undefined;\n    if (normalizedProps.invalid || normalizedProps.warn) {\n      describedBy = 'error-text';\n    } else if (helperText) {\n      describedBy = 'helper-text';\n    }\n\n    const input = html`\n      <select\n        id=\"${id}\"\n        class=\"${inputClasses}\"\n        ?disabled=\"${disabled}\"\n        title=\"${value}\"\n        aria-readonly=\"${String(readonly)}\"\n        aria-invalid=\"${String(normalizedProps.invalid)}\"\n        aria-describedby=\"${ifDefined(describedBy)}\"\n        @input=\"${handleInput}\">\n        ${!placeholder || value\n          ? undefined\n          : html`\n              <option\n                disabled\n                hidden\n                class=\"${prefix}--select-option\"\n                value=\"${placeholderItemValue}\">\n                ${placeholder}\n              </option>\n            `}\n        ${this._renderItems(this)}\n      </select>\n      ${iconLoader(ChevronDown16, {\n        class: `${prefix}--select__arrow`,\n        'aria-hidden': 'true',\n      })}\n      <slot\n        name=\"ai-label\"\n        style=\"--${prefix}-show-before: ${normalizedProps.warn ||\n        normalizedProps.invalid\n          ? 'block'\n          : 'none'}\"\n        @slotchange=${handleAILabelSlotChange}></slot>\n      <slot name=\"slug\" @slotchange=${handleAILabelSlotChange}></slot>\n      ${!normalizedProps.invalid\n        ? undefined\n        : iconLoader(WarningFilled16, {\n            class: `${prefix}--select__invalid-icon`,\n          })}\n      ${!normalizedProps.invalid && normalizedProps.warn\n        ? iconLoader(WarningAltFilled16, {\n            class: `${prefix}--select__invalid-icon ${prefix}--select__invalid-icon--warning`,\n          })\n        : null}\n    `;\n\n    return html`\n      <label class=\"${labelClasses}\" for=${id}>\n        <slot name=\"label-text\">${labelText}</slot>\n      </label>\n\n      ${inline\n        ? html`<div\n            class=\"${prefix}--select-input--inline__wrapper\"\n            ?data-invalid=\"${normalizedProps.invalid}\">\n            <div\n              class=\"${prefix}--select-input__wrapper\"\n              ?data-invalid=\"${normalizedProps.invalid}\">\n              ${input}\n            </div>\n          </div>`\n        : html`<div\n            class=\"${prefix}--select-input__wrapper\"\n            ?data-invalid=\"${normalizedProps.invalid}\">\n            ${input}\n            ${this.isFluid\n              ? html`\n                  <hr class=\"${prefix}--select__divider\" />\n                  ${errorText ? errorText : null}\n                `\n              : null}\n          </div> `}\n      ${!this.isFluid && errorText ? errorText : supplementalText}\n    `;\n  }\n\n  /**\n   * A selector selecting child pseudo `<optgroup>`/`<option>`.\n   */\n  static get selectorItem() {\n    return `${prefix}-select-item-group,${prefix}-select-item`;\n  }\n\n  /**\n   * A selector selecting child pseudo `<option>`.\n   */\n  static get selectorLeafItem() {\n    return `${prefix}-select-item`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  /**\n   * The name of the custom event fired after item is selected.\n   */\n  static get eventSelect() {\n    return `${prefix}-select-selected`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSelect;\n"],"mappings":"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"}
+{"version":3,"file":"select.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/select/select.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, query, queryAll } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport FormMixin from '../../globals/mixins/form';\nimport { filter } from '../../globals/internal/collection-helpers';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport styles from './select.scss?lit';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Select box.\n *\n * @element cds-select\n * @fires cds-select-selected\n *   The name of the custom event fired after an item is selected.\n * @slot helper-text - The helper text.\n * @slot label-text - The label text.\n * @slot validity-message - The validity message. If present and non-empty, this input shows the UI of its invalid state.\n */\n@customElement(`${prefix}-select`)\nclass CDSSelect extends FormMixin(LitElement) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * The mutation observer DOM mutation.\n   */\n  private _observerMutation: MutationObserver | null = null;\n\n  /**\n   * The `value` for placeholder `<option>`.\n   */\n  private _placeholderItemValue = `__${prefix}-select-placeholder_${Math.random()\n    .toString(36)\n    .slice(2)}`;\n\n  /**\n   * The select box.\n   */\n  @query('select')\n  private _selectNode!: HTMLSelectElement;\n\n  /**\n   * Select all <option> nodes with `selected` attribute\n   */\n  @queryAll(`.${prefix}--select-option[selected]`)\n  private _selectedOptionNodes!: HTMLOptionElement[];\n\n  /**\n   * Specify whether the textarea is fluid or not\n   */\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput({ target }: Event) {\n    const { value } = target as HTMLSelectElement;\n    this.value = value;\n    const { eventSelect } = this.constructor as typeof CDSSelect;\n    this.dispatchEvent(\n      new CustomEvent(eventSelect, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          value,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles DOM mutation of `<cds-select-item>` or `<cds-select-item-group>` put in `<cds-select>`, or their changes.\n   * In such event, `<cds-select>` creates the corresponding `<option>` and `<optgroup>`, respectively, into shadow DOM,\n   * with `._renderItems()`.\n   * Doing so allows the shadow DOM style of `<cds-select>` to control the style of the `<option>` and `<optgroup>`,\n   * notably the disabled ones.\n   */\n  private _handleMutation = () => {\n    this.requestUpdate();\n  };\n\n  /**\n   * @param element The parent element containing pseudo `<optgroup>`/`<option>`.\n   * @returns The template containing child `<optgroup>`/`<option>` that will be rendered to shadow DOM.\n   */\n  private _renderItems(element: CDSSelect | HTMLOptGroupElement) {\n    const { selectorItem, selectorLeafItem } = this\n      .constructor as typeof CDSSelect;\n    // Harvests attributes from `<cds-select-item>` and `<cds-select-item-group>`.\n    // Does not use properties to avoid delay in attribute to property mapping, which runs in custom element reaction cycle:\n    // https://html.spec.whatwg.org/multipage/custom-elements.html#custom-element-reactions\n    return html`\n      ${filter(\n        element.childNodes,\n        (item) =>\n          item.nodeType === Node.ELEMENT_NODE &&\n          (item as Element).matches(selectorItem)\n      ).map((item) => {\n        const disabled = item.hasAttribute('disabled');\n        const label = item.getAttribute('label');\n        const selected = item.hasAttribute('selected');\n        const value = item.getAttribute('value');\n        const { textContent } = item;\n        return item.matches(selectorLeafItem)\n          ? html`\n              <option\n                class=\"${prefix}--select-option\"\n                ?disabled=\"${disabled}\"\n                label=\"${ifNonEmpty(label)}\"\n                ?selected=\"${selected}\"\n                value=\"${ifDefined(value)}\">\n                ${textContent}\n              </option>\n            `\n          : html`\n              <optgroup\n                class=\"${prefix}--select-optgroup\"\n                ?disabled=\"${disabled}\"\n                label=\"${ifDefined(label)}\">\n                ${this._renderItems(item)}\n              </optgroup>\n            `;\n      })}\n    `;\n  }\n\n  _handleFormdata(event: FormDataEvent) {\n    const { formData } = event;\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleAILabelSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelect).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelect).slugItem\n            )\n          : false\n      );\n\n    this._hasAILabel = Boolean(hasContent);\n    this.setAttribute('slug', `${this._hasAILabel}`);\n    (hasContent[0] as HTMLElement).setAttribute('size', 'mini');\n    this.requestUpdate();\n  }\n\n  /**\n   * The count of child `<option>`s.\n   * If the placeholder is in effect, it includes the `<option>` for the placeholder.\n   */\n  get length() {\n    return this._selectNode.length;\n  }\n\n  /**\n   * The child `<option>`s.\n   */\n  get options() {\n    return this._selectNode.options;\n  }\n\n  /**\n   * This form control's type.\n   */\n  get type() {\n    return this._selectNode.type;\n  }\n\n  /**\n   * Sets the select to be focussed automatically on page load. Defaults to false\n   */\n  @property({ type: Boolean })\n  autofocus = false;\n\n  /**\n   * Controls the disabled state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\n\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * ID to link the `label` and `select`\n   */\n  @property()\n  id = 'select';\n\n  /**\n   * Specify if the currently value is invalid.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * Message which is displayed if the value is invalid.\n   */\n  @property({ attribute: 'invalid-text' })\n  invalidText = '';\n\n  /**\n   * Specify if the currently value is warn.\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Message which is displayed if the value is warn.\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText = '';\n\n  /**\n   * Specify if you want to disable the default label styling\n   */\n  @property({ type: Boolean, attribute: 'label-styles-disable' })\n  labelStylesDisable = false;\n\n  /**\n   * Specify whether you want the inline version of this control\n   */\n  @property({ type: Boolean, reflect: true })\n  inline = false;\n\n  /**\n   * `true` to enable multiple selection.\n   */\n  @property({ type: Boolean })\n  get multiple() {\n    return false;\n  }\n\n  /**\n   * Name for the select in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the select against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the select has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Controls the readonly state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The special validity message for `required`.\n   */\n  @property({ attribute: 'required-validity-message' })\n  requiredValidityMessage = 'Please fill out this field.';\n\n  /**\n   * The selected index.\n   */\n  @property({ type: Number })\n  get selectedIndex() {\n    return this._selectNode?.selectedIndex;\n  }\n\n  set selectedIndex(value) {\n    this._selectNode.selectedIndex = value;\n    this.value = this._selectNode.value;\n  }\n\n  /**\n   * The input box size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  /**\n   * The value of the text area.\n   */\n  @property({ reflect: true })\n  value = '';\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._observerMutation = new MutationObserver(this._handleMutation);\n    this._observerMutation.observe(this, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this._observerMutation) {\n      this._observerMutation.disconnect();\n      this._observerMutation = null;\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('value')) {\n      const { value, _placeholderItemValue: placeholderItemValue } = this;\n      // Ensures setting the `value` after rendering child `<option>`s/`<optgroup>`s when there is a change in `value`,\n      // given reflecting `value` requires child `<option>`s/`<optgroup>`s being there beforehand\n\n      const lastOption =\n        this._selectedOptionNodes?.[this._selectedOptionNodes?.length - 1]?.[\n          'value'\n        ];\n\n      if (value) {\n        this._selectNode.value = value;\n      } else if (lastOption) {\n        this._selectNode.value = lastOption;\n      } else {\n        this._selectNode.value = placeholderItemValue;\n      }\n    }\n\n    const label = this.shadowRoot?.querySelector(\"slot[name='ai-label']\");\n\n    if (label) {\n      if ((label as HTMLSlotElement).assignedNodes()?.length) {\n        this._selectNode?.classList.add(\n          `${prefix}--select-input-has--ai-label`\n        );\n      }\n\n      label?.classList.toggle(\n        `${prefix}--slug--revert`,\n        this.querySelector(`${prefix}-ai-label`)?.hasAttribute('revert-active')\n      );\n    } else {\n      this.shadowRoot\n        ?.querySelector(\"slot[name='slug']\")\n        ?.classList.toggle(\n          `${prefix}--slug--revert`,\n          this.querySelector(`${prefix}-slug`)?.hasAttribute('revert-active')\n        );\n    }\n  }\n\n  render() {\n    const {\n      disabled,\n      helperText,\n      hideLabel,\n      id,\n      inline,\n      invalid,\n      invalidText,\n      labelStylesDisable,\n      labelText,\n      placeholder,\n      readonly,\n      size,\n      warn,\n      warnText,\n      value,\n      _placeholderItemValue: placeholderItemValue,\n      _handleInput: handleInput,\n      _handleAILabelSlotChange: handleAILabelSlotChange,\n    } = this;\n\n    const normalizedProps: {\n      disabled: boolean;\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      disabled: !readonly && disabled,\n      invalid: !readonly && !disabled && invalid,\n      warn: !readonly && !invalid && !disabled && warn,\n    };\n\n    const inputClasses = classMap({\n      [`${prefix}--select-input`]: true,\n      [`${prefix}--select-input--${size}`]: size !== undefined,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: !labelStylesDisable,\n      [`${prefix}--label--disabled`]: normalizedProps.disabled,\n      [`${prefix}--visually-hidden`]: hideLabel,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: normalizedProps.disabled,\n    });\n\n    const supplementalText = helperText\n      ? html`\n          <div id=\"helper-text\" class=\"${helperTextClasses}\">\n            <slot name=\"helper-text\"> ${helperText} </slot>\n          </div>\n        `\n      : null;\n\n    const errorText =\n      normalizedProps.invalid || normalizedProps.warn\n        ? html` <div id=\"error-text\" class=\"${prefix}--form-requirement\">\n            ${normalizedProps.invalid ? invalidText : warnText}\n          </div>`\n        : null;\n\n    let describedBy: string | undefined;\n    if (normalizedProps.invalid || normalizedProps.warn) {\n      describedBy = 'error-text';\n    } else if (helperText) {\n      describedBy = 'helper-text';\n    }\n\n    const input = html`\n      <select\n        id=\"${id}\"\n        class=\"${inputClasses}\"\n        ?disabled=\"${disabled}\"\n        title=\"${value}\"\n        aria-readonly=\"${String(readonly)}\"\n        aria-invalid=\"${String(normalizedProps.invalid)}\"\n        aria-describedby=\"${ifDefined(describedBy)}\"\n        @input=\"${handleInput}\">\n        ${!placeholder || value\n          ? undefined\n          : html`\n              <option\n                disabled\n                hidden\n                class=\"${prefix}--select-option\"\n                value=\"${placeholderItemValue}\">\n                ${placeholder}\n              </option>\n            `}\n        ${this._renderItems(this)}\n      </select>\n      ${iconLoader(ChevronDown16, {\n        class: `${prefix}--select__arrow`,\n        'aria-hidden': 'true',\n      })}\n      <slot\n        name=\"ai-label\"\n        style=\"--${prefix}-show-before: ${normalizedProps.warn ||\n        normalizedProps.invalid\n          ? 'block'\n          : 'none'}\"\n        @slotchange=${handleAILabelSlotChange}></slot>\n      <slot name=\"slug\" @slotchange=${handleAILabelSlotChange}></slot>\n      ${!normalizedProps.invalid\n        ? undefined\n        : iconLoader(WarningFilled16, {\n            class: `${prefix}--select__invalid-icon`,\n          })}\n      ${!normalizedProps.invalid && normalizedProps.warn\n        ? iconLoader(WarningAltFilled16, {\n            class: `${prefix}--select__invalid-icon ${prefix}--select__invalid-icon--warning`,\n          })\n        : null}\n    `;\n\n    return html`\n      <label class=\"${labelClasses}\" for=${id}>\n        <slot name=\"label-text\">${labelText}</slot>\n      </label>\n\n      ${inline\n        ? html`<div\n            class=\"${prefix}--select-input--inline__wrapper\"\n            ?data-invalid=\"${normalizedProps.invalid}\">\n            <div\n              class=\"${prefix}--select-input__wrapper\"\n              ?data-invalid=\"${normalizedProps.invalid}\">\n              ${input}\n            </div>\n          </div>`\n        : html`<div\n            class=\"${prefix}--select-input__wrapper\"\n            ?data-invalid=\"${normalizedProps.invalid}\">\n            ${input}\n            ${this.isFluid\n              ? html`\n                  <hr class=\"${prefix}--select__divider\" />\n                  ${errorText ? errorText : null}\n                `\n              : null}\n          </div> `}\n      ${!this.isFluid && errorText ? errorText : supplementalText}\n    `;\n  }\n\n  /**\n   * A selector selecting child pseudo `<optgroup>`/`<option>`.\n   */\n  static get selectorItem() {\n    return `${prefix}-select-item-group,${prefix}-select-item`;\n  }\n\n  /**\n   * A selector selecting child pseudo `<option>`.\n   */\n  static get selectorLeafItem() {\n    return `${prefix}-select-item`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  /**\n   * The name of the custom event fired after item is selected.\n   */\n  static get eventSelect() {\n    return `${prefix}-select-selected`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSelect;\n"],"mappings":"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"}

package/es/components/shape-indicator/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/shape-indicator/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Shape indicator kinds.\n */\nexport enum SHAPE_INDICATOR_KIND {\n  /**\n   * Failed status\n   */\n  FAILED = 'failed',\n  /**\n   * Critical status\n   */\n  CRITICAL = 'critical',\n  /**\n   * High severity\n   */\n  HIGH = 'high',\n  /**\n   * Medium severity\n   */\n  MEDIUM = 'medium',\n  /**\n   * Low severity\n   */\n  LOW = 'low',\n  /**\n   * Cautious status\n   */\n  CAUTIOUS = 'cautious',\n  /**\n   * Undefined status\n   */\n  UNDEFINED = 'undefined',\n  /**\n   * Stable status\n   */\n  STABLE = 'stable',\n  /**\n   * Informative status\n   */\n  INFORMATIVE = 'informative',\n  /**\n   * Incomplete status\n   */\n  INCOMPLETE = 'incomplete',\n  /**\n   * Draft status\n   */\n  DRAFT = 'draft',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,uBAAL,yBAAA,sBAAA;;;;AAIL,sBAAA,YAAA;;;;AAIA,sBAAA,cAAA;;;;AAIA,sBAAA,UAAA;;;;AAIA,sBAAA,YAAA;;;;AAIA,sBAAA,SAAA;;;;AAIA,sBAAA,cAAA;;;;AAIA,sBAAA,eAAA;;;;AAIA,sBAAA,YAAA;;;;AAIA,sBAAA,iBAAA;;;;AAIA,sBAAA,gBAAA;;;;AAIA,sBAAA,WAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/shape-indicator/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Shape indicator kinds.\n */\nexport enum SHAPE_INDICATOR_KIND {\n  /**\n   * Failed status\n   */\n  FAILED = 'failed',\n  /**\n   * Critical status\n   */\n  CRITICAL = 'critical',\n  /**\n   * High severity\n   */\n  HIGH = 'high',\n  /**\n   * Medium severity\n   */\n  MEDIUM = 'medium',\n  /**\n   * Low severity\n   */\n  LOW = 'low',\n  /**\n   * Cautious status\n   */\n  CAUTIOUS = 'cautious',\n  /**\n   * Undefined status\n   */\n  UNDEFINED = 'undefined',\n  /**\n   * Stable status\n   */\n  STABLE = 'stable',\n  /**\n   * Informative status\n   */\n  INFORMATIVE = 'informative',\n  /**\n   * Incomplete status\n   */\n  INCOMPLETE = 'incomplete',\n  /**\n   * Draft status\n   */\n  DRAFT = 'draft',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,uBAAL,yBAAA,sBAAA;;;;CAIL,qBAAA,YAAA;;;;CAIA,qBAAA,cAAA;;;;CAIA,qBAAA,UAAA;;;;CAIA,qBAAA,YAAA;;;;CAIA,qBAAA,SAAA;;;;CAIA,qBAAA,cAAA;;;;CAIA,qBAAA,eAAA;;;;CAIA,qBAAA,YAAA;;;;CAIA,qBAAA,iBAAA;;;;CAIA,qBAAA,gBAAA;;;;CAIA,qBAAA,WAAA;;AACF,EAAA,CAAA,CAAA"}

package/es/components/shape-indicator/shape-indicator.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import shape_indicator_default$1 from "./shape-indicator.scss.js";
 import "./defs.js";

package/es/components/shape-indicator/shape-indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"shape-indicator.js","names":["styles","customElement"],"sources":["../../../src/components/shape-indicator/shape-indicator.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2025, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport styles from './shape-indicator.scss?lit';\n\n// Import Carbon icons\nimport Critical from '@carbon/icons/es/critical/index.js';\nimport CriticalSeverity from '@carbon/icons/es/critical-severity/index.js';\nimport DiamondFill from '@carbon/icons/es/diamond-fill/index.js';\nimport LowSeverity from '@carbon/icons/es/low-severity/index.js';\nimport Caution from '@carbon/icons/es/caution/index.js';\nimport CircleFill from '@carbon/icons/es/circle-fill/index.js';\nimport CircleStroke from '@carbon/icons/es/circle-stroke/index.js';\nimport { SHAPE_INDICATOR_KIND } from './defs';\n\n/**\n * Custom incomplete icon implementation\n */\nconst IncompleteIcon = `<svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  width=\"16\"\n  height=\"16\"\n  fill=\"none\"\n  aria-hidden=\"true\">\n  <path\n    fill=\"#fff\"\n    fillOpacity=\"0.01\"\n    d=\"M0 0h16v16H0z\"\n    style=\"mix-blend-mode: multiply;\" />\n  <path\n    fill=\"#161616\"\n    d=\"M8 2a6 6 0 1 0 0 12A6 6 0 0 0 8 2Zm0 2a4.004 4.004 0 0 1 4 4H4a4.004 4.004 0 0 1 4-4Z\" />\n</svg>`;\n\n/**\n * Map of shape indicators to their corresponding icons\n */\nconst shapeMap = {\n  [SHAPE_INDICATOR_KIND.FAILED]: Critical,\n  [SHAPE_INDICATOR_KIND.CRITICAL]: CriticalSeverity,\n  [SHAPE_INDICATOR_KIND.HIGH]: Caution,\n  [SHAPE_INDICATOR_KIND.MEDIUM]: DiamondFill,\n  [SHAPE_INDICATOR_KIND.LOW]: LowSeverity,\n  [SHAPE_INDICATOR_KIND.CAUTIOUS]: Caution,\n  [SHAPE_INDICATOR_KIND.UNDEFINED]: DiamondFill,\n  [SHAPE_INDICATOR_KIND.STABLE]: CircleFill,\n  [SHAPE_INDICATOR_KIND.INFORMATIVE]: LowSeverity,\n  [SHAPE_INDICATOR_KIND.INCOMPLETE]: IncompleteIcon,\n  [SHAPE_INDICATOR_KIND.DRAFT]: CircleStroke,\n};\n\n/**\n * Shape Indicator.\n * @element cds-shape-indicator\n */\n@customElement(`${prefix}-shape-indicator`)\nclass CDSShapeIndicator extends LitElement {\n  /**\n   * Shape indicator size (12 or 14)\n   */\n  @property({ attribute: 'text-size' })\n  textSize = 12;\n\n  /**\n   * Label next to the shape.\n   */\n  @property()\n  label!: string;\n\n  /**\n   * Shape Indicator kind\n   */\n  @property()\n  kind!: SHAPE_INDICATOR_KIND;\n\n  render() {\n    const shape = shapeMap[this.kind];\n\n    if (!shape) {\n      return null;\n    }\n\n    // Handle custom SVG string vs Carbon icon descriptor\n    if (typeof shape === 'string') {\n      return html` ${iconLoader(null, {}, shape)} ${this.label} `;\n    }\n\n    return html` ${iconLoader(shape)} ${this.label} `;\n  }\n\n  /**\n   * Styles are imported from the SCSS file\n   */\n  static styles = styles;\n}\n\nexport default CDSShapeIndicator;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;AAmBvB,MAAM,WAAW;aACgB;eACE;WACJ;aACE;UACH;eACK;gBACC;aACH;kBACK;iBACD;YACL;CAC/B;;;;;AAMD,IAAA,oBAAA,MACM,0BAA0B,WAAW;;;kBAK9B;;CAcX,SAAS;EACP,MAAM,QAAQ,SAAS,KAAK;AAE5B,MAAI,CAAC,MACH,QAAO;AAIT,MAAI,OAAO,UAAU,SACnB,QAAO,IAAI,IAAI,WAAW,MAAM,EAAE,EAAE,MAAM,CAAC,GAAG,KAAK,MAAM;AAG3D,SAAO,IAAI,IAAI,WAAW,MAAM,CAAC,GAAG,KAAK,MAAM;;;gBAMjCA;;;YAjCf,SAAS,EAAE,WAAW,aAAa,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAMpC,UAAU,CAAA,EAAA,kBAAA,WAAA,SAAA,KAAA,EAAA;YAMV,UAAU,CAAA,EAAA,kBAAA,WAAA,QAAA,KAAA,EAAA;gCAjBZC,cAAc,sBAA4B,CAAA,EAAA,kBAAA;AAyC3C,IAAA,0BAAe"}
+{"version":3,"file":"shape-indicator.js","names":["styles","customElement"],"sources":["../../../src/components/shape-indicator/shape-indicator.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2025, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport styles from './shape-indicator.scss?lit';\n\n// Import Carbon icons\nimport Critical from '@carbon/icons/es/critical/index.js';\nimport CriticalSeverity from '@carbon/icons/es/critical-severity/index.js';\nimport DiamondFill from '@carbon/icons/es/diamond-fill/index.js';\nimport LowSeverity from '@carbon/icons/es/low-severity/index.js';\nimport Caution from '@carbon/icons/es/caution/index.js';\nimport CircleFill from '@carbon/icons/es/circle-fill/index.js';\nimport CircleStroke from '@carbon/icons/es/circle-stroke/index.js';\nimport { SHAPE_INDICATOR_KIND } from './defs';\n\n/**\n * Custom incomplete icon implementation\n */\nconst IncompleteIcon = `<svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  width=\"16\"\n  height=\"16\"\n  fill=\"none\"\n  aria-hidden=\"true\">\n  <path\n    fill=\"#fff\"\n    fillOpacity=\"0.01\"\n    d=\"M0 0h16v16H0z\"\n    style=\"mix-blend-mode: multiply;\" />\n  <path\n    fill=\"#161616\"\n    d=\"M8 2a6 6 0 1 0 0 12A6 6 0 0 0 8 2Zm0 2a4.004 4.004 0 0 1 4 4H4a4.004 4.004 0 0 1 4-4Z\" />\n</svg>`;\n\n/**\n * Map of shape indicators to their corresponding icons\n */\nconst shapeMap = {\n  [SHAPE_INDICATOR_KIND.FAILED]: Critical,\n  [SHAPE_INDICATOR_KIND.CRITICAL]: CriticalSeverity,\n  [SHAPE_INDICATOR_KIND.HIGH]: Caution,\n  [SHAPE_INDICATOR_KIND.MEDIUM]: DiamondFill,\n  [SHAPE_INDICATOR_KIND.LOW]: LowSeverity,\n  [SHAPE_INDICATOR_KIND.CAUTIOUS]: Caution,\n  [SHAPE_INDICATOR_KIND.UNDEFINED]: DiamondFill,\n  [SHAPE_INDICATOR_KIND.STABLE]: CircleFill,\n  [SHAPE_INDICATOR_KIND.INFORMATIVE]: LowSeverity,\n  [SHAPE_INDICATOR_KIND.INCOMPLETE]: IncompleteIcon,\n  [SHAPE_INDICATOR_KIND.DRAFT]: CircleStroke,\n};\n\n/**\n * Shape Indicator.\n * @element cds-shape-indicator\n */\n@customElement(`${prefix}-shape-indicator`)\nclass CDSShapeIndicator extends LitElement {\n  /**\n   * Shape indicator size (12 or 14)\n   */\n  @property({ attribute: 'text-size' })\n  textSize = 12;\n\n  /**\n   * Label next to the shape.\n   */\n  @property()\n  label!: string;\n\n  /**\n   * Shape Indicator kind\n   */\n  @property()\n  kind!: SHAPE_INDICATOR_KIND;\n\n  render() {\n    const shape = shapeMap[this.kind];\n\n    if (!shape) {\n      return null;\n    }\n\n    // Handle custom SVG string vs Carbon icon descriptor\n    if (typeof shape === 'string') {\n      return html` ${iconLoader(null, {}, shape)} ${this.label} `;\n    }\n\n    return html` ${iconLoader(shape)} ${this.label} `;\n  }\n\n  /**\n   * Styles are imported from the SCSS file\n   */\n  static styles = styles;\n}\n\nexport default CDSShapeIndicator;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;AAmBvB,MAAM,WAAW;aACgB;eACE;WACJ;aACE;UACH;eACK;gBACC;aACH;kBACK;iBACD;YACL;AAChC;;;;;AAMA,IAAA,oBAAA,MACM,0BAA0B,WAAW;;;kBAK9B;;CAcX,SAAS;EACP,MAAM,QAAQ,SAAS,KAAK;EAE5B,IAAI,CAAC,OACH,OAAO;EAIT,IAAI,OAAO,UAAU,UACnB,OAAO,IAAI,IAAI,WAAW,MAAM,CAAC,GAAG,KAAK,EAAE,GAAG,KAAK,MAAM;EAG3D,OAAO,IAAI,IAAI,WAAW,KAAK,EAAE,GAAG,KAAK,MAAM;CACjD;;gBAKgBA;;AAClB;YAlCG,SAAS,EAAE,WAAW,YAAY,CAAC,CAAA,GAAA,kBAAA,WAAA,YAAA,KAAA,CAAA;YAMnC,SAAS,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;YAMT,SAAS,CAAA,GAAA,kBAAA,WAAA,QAAA,KAAA,CAAA;gCAjBXC,cAAc,qBAA2B,CAAA,GAAA,iBAAA;AAyC1C,IAAA,0BAAe"}

package/es/components/side-panel/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/side-panel/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Modal size.\n */\nexport enum SIDE_PANEL_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * 2X-Large size.\n   */\n  EXTRA_EXTRA_LARGE = '2xl',\n}\n\nexport enum SIDE_PANEL_PLACEMENT {\n  /** right / default */\n  RIGHT = 'right',\n\n  /** left  */\n  LEFT = 'left',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,kBAAL,yBAAA,iBAAA;;;;AAIL,iBAAA,iBAAA;;;;AAKA,iBAAA,WAAA;;;;AAKA,iBAAA,YAAA;;;;AAKA,iBAAA,WAAA;;;;AAKA,iBAAA,uBAAA;;KACD;AAED,IAAY,uBAAL,yBAAA,sBAAA;;AAEL,sBAAA,WAAA;;AAGA,sBAAA,UAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/side-panel/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Modal size.\n */\nexport enum SIDE_PANEL_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * 2X-Large size.\n   */\n  EXTRA_EXTRA_LARGE = '2xl',\n}\n\nexport enum SIDE_PANEL_PLACEMENT {\n  /** right / default */\n  RIGHT = 'right',\n\n  /** left  */\n  LEFT = 'left',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,kBAAL,yBAAA,iBAAA;;;;CAIL,gBAAA,iBAAA;;;;CAKA,gBAAA,WAAA;;;;CAKA,gBAAA,YAAA;;;;CAKA,gBAAA,WAAA;;;;CAKA,gBAAA,uBAAA;;AACF,EAAA,CAAA,CAAA;AAEA,IAAY,uBAAL,yBAAA,sBAAA;;CAEL,qBAAA,WAAA;;CAGA,qBAAA,UAAA;;AACF,EAAA,CAAA,CAAA"}

package/es/components/side-panel/side-panel.js

@@ -7,7 +7,7 @@
 
 import { selectorTabbable } from "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";

package/es/components/side-panel/side-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"side-panel.js","names":["customElement"],"sources":["../../../src/components/side-panel/side-panel.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { SIDE_PANEL_SIZE, SIDE_PANEL_PLACEMENT } from './defs';\nimport { selectorTabbable } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport ArrowLeft16 from '@carbon/icons/es/arrow--left/16.js';\nimport Close20 from '@carbon/icons/es/close/20.js';\nimport { moderate02 } from '@carbon/motion';\nimport '../button/index';\nimport '../icon-button/index';\nimport '../layer/index';\nimport Handle from '../../globals/internal/handle';\nimport '../button/button-set-base';\n\nexport { SIDE_PANEL_SIZE, SIDE_PANEL_PLACEMENT };\n\nconst PRECEDING =\n  Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS;\n\nconst FOLLOWING =\n  Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY;\n\nconst blockClass = `${prefix}--side-panel`;\nconst blockClassActionSet = `${prefix}--action-set`;\n\n/**\n * Observes resize of the given element with the given resize observer.\n *\n * @param observer The resize observer.\n * @param elem The element to observe the resize.\n */\nconst observeResize = (observer: ResizeObserver, elem: Element) => {\n  if (!elem) {\n    return null;\n  }\n  observer.observe(elem);\n  return {\n    release() {\n      observer.unobserve(elem);\n      return null;\n    },\n  } as Handle;\n};\n\n/**\n * Tries to focus on the given elements and bails out if one of them is successful.\n *\n * @param elems The elements.\n * @param reverse `true` to go through the list in reverse order.\n * @returns `true` if one of the attempts is successful, `false` otherwise.\n */\nfunction tryFocusElems(elems: NodeListOf<HTMLElement>, reverse: boolean) {\n  if (!reverse) {\n    for (let i = 0; i < elems.length; ++i) {\n      const elem = elems[i];\n      elem.focus();\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  } else {\n    for (let i = elems.length - 1; i >= 0; --i) {\n      const elem = elems[i];\n      elem.focus();\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  }\n  return false;\n}\n\n/**\n * SidePanel.\n *\n * @deprecated Use Carbon for IBM Products `side-panel` component.\n *   This component has been deprecated in `@carbon/web-components` and will instead be maintained\n *   in the Carbon for IBM Products library:\n *   https://github.com/carbon-design-system/ibm-products/tree/main/packages/ibm-products-web-components\n * @element cds-side-panel\n * @csspart dialog The dialog.\n * @fires cds-side-panel-beingclosed\n *   The custom event fired before this side-panel is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this side-panel.\n * @fires cds-side-panel-closed - The custom event fired after this side-panel is closed upon a user gesture.\n * @fires cds-side-panel-navigate-back - custom event fired when clicking navigate back (available when step > 0)\n */\n@customElement(`${prefix}-side-panel`)\nclass CDSSidePanel extends HostListenerMixin(LitElement) {\n  /**\n   * The handle for observing resize of the parent element of this element.\n   */\n  private _hObserveResize: Handle | null = null;\n\n  /**\n   * The element that had focus before this side-panel gets open.\n   */\n  private _launcher: Element | null = null;\n\n  /**\n   * Node to track focus going outside of side-panel content.\n   */\n  @query('#start-sentinel')\n  private _startSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track focus going outside of side-panel content.\n   */\n  @query('#end-sentinel')\n  private _endSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track side panel.\n   */\n  @query(`.${blockClass}`)\n  private _sidePanel!: HTMLDivElement;\n\n  @query(`.${blockClass}__animated-scroll-wrapper`)\n  private _animateScrollWrapper?: HTMLElement;\n\n  @query(`.${blockClass}__label-text`)\n  private _label!: HTMLElement;\n\n  @query(`.${blockClass}__title-text`)\n  private _title!: HTMLElement;\n\n  @query(`.${blockClass}__subtitle-text`)\n  private _subtitle!: HTMLElement;\n\n  @query(`.${blockClass}__inner-content`)\n  private _innerContent!: HTMLElement;\n\n  @queryAssignedElements({ slot: 'actions', selector: `${prefix}-button` })\n  private _actions!: Array<HTMLElement>;\n\n  @state()\n  _doAnimateTitle = true;\n\n  @state()\n  _isOpen = false;\n\n  @state()\n  _containerScrollTop = -16;\n\n  @state()\n  _hasSubtitle = false;\n\n  @state()\n  _hasSlug = false;\n\n  @state()\n  _hasActionToolbar = false;\n\n  @state()\n  _actionsCount = 0;\n\n  @state()\n  _slugCloseSize = 'sm';\n\n  /**\n   * Handles `blur` event on this element.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   * @param event.relatedTarget The event relatedTarget.\n   */\n  @HostListener('shadowRoot:focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = async ({ target, relatedTarget }: FocusEvent) => {\n    const {\n      open,\n      _startSentinelNode: startSentinelNode,\n      _endSentinelNode: endSentinelNode,\n    } = this;\n\n    const oldContains = target !== this && this.contains(target as Node);\n    const currentContains =\n      relatedTarget !== this &&\n      (this.contains(relatedTarget as Node) ||\n        (this.shadowRoot?.contains(relatedTarget as Node) &&\n          relatedTarget !== (startSentinelNode as Node) &&\n          relatedTarget !== (endSentinelNode as Node)));\n\n    // Performs focus wrapping if _all_ of the following is met:\n    // * This side-panel is open\n    // * The viewport still has focus\n    // * SidePanel body used to have focus but no longer has focus\n    const { selectorTabbable: selectorTabbableForSidePanel } = this\n      .constructor as typeof CDSSidePanel;\n\n    if (open && relatedTarget && oldContains && !currentContains) {\n      const comparisonResult = (target as Node).compareDocumentPosition(\n        relatedTarget as Node\n      );\n\n      if (relatedTarget === startSentinelNode || comparisonResult & PRECEDING) {\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForSidePanel),\n            true\n          ) &&\n          relatedTarget !== this\n        ) {\n          this.focus();\n        }\n      } else if (\n        relatedTarget === endSentinelNode ||\n        comparisonResult & FOLLOWING\n      ) {\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForSidePanel),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      }\n    }\n  };\n\n  @HostListener('document:keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  private _reducedMotion =\n    typeof window !== 'undefined' && window?.matchMedia\n      ? window.matchMedia('(prefers-reduced-motion: reduce)')\n      : { matches: true };\n\n  /**\n   * Handles `click` event on the side-panel container.\n   *\n   * @param event The event.\n   */\n  private _handleClickOnOverlay(event: MouseEvent) {\n    if (!this.preventCloseOnClickOutside) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  }\n\n  /**\n   * Handles `click` event on the side-panel container.\n   *\n   * @param event The event.\n   */\n  private _handleCloseClick(event: MouseEvent) {\n    this._handleUserInitiatedClose(event.target);\n  }\n\n  /**\n   * Handles user-initiated close request of this side-panel.\n   *\n   * @param triggeredBy The element that triggered this close request.\n   */\n  private _handleUserInitiatedClose(triggeredBy: EventTarget | null) {\n    if (this.open) {\n      const init = {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: {\n          triggeredBy,\n        },\n      };\n      if (\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSidePanel).eventBeforeClose,\n            init\n          )\n        )\n      ) {\n        this.open = false;\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSidePanel).eventClose,\n            init\n          )\n        );\n      }\n    }\n  }\n\n  private _handleNavigateBack(triggeredBy: EventTarget | null) {\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSSidePanel).eventNavigateBack,\n        {\n          composed: true,\n          detail: {\n            triggeredBy,\n          },\n        }\n      )\n    );\n  }\n\n  private _adjustPageContent = () => {\n    // sets/resets styles based on slideIn property and selectorPageContent;\n    if (this.selectorPageContent) {\n      const pageContentEl: HTMLElement | null = document.querySelector(\n        this.selectorPageContent\n      );\n\n      if (pageContentEl) {\n        const newValues = {\n          marginInlineStart: '',\n          marginInlineEnd: '',\n          inlineSize: '',\n          transition: this._reducedMotion.matches\n            ? 'none'\n            : `all ${moderate02}`,\n          transitionProperty: 'margin-inline-start, margin-inline-end',\n        };\n        if (this.open) {\n          newValues.inlineSize = 'auto';\n          if (this.placement === 'left') {\n            newValues.marginInlineStart = `${this?._sidePanel?.offsetWidth}px`;\n          } else {\n            newValues.marginInlineEnd = `${this?._sidePanel?.offsetWidth}px`;\n          }\n        }\n\n        Object.keys(newValues).forEach((key) => {\n          pageContentEl.style[key] = newValues[key];\n        });\n      }\n    }\n  };\n\n  private _checkSetOpen = () => {\n    const { _sidePanel: sidePanel } = this;\n    if (sidePanel && this._isOpen) {\n      if (this._reducedMotion) {\n        this._isOpen = false;\n      } else {\n        // wait until the side panel has transitioned off the screen to remove\n        sidePanel.addEventListener('transitionend', () => {\n          this._isOpen = false;\n        });\n      }\n    } else {\n      // allow the html to render before animating in the side panel\n      this._isOpen = this.open;\n    }\n  };\n\n  private _checkUpdateIconButtonSizes = () => {\n    const slug = this.querySelector(`${prefix}-slug`);\n    const otherButtons = this?.shadowRoot?.querySelectorAll(\n      '#nav-back-button, #close-button'\n    );\n\n    let iconButtonSize = 'sm';\n\n    if (slug || otherButtons?.length) {\n      const actions = this?.querySelectorAll?.(\n        `${prefix}-button[slot='actions']`\n      );\n\n      if (actions?.length && /l/.test(this.size)) {\n        iconButtonSize = 'md';\n      }\n    }\n\n    if (slug) {\n      slug?.setAttribute('size', iconButtonSize);\n    }\n\n    if (otherButtons) {\n      [...otherButtons].forEach((btn) => {\n        btn.setAttribute('size', iconButtonSize);\n      });\n    }\n  };\n\n  private _handleSlugChange(e: Event) {\n    this._checkUpdateIconButtonSizes();\n    const childItems = (e.target as HTMLSlotElement).assignedElements();\n\n    this._hasSlug = childItems.length > 0;\n  }\n\n  private _handleSubtitleChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const subtitle = target?.assignedElements();\n\n    this._hasSubtitle = subtitle.length > 0;\n  }\n\n  private _handleActionToolbarChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const toolbarActions = target?.assignedElements();\n\n    this._hasActionToolbar = toolbarActions && toolbarActions.length > 0;\n\n    if (this._hasActionToolbar) {\n      for (const toolbarAction of toolbarActions) {\n        // toolbar actions size should always be sm\n        toolbarAction.setAttribute('size', 'sm');\n      }\n    }\n  }\n\n  private _checkUpdateActionSizes = () => {\n    if (this._actions) {\n      for (let i = 0; i < this._actions.length; i++) {\n        this._actions[i].setAttribute(\n          'size',\n          this.condensedActions ? 'lg' : 'xl'\n        );\n      }\n    }\n  };\n\n  private _maxActions = 3;\n  private _handleActionsChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const actions = target?.assignedElements();\n\n    // update slug size\n    this._checkUpdateIconButtonSizes();\n\n    const actionsCount = actions?.length ?? 0;\n    if (actionsCount > this._maxActions) {\n      this._actionsCount = this._maxActions;\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(`Too many side-panel actions, max ${this._maxActions}.`);\n      }\n    } else {\n      this._actionsCount = actionsCount;\n    }\n\n    for (let i = 0; i < actions?.length; i++) {\n      if (i + 1 > this._maxActions) {\n        // hide excessive side panel actions\n        actions[i].setAttribute('hidden', 'true');\n        actions[i].setAttribute(\n          `data-actions-limit-${this._maxActions}-exceeded`,\n          `${actions.length}`\n        );\n      } else {\n        actions[i].classList.add(`${blockClassActionSet}__action-button`);\n      }\n    }\n    this._checkUpdateActionSizes();\n  }\n\n  private _checkSetDoAnimateTitle = () => {\n    let canDoAnimateTitle = false;\n\n    if (\n      this._sidePanel &&\n      this.open &&\n      this.animateTitle &&\n      this?.title?.length &&\n      !this._reducedMotion.matches\n    ) {\n      const scrollAnimationDistance = this._getScrollAnimationDistance();\n      // used to calculate the header moves\n      this?._sidePanel?.style?.setProperty(\n        `--${blockClass}--scroll-animation-distance`,\n        `${scrollAnimationDistance}`\n      );\n\n      let scrollEl = this._animateScrollWrapper;\n      if (!scrollEl && this.animateTitle && !this._doAnimateTitle) {\n        scrollEl = this._innerContent;\n      }\n\n      if (scrollEl) {\n        const innerComputed = window?.getComputedStyle(this._innerContent);\n        const innerPaddingHeight = innerComputed\n          ? parseFloat(innerComputed?.paddingTop) +\n            parseFloat(innerComputed?.paddingBottom)\n          : 0;\n\n        canDoAnimateTitle =\n          (!!this.labelText || !!this._hasActionToolbar || this._hasSubtitle) &&\n          scrollEl.scrollHeight - scrollEl.clientHeight >=\n            scrollAnimationDistance + innerPaddingHeight;\n      }\n    }\n\n    this._doAnimateTitle = canDoAnimateTitle;\n  };\n\n  /**\n   * The `ResizeObserver` instance for observing element resizes for re-positioning floating menu position.\n   */\n  // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore\n  private _resizeObserver = new ResizeObserver(() => {\n    if (this._sidePanel) {\n      this._checkSetDoAnimateTitle();\n    }\n  });\n\n  private _getScrollAnimationDistance = () => {\n    const labelHeight = this?._label?.offsetHeight ?? 0;\n    const subtitleHeight = this?._subtitle?.offsetHeight ?? 0;\n    const titleVerticalBorder = this._hasActionToolbar\n      ? this._title.offsetHeight - this._title.clientHeight\n      : 0;\n\n    return labelHeight + subtitleHeight + titleVerticalBorder;\n  };\n\n  private _scrollObserver = () => {\n    const scrollTop = this._animateScrollWrapper?.scrollTop ?? 0;\n    const scrollAnimationDistance = this._getScrollAnimationDistance();\n    this?._sidePanel?.style?.setProperty(\n      `--${blockClass}--scroll-animation-progress`,\n      `${\n        Math.min(scrollTop, scrollAnimationDistance) / scrollAnimationDistance\n      }`\n    );\n  };\n\n  private _handleCurrentStepUpdate = () => {\n    const scrollable = this._animateScrollWrapper ?? this._innerContent;\n    if (scrollable) {\n      scrollable.scrollTop = 0;\n    }\n  };\n\n  /**\n   * Determines if the title will animate on scroll\n   */\n  @property({ reflect: true, attribute: 'animate-title', type: Boolean })\n  animateTitle = true;\n\n  /**\n   * Sets the close button icon description\n   */\n  @property({ reflect: true, attribute: 'close-icon-description' })\n  closeIconDescription = 'Close';\n\n  /**\n   * Determines whether the side panel should render the condensed version (affects action buttons primarily)\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'condensed-actions' })\n  condensedActions = false;\n\n  /**\n   * Sets the current step of the side panel\n   */\n  @property({ reflect: true, attribute: 'current-step', type: Number })\n  currentStep;\n\n  /**\n   * Determines whether the side panel should render with an overlay\n   */\n  @property({ attribute: 'include-overlay', type: Boolean, reflect: true })\n  includeOverlay = false;\n\n  /**\n   * Sets the label text which will display above the title text\n   */\n  @property({ reflect: true, attribute: 'label-text' })\n  labelText;\n\n  /**\n   * Sets the icon description for the navigation back icon button\n   */\n  @property({ reflect: true, attribute: 'navigation-back-icon-description' })\n  navigationBackIconDescription = 'Back';\n\n  /**\n   * `true` if the side-panel should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * SidePanel placement.\n   */\n  @property({ reflect: true, type: String })\n  placement = SIDE_PANEL_PLACEMENT.RIGHT;\n\n  /**\n   * Prevent closing on click outside of side-panel\n   */\n  @property({ type: Boolean, attribute: 'prevent-close-on-click-outside' })\n  preventCloseOnClickOutside = false;\n\n  /**\n   * The initial location of focus in the side panel\n   */\n  @property({\n    reflect: true,\n    attribute: 'selector-initial-focus',\n    type: String,\n  })\n  selectorInitialFocus;\n\n  /**\n   * Selector for page content, used to push content to side except\n   */\n  @property({ reflect: true, attribute: 'selector-page-content' })\n  selectorPageContent = '';\n\n  /**\n   * SidePanel size.\n   */\n  @property({ reflect: true, type: String })\n  size = SIDE_PANEL_SIZE.MEDIUM;\n\n  /**\n   * Determines if this panel slides in\n   */\n  @property({ attribute: 'slide-in', type: Boolean, reflect: true })\n  slideIn = false;\n\n  /**\n   * Sets the title text\n   */\n  @property({ reflect: false, type: String })\n  title;\n\n  async connectObservers() {\n    await this.updateComplete;\n    this._hObserveResize = observeResize(this._resizeObserver, this._sidePanel);\n  }\n\n  disconnectObservers() {\n    if (this._hObserveResize) {\n      this._hObserveResize = this._hObserveResize.release();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.disconnectObservers();\n    this.connectObservers();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.disconnectObservers();\n  }\n\n  render() {\n    const {\n      closeIconDescription,\n      condensedActions,\n      currentStep,\n      includeOverlay,\n      labelText,\n      navigationBackIconDescription,\n      open,\n      placement,\n      size,\n      slideIn,\n      title,\n    } = this;\n\n    if (!open && !this._isOpen) {\n      return html``;\n    }\n\n    const actionsMultiple = ['', 'single', 'double', 'triple'][\n      this._actionsCount\n    ];\n\n    const titleTemplate = html`<div\n      class=${`${blockClass}__title`}\n      ?no-label=${!!labelText}>\n      <h2 class=${title ? `${blockClass}__title-text` : ''} title=${title}>\n        ${title}\n      </h2>\n\n      ${this._doAnimateTitle\n        ? html`<h2\n            class=${`${blockClass}__collapsed-title-text`}\n            title=${title}\n            aria-hidden=\"true\">\n            ${title}\n          </h2>`\n        : ''}\n    </div>`;\n\n    const headerHasTitleClass = this.title\n      ? ` ${blockClass}__header--has-title `\n      : '';\n    const headerTemplate = html`\n      <div\n        class=${`${blockClass}__header${headerHasTitleClass}`}\n        ?detail-step=${currentStep > 0}\n        ?no-title-animation=${!this._doAnimateTitle}\n        ?reduced-motion=${this._reducedMotion.matches}>\n        <!-- render back button -->\n        ${currentStep > 0\n          ? html`<cds-icon-button\n              align=\"bottom-left\"\n              aria-label=${navigationBackIconDescription}\n              kind=\"ghost\"\n              size=\"sm\"\n              class=${`${prefix}--btn ${blockClass}__navigation-back-button`}\n              @click=${this._handleNavigateBack}>\n              ${iconLoader(ArrowLeft16, { slot: 'icon' })}\n              <span slot=\"tooltip-content\">\n                ${navigationBackIconDescription}\n              </span>\n            </cds-icon-button>`\n          : ''}\n\n        <!-- render title label -->\n        ${title?.length && labelText?.length\n          ? html` <p class=${`${blockClass}__label-text`}>${labelText}</p>`\n          : ''}\n\n        <!-- title -->\n        ${title ? titleTemplate : ''}\n\n        <!-- render slug and close button area -->\n        <div class=${`${blockClass}__slug-and-close`}>\n          <slot name=\"slug\" @slotchange=${this._handleSlugChange}></slot>\n          <!-- {normalizedSlug} -->\n          <cds-icon-button\n            align=\"bottom-right\"\n            aria-label=${closeIconDescription}\n            kind=\"ghost\"\n            size=\"sm\"\n            class=${`${blockClass}__close-button`}\n            @click=${this._handleCloseClick}>\n            ${iconLoader(Close20, { slot: 'icon' })}\n            <span slot=\"tooltip-content\"> ${closeIconDescription} </span>\n          </cds-icon-button>\n        </div>\n\n        <!-- render sub title -->\n        <p\n          class=${this._hasSubtitle ? `${blockClass}__subtitle-text` : ''}\n          ?hidden=${!this._hasSubtitle}\n          ?no-title-animation=${!this._doAnimateTitle}\n          ?no-action-toolbar=${!this._hasActionToolbar}\n          ?no-title=${!title}>\n          <slot\n            name=\"subtitle\"\n            @slotchange=${this._handleSubtitleChange}></slot>\n        </p>\n\n        <div\n          class=${this._hasActionToolbar ? `${blockClass}__action-toolbar` : ''}\n          ?hidden=${!this._hasActionToolbar}\n          ?no-title-animation=${!this._doAnimateTitle}>\n          <slot\n            name=\"action-toolbar\"\n            @slotchange=${this._handleActionToolbarChange}></slot>\n        </div>\n      </div>\n    `;\n\n    const mainTemplate = html`<div\n      class=${`${blockClass}__inner-content`}\n      ?scrolls=${!this._doAnimateTitle}>\n      <cds-layer level=\"1\">\n        <slot></slot>\n      </cds-layer>\n    </div> `;\n\n    const sidePanelAnimateTitleClass = this._doAnimateTitle\n      ? ` ${blockClass}--animated-title`\n      : '';\n\n    return html`\n      <div\n        class=${`${blockClass}${sidePanelAnimateTitleClass}`}\n        part=\"dialog\"\n        role=\"complementary\"\n        placement=\"${placement}\"\n        ?has-slug=${this._hasSlug}\n        ?open=${this._isOpen}\n        ?opening=${open && !this._isOpen}\n        ?closing=${!open && this._isOpen}\n        ?condensed-actions=${condensedActions}\n        ?overlay=${includeOverlay || slideIn}\n        ?slide-in=${slideIn}\n        size=${size}>\n        <a\n          id=\"start-sentinel\"\n          class=\"sentinel\"\n          hidden\n          href=\"javascript:void 0\"\n          role=\"navigation\"></a>\n\n        ${this._doAnimateTitle\n          ? html`<div class=${`${blockClass}__animated-scroll-wrapper`} scrolls>\n              ${headerTemplate} ${mainTemplate}\n            </div>`\n          : html` ${headerTemplate} ${mainTemplate}`}\n\n        <cds-button-set-base\n          class=${`${blockClass}__actions-container`}\n          ?hidden=${this._actionsCount === 0}\n          ?condensed=${condensedActions}\n          actions-multiple=${actionsMultiple}\n          size=${size}>\n          <slot name=\"actions\" @slotchange=${this._handleActionsChange}></slot>\n        </cds-button-set-base>\n\n        <a\n          id=\"end-sentinel\"\n          class=\"sentinel\"\n          hidden\n          href=\"javascript:void 0\"\n          role=\"navigation\"></a>\n      </div>\n\n      ${includeOverlay\n        ? html`<div\n            ?slide-in=${slideIn}\n            class=${`${blockClass}__overlay`}\n            ?open=${this.open}\n            ?opening=${open && !this._isOpen}\n            ?closing=${!open && this._isOpen}\n            tabindex=\"-1\"\n            @click=${this._handleClickOnOverlay}></div>`\n        : ''}\n    `;\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('condensedActions')) {\n      this._checkUpdateActionSizes();\n    }\n\n    if (changedProperties.has('currentStep')) {\n      this._handleCurrentStepUpdate();\n    }\n\n    if (changedProperties.has('_doAnimateTitle')) {\n      this?._animateScrollWrapper?.removeEventListener(\n        'scroll',\n        this._scrollObserver\n      );\n\n      if (this._doAnimateTitle) {\n        this?._animateScrollWrapper?.addEventListener(\n          'scroll',\n          this._scrollObserver\n        );\n      } else {\n        this?._sidePanel?.style?.setProperty(\n          `--${blockClass}--scroll-animation-progress`,\n          '0'\n        );\n      }\n    }\n\n    if (\n      changedProperties.has('_isOpen') ||\n      changedProperties.has('animateTitle')\n    ) {\n      /* @state property changed */\n      this._checkSetDoAnimateTitle();\n    }\n\n    if (\n      changedProperties.has('slideIn') ||\n      changedProperties.has('open') ||\n      changedProperties.has('includeOverlay')\n    ) {\n      this._adjustPageContent();\n    }\n\n    if (changedProperties.has('open')) {\n      this._checkSetOpen();\n\n      this.disconnectObservers();\n      if (this.open) {\n        this.connectObservers();\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._launcher = this.ownerDocument!.activeElement;\n        const focusNode =\n          this.selectorInitialFocus &&\n          this.querySelector(this.selectorInitialFocus);\n\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (focusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-side-panel>`'s first update/render cycle\n          (focusNode as HTMLElement).focus();\n        } else if (\n          !tryFocusElems(\n            this.querySelectorAll(\n              (this.constructor as typeof CDSSidePanel).selectorTabbable\n            ),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  private static _delay(ms = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return selectorTabbable;\n  }\n\n  /**\n   * The name of the custom event fired before this side-panel is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this side-panel.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-side-panel-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this side-panel is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-side-panel-closed`;\n  }\n\n  /**\n   * The name of the custom event fired on clicking the navigate back button\n   */\n  static get eventNavigateBack() {\n    return `${prefix}-side-panel-navigate-back`;\n  }\n}\n\nexport default CDSSidePanel;\n"],"mappings":"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"}
+{"version":3,"file":"side-panel.js","names":["customElement"],"sources":["../../../src/components/side-panel/side-panel.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { SIDE_PANEL_SIZE, SIDE_PANEL_PLACEMENT } from './defs';\nimport { selectorTabbable } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport ArrowLeft16 from '@carbon/icons/es/arrow--left/16.js';\nimport Close20 from '@carbon/icons/es/close/20.js';\nimport { moderate02 } from '@carbon/motion';\nimport '../button/index';\nimport '../icon-button/index';\nimport '../layer/index';\nimport Handle from '../../globals/internal/handle';\nimport '../button/button-set-base';\n\nexport { SIDE_PANEL_SIZE, SIDE_PANEL_PLACEMENT };\n\nconst PRECEDING =\n  Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS;\n\nconst FOLLOWING =\n  Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY;\n\nconst blockClass = `${prefix}--side-panel`;\nconst blockClassActionSet = `${prefix}--action-set`;\n\n/**\n * Observes resize of the given element with the given resize observer.\n *\n * @param observer The resize observer.\n * @param elem The element to observe the resize.\n */\nconst observeResize = (observer: ResizeObserver, elem: Element) => {\n  if (!elem) {\n    return null;\n  }\n  observer.observe(elem);\n  return {\n    release() {\n      observer.unobserve(elem);\n      return null;\n    },\n  } as Handle;\n};\n\n/**\n * Tries to focus on the given elements and bails out if one of them is successful.\n *\n * @param elems The elements.\n * @param reverse `true` to go through the list in reverse order.\n * @returns `true` if one of the attempts is successful, `false` otherwise.\n */\nfunction tryFocusElems(elems: NodeListOf<HTMLElement>, reverse: boolean) {\n  if (!reverse) {\n    for (let i = 0; i < elems.length; ++i) {\n      const elem = elems[i];\n      elem.focus();\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  } else {\n    for (let i = elems.length - 1; i >= 0; --i) {\n      const elem = elems[i];\n      elem.focus();\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  }\n  return false;\n}\n\n/**\n * SidePanel.\n *\n * @deprecated Use Carbon for IBM Products `side-panel` component.\n *   This component has been deprecated in `@carbon/web-components` and will instead be maintained\n *   in the Carbon for IBM Products library:\n *   https://github.com/carbon-design-system/ibm-products/tree/main/packages/ibm-products-web-components\n * @element cds-side-panel\n * @csspart dialog The dialog.\n * @fires cds-side-panel-beingclosed\n *   The custom event fired before this side-panel is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this side-panel.\n * @fires cds-side-panel-closed - The custom event fired after this side-panel is closed upon a user gesture.\n * @fires cds-side-panel-navigate-back - custom event fired when clicking navigate back (available when step > 0)\n */\n@customElement(`${prefix}-side-panel`)\nclass CDSSidePanel extends HostListenerMixin(LitElement) {\n  /**\n   * The handle for observing resize of the parent element of this element.\n   */\n  private _hObserveResize: Handle | null = null;\n\n  /**\n   * The element that had focus before this side-panel gets open.\n   */\n  private _launcher: Element | null = null;\n\n  /**\n   * Node to track focus going outside of side-panel content.\n   */\n  @query('#start-sentinel')\n  private _startSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track focus going outside of side-panel content.\n   */\n  @query('#end-sentinel')\n  private _endSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track side panel.\n   */\n  @query(`.${blockClass}`)\n  private _sidePanel!: HTMLDivElement;\n\n  @query(`.${blockClass}__animated-scroll-wrapper`)\n  private _animateScrollWrapper?: HTMLElement;\n\n  @query(`.${blockClass}__label-text`)\n  private _label!: HTMLElement;\n\n  @query(`.${blockClass}__title-text`)\n  private _title!: HTMLElement;\n\n  @query(`.${blockClass}__subtitle-text`)\n  private _subtitle!: HTMLElement;\n\n  @query(`.${blockClass}__inner-content`)\n  private _innerContent!: HTMLElement;\n\n  @queryAssignedElements({ slot: 'actions', selector: `${prefix}-button` })\n  private _actions!: Array<HTMLElement>;\n\n  @state()\n  _doAnimateTitle = true;\n\n  @state()\n  _isOpen = false;\n\n  @state()\n  _containerScrollTop = -16;\n\n  @state()\n  _hasSubtitle = false;\n\n  @state()\n  _hasSlug = false;\n\n  @state()\n  _hasActionToolbar = false;\n\n  @state()\n  _actionsCount = 0;\n\n  @state()\n  _slugCloseSize = 'sm';\n\n  /**\n   * Handles `blur` event on this element.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   * @param event.relatedTarget The event relatedTarget.\n   */\n  @HostListener('shadowRoot:focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = async ({ target, relatedTarget }: FocusEvent) => {\n    const {\n      open,\n      _startSentinelNode: startSentinelNode,\n      _endSentinelNode: endSentinelNode,\n    } = this;\n\n    const oldContains = target !== this && this.contains(target as Node);\n    const currentContains =\n      relatedTarget !== this &&\n      (this.contains(relatedTarget as Node) ||\n        (this.shadowRoot?.contains(relatedTarget as Node) &&\n          relatedTarget !== (startSentinelNode as Node) &&\n          relatedTarget !== (endSentinelNode as Node)));\n\n    // Performs focus wrapping if _all_ of the following is met:\n    // * This side-panel is open\n    // * The viewport still has focus\n    // * SidePanel body used to have focus but no longer has focus\n    const { selectorTabbable: selectorTabbableForSidePanel } = this\n      .constructor as typeof CDSSidePanel;\n\n    if (open && relatedTarget && oldContains && !currentContains) {\n      const comparisonResult = (target as Node).compareDocumentPosition(\n        relatedTarget as Node\n      );\n\n      if (relatedTarget === startSentinelNode || comparisonResult & PRECEDING) {\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForSidePanel),\n            true\n          ) &&\n          relatedTarget !== this\n        ) {\n          this.focus();\n        }\n      } else if (\n        relatedTarget === endSentinelNode ||\n        comparisonResult & FOLLOWING\n      ) {\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForSidePanel),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      }\n    }\n  };\n\n  @HostListener('document:keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  private _reducedMotion =\n    typeof window !== 'undefined' && window?.matchMedia\n      ? window.matchMedia('(prefers-reduced-motion: reduce)')\n      : { matches: true };\n\n  /**\n   * Handles `click` event on the side-panel container.\n   *\n   * @param event The event.\n   */\n  private _handleClickOnOverlay(event: MouseEvent) {\n    if (!this.preventCloseOnClickOutside) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  }\n\n  /**\n   * Handles `click` event on the side-panel container.\n   *\n   * @param event The event.\n   */\n  private _handleCloseClick(event: MouseEvent) {\n    this._handleUserInitiatedClose(event.target);\n  }\n\n  /**\n   * Handles user-initiated close request of this side-panel.\n   *\n   * @param triggeredBy The element that triggered this close request.\n   */\n  private _handleUserInitiatedClose(triggeredBy: EventTarget | null) {\n    if (this.open) {\n      const init = {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: {\n          triggeredBy,\n        },\n      };\n      if (\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSidePanel).eventBeforeClose,\n            init\n          )\n        )\n      ) {\n        this.open = false;\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSidePanel).eventClose,\n            init\n          )\n        );\n      }\n    }\n  }\n\n  private _handleNavigateBack(triggeredBy: EventTarget | null) {\n    this.dispatchEvent(\n      new CustomEvent(\n        (this.constructor as typeof CDSSidePanel).eventNavigateBack,\n        {\n          composed: true,\n          detail: {\n            triggeredBy,\n          },\n        }\n      )\n    );\n  }\n\n  private _adjustPageContent = () => {\n    // sets/resets styles based on slideIn property and selectorPageContent;\n    if (this.selectorPageContent) {\n      const pageContentEl: HTMLElement | null = document.querySelector(\n        this.selectorPageContent\n      );\n\n      if (pageContentEl) {\n        const newValues = {\n          marginInlineStart: '',\n          marginInlineEnd: '',\n          inlineSize: '',\n          transition: this._reducedMotion.matches\n            ? 'none'\n            : `all ${moderate02}`,\n          transitionProperty: 'margin-inline-start, margin-inline-end',\n        };\n        if (this.open) {\n          newValues.inlineSize = 'auto';\n          if (this.placement === 'left') {\n            newValues.marginInlineStart = `${this?._sidePanel?.offsetWidth}px`;\n          } else {\n            newValues.marginInlineEnd = `${this?._sidePanel?.offsetWidth}px`;\n          }\n        }\n\n        Object.keys(newValues).forEach((key) => {\n          pageContentEl.style[key] = newValues[key];\n        });\n      }\n    }\n  };\n\n  private _checkSetOpen = () => {\n    const { _sidePanel: sidePanel } = this;\n    if (sidePanel && this._isOpen) {\n      if (this._reducedMotion) {\n        this._isOpen = false;\n      } else {\n        // wait until the side panel has transitioned off the screen to remove\n        sidePanel.addEventListener('transitionend', () => {\n          this._isOpen = false;\n        });\n      }\n    } else {\n      // allow the html to render before animating in the side panel\n      this._isOpen = this.open;\n    }\n  };\n\n  private _checkUpdateIconButtonSizes = () => {\n    const slug = this.querySelector(`${prefix}-slug`);\n    const otherButtons = this?.shadowRoot?.querySelectorAll(\n      '#nav-back-button, #close-button'\n    );\n\n    let iconButtonSize = 'sm';\n\n    if (slug || otherButtons?.length) {\n      const actions = this?.querySelectorAll?.(\n        `${prefix}-button[slot='actions']`\n      );\n\n      if (actions?.length && /l/.test(this.size)) {\n        iconButtonSize = 'md';\n      }\n    }\n\n    if (slug) {\n      slug?.setAttribute('size', iconButtonSize);\n    }\n\n    if (otherButtons) {\n      [...otherButtons].forEach((btn) => {\n        btn.setAttribute('size', iconButtonSize);\n      });\n    }\n  };\n\n  private _handleSlugChange(e: Event) {\n    this._checkUpdateIconButtonSizes();\n    const childItems = (e.target as HTMLSlotElement).assignedElements();\n\n    this._hasSlug = childItems.length > 0;\n  }\n\n  private _handleSubtitleChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const subtitle = target?.assignedElements();\n\n    this._hasSubtitle = subtitle.length > 0;\n  }\n\n  private _handleActionToolbarChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const toolbarActions = target?.assignedElements();\n\n    this._hasActionToolbar = toolbarActions && toolbarActions.length > 0;\n\n    if (this._hasActionToolbar) {\n      for (const toolbarAction of toolbarActions) {\n        // toolbar actions size should always be sm\n        toolbarAction.setAttribute('size', 'sm');\n      }\n    }\n  }\n\n  private _checkUpdateActionSizes = () => {\n    if (this._actions) {\n      for (let i = 0; i < this._actions.length; i++) {\n        this._actions[i].setAttribute(\n          'size',\n          this.condensedActions ? 'lg' : 'xl'\n        );\n      }\n    }\n  };\n\n  private _maxActions = 3;\n  private _handleActionsChange(e: Event) {\n    const target = e.target as HTMLSlotElement;\n    const actions = target?.assignedElements();\n\n    // update slug size\n    this._checkUpdateIconButtonSizes();\n\n    const actionsCount = actions?.length ?? 0;\n    if (actionsCount > this._maxActions) {\n      this._actionsCount = this._maxActions;\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(`Too many side-panel actions, max ${this._maxActions}.`);\n      }\n    } else {\n      this._actionsCount = actionsCount;\n    }\n\n    for (let i = 0; i < actions?.length; i++) {\n      if (i + 1 > this._maxActions) {\n        // hide excessive side panel actions\n        actions[i].setAttribute('hidden', 'true');\n        actions[i].setAttribute(\n          `data-actions-limit-${this._maxActions}-exceeded`,\n          `${actions.length}`\n        );\n      } else {\n        actions[i].classList.add(`${blockClassActionSet}__action-button`);\n      }\n    }\n    this._checkUpdateActionSizes();\n  }\n\n  private _checkSetDoAnimateTitle = () => {\n    let canDoAnimateTitle = false;\n\n    if (\n      this._sidePanel &&\n      this.open &&\n      this.animateTitle &&\n      this?.title?.length &&\n      !this._reducedMotion.matches\n    ) {\n      const scrollAnimationDistance = this._getScrollAnimationDistance();\n      // used to calculate the header moves\n      this?._sidePanel?.style?.setProperty(\n        `--${blockClass}--scroll-animation-distance`,\n        `${scrollAnimationDistance}`\n      );\n\n      let scrollEl = this._animateScrollWrapper;\n      if (!scrollEl && this.animateTitle && !this._doAnimateTitle) {\n        scrollEl = this._innerContent;\n      }\n\n      if (scrollEl) {\n        const innerComputed = window?.getComputedStyle(this._innerContent);\n        const innerPaddingHeight = innerComputed\n          ? parseFloat(innerComputed?.paddingTop) +\n            parseFloat(innerComputed?.paddingBottom)\n          : 0;\n\n        canDoAnimateTitle =\n          (!!this.labelText || !!this._hasActionToolbar || this._hasSubtitle) &&\n          scrollEl.scrollHeight - scrollEl.clientHeight >=\n            scrollAnimationDistance + innerPaddingHeight;\n      }\n    }\n\n    this._doAnimateTitle = canDoAnimateTitle;\n  };\n\n  /**\n   * The `ResizeObserver` instance for observing element resizes for re-positioning floating menu position.\n   */\n  // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore\n  private _resizeObserver = new ResizeObserver(() => {\n    if (this._sidePanel) {\n      this._checkSetDoAnimateTitle();\n    }\n  });\n\n  private _getScrollAnimationDistance = () => {\n    const labelHeight = this?._label?.offsetHeight ?? 0;\n    const subtitleHeight = this?._subtitle?.offsetHeight ?? 0;\n    const titleVerticalBorder = this._hasActionToolbar\n      ? this._title.offsetHeight - this._title.clientHeight\n      : 0;\n\n    return labelHeight + subtitleHeight + titleVerticalBorder;\n  };\n\n  private _scrollObserver = () => {\n    const scrollTop = this._animateScrollWrapper?.scrollTop ?? 0;\n    const scrollAnimationDistance = this._getScrollAnimationDistance();\n    this?._sidePanel?.style?.setProperty(\n      `--${blockClass}--scroll-animation-progress`,\n      `${\n        Math.min(scrollTop, scrollAnimationDistance) / scrollAnimationDistance\n      }`\n    );\n  };\n\n  private _handleCurrentStepUpdate = () => {\n    const scrollable = this._animateScrollWrapper ?? this._innerContent;\n    if (scrollable) {\n      scrollable.scrollTop = 0;\n    }\n  };\n\n  /**\n   * Determines if the title will animate on scroll\n   */\n  @property({ reflect: true, attribute: 'animate-title', type: Boolean })\n  animateTitle = true;\n\n  /**\n   * Sets the close button icon description\n   */\n  @property({ reflect: true, attribute: 'close-icon-description' })\n  closeIconDescription = 'Close';\n\n  /**\n   * Determines whether the side panel should render the condensed version (affects action buttons primarily)\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'condensed-actions' })\n  condensedActions = false;\n\n  /**\n   * Sets the current step of the side panel\n   */\n  @property({ reflect: true, attribute: 'current-step', type: Number })\n  currentStep;\n\n  /**\n   * Determines whether the side panel should render with an overlay\n   */\n  @property({ attribute: 'include-overlay', type: Boolean, reflect: true })\n  includeOverlay = false;\n\n  /**\n   * Sets the label text which will display above the title text\n   */\n  @property({ reflect: true, attribute: 'label-text' })\n  labelText;\n\n  /**\n   * Sets the icon description for the navigation back icon button\n   */\n  @property({ reflect: true, attribute: 'navigation-back-icon-description' })\n  navigationBackIconDescription = 'Back';\n\n  /**\n   * `true` if the side-panel should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * SidePanel placement.\n   */\n  @property({ reflect: true, type: String })\n  placement = SIDE_PANEL_PLACEMENT.RIGHT;\n\n  /**\n   * Prevent closing on click outside of side-panel\n   */\n  @property({ type: Boolean, attribute: 'prevent-close-on-click-outside' })\n  preventCloseOnClickOutside = false;\n\n  /**\n   * The initial location of focus in the side panel\n   */\n  @property({\n    reflect: true,\n    attribute: 'selector-initial-focus',\n    type: String,\n  })\n  selectorInitialFocus;\n\n  /**\n   * Selector for page content, used to push content to side except\n   */\n  @property({ reflect: true, attribute: 'selector-page-content' })\n  selectorPageContent = '';\n\n  /**\n   * SidePanel size.\n   */\n  @property({ reflect: true, type: String })\n  size = SIDE_PANEL_SIZE.MEDIUM;\n\n  /**\n   * Determines if this panel slides in\n   */\n  @property({ attribute: 'slide-in', type: Boolean, reflect: true })\n  slideIn = false;\n\n  /**\n   * Sets the title text\n   */\n  @property({ reflect: false, type: String })\n  title;\n\n  async connectObservers() {\n    await this.updateComplete;\n    this._hObserveResize = observeResize(this._resizeObserver, this._sidePanel);\n  }\n\n  disconnectObservers() {\n    if (this._hObserveResize) {\n      this._hObserveResize = this._hObserveResize.release();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.disconnectObservers();\n    this.connectObservers();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.disconnectObservers();\n  }\n\n  render() {\n    const {\n      closeIconDescription,\n      condensedActions,\n      currentStep,\n      includeOverlay,\n      labelText,\n      navigationBackIconDescription,\n      open,\n      placement,\n      size,\n      slideIn,\n      title,\n    } = this;\n\n    if (!open && !this._isOpen) {\n      return html``;\n    }\n\n    const actionsMultiple = ['', 'single', 'double', 'triple'][\n      this._actionsCount\n    ];\n\n    const titleTemplate = html`<div\n      class=${`${blockClass}__title`}\n      ?no-label=${!!labelText}>\n      <h2 class=${title ? `${blockClass}__title-text` : ''} title=${title}>\n        ${title}\n      </h2>\n\n      ${this._doAnimateTitle\n        ? html`<h2\n            class=${`${blockClass}__collapsed-title-text`}\n            title=${title}\n            aria-hidden=\"true\">\n            ${title}\n          </h2>`\n        : ''}\n    </div>`;\n\n    const headerHasTitleClass = this.title\n      ? ` ${blockClass}__header--has-title `\n      : '';\n    const headerTemplate = html`\n      <div\n        class=${`${blockClass}__header${headerHasTitleClass}`}\n        ?detail-step=${currentStep > 0}\n        ?no-title-animation=${!this._doAnimateTitle}\n        ?reduced-motion=${this._reducedMotion.matches}>\n        <!-- render back button -->\n        ${currentStep > 0\n          ? html`<cds-icon-button\n              align=\"bottom-left\"\n              aria-label=${navigationBackIconDescription}\n              kind=\"ghost\"\n              size=\"sm\"\n              class=${`${prefix}--btn ${blockClass}__navigation-back-button`}\n              @click=${this._handleNavigateBack}>\n              ${iconLoader(ArrowLeft16, { slot: 'icon' })}\n              <span slot=\"tooltip-content\">\n                ${navigationBackIconDescription}\n              </span>\n            </cds-icon-button>`\n          : ''}\n\n        <!-- render title label -->\n        ${title?.length && labelText?.length\n          ? html` <p class=${`${blockClass}__label-text`}>${labelText}</p>`\n          : ''}\n\n        <!-- title -->\n        ${title ? titleTemplate : ''}\n\n        <!-- render slug and close button area -->\n        <div class=${`${blockClass}__slug-and-close`}>\n          <slot name=\"slug\" @slotchange=${this._handleSlugChange}></slot>\n          <!-- {normalizedSlug} -->\n          <cds-icon-button\n            align=\"bottom-right\"\n            aria-label=${closeIconDescription}\n            kind=\"ghost\"\n            size=\"sm\"\n            class=${`${blockClass}__close-button`}\n            @click=${this._handleCloseClick}>\n            ${iconLoader(Close20, { slot: 'icon' })}\n            <span slot=\"tooltip-content\"> ${closeIconDescription} </span>\n          </cds-icon-button>\n        </div>\n\n        <!-- render sub title -->\n        <p\n          class=${this._hasSubtitle ? `${blockClass}__subtitle-text` : ''}\n          ?hidden=${!this._hasSubtitle}\n          ?no-title-animation=${!this._doAnimateTitle}\n          ?no-action-toolbar=${!this._hasActionToolbar}\n          ?no-title=${!title}>\n          <slot\n            name=\"subtitle\"\n            @slotchange=${this._handleSubtitleChange}></slot>\n        </p>\n\n        <div\n          class=${this._hasActionToolbar ? `${blockClass}__action-toolbar` : ''}\n          ?hidden=${!this._hasActionToolbar}\n          ?no-title-animation=${!this._doAnimateTitle}>\n          <slot\n            name=\"action-toolbar\"\n            @slotchange=${this._handleActionToolbarChange}></slot>\n        </div>\n      </div>\n    `;\n\n    const mainTemplate = html`<div\n      class=${`${blockClass}__inner-content`}\n      ?scrolls=${!this._doAnimateTitle}>\n      <cds-layer level=\"1\">\n        <slot></slot>\n      </cds-layer>\n    </div> `;\n\n    const sidePanelAnimateTitleClass = this._doAnimateTitle\n      ? ` ${blockClass}--animated-title`\n      : '';\n\n    return html`\n      <div\n        class=${`${blockClass}${sidePanelAnimateTitleClass}`}\n        part=\"dialog\"\n        role=\"complementary\"\n        placement=\"${placement}\"\n        ?has-slug=${this._hasSlug}\n        ?open=${this._isOpen}\n        ?opening=${open && !this._isOpen}\n        ?closing=${!open && this._isOpen}\n        ?condensed-actions=${condensedActions}\n        ?overlay=${includeOverlay || slideIn}\n        ?slide-in=${slideIn}\n        size=${size}>\n        <a\n          id=\"start-sentinel\"\n          class=\"sentinel\"\n          hidden\n          href=\"javascript:void 0\"\n          role=\"navigation\"></a>\n\n        ${this._doAnimateTitle\n          ? html`<div class=${`${blockClass}__animated-scroll-wrapper`} scrolls>\n              ${headerTemplate} ${mainTemplate}\n            </div>`\n          : html` ${headerTemplate} ${mainTemplate}`}\n\n        <cds-button-set-base\n          class=${`${blockClass}__actions-container`}\n          ?hidden=${this._actionsCount === 0}\n          ?condensed=${condensedActions}\n          actions-multiple=${actionsMultiple}\n          size=${size}>\n          <slot name=\"actions\" @slotchange=${this._handleActionsChange}></slot>\n        </cds-button-set-base>\n\n        <a\n          id=\"end-sentinel\"\n          class=\"sentinel\"\n          hidden\n          href=\"javascript:void 0\"\n          role=\"navigation\"></a>\n      </div>\n\n      ${includeOverlay\n        ? html`<div\n            ?slide-in=${slideIn}\n            class=${`${blockClass}__overlay`}\n            ?open=${this.open}\n            ?opening=${open && !this._isOpen}\n            ?closing=${!open && this._isOpen}\n            tabindex=\"-1\"\n            @click=${this._handleClickOnOverlay}></div>`\n        : ''}\n    `;\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('condensedActions')) {\n      this._checkUpdateActionSizes();\n    }\n\n    if (changedProperties.has('currentStep')) {\n      this._handleCurrentStepUpdate();\n    }\n\n    if (changedProperties.has('_doAnimateTitle')) {\n      this?._animateScrollWrapper?.removeEventListener(\n        'scroll',\n        this._scrollObserver\n      );\n\n      if (this._doAnimateTitle) {\n        this?._animateScrollWrapper?.addEventListener(\n          'scroll',\n          this._scrollObserver\n        );\n      } else {\n        this?._sidePanel?.style?.setProperty(\n          `--${blockClass}--scroll-animation-progress`,\n          '0'\n        );\n      }\n    }\n\n    if (\n      changedProperties.has('_isOpen') ||\n      changedProperties.has('animateTitle')\n    ) {\n      /* @state property changed */\n      this._checkSetDoAnimateTitle();\n    }\n\n    if (\n      changedProperties.has('slideIn') ||\n      changedProperties.has('open') ||\n      changedProperties.has('includeOverlay')\n    ) {\n      this._adjustPageContent();\n    }\n\n    if (changedProperties.has('open')) {\n      this._checkSetOpen();\n\n      this.disconnectObservers();\n      if (this.open) {\n        this.connectObservers();\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._launcher = this.ownerDocument!.activeElement;\n        const focusNode =\n          this.selectorInitialFocus &&\n          this.querySelector(this.selectorInitialFocus);\n\n        await (this.constructor as typeof CDSSidePanel)._delay();\n        if (focusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-side-panel>`'s first update/render cycle\n          (focusNode as HTMLElement).focus();\n        } else if (\n          !tryFocusElems(\n            this.querySelectorAll(\n              (this.constructor as typeof CDSSidePanel).selectorTabbable\n            ),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  private static _delay(ms = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return selectorTabbable;\n  }\n\n  /**\n   * The name of the custom event fired before this side-panel is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this side-panel.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-side-panel-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this side-panel is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-side-panel-closed`;\n  }\n\n  /**\n   * The name of the custom event fired on clicking the navigate back button\n   */\n  static get eventNavigateBack() {\n    return `${prefix}-side-panel-navigate-back`;\n  }\n}\n\nexport default CDSSidePanel;\n"],"mappings":"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"}

package/es/components/skeleton-icon/skeleton-icon.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import skeleton_icon_default$1 from "./skeleton-icon.scss.js";
 import { LitElement } from "lit";
 //#region src/components/skeleton-icon/skeleton-icon.ts

package/es/components/skeleton-icon/skeleton-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-icon.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-icon/skeleton-icon.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './skeleton-icon.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton icon.\n *\n * @element cds-skeleton-icon\n */\n@customElement(`${prefix}-skeleton-icon`)\nclass CDSSkeletonIcon extends LitElement {\n  static styles = styles;\n}\n\nexport default CDSSkeletonIcon;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,kBAAA,MACM,wBAAwB,WAAW;;gBACvBA;;;8BAFjBC,cAAc,oBAA0B,CAAA,EAAA,gBAAA;AAKzC,IAAA,wBAAe"}
+{"version":3,"file":"skeleton-icon.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-icon/skeleton-icon.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './skeleton-icon.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton icon.\n *\n * @element cds-skeleton-icon\n */\n@customElement(`${prefix}-skeleton-icon`)\nclass CDSSkeletonIcon extends LitElement {\n  static styles = styles;\n}\n\nexport default CDSSkeletonIcon;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,kBAAA,MACM,wBAAwB,WAAW;;gBACvBA;;AAClB;8BAHCC,cAAc,mBAAyB,CAAA,GAAA,eAAA;AAKxC,IAAA,wBAAe"}

package/es/components/skeleton-placeholder/skeleton-placeholder.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import skeleton_placeholder_default$1 from "./skeleton-placeholder.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es/components/skeleton-placeholder/skeleton-placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-placeholder.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-placeholder/skeleton-placeholder.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './skeleton-placeholder.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton placeholder.\n *\n * @element cds-skeleton-placeholder\n */\n@customElement(`${prefix}-skeleton-placeholder`)\nclass CDSSkeletonPlaceholder extends LitElement {\n  /**\n   * Specify optional classes to be added to your SkeletonText\n   */\n  @property({ reflect: true, attribute: 'optional-classes' })\n  optionalClasses;\n\n  render() {\n    let defaultClasses = {\n      [`${prefix}--skeleton__placeholder`]: true,\n    };\n\n    if (this.optionalClasses) {\n      const outputObject = {};\n      this.optionalClasses?.split(' ').forEach((element) => {\n        outputObject[element] = true;\n      });\n      defaultClasses = { ...defaultClasses, ...outputObject };\n    }\n    const classes = classMap(defaultClasses);\n\n    return html` <div part=\"placeholder\" class=\"${classes}\"></div> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSkeletonPlaceholder;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,IAAA,yBAAA,MACM,+BAA+B,WAAW;CAO9C,SAAS;EACP,IAAI,iBAAiB,GAClB,+BAAqC,MACvC;AAED,MAAI,KAAK,iBAAiB;GACxB,MAAM,eAAe,EAAE;AACvB,QAAK,iBAAiB,MAAM,IAAI,CAAC,SAAS,YAAY;AACpD,iBAAa,WAAW;KACxB;AACF,oBAAiB;IAAE,GAAG;IAAgB,GAAG;IAAc;;AAIzD,SAAO,IAAI,mCAFK,SAAS,eAAe,CAEc;;;gBAGxCA;;;YApBf,SAAS;CAAE,SAAS;CAAM,WAAW;CAAoB,CAAC,CAAA,EAAA,uBAAA,WAAA,mBAAA,KAAA,EAAA;qCAL5DC,cAAc,2BAAiC,CAAA,EAAA,uBAAA;AA4BhD,IAAA,+BAAe"}
+{"version":3,"file":"skeleton-placeholder.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-placeholder/skeleton-placeholder.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './skeleton-placeholder.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton placeholder.\n *\n * @element cds-skeleton-placeholder\n */\n@customElement(`${prefix}-skeleton-placeholder`)\nclass CDSSkeletonPlaceholder extends LitElement {\n  /**\n   * Specify optional classes to be added to your SkeletonText\n   */\n  @property({ reflect: true, attribute: 'optional-classes' })\n  optionalClasses;\n\n  render() {\n    let defaultClasses = {\n      [`${prefix}--skeleton__placeholder`]: true,\n    };\n\n    if (this.optionalClasses) {\n      const outputObject = {};\n      this.optionalClasses?.split(' ').forEach((element) => {\n        outputObject[element] = true;\n      });\n      defaultClasses = { ...defaultClasses, ...outputObject };\n    }\n    const classes = classMap(defaultClasses);\n\n    return html` <div part=\"placeholder\" class=\"${classes}\"></div> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSkeletonPlaceholder;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,IAAA,yBAAA,MACM,+BAA+B,WAAW;CAO9C,SAAS;EACP,IAAI,iBAAiB,GAClB,+BAAqC,KACxC;EAEA,IAAI,KAAK,iBAAiB;GACxB,MAAM,eAAe,CAAC;GACtB,KAAK,iBAAiB,MAAM,GAAG,CAAC,CAAC,SAAS,YAAY;IACpD,aAAa,WAAW;GAC1B,CAAC;GACD,iBAAiB;IAAE,GAAG;IAAgB,GAAG;GAAa;EACxD;EAGA,OAAO,IAAI,mCAFK,SAAS,cAE2B,EAAE;CACxD;;gBAEgBA;;AAClB;YArBG,SAAS;CAAE,SAAS;CAAM,WAAW;AAAmB,CAAC,CAAA,GAAA,uBAAA,WAAA,mBAAA,KAAA,CAAA;qCAL3DC,cAAc,0BAAgC,CAAA,GAAA,sBAAA;AA4B/C,IAAA,+BAAe"}

package/es/components/skeleton-text/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/skeleton-text/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Skeleton text types.\n */\nexport enum SKELETON_TEXT_TYPE {\n  /**\n   * Regular variant.\n   */\n  REGULAR = '',\n\n  /**\n   * Heading variant.\n   */\n  HEADING = 'heading',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,qBAAL,yBAAA,oBAAA;;;;AAIL,oBAAA,aAAA;;;;AAKA,oBAAA,aAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/skeleton-text/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Skeleton text types.\n */\nexport enum SKELETON_TEXT_TYPE {\n  /**\n   * Regular variant.\n   */\n  REGULAR = '',\n\n  /**\n   * Heading variant.\n   */\n  HEADING = 'heading',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,qBAAL,yBAAA,oBAAA;;;;CAIL,mBAAA,aAAA;;;;CAKA,mBAAA,aAAA;;AACF,EAAA,CAAA,CAAA"}

package/es/components/skeleton-text/skeleton-text.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import { SKELETON_TEXT_TYPE } from "./defs.js";
 import skeleton_text_default$1 from "./skeleton-text.scss.js";
 import { LitElement, html } from "lit";

package/es/components/skeleton-text/skeleton-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-text.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-text/skeleton-text.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, TemplateResult, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { SKELETON_TEXT_TYPE } from './defs';\nimport styles from './skeleton-text.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { SKELETON_TEXT_TYPE };\n\nfunction getRandomInt(min: number, max: number, n: number) {\n  const randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];\n  return Math.floor(randoms[n % 3] * (max - min + 1)) + min;\n}\n\n/**\n * Skeleton text.\n *\n * @element cds-skeleton-text\n */\n@customElement(`${prefix}-skeleton-text`)\nclass CDSSkeletonText extends LitElement {\n  /**\n   * Specify optional classes to be added to your SkeletonText\n   */\n  @property({ reflect: true, attribute: 'optional-classes' })\n  optionalClasses;\n\n  /**\n   * The type of skeleton text.\n   * @deprecated Use the `heading` property instead.\n   */\n  @property({ reflect: true })\n  type = SKELETON_TEXT_TYPE.REGULAR;\n\n  /**\n   * Determines if the skeleton text should be rendered as a heading.\n   */\n  @property({ type: Boolean, reflect: true })\n  heading = false;\n\n  /**\n   * width (in px or %) of single line of text or max-width of paragraph lines\n   */\n  @property({ reflect: true })\n  width = '100%';\n\n  /**\n   * will generate multiple lines of text\n   */\n  @property({ type: Boolean, reflect: true })\n  paragraph = false;\n\n  /**\n   * the number of lines in a paragraph\n   */\n  @property({ type: Number, reflect: true })\n  lineCount = 3;\n\n  render() {\n    const { optionalClasses, paragraph, lineCount, type, width, heading } =\n      this;\n    let defaultClasses = {\n      [`${prefix}--skeleton__text`]: true,\n      [`${prefix}--skeleton__heading`]:\n        heading || type === SKELETON_TEXT_TYPE.HEADING,\n    };\n\n    if (optionalClasses) {\n      const outputObject = {};\n      optionalClasses?.split(' ').forEach((element) => {\n        outputObject[element] = true;\n      });\n      defaultClasses = { ...defaultClasses, ...outputObject };\n    }\n    const classes = classMap(defaultClasses);\n\n    if (paragraph) {\n      const widthNum = parseInt(this.width, 10);\n      const widthPx = this.width.includes('px');\n      const widthPercent = this.width.includes('%');\n      const lines: TemplateResult[] = [];\n      for (let i = 0; i < lineCount; i++) {\n        const randomWidth =\n          (widthPercent && `${getRandomInt(0, 75, i)}px`) ||\n          (widthPx && `${getRandomInt(0, widthNum, i)}px`);\n        const style =\n          (widthPercent && `width: calc(${width} - ${randomWidth})`) ||\n          (widthPx && `width: ${randomWidth}`) ||\n          '';\n        lines.push(html`<p class=\"${classes}\" style=\"${style}\"></p>`);\n      }\n      return lines;\n    }\n\n    return html`<p class=\"${classes}\" style=\"width:${width}\"></p>`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSkeletonText;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiBA,SAAS,aAAa,KAAa,KAAa,GAAW;AAEzD,QAAO,KAAK,MADI;EAAC;EAAmB;EAAqB;EAAmB,CAClD,IAAI,MAAM,MAAM,MAAM,GAAG,GAAG;;;;;;;AAQxD,IAAA,kBAAA,MACM,wBAAwB,WAAW;;;;iBAkB7B;eAMF;mBAMI;mBAMA;;CAEZ,SAAS;EACP,MAAM,EAAE,iBAAiB,WAAW,WAAW,MAAM,OAAO,YAC1D;EACF,IAAI,iBAAiB;IAClB,wBAA8B;IAC9B,2BACC,WAAW,SAAA;GACd;AAED,MAAI,iBAAiB;GACnB,MAAM,eAAe,EAAE;AACvB,oBAAiB,MAAM,IAAI,CAAC,SAAS,YAAY;AAC/C,iBAAa,WAAW;KACxB;AACF,oBAAiB;IAAE,GAAG;IAAgB,GAAG;IAAc;;EAEzD,MAAM,UAAU,SAAS,eAAe;AAExC,MAAI,WAAW;GACb,MAAM,WAAW,SAAS,KAAK,OAAO,GAAG;GACzC,MAAM,UAAU,KAAK,MAAM,SAAS,KAAK;GACzC,MAAM,eAAe,KAAK,MAAM,SAAS,IAAI;GAC7C,MAAM,QAA0B,EAAE;AAClC,QAAK,IAAI,IAAI,GAAG,IAAI,WAAW,KAAK;IAClC,MAAM,cACH,gBAAgB,GAAG,aAAa,GAAG,IAAI,EAAE,CAAC,OAC1C,WAAW,GAAG,aAAa,GAAG,UAAU,EAAE,CAAC;IAC9C,MAAM,QACH,gBAAgB,eAAe,MAAM,KAAK,YAAY,MACtD,WAAW,UAAU,iBACtB;AACF,UAAM,KAAK,IAAI,aAAa,QAAQ,WAAW,MAAM,QAAQ;;AAE/D,UAAO;;AAGT,SAAO,IAAI,aAAa,QAAQ,iBAAiB,MAAM;;;gBAGzCA;;;YAzEf,SAAS;CAAE,SAAS;CAAM,WAAW;CAAoB,CAAC,CAAA,EAAA,gBAAA,WAAA,mBAAA,KAAA,EAAA;YAO1D,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,QAAA,KAAA,EAAA;YAM3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,WAAA,KAAA,EAAA;YAM1C,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,SAAA,KAAA,EAAA;YAM3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,aAAA,KAAA,EAAA;YAM1C,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,aAAA,KAAA,EAAA;8BApC3CC,cAAc,oBAA0B,CAAA,EAAA,gBAAA;AAiFzC,IAAA,wBAAe"}
+{"version":3,"file":"skeleton-text.js","names":["styles","customElement"],"sources":["../../../src/components/skeleton-text/skeleton-text.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, TemplateResult, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { SKELETON_TEXT_TYPE } from './defs';\nimport styles from './skeleton-text.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { SKELETON_TEXT_TYPE };\n\nfunction getRandomInt(min: number, max: number, n: number) {\n  const randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];\n  return Math.floor(randoms[n % 3] * (max - min + 1)) + min;\n}\n\n/**\n * Skeleton text.\n *\n * @element cds-skeleton-text\n */\n@customElement(`${prefix}-skeleton-text`)\nclass CDSSkeletonText extends LitElement {\n  /**\n   * Specify optional classes to be added to your SkeletonText\n   */\n  @property({ reflect: true, attribute: 'optional-classes' })\n  optionalClasses;\n\n  /**\n   * The type of skeleton text.\n   * @deprecated Use the `heading` property instead.\n   */\n  @property({ reflect: true })\n  type = SKELETON_TEXT_TYPE.REGULAR;\n\n  /**\n   * Determines if the skeleton text should be rendered as a heading.\n   */\n  @property({ type: Boolean, reflect: true })\n  heading = false;\n\n  /**\n   * width (in px or %) of single line of text or max-width of paragraph lines\n   */\n  @property({ reflect: true })\n  width = '100%';\n\n  /**\n   * will generate multiple lines of text\n   */\n  @property({ type: Boolean, reflect: true })\n  paragraph = false;\n\n  /**\n   * the number of lines in a paragraph\n   */\n  @property({ type: Number, reflect: true })\n  lineCount = 3;\n\n  render() {\n    const { optionalClasses, paragraph, lineCount, type, width, heading } =\n      this;\n    let defaultClasses = {\n      [`${prefix}--skeleton__text`]: true,\n      [`${prefix}--skeleton__heading`]:\n        heading || type === SKELETON_TEXT_TYPE.HEADING,\n    };\n\n    if (optionalClasses) {\n      const outputObject = {};\n      optionalClasses?.split(' ').forEach((element) => {\n        outputObject[element] = true;\n      });\n      defaultClasses = { ...defaultClasses, ...outputObject };\n    }\n    const classes = classMap(defaultClasses);\n\n    if (paragraph) {\n      const widthNum = parseInt(this.width, 10);\n      const widthPx = this.width.includes('px');\n      const widthPercent = this.width.includes('%');\n      const lines: TemplateResult[] = [];\n      for (let i = 0; i < lineCount; i++) {\n        const randomWidth =\n          (widthPercent && `${getRandomInt(0, 75, i)}px`) ||\n          (widthPx && `${getRandomInt(0, widthNum, i)}px`);\n        const style =\n          (widthPercent && `width: calc(${width} - ${randomWidth})`) ||\n          (widthPx && `width: ${randomWidth}`) ||\n          '';\n        lines.push(html`<p class=\"${classes}\" style=\"${style}\"></p>`);\n      }\n      return lines;\n    }\n\n    return html`<p class=\"${classes}\" style=\"width:${width}\"></p>`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSkeletonText;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiBA,SAAS,aAAa,KAAa,KAAa,GAAW;CAEzD,OAAO,KAAK,MAAM;EADD;EAAmB;EAAqB;CACjC,CAAC,CAAC,IAAI,MAAM,MAAM,MAAM,EAAE,IAAI;AACxD;;;;;;AAOA,IAAA,kBAAA,MACM,wBAAwB,WAAW;;;;iBAkB7B;eAMF;mBAMI;mBAMA;;CAEZ,SAAS;EACP,MAAM,EAAE,iBAAiB,WAAW,WAAW,MAAM,OAAO,YAC1D;EACF,IAAI,iBAAiB;IAClB,wBAA8B;IAC9B,2BACC,WAAW,SAAA;EACf;EAEA,IAAI,iBAAiB;GACnB,MAAM,eAAe,CAAC;GACtB,iBAAiB,MAAM,GAAG,CAAC,CAAC,SAAS,YAAY;IAC/C,aAAa,WAAW;GAC1B,CAAC;GACD,iBAAiB;IAAE,GAAG;IAAgB,GAAG;GAAa;EACxD;EACA,MAAM,UAAU,SAAS,cAAc;EAEvC,IAAI,WAAW;GACb,MAAM,WAAW,SAAS,KAAK,OAAO,EAAE;GACxC,MAAM,UAAU,KAAK,MAAM,SAAS,IAAI;GACxC,MAAM,eAAe,KAAK,MAAM,SAAS,GAAG;GAC5C,MAAM,QAA0B,CAAC;GACjC,KAAK,IAAI,IAAI,GAAG,IAAI,WAAW,KAAK;IAClC,MAAM,cACH,gBAAgB,GAAG,aAAa,GAAG,IAAI,CAAC,EAAE,OAC1C,WAAW,GAAG,aAAa,GAAG,UAAU,CAAC,EAAE;IAC9C,MAAM,QACH,gBAAgB,eAAe,MAAM,KAAK,YAAY,MACtD,WAAW,UAAU,iBACtB;IACF,MAAM,KAAK,IAAI,aAAa,QAAQ,WAAW,MAAM,OAAO;GAC9D;GACA,OAAO;EACT;EAEA,OAAO,IAAI,aAAa,QAAQ,iBAAiB,MAAM;CACzD;;gBAEgBA;;AAClB;YA1EG,SAAS;CAAE,SAAS;CAAM,WAAW;AAAmB,CAAC,CAAA,GAAA,gBAAA,WAAA,mBAAA,KAAA,CAAA;YAOzD,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,QAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,WAAA,KAAA,CAAA;YAMzC,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,SAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,aAAA,KAAA,CAAA;YAMzC,SAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,aAAA,KAAA,CAAA;8BApC1CC,cAAc,mBAAyB,CAAA,GAAA,eAAA;AAiFxC,IAAA,wBAAe"}

package/es/components/skip-to-content/skip-to-content.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import skip_to_content_default$1 from "./skip-to-content.scss.js";
 import { LitElement, html } from "lit";

package/es/components/skip-to-content/skip-to-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"skip-to-content.js","names":["styles","customElement"],"sources":["../../../src/components/skip-to-content/skip-to-content.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport FocusMixin from '../../globals/mixins/focus';\nimport styles from './skip-to-content.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skip-to-content link.\n *\n * @element cds-skip-to-content\n */\n@customElement(`${prefix}-skip-to-content`)\nclass CDSSkipToContent extends FocusMixin(LitElement) {\n  /**\n   * The assistive text for the link,\n   */\n  @property({ attribute: 'link-assistive-text' })\n  linkAssisstiveText = 'Skip to main content';\n\n  /**\n   * The skip link href.\n   */\n  @property()\n  href?: string;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'navigation');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const { linkAssisstiveText } = this;\n    return html`\n      <a class=\"${prefix}--skip-to-content\" href=\"${ifDefined(this.href)}\"\n        ><slot>${linkAssisstiveText}</slot></a\n      >\n    `;\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('linkAssisstiveText')) {\n      const { linkAssisstiveText } = this;\n      this.setAttribute('aria-label', linkAssisstiveText);\n    }\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSkipToContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,mBAAA,MACM,yBAAyB,WAAW,WAAW,CAAC;;;4BAK/B;;CAQrB,oBAAoB;AAClB,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,aAAa;AAEzC,QAAM,mBAAmB;;CAG3B,SAAS;EACP,MAAM,EAAE,uBAAuB;AAC/B,SAAO,IAAI;wBACU,2BAA2B,UAAU,KAAK,KAAK,CAAC;iBACxD,mBAAmB;;;;CAKlC,QAAQ,mBAAmB;AACzB,MAAI,kBAAkB,IAAI,qBAAqB,EAAE;GAC/C,MAAM,EAAE,uBAAuB;AAC/B,QAAK,aAAa,cAAc,mBAAmB;;;;2BAI5B;GACzB,GAAG,WAAW;GACd,gBAAgB;GACjB;;;gBACeA;;;YApCf,SAAS,EAAE,WAAW,uBAAuB,CAAC,CAAA,EAAA,iBAAA,WAAA,sBAAA,KAAA,EAAA;YAM9C,UAAU,CAAA,EAAA,iBAAA,WAAA,QAAA,KAAA,EAAA;+BAXZC,cAAc,sBAA4B,CAAA,EAAA,iBAAA;AA4C3C,IAAA,0BAAe"}
+{"version":3,"file":"skip-to-content.js","names":["styles","customElement"],"sources":["../../../src/components/skip-to-content/skip-to-content.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport FocusMixin from '../../globals/mixins/focus';\nimport styles from './skip-to-content.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skip-to-content link.\n *\n * @element cds-skip-to-content\n */\n@customElement(`${prefix}-skip-to-content`)\nclass CDSSkipToContent extends FocusMixin(LitElement) {\n  /**\n   * The assistive text for the link,\n   */\n  @property({ attribute: 'link-assistive-text' })\n  linkAssisstiveText = 'Skip to main content';\n\n  /**\n   * The skip link href.\n   */\n  @property()\n  href?: string;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'navigation');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const { linkAssisstiveText } = this;\n    return html`\n      <a class=\"${prefix}--skip-to-content\" href=\"${ifDefined(this.href)}\"\n        ><slot>${linkAssisstiveText}</slot></a\n      >\n    `;\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('linkAssisstiveText')) {\n      const { linkAssisstiveText } = this;\n      this.setAttribute('aria-label', linkAssisstiveText);\n    }\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSkipToContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,mBAAA,MACM,yBAAyB,WAAW,UAAU,CAAC,CAAC;;;4BAK/B;;CAQrB,oBAAoB;EAClB,IAAI,CAAC,KAAK,aAAa,MAAM,GAC3B,KAAK,aAAa,QAAQ,YAAY;EAExC,MAAM,kBAAkB;CAC1B;CAEA,SAAS;EACP,MAAM,EAAE,uBAAuB;EAC/B,OAAO,IAAI;wBACU,2BAA2B,UAAU,KAAK,IAAI,EAAE;iBACxD,mBAAmB;;;CAGlC;CAEA,QAAQ,mBAAmB;EACzB,IAAI,kBAAkB,IAAI,oBAAoB,GAAG;GAC/C,MAAM,EAAE,uBAAuB;GAC/B,KAAK,aAAa,cAAc,kBAAkB;EACpD;CACF;;2BAE2B;GACzB,GAAG,WAAW;GACd,gBAAgB;EAClB;;;gBACgBA;;AAClB;YArCG,SAAS,EAAE,WAAW,sBAAsB,CAAC,CAAA,GAAA,iBAAA,WAAA,sBAAA,KAAA,CAAA;YAM7C,SAAS,CAAA,GAAA,iBAAA,WAAA,QAAA,KAAA,CAAA;+BAXXC,cAAc,qBAA2B,CAAA,GAAA,gBAAA;AA4C1C,IAAA,0BAAe"}