@carbon/web-components 2.57.0-rc.0 → 2.58.0-rc.0

package/es-custom/components/text-input/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/text-input/defs.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\nexport { FORM_ELEMENT_COLOR_SCHEME as INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Input size.\n */\nexport enum INPUT_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  // TODO: deprecate\n  /**\n   * Extra large size.\n   */\n  EXTRA_LARGE = 'xl',\n}\n\n/**\n * Input tooltop alignment\n */\nexport enum INPUT_TOOLTIP_ALIGNMENT {\n  /**\n   * Small size.\n   */\n  START = 'start',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  CENTER = 'center',\n\n  /**\n   * Large size.\n   */\n  END = 'end',\n}\n\n/**\n * Input tooltop direction\n */\nexport enum INPUT_TOOLTIP_DIRECTION {\n  /**\n   * Small size.\n   */\n  TOP = 'top',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  RIGHT = 'right',\n\n  /**\n   * Large size.\n   */\n  BOTTOM = 'bottom',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  LEFT = 'left',\n}\n\n/**\n * Supported input types.\n *\n * For this component we only support textual types\n */\nexport enum INPUT_TYPE {\n  EMAIL = 'email',\n  PASSWORD = 'password',\n  TEL = 'tel',\n  TEXT = 'text',\n  URL = 'url',\n}\n"],"mappings":";;;;;;;;;;;;AAYA,IAAY,aAAL,yBAAA,YAAA;;;;AAIL,YAAA,iBAAA;;;;AAKA,YAAA,WAAA;;;;AAKA,YAAA,YAAA;;;;AAKA,YAAA,WAAA;;;;AAMA,YAAA,iBAAA;;KACD;;;;AAKD,IAAY,0BAAL,yBAAA,yBAAA;;;;AAIL,yBAAA,WAAA;;;;AAKA,yBAAA,YAAA;;;;AAKA,yBAAA,SAAA;;KACD;;;;AAKD,IAAY,0BAAL,yBAAA,yBAAA;;;;AAIL,yBAAA,SAAA;;;;AAKA,yBAAA,WAAA;;;;AAKA,yBAAA,YAAA;;;;AAKA,yBAAA,UAAA;;KACD;;;;;;AAOD,IAAY,aAAL,yBAAA,YAAA;AACL,YAAA,WAAA;AACA,YAAA,cAAA;AACA,YAAA,SAAA;AACA,YAAA,UAAA;AACA,YAAA,SAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/text-input/defs.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\nexport { FORM_ELEMENT_COLOR_SCHEME as INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Input size.\n */\nexport enum INPUT_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  // TODO: deprecate\n  /**\n   * Extra large size.\n   */\n  EXTRA_LARGE = 'xl',\n}\n\n/**\n * Input tooltop alignment\n */\nexport enum INPUT_TOOLTIP_ALIGNMENT {\n  /**\n   * Small size.\n   */\n  START = 'start',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  CENTER = 'center',\n\n  /**\n   * Large size.\n   */\n  END = 'end',\n}\n\n/**\n * Input tooltop direction\n */\nexport enum INPUT_TOOLTIP_DIRECTION {\n  /**\n   * Small size.\n   */\n  TOP = 'top',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  RIGHT = 'right',\n\n  /**\n   * Large size.\n   */\n  BOTTOM = 'bottom',\n\n  /**\n   * Regular size, same as medium size.\n   */\n  LEFT = 'left',\n}\n\n/**\n * Supported input types.\n *\n * For this component we only support textual types\n */\nexport enum INPUT_TYPE {\n  EMAIL = 'email',\n  PASSWORD = 'password',\n  TEL = 'tel',\n  TEXT = 'text',\n  URL = 'url',\n}\n"],"mappings":";;;;;;;;;;;;AAYA,IAAY,aAAL,yBAAA,YAAA;;;;CAIL,WAAA,iBAAA;;;;CAKA,WAAA,WAAA;;;;CAKA,WAAA,YAAA;;;;CAKA,WAAA,WAAA;;;;CAMA,WAAA,iBAAA;;AACF,EAAA,CAAA,CAAA;;;;AAKA,IAAY,0BAAL,yBAAA,yBAAA;;;;CAIL,wBAAA,WAAA;;;;CAKA,wBAAA,YAAA;;;;CAKA,wBAAA,SAAA;;AACF,EAAA,CAAA,CAAA;;;;AAKA,IAAY,0BAAL,yBAAA,yBAAA;;;;CAIL,wBAAA,SAAA;;;;CAKA,wBAAA,WAAA;;;;CAKA,wBAAA,YAAA;;;;CAKA,wBAAA,UAAA;;AACF,EAAA,CAAA,CAAA;;;;;;AAOA,IAAY,aAAL,yBAAA,YAAA;CACL,WAAA,WAAA;CACA,WAAA,cAAA;CACA,WAAA,SAAA;CACA,WAAA,UAAA;CACA,WAAA,SAAA;;AACF,EAAA,CAAA,CAAA"}

package/es-custom/components/text-input/stories/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","names":[],"sources":["../../../../src/components/text-input/stories/helpers.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { action } from 'storybook/actions';\nimport { INPUT_COLOR_SCHEME, INPUT_SIZE, INPUT_TYPE } from '../text-input';\n\nconst inputTypes = Object.entries(INPUT_TYPE).reduce(\n  (acc, [key, val]) => ({\n    ...acc,\n    [`${key.toLowerCase()}`]: val,\n  }),\n  {}\n);\n\nconst sizes = {\n  [`Small size (${INPUT_SIZE.SMALL})`]: INPUT_SIZE.SMALL,\n  [`Medium size (${INPUT_SIZE.MEDIUM})`]: INPUT_SIZE.MEDIUM,\n  [`Large size (${INPUT_SIZE.LARGE})`]: INPUT_SIZE.LARGE,\n};\n\nconst colorSchemes = {\n  [`Regular`]: null,\n  [`Light (${INPUT_COLOR_SCHEME.LIGHT})`]: INPUT_COLOR_SCHEME.LIGHT,\n};\n\nconst createProps = ({ boolean, textNonEmpty, select }) => {\n  const type = select('Input type (type)', inputTypes, INPUT_TYPE.TEXT);\n  return {\n    colorScheme: select('Color scheme (color-scheme)', colorSchemes, null),\n    disabled: boolean('Disabled (disabled)', false),\n    value: textNonEmpty('Input value (value)', ''),\n    placeholder: textNonEmpty(\n      'Placeholder text (placeholder)',\n      'Optional placeholder text'\n    ),\n    invalid: boolean('Invalid (invalid)', false),\n    onInput: action('input'),\n    showPasswordVisibilityToggle:\n      type === INPUT_TYPE.TEXT || type === INPUT_TYPE.PASSWORD\n        ? boolean(\n            'Show password visibility toggle (show-password-visibility-toggle)',\n            false\n          )\n        : null,\n    size: select('Input size (size)', sizes, INPUT_SIZE.MEDIUM),\n    type,\n  };\n};\n\nexport default createProps;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAUA,MAAM,aAAa,OAAO,QAAQ,WAAW,CAAC,QAC3C,KAAK,CAAC,KAAK,UAAU;CACpB,GAAG;EACF,GAAG,IAAI,aAAa,KAAK;CAC3B,GACD,EAAE,CACH;AAED,MAAM,QAAQ;EACX,oBAAgC;EAChC,qBAAkC;EAClC,oBAAgC;CAClC;AAED,MAAM,eAAe;EAClB,YAAY;EACZ,kBAAmC;CACrC;AAED,MAAM,eAAe,EAAE,SAAS,cAAc,aAAa;CACzD,MAAM,OAAO,OAAO,qBAAqB,YAAA,OAA4B;AACrE,QAAO;EACL,aAAa,OAAO,+BAA+B,cAAc,KAAK;EACtE,UAAU,QAAQ,uBAAuB,MAAM;EAC/C,OAAO,aAAa,uBAAuB,GAAG;EAC9C,aAAa,aACX,kCACA,4BACD;EACD,SAAS,QAAQ,qBAAqB,MAAM;EAC5C,SAAS,OAAO,QAAQ;EACxB,8BACE,SAAA,UAA4B,SAAA,aACxB,QACE,qEACA,MACD,GACD;EACN,MAAM,OAAO,qBAAqB,OAAA,KAAyB;EAC3D;EACD"}
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../../src/components/text-input/stories/helpers.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { action } from 'storybook/actions';\nimport { INPUT_COLOR_SCHEME, INPUT_SIZE, INPUT_TYPE } from '../text-input';\n\nconst inputTypes = Object.entries(INPUT_TYPE).reduce(\n  (acc, [key, val]) => ({\n    ...acc,\n    [`${key.toLowerCase()}`]: val,\n  }),\n  {}\n);\n\nconst sizes = {\n  [`Small size (${INPUT_SIZE.SMALL})`]: INPUT_SIZE.SMALL,\n  [`Medium size (${INPUT_SIZE.MEDIUM})`]: INPUT_SIZE.MEDIUM,\n  [`Large size (${INPUT_SIZE.LARGE})`]: INPUT_SIZE.LARGE,\n};\n\nconst colorSchemes = {\n  [`Regular`]: null,\n  [`Light (${INPUT_COLOR_SCHEME.LIGHT})`]: INPUT_COLOR_SCHEME.LIGHT,\n};\n\nconst createProps = ({ boolean, textNonEmpty, select }) => {\n  const type = select('Input type (type)', inputTypes, INPUT_TYPE.TEXT);\n  return {\n    colorScheme: select('Color scheme (color-scheme)', colorSchemes, null),\n    disabled: boolean('Disabled (disabled)', false),\n    value: textNonEmpty('Input value (value)', ''),\n    placeholder: textNonEmpty(\n      'Placeholder text (placeholder)',\n      'Optional placeholder text'\n    ),\n    invalid: boolean('Invalid (invalid)', false),\n    onInput: action('input'),\n    showPasswordVisibilityToggle:\n      type === INPUT_TYPE.TEXT || type === INPUT_TYPE.PASSWORD\n        ? boolean(\n            'Show password visibility toggle (show-password-visibility-toggle)',\n            false\n          )\n        : null,\n    size: select('Input size (size)', sizes, INPUT_SIZE.MEDIUM),\n    type,\n  };\n};\n\nexport default createProps;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAUA,MAAM,aAAa,OAAO,QAAQ,UAAU,CAAC,CAAC,QAC3C,KAAK,CAAC,KAAK,UAAU;CACpB,GAAG;EACF,GAAG,IAAI,YAAY,MAAM;AAC5B,IACA,CAAC,CACH;AAEA,MAAM,QAAQ;EACX,oBAAgC;EAChC,qBAAkC;EAClC,oBAAgC;AACnC;AAEA,MAAM,eAAe;EAClB,YAAY;EACZ,kBAAmC;AACtC;AAEA,MAAM,eAAe,EAAE,SAAS,cAAc,aAAa;CACzD,MAAM,OAAO,OAAO,qBAAqB,YAAA,MAA2B;CACpE,OAAO;EACL,aAAa,OAAO,+BAA+B,cAAc,IAAI;EACrE,UAAU,QAAQ,uBAAuB,KAAK;EAC9C,OAAO,aAAa,uBAAuB,EAAE;EAC7C,aAAa,aACX,kCACA,2BACF;EACA,SAAS,QAAQ,qBAAqB,KAAK;EAC3C,SAAS,OAAO,OAAO;EACvB,8BACE,SAAA,UAA4B,SAAA,aACxB,QACE,qEACA,KACF,IACA;EACN,MAAM,OAAO,qBAAqB,OAAA,IAAwB;EAC1D;CACF;AACF"}

package/es-custom/components/text-input/text-input-skeleton.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 text_input_default from "./text-input.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

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

@@ -1 +1 @@
-{"version":3,"file":"text-input-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/text-input/text-input-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './text-input.scss?lit';\nimport { INPUT_SIZE } from './defs';\n\n/**\n * @element cds-custom-text-input-skeleton\n *\n * Skeleton of text input.\n */\n@customElement(`${prefix}-text-input-skeleton`)\nclass CDSTextInputSkeleton extends LitElement {\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * The text-input-skeleton size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  render() {\n    const { hideLabel, size } = this;\n\n    const skeletonClasses = classMap({\n      [`${prefix}--form-item`]: true,\n      [`${prefix}--layout--size-${size}`]: size !== undefined,\n    });\n\n    return html`\n      <div class=${skeletonClasses}>\n        ${hideLabel\n          ? ''\n          : html`<span class=\"${prefix}--label ${prefix}--skeleton\"></span>`}\n        <div class=\"${prefix}--text-input ${prefix}--skeleton\"></div>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTextInputSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,uBAAA,MACM,6BAA6B,WAAW;;;mBAKhC;;CAQZ,SAAS;EACP,MAAM,EAAE,WAAW,SAAS;AAO5B,SAAO,IAAI;mBALa,SAAS;IAC9B,mBAAyB;IACzB,qBAA2B,SAAS,SAAS,KAAA;GAC/C,CAAC,CAG6B;UACzB,YACE,KACA,IAAI,gBAAA,MAAuB,UAAA,MAAiB,qBAAqB;4BAChD,eAAA,MAAsB;;;;;gBAKjCA;;;YA3Bf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAc,CAAC,CAAA,EAAA,qBAAA,WAAA,aAAA,KAAA,EAAA;YAMnE,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,QAAA,KAAA,EAAA;mCAX7BC,cAAc,0BAAgC,CAAA,EAAA,qBAAA;AAmC/C,IAAA,8BAAe"}
+{"version":3,"file":"text-input-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/text-input/text-input-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './text-input.scss?lit';\nimport { INPUT_SIZE } from './defs';\n\n/**\n * @element cds-custom-text-input-skeleton\n *\n * Skeleton of text input.\n */\n@customElement(`${prefix}-text-input-skeleton`)\nclass CDSTextInputSkeleton extends LitElement {\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * The text-input-skeleton size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  render() {\n    const { hideLabel, size } = this;\n\n    const skeletonClasses = classMap({\n      [`${prefix}--form-item`]: true,\n      [`${prefix}--layout--size-${size}`]: size !== undefined,\n    });\n\n    return html`\n      <div class=${skeletonClasses}>\n        ${hideLabel\n          ? ''\n          : html`<span class=\"${prefix}--label ${prefix}--skeleton\"></span>`}\n        <div class=\"${prefix}--text-input ${prefix}--skeleton\"></div>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTextInputSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,uBAAA,MACM,6BAA6B,WAAW;;;mBAKhC;;CAQZ,SAAS;EACP,MAAM,EAAE,WAAW,SAAS;EAO5B,OAAO,IAAI;mBALa,SAAS;IAC9B,mBAAyB;IACzB,qBAA2B,SAAS,SAAS,KAAA;EAChD,CAG6B,EAAE;UACzB,YACE,KACA,IAAI,gBAAA,MAAuB,UAAA,MAAiB,qBAAqB;4BAChD,eAAA,MAAsB;;;CAGjD;;gBAEgBA;;AAClB;YA5BG,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAa,CAAC,CAAA,GAAA,qBAAA,WAAA,aAAA,KAAA,CAAA;YAMlE,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,qBAAA,WAAA,QAAA,KAAA,CAAA;mCAX5BC,cAAc,yBAA+B,CAAA,GAAA,oBAAA;AAmC9C,IAAA,8BAAe"}

package/es-custom/components/text-input/text-input.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 FormMixin from "../../globals/mixins/form.js";
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";

package/es-custom/components/text-input/text-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/text-input/text-input.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport View16 from '@carbon/icons/es/view/16.js';\nimport ViewOff16 from '@carbon/icons/es/view--off/16.js';\nimport FormMixin from '../../globals/mixins/form';\nimport ValidityMixin from '../../globals/mixins/validity';\nimport {\n  INPUT_COLOR_SCHEME,\n  INPUT_SIZE,\n  INPUT_TOOLTIP_ALIGNMENT,\n  INPUT_TOOLTIP_DIRECTION,\n  INPUT_TYPE,\n} from './defs';\nimport styles from './text-input.scss?lit';\n\nexport {\n  INPUT_COLOR_SCHEME,\n  INPUT_SIZE,\n  INPUT_TOOLTIP_ALIGNMENT,\n  INPUT_TOOLTIP_DIRECTION,\n  INPUT_TYPE,\n};\n\n/**\n * Text Input element. Supports all the usual attributes for textual input types\n *\n * @element cds-custom-text-input\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}-text-input`)\nclass CDSTextInput extends ValidityMixin(FormMixin(LitElement)) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSTextInput).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTextInput).slugItem\n            )\n          : false\n      );\n\n    this._hasAILabel = Boolean(hasContent);\n    (hasContent[0] as HTMLElement).setAttribute('size', 'mini');\n    this.requestUpdate();\n  }\n  /**\n   * The underlying input element\n   */\n  @query('input')\n  protected _input!: HTMLInputElement;\n\n  @query('slot[name=\"helper-text\"]')\n  protected _slotHelperTextNode!: HTMLSlotElement;\n\n  /**\n   * The internal value.\n   */\n  protected _value = '';\n\n  /**\n   * Handles `oninput` event on the `input`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  protected _handleInput({ target }: Event) {\n    this.value = (target as HTMLInputElement).value;\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  protected _handleHelperTextSlotChange() {\n    this.requestUpdate();\n  }\n\n  /**\n   * May be any of the standard HTML autocomplete options\n   */\n  @property()\n  autocomplete = '';\n\n  /**\n   * Sets the input 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 input\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify whether to display the character counter\n   */\n  @property({ type: Boolean, attribute: 'enable-counter', reflect: true })\n  enableCounter = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\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   * Max character count allowed for input. This is needed in order for enableCounter to display\n   */\n  @property({ type: Number, attribute: 'max-count', reflect: true })\n  maxCount;\n\n  /**\n   * Specify whether the control is currently in warning state\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Provide the text that is displayed when the control is in warning state\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  /**\n   * Specify whether you want the underlying label to be visually hidden\n   */\n  @property({ attribute: 'hide-label', type: Boolean, reflect: true })\n  hideLabel = false;\n\n  /**\n   * Generic label that will be used as the textual representation of what this field is for\n   */\n  @property({ attribute: 'label' })\n  label = '';\n\n  /**\n   * Name for the input in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the input against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the input has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Specify if the component should be read-only\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   * \"Hide password\" tooltip text on password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property()\n  hidePasswordLabel = 'Hide password';\n\n  /**\n   * \"Show password\" tooltip text on password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property()\n  showPasswordLabel = 'Show password';\n\n  /**\n   * Boolean property to render password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property({\n    type: Boolean,\n    attribute: 'show-password-visibility-toggle',\n    reflect: true,\n  })\n  showPasswordVisibilityToggle = false;\n\n  /**\n   * The input box size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * true to use the inline version.\n   */\n  @property({ type: Boolean, reflect: true })\n  inline = false;\n\n  /**\n   * Specify the alignment of the tooltip to the icon-only button.\n   * Can be one of: start, center, or end.\n   */\n  @property()\n  tooltipAlignment = INPUT_TOOLTIP_ALIGNMENT.CENTER;\n\n  /**\n   * Specify the direction of the tooltip for icon-only buttons.\n   * Can be either top, right, bottom, or left.\n   */\n  @property()\n  tooltipDirection = INPUT_TOOLTIP_DIRECTION.BOTTOM;\n\n  /**\n   * The type of the input. Can be one of the types listed in the INPUT_TYPE enum\n   */\n  @property({ reflect: true })\n  type = INPUT_TYPE.TEXT;\n\n  /**\n   * The validity message. If present and non-empty, this input shows the UI of its invalid state.\n   */\n  @property({ attribute: 'validity-message' })\n  validityMessage = '';\n\n  /**\n   * The value of the input.\n   */\n  @property({ reflect: true })\n  get value() {\n    // FIXME: Figure out how to deal with TS2611\n    // once we have the input we can directly query for the value\n    if (this._input) {\n      return this._input.value;\n    }\n    // but before then _value will work fine\n    return this._value;\n  }\n\n  set value(value) {\n    const oldValue = this._value;\n    this._value = value;\n    // make sure that lit-element updates the right properties\n    this.requestUpdate('value', oldValue);\n    // we set the value directly on the input (when available)\n    // so that programatic manipulation updates the UI correctly\n    if (this._input) {\n      this._input.value = value;\n    }\n  }\n\n  /**\n   * Handles password visibility toggle button click\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  private togglePasswordVisibility() {\n    this.type =\n      this.type === INPUT_TYPE.PASSWORD ? INPUT_TYPE.TEXT : INPUT_TYPE.PASSWORD;\n  }\n\n  render() {\n    const {\n      disabled,\n      enableCounter,\n      helperText,\n      hideLabel,\n      inline,\n      isFluid,\n      invalid,\n      invalidText,\n      label,\n      maxCount,\n      readonly,\n      required,\n      size,\n      type,\n      warn,\n      warnText,\n      value,\n      _handleInput: handleInput,\n      _hasAILabel: hasAILabel,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--text-input__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--text-input__invalid-icon ${prefix}--text-input__invalid-icon--warning`,\n    });\n\n    const normalizedProps: {\n      disabled: boolean;\n      invalid: boolean;\n      warn: boolean;\n      'slot-name': string;\n      'slot-text': string;\n      icon: ReturnType<typeof iconLoader>;\n    } = {\n      disabled: !readonly && disabled,\n      invalid: !readonly && invalid,\n      warn: !readonly && !invalid && warn,\n      'slot-name': '',\n      'slot-text': '',\n      icon: null,\n    };\n\n    if (normalizedProps.invalid) {\n      normalizedProps.icon = invalidIcon;\n      normalizedProps['slot-name'] = 'invalid-text';\n      normalizedProps['slot-text'] = invalidText;\n    } else if (normalizedProps.warn) {\n      normalizedProps.icon = warnIcon;\n      normalizedProps['slot-name'] = 'warn-text';\n      normalizedProps['slot-text'] = warnText;\n    }\n\n    const counterClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--text-input__label-counter`]: true,\n      [`${prefix}--label--disabled`]: disabled,\n    });\n\n    const inputWrapperClasses = classMap({\n      [`${prefix}--form-item`]: true,\n      [`${prefix}--text-input-wrapper`]: true,\n      [`${prefix}--text-input-wrapper--inline`]: inline,\n      [`${prefix}--text-input-wrapper--readonly`]: readonly,\n      [`${prefix}--text-input-wrapper--inline--invalid`]:\n        inline && normalizedProps.invalid,\n    });\n\n    const inputClasses = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--text-input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--text-input--warning`]: normalizedProps.warn,\n      [`${prefix}--text-input--${size}`]: size !== undefined, // TODO V12 - remove this class\n      [`${prefix}--layout--size-${size}`]: size !== undefined,\n      [`${prefix}--password-input`]: type === INPUT_TYPE.PASSWORD, // TODO: deprecated, remove in v12\n    });\n\n    const fieldOuterWrapperClasses = classMap({\n      [`${prefix}--text-input__field-outer-wrapper`]: true,\n      [`${prefix}--text-input__field-outer-wrapper--inline`]: inline,\n    });\n\n    const fieldWrapperClasses = classMap({\n      [`${prefix}--text-input__field-wrapper`]: true,\n      [`${prefix}--text-input__field-wrapper--warning`]: normalizedProps.warn,\n      [`${prefix}--text-input__field-wrapper--decorator`]: hasAILabel,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: hideLabel,\n      [`${prefix}--label--disabled`]: normalizedProps.disabled,\n      [`${prefix}--label--inline`]: inline,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: normalizedProps.disabled,\n      [`${prefix}--form__helper-text--inline`]: inline,\n    });\n\n    // TODO: deprecated, remove in v12\n    const passwordIsVisible = type !== INPUT_TYPE.PASSWORD;\n    const passwordVisibilityIcon = passwordIsVisible\n      ? iconLoader(ViewOff16, { class: `${prefix}--icon-visibility-off` })\n      : iconLoader(View16, { class: `${prefix}--icon-visibility-on` });\n\n    // TODO: deprecated, remove in v12\n    const passwordVisibilityToggleClasses = classMap({\n      [`${prefix}--text-input--password__visibility__toggle`]: true,\n      [`${prefix}--btn`]: true,\n      [`${prefix}--btn--icon-only`]: true,\n      [`${prefix}--tooltip__trigger`]: true,\n      [`${prefix}--tooltip--a11y`]: true,\n      [`${prefix}--btn--disabled`]: normalizedProps.disabled,\n      [`${prefix}--tooltip--${this.tooltipDirection}`]: this.tooltipDirection,\n      [`${prefix}--tooltip--align-${this.tooltipAlignment}`]:\n        this.tooltipAlignment,\n    });\n\n    // TODO: deprecated, remove in v12\n    const passwordButtonLabel = html`\n      <span class=\"${prefix}--assistive-text\">\n        ${passwordIsVisible ? this.hidePasswordLabel : this.showPasswordLabel}\n      </span>\n    `;\n\n    // TODO: deprecated, remove in v12\n    const passwordVisibilityButton = () => html`\n      <button\n        type=\"button\"\n        class=\"${passwordVisibilityToggleClasses}\"\n        ?disabled=\"${normalizedProps.disabled}\"\n        @click=\"${this.togglePasswordVisibility}\">\n        ${!normalizedProps.disabled ? passwordButtonLabel : null}\n        ${passwordVisibilityIcon}\n      </button>\n    `;\n\n    const textCount = value?.length;\n\n    const counter =\n      enableCounter && maxCount\n        ? html` <label class=\"${counterClasses}\">\n            <slot name=\"label-text\">${textCount}/${maxCount}</slot>\n          </label>`\n        : null;\n\n    const labelWrapper = html`<div class=\"${prefix}--text-input__label-wrapper\">\n      <label class=\"${labelClasses}\">\n        <slot name=\"label-text\">${label}</slot>\n      </label>\n      ${counter}\n    </div>`;\n\n    const hasHelperText =\n      helperText || (this._slotHelperTextNode?.assignedNodes().length ?? 0) > 0;\n\n    const helper = html`<div\n      class=\"${helperTextClasses}\"\n      id=\"helper-text\"\n      ?hidden=\"${normalizedProps.invalid ||\n      normalizedProps.warn ||\n      !hasHelperText}\">\n      <slot\n        name=\"helper-text\"\n        @slotchange=\"${this._handleHelperTextSlotChange}\">\n        ${helperText}\n      </slot>\n    </div>`;\n\n    const validationMessage =\n      normalizedProps.invalid || normalizedProps.warn\n        ? html`<div\n            class=\"${prefix}--form-requirement\"\n            ?hidden=\"${!normalizedProps.invalid && !normalizedProps.warn}\">\n            <slot name=\"${normalizedProps['slot-name']}\">\n              ${normalizedProps['slot-text']}\n            </slot>\n          </div>`\n        : null;\n\n    return html`\n      <div class=\"${inputWrapperClasses}\">\n        ${!inline\n          ? labelWrapper\n          : html`<div class=\"${prefix}--text-input__label-helper-wrapper\">\n              ${labelWrapper}\n            </div>`}\n        <div class=\"${fieldOuterWrapperClasses}\">\n          <div class=\"${fieldWrapperClasses}\" ?data-invalid=\"${invalid}\">\n            <input\n              autocomplete=\"${this.autocomplete}\"\n              ?autofocus=\"${this.autofocus}\"\n              class=\"${inputClasses}\"\n              ?data-invalid=\"${invalid}\"\n              ?disabled=\"${disabled}\"\n              ?aria-describedby=\"${hasHelperText ? 'helper-text' : undefined}\"\n              id=\"input\"\n              name=\"${ifNonEmpty(this.name)}\"\n              pattern=\"${ifNonEmpty(this.pattern)}\"\n              placeholder=\"${ifNonEmpty(this.placeholder)}\"\n              ?readonly=\"${readonly}\"\n              ?required=\"${required}\"\n              type=\"${ifNonEmpty(type)}\"\n              .value=\"${this._value}\"\n              maxlength=\"${ifNonEmpty(maxCount)}\"\n              @input=\"${handleInput}\" />\n            ${normalizedProps.icon}\n            <slot name=\"ai-label\" @slotchange=\"${handleSlotChange}\"></slot>\n            <slot name=\"slug\" @slotchange=\"${handleSlotChange}\"></slot>\n            ${this.showPasswordVisibilityToggle &&\n            (type === INPUT_TYPE.PASSWORD || type === INPUT_TYPE.TEXT)\n              ? passwordVisibilityButton()\n              : null}\n            ${isFluid\n              ? html`<hr class=\"${prefix}--text-input__divider\" />`\n              : null}\n            ${isFluid && !inline ? validationMessage : null}\n          </div>\n\n          ${/* Non-fluid: validation and helper outside field wrapper */ ''}\n          ${!isFluid && !inline ? validationMessage || helper : null}\n        </div>\n        ${inline && !isFluid\n          ? html`<div class=\"${prefix}--text-input__label-helper-wrapper\">\n              ${!isFluid ? validationMessage || helper : null}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n\n  updated() {\n    this.toggleAttribute('ai-label', this._hasAILabel);\n    const label = this.shadowRoot?.querySelector(\"slot[name='ai-label']\");\n\n    if (label) {\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  /**\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  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSTextInput;\n"],"mappings":"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"}
+{"version":3,"file":"text-input.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/text-input/text-input.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport View16 from '@carbon/icons/es/view/16.js';\nimport ViewOff16 from '@carbon/icons/es/view--off/16.js';\nimport FormMixin from '../../globals/mixins/form';\nimport ValidityMixin from '../../globals/mixins/validity';\nimport {\n  INPUT_COLOR_SCHEME,\n  INPUT_SIZE,\n  INPUT_TOOLTIP_ALIGNMENT,\n  INPUT_TOOLTIP_DIRECTION,\n  INPUT_TYPE,\n} from './defs';\nimport styles from './text-input.scss?lit';\n\nexport {\n  INPUT_COLOR_SCHEME,\n  INPUT_SIZE,\n  INPUT_TOOLTIP_ALIGNMENT,\n  INPUT_TOOLTIP_DIRECTION,\n  INPUT_TYPE,\n};\n\n/**\n * Text Input element. Supports all the usual attributes for textual input types\n *\n * @element cds-custom-text-input\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}-text-input`)\nclass CDSTextInput extends ValidityMixin(FormMixin(LitElement)) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSTextInput).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTextInput).slugItem\n            )\n          : false\n      );\n\n    this._hasAILabel = Boolean(hasContent);\n    (hasContent[0] as HTMLElement).setAttribute('size', 'mini');\n    this.requestUpdate();\n  }\n  /**\n   * The underlying input element\n   */\n  @query('input')\n  protected _input!: HTMLInputElement;\n\n  @query('slot[name=\"helper-text\"]')\n  protected _slotHelperTextNode!: HTMLSlotElement;\n\n  /**\n   * The internal value.\n   */\n  protected _value = '';\n\n  /**\n   * Handles `oninput` event on the `input`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  protected _handleInput({ target }: Event) {\n    this.value = (target as HTMLInputElement).value;\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  protected _handleHelperTextSlotChange() {\n    this.requestUpdate();\n  }\n\n  /**\n   * May be any of the standard HTML autocomplete options\n   */\n  @property()\n  autocomplete = '';\n\n  /**\n   * Sets the input 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 input\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify whether to display the character counter\n   */\n  @property({ type: Boolean, attribute: 'enable-counter', reflect: true })\n  enableCounter = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\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   * Max character count allowed for input. This is needed in order for enableCounter to display\n   */\n  @property({ type: Number, attribute: 'max-count', reflect: true })\n  maxCount;\n\n  /**\n   * Specify whether the control is currently in warning state\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * Provide the text that is displayed when the control is in warning state\n   */\n  @property({ attribute: 'warn-text' })\n  warnText = '';\n\n  /**\n   * Specify whether you want the underlying label to be visually hidden\n   */\n  @property({ attribute: 'hide-label', type: Boolean, reflect: true })\n  hideLabel = false;\n\n  /**\n   * Generic label that will be used as the textual representation of what this field is for\n   */\n  @property({ attribute: 'label' })\n  label = '';\n\n  /**\n   * Name for the input in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the input against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the input has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Specify if the component should be read-only\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   * \"Hide password\" tooltip text on password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property()\n  hidePasswordLabel = 'Hide password';\n\n  /**\n   * \"Show password\" tooltip text on password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property()\n  showPasswordLabel = 'Show password';\n\n  /**\n   * Boolean property to render password visibility toggle\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  @property({\n    type: Boolean,\n    attribute: 'show-password-visibility-toggle',\n    reflect: true,\n  })\n  showPasswordVisibilityToggle = false;\n\n  /**\n   * The input box size.\n   */\n  @property({ reflect: true })\n  size?: INPUT_SIZE;\n\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * true to use the inline version.\n   */\n  @property({ type: Boolean, reflect: true })\n  inline = false;\n\n  /**\n   * Specify the alignment of the tooltip to the icon-only button.\n   * Can be one of: start, center, or end.\n   */\n  @property()\n  tooltipAlignment = INPUT_TOOLTIP_ALIGNMENT.CENTER;\n\n  /**\n   * Specify the direction of the tooltip for icon-only buttons.\n   * Can be either top, right, bottom, or left.\n   */\n  @property()\n  tooltipDirection = INPUT_TOOLTIP_DIRECTION.BOTTOM;\n\n  /**\n   * The type of the input. Can be one of the types listed in the INPUT_TYPE enum\n   */\n  @property({ reflect: true })\n  type = INPUT_TYPE.TEXT;\n\n  /**\n   * The validity message. If present and non-empty, this input shows the UI of its invalid state.\n   */\n  @property({ attribute: 'validity-message' })\n  validityMessage = '';\n\n  /**\n   * The value of the input.\n   */\n  @property({ reflect: true })\n  get value() {\n    // FIXME: Figure out how to deal with TS2611\n    // once we have the input we can directly query for the value\n    if (this._input) {\n      return this._input.value;\n    }\n    // but before then _value will work fine\n    return this._value;\n  }\n\n  set value(value) {\n    const oldValue = this._value;\n    this._value = value;\n    // make sure that lit-element updates the right properties\n    this.requestUpdate('value', oldValue);\n    // we set the value directly on the input (when available)\n    // so that programatic manipulation updates the UI correctly\n    if (this._input) {\n      this._input.value = value;\n    }\n  }\n\n  /**\n   * Handles password visibility toggle button click\n   *\n   * @deprecated will be removed in the next major version, use `cds-custom-password-input` instead\n   */\n  private togglePasswordVisibility() {\n    this.type =\n      this.type === INPUT_TYPE.PASSWORD ? INPUT_TYPE.TEXT : INPUT_TYPE.PASSWORD;\n  }\n\n  render() {\n    const {\n      disabled,\n      enableCounter,\n      helperText,\n      hideLabel,\n      inline,\n      isFluid,\n      invalid,\n      invalidText,\n      label,\n      maxCount,\n      readonly,\n      required,\n      size,\n      type,\n      warn,\n      warnText,\n      value,\n      _handleInput: handleInput,\n      _hasAILabel: hasAILabel,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--text-input__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--text-input__invalid-icon ${prefix}--text-input__invalid-icon--warning`,\n    });\n\n    const normalizedProps: {\n      disabled: boolean;\n      invalid: boolean;\n      warn: boolean;\n      'slot-name': string;\n      'slot-text': string;\n      icon: ReturnType<typeof iconLoader>;\n    } = {\n      disabled: !readonly && disabled,\n      invalid: !readonly && invalid,\n      warn: !readonly && !invalid && warn,\n      'slot-name': '',\n      'slot-text': '',\n      icon: null,\n    };\n\n    if (normalizedProps.invalid) {\n      normalizedProps.icon = invalidIcon;\n      normalizedProps['slot-name'] = 'invalid-text';\n      normalizedProps['slot-text'] = invalidText;\n    } else if (normalizedProps.warn) {\n      normalizedProps.icon = warnIcon;\n      normalizedProps['slot-name'] = 'warn-text';\n      normalizedProps['slot-text'] = warnText;\n    }\n\n    const counterClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--text-input__label-counter`]: true,\n      [`${prefix}--label--disabled`]: disabled,\n    });\n\n    const inputWrapperClasses = classMap({\n      [`${prefix}--form-item`]: true,\n      [`${prefix}--text-input-wrapper`]: true,\n      [`${prefix}--text-input-wrapper--inline`]: inline,\n      [`${prefix}--text-input-wrapper--readonly`]: readonly,\n      [`${prefix}--text-input-wrapper--inline--invalid`]:\n        inline && normalizedProps.invalid,\n    });\n\n    const inputClasses = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--text-input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--text-input--warning`]: normalizedProps.warn,\n      [`${prefix}--text-input--${size}`]: size !== undefined, // TODO V12 - remove this class\n      [`${prefix}--layout--size-${size}`]: size !== undefined,\n      [`${prefix}--password-input`]: type === INPUT_TYPE.PASSWORD, // TODO: deprecated, remove in v12\n    });\n\n    const fieldOuterWrapperClasses = classMap({\n      [`${prefix}--text-input__field-outer-wrapper`]: true,\n      [`${prefix}--text-input__field-outer-wrapper--inline`]: inline,\n    });\n\n    const fieldWrapperClasses = classMap({\n      [`${prefix}--text-input__field-wrapper`]: true,\n      [`${prefix}--text-input__field-wrapper--warning`]: normalizedProps.warn,\n      [`${prefix}--text-input__field-wrapper--decorator`]: hasAILabel,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: hideLabel,\n      [`${prefix}--label--disabled`]: normalizedProps.disabled,\n      [`${prefix}--label--inline`]: inline,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: normalizedProps.disabled,\n      [`${prefix}--form__helper-text--inline`]: inline,\n    });\n\n    // TODO: deprecated, remove in v12\n    const passwordIsVisible = type !== INPUT_TYPE.PASSWORD;\n    const passwordVisibilityIcon = passwordIsVisible\n      ? iconLoader(ViewOff16, { class: `${prefix}--icon-visibility-off` })\n      : iconLoader(View16, { class: `${prefix}--icon-visibility-on` });\n\n    // TODO: deprecated, remove in v12\n    const passwordVisibilityToggleClasses = classMap({\n      [`${prefix}--text-input--password__visibility__toggle`]: true,\n      [`${prefix}--btn`]: true,\n      [`${prefix}--btn--icon-only`]: true,\n      [`${prefix}--tooltip__trigger`]: true,\n      [`${prefix}--tooltip--a11y`]: true,\n      [`${prefix}--btn--disabled`]: normalizedProps.disabled,\n      [`${prefix}--tooltip--${this.tooltipDirection}`]: this.tooltipDirection,\n      [`${prefix}--tooltip--align-${this.tooltipAlignment}`]:\n        this.tooltipAlignment,\n    });\n\n    // TODO: deprecated, remove in v12\n    const passwordButtonLabel = html`\n      <span class=\"${prefix}--assistive-text\">\n        ${passwordIsVisible ? this.hidePasswordLabel : this.showPasswordLabel}\n      </span>\n    `;\n\n    // TODO: deprecated, remove in v12\n    const passwordVisibilityButton = () => html`\n      <button\n        type=\"button\"\n        class=\"${passwordVisibilityToggleClasses}\"\n        ?disabled=\"${normalizedProps.disabled}\"\n        @click=\"${this.togglePasswordVisibility}\">\n        ${!normalizedProps.disabled ? passwordButtonLabel : null}\n        ${passwordVisibilityIcon}\n      </button>\n    `;\n\n    const textCount = value?.length;\n\n    const counter =\n      enableCounter && maxCount\n        ? html` <label class=\"${counterClasses}\">\n            <slot name=\"label-text\">${textCount}/${maxCount}</slot>\n          </label>`\n        : null;\n\n    const labelWrapper = html`<div class=\"${prefix}--text-input__label-wrapper\">\n      <label class=\"${labelClasses}\">\n        <slot name=\"label-text\">${label}</slot>\n      </label>\n      ${counter}\n    </div>`;\n\n    const hasHelperText =\n      helperText || (this._slotHelperTextNode?.assignedNodes().length ?? 0) > 0;\n\n    const helper = html`<div\n      class=\"${helperTextClasses}\"\n      id=\"helper-text\"\n      ?hidden=\"${normalizedProps.invalid ||\n      normalizedProps.warn ||\n      !hasHelperText}\">\n      <slot\n        name=\"helper-text\"\n        @slotchange=\"${this._handleHelperTextSlotChange}\">\n        ${helperText}\n      </slot>\n    </div>`;\n\n    const validationMessage =\n      normalizedProps.invalid || normalizedProps.warn\n        ? html`<div\n            class=\"${prefix}--form-requirement\"\n            ?hidden=\"${!normalizedProps.invalid && !normalizedProps.warn}\">\n            <slot name=\"${normalizedProps['slot-name']}\">\n              ${normalizedProps['slot-text']}\n            </slot>\n          </div>`\n        : null;\n\n    return html`\n      <div class=\"${inputWrapperClasses}\">\n        ${!inline\n          ? labelWrapper\n          : html`<div class=\"${prefix}--text-input__label-helper-wrapper\">\n              ${labelWrapper}\n            </div>`}\n        <div class=\"${fieldOuterWrapperClasses}\">\n          <div class=\"${fieldWrapperClasses}\" ?data-invalid=\"${invalid}\">\n            <input\n              autocomplete=\"${this.autocomplete}\"\n              ?autofocus=\"${this.autofocus}\"\n              class=\"${inputClasses}\"\n              ?data-invalid=\"${invalid}\"\n              ?disabled=\"${disabled}\"\n              ?aria-describedby=\"${hasHelperText ? 'helper-text' : undefined}\"\n              id=\"input\"\n              name=\"${ifNonEmpty(this.name)}\"\n              pattern=\"${ifNonEmpty(this.pattern)}\"\n              placeholder=\"${ifNonEmpty(this.placeholder)}\"\n              ?readonly=\"${readonly}\"\n              ?required=\"${required}\"\n              type=\"${ifNonEmpty(type)}\"\n              .value=\"${this._value}\"\n              maxlength=\"${ifNonEmpty(maxCount)}\"\n              @input=\"${handleInput}\" />\n            ${normalizedProps.icon}\n            <slot name=\"ai-label\" @slotchange=\"${handleSlotChange}\"></slot>\n            <slot name=\"slug\" @slotchange=\"${handleSlotChange}\"></slot>\n            ${this.showPasswordVisibilityToggle &&\n            (type === INPUT_TYPE.PASSWORD || type === INPUT_TYPE.TEXT)\n              ? passwordVisibilityButton()\n              : null}\n            ${isFluid\n              ? html`<hr class=\"${prefix}--text-input__divider\" />`\n              : null}\n            ${isFluid && !inline ? validationMessage : null}\n          </div>\n\n          ${/* Non-fluid: validation and helper outside field wrapper */ ''}\n          ${!isFluid && !inline ? validationMessage || helper : null}\n        </div>\n        ${inline && !isFluid\n          ? html`<div class=\"${prefix}--text-input__label-helper-wrapper\">\n              ${!isFluid ? validationMessage || helper : null}\n            </div>`\n          : null}\n      </div>\n    `;\n  }\n\n  updated() {\n    this.toggleAttribute('ai-label', this._hasAILabel);\n    const label = this.shadowRoot?.querySelector(\"slot[name='ai-label']\");\n\n    if (label) {\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  /**\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  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSTextInput;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,IAAA,eAAA,MACM,qBAAqB,cAAc,UAAU,UAAU,CAAC,CAAC,CAAC;;;qBAItC;gBAoCL;sBA4BJ;mBAMH;kBAMD;uBAMK;oBAMH;iBAMH;qBAMI;cAYP;kBAMI;mBAMC;eAMJ;cAMD;iBAMG;qBAMI;kBAMH;kBAMA;iCAMe;2BAQN;2BAQA;sCAYW;iBASrB;gBAMD;;;;yBA0BS;;;;;CAtOlB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,cAAc,CAAC,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,YAAoC,WAC5C,KAEC,KAAqB,QACnB,KAAK,YAAoC,QAC5C,IACA,KACN;EAEF,KAAK,cAAc,QAAQ,UAAU;EACrC,WAAY,EAAE,CAAiB,aAAa,QAAQ,MAAM;EAC1D,KAAK,cAAc;CACrB;;;;;;;CAqBA,aAAuB,EAAE,UAAiB;EACxC,KAAK,QAAS,OAA4B;CAC5C;CAEA,gBAAgB,OAAsB;EACpC,MAAM,EAAE,aAAa;EACrB,MAAM,EAAE,UAAU,MAAM,UAAU;EAClC,IAAI,CAAC,UACH,SAAS,OAAO,MAAM,KAAK;CAE/B;CAEA,8BAAwC;EACtC,KAAK,cAAc;CACrB;;;;CAsLA,IACI,QAAQ;EAGV,IAAI,KAAK,QACP,OAAO,KAAK,OAAO;EAGrB,OAAO,KAAK;CACd;CAEA,IAAI,MAAM,OAAO;EACf,MAAM,WAAW,KAAK;EACtB,KAAK,SAAS;EAEd,KAAK,cAAc,SAAS,QAAQ;EAGpC,IAAI,KAAK,QACP,KAAK,OAAO,QAAQ;CAExB;;;;;;CAOA,2BAAmC;EACjC,KAAK,OACH,KAAK,SAAA,aAAA,SAAA;CACT;CAEA,SAAS;EACP,MAAM,EACJ,UACA,eACA,YACA,WACA,QACA,SACA,SACA,aACA,OACA,UACA,UACA,UACA,MACA,MACA,MACA,UACA,OACA,cAAc,aACd,aAAa,YACb,mBAAmB,qBACjB;EAEJ,MAAM,cAAc,WAAW,iBAAiB,EAC9C,OAAO,gCACT,CAAC;EAED,MAAM,WAAW,WAAW,oBAAoB,EAC9C,OAAO,uEACT,CAAC;EAED,MAAM,kBAOF;GACF,UAAU,CAAC,YAAY;GACvB,SAAS,CAAC,YAAY;GACtB,MAAM,CAAC,YAAY,CAAC,WAAW;GAC/B,aAAa;GACb,aAAa;GACb,MAAM;EACR;EAEA,IAAI,gBAAgB,SAAS;GAC3B,gBAAgB,OAAO;GACvB,gBAAgB,eAAe;GAC/B,gBAAgB,eAAe;EACjC,OAAO,IAAI,gBAAgB,MAAM;GAC/B,gBAAgB,OAAO;GACvB,gBAAgB,eAAe;GAC/B,gBAAgB,eAAe;EACjC;EAEA,MAAM,iBAAiB,SAAS;IAC7B,eAAqB;IACrB,mCAAyC;IACzC,yBAA+B;EAClC,CAAC;EAED,MAAM,sBAAsB,SAAS;IAClC,mBAAyB;IACzB,4BAAkC;IAClC,oCAA0C;IAC1C,sCAA4C;IAC5C,6CACC,UAAU,gBAAgB;EAC9B,CAAC;EAED,MAAM,eAAe,SAAS;IAC3B,oBAA0B;IAC1B,6BAAmC,gBAAgB;IACnD,6BAAmC,gBAAgB;IACnD,oBAA0B,SAAS,SAAS,KAAA;IAC5C,qBAA2B,SAAS,SAAS,KAAA;IAC7C,wBAA8B,SAAA;EACjC,CAAC;EAED,MAAM,2BAA2B,SAAS;IACvC,yCAA+C;IAC/C,iDAAuD;EAC1D,CAAC;EAED,MAAM,sBAAsB,SAAS;IAClC,mCAAyC;IACzC,4CAAkD,gBAAgB;IAClE,8CAAoD;EACvD,CAAC;EAED,MAAM,eAAe,SAAS;IAC3B,eAAqB;IACrB,yBAA+B;IAC/B,yBAA+B,gBAAgB;IAC/C,uBAA6B;EAChC,CAAC;EAED,MAAM,oBAAoB,SAAS;IAChC,2BAAiC;IACjC,qCAA2C,gBAAgB;IAC3D,mCAAyC;EAC5C,CAAC;EAGD,MAAM,oBAAoB,SAAA;EAC1B,MAAM,yBAAyB,oBAC3B,WAAW,WAAW,EAAE,OAAO,2BAAiC,CAAC,IACjE,WAAW,QAAQ,EAAE,OAAO,0BAAgC,CAAC;EAGjE,MAAM,kCAAkC,SAAS;IAC9C,kDAAwD;IACxD,aAAmB;IACnB,wBAA8B;IAC9B,0BAAgC;IAChC,uBAA6B;IAC7B,uBAA6B,gBAAgB;IAC7C,iBAAuB,KAAK,qBAAqB,KAAK;IACtD,uBAA6B,KAAK,qBACjC,KAAK;EACT,CAAC;EAGD,MAAM,sBAAsB,IAAI;2BACR;UAClB,oBAAoB,KAAK,oBAAoB,KAAK,kBAAkB;;;EAK1E,MAAM,iCAAiC,IAAI;;;iBAG9B,gCAAgC;qBAC5B,gBAAgB,SAAS;kBAC5B,KAAK,yBAAyB;UACtC,CAAC,gBAAgB,WAAW,sBAAsB,KAAK;UACvD,uBAAuB;;;EAI7B,MAAM,YAAY,OAAO;EASzB,MAAM,eAAe,IAAI,eAAA,MAAsB;sBAC7B,aAAa;kCACD,MAAM;;QARlC,iBAAiB,WACb,IAAI,kBAAkB,eAAe;sCACT,UAAU,GAAG,SAAS;sBAElD,KAMM;;EAGZ,MAAM,gBACJ,eAAe,KAAK,qBAAqB,cAAc,CAAC,CAAC,UAAU,KAAK;EAE1E,MAAM,SAAS,IAAI;eACR,kBAAkB;;iBAEhB,gBAAgB,WAC3B,gBAAgB,QAChB,CAAC,cAAc;;;uBAGE,KAAK,4BAA4B;UAC9C,WAAW;;;EAIjB,MAAM,oBACJ,gBAAgB,WAAW,gBAAgB,OACvC,IAAI;2BACc;uBACL,CAAC,gBAAgB,WAAW,CAAC,gBAAgB,KAAK;0BAC/C,gBAAgB,aAAa;gBACvC,gBAAgB,aAAa;;oBAGnC;EAEN,OAAO,IAAI;oBACK,oBAAoB;UAC9B,CAAC,SACC,eACA,IAAI,eAAA,MAAsB;gBACtB,aAAa;oBACT;sBACE,yBAAyB;wBACvB,oBAAoB,mBAAmB,QAAQ;;8BAEzC,KAAK,aAAa;4BACpB,KAAK,UAAU;uBACpB,aAAa;+BACL,QAAQ;2BACZ,SAAS;mCACD,gBAAgB,gBAAgB,KAAA,EAAU;;sBAEvDA,qBAAW,KAAK,IAAI,EAAE;yBACnBA,qBAAW,KAAK,OAAO,EAAE;6BACrBA,qBAAW,KAAK,WAAW,EAAE;2BAC/B,SAAS;2BACT,SAAS;sBACdA,qBAAW,IAAI,EAAE;wBACf,KAAK,OAAO;2BACTA,qBAAW,QAAQ,EAAE;wBACxB,YAAY;cACtB,gBAAgB,KAAK;iDACc,iBAAiB;6CACrB,iBAAiB;cAChD,KAAK,iCACN,SAAA,cAAgC,SAAA,UAC7B,yBAAyB,IACzB,KAAK;cACP,UACE,IAAI,cAAA,MAAqB,6BACzB,KAAK;cACP,WAAW,CAAC,SAAS,oBAAoB,KAAK;;;YAGa,GAAG;YAChE,CAAC,WAAW,CAAC,SAAS,qBAAqB,SAAS,KAAK;;UAE3D,UAAU,CAAC,UACT,IAAI,eAAA,MAAsB;gBACtB,CAAC,UAAU,qBAAqB,SAAS,KAAK;sBAElD,KAAK;;;CAGf;CAEA,UAAU;EACR,KAAK,gBAAgB,YAAY,KAAK,WAAW;EACjD,MAAM,QAAQ,KAAK,YAAY,cAAc,uBAAuB;EAEpE,IAAI,OACF,OAAO,UAAU,OACf,qBACA,KAAK,cAAc,cAAoB,CAAC,EAAE,aAAa,eAAe,CACxE;OAEA,KAAK,YACD,cAAc,mBAAmB,CAAC,EAClC,UAAU,OACV,qBACA,KAAK,cAAc,UAAgB,CAAC,EAAE,aAAa,eAAe,CACpE;CAEN;;;;;;CAOA,WAAW,WAAW;EACpB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;2BAE2B;GACzB,GAAG,WAAW;GACd,gBAAgB;EAClB;;;gBACgBC;;AAClB;YA5gBG,MAAM,OAAO,CAAA,GAAA,aAAA,WAAA,UAAA,KAAA,CAAA;YAGb,MAAM,4BAA0B,CAAA,GAAA,aAAA,WAAA,uBAAA,KAAA,CAAA;YAiChC,SAAS,CAAA,GAAA,aAAA,WAAA,gBAAA,KAAA,CAAA;YAMT,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,aAAA,WAAA,aAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;YAMzC,SAAS;CAAE,MAAM;CAAS,WAAW;CAAkB,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,iBAAA,KAAA,CAAA;YAMtE,SAAS,EAAE,WAAW,cAAc,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;YAMrC,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,WAAA,KAAA,CAAA;YAMzC,SAAS,EAAE,WAAW,eAAe,CAAC,CAAA,GAAA,aAAA,WAAA,eAAA,KAAA,CAAA;YAMtC,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAa,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;YAMhE,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,QAAA,KAAA,CAAA;YAMzC,SAAS,EAAE,WAAW,YAAY,CAAC,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;YAMnC,SAAS;CAAE,WAAW;CAAc,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,aAAA,KAAA,CAAA;YAMlE,SAAS,EAAE,WAAW,QAAQ,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,KAAA,CAAA;YAM/B,SAAS,CAAA,GAAA,aAAA,WAAA,QAAA,KAAA,CAAA;YAMT,SAAS,CAAA,GAAA,aAAA,WAAA,WAAA,KAAA,CAAA;YAMT,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,aAAA,WAAA,eAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;YAMzC,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;YAMzC,SAAS,EAAE,WAAW,4BAA4B,CAAC,CAAA,GAAA,aAAA,WAAA,2BAAA,KAAA,CAAA;YAQnD,SAAS,CAAA,GAAA,aAAA,WAAA,qBAAA,KAAA,CAAA;YAQT,SAAS,CAAA,GAAA,aAAA,WAAA,qBAAA,KAAA,CAAA;YAQT,SAAS;CACR,MAAM;CACN,WAAW;CACX,SAAS;AACX,CAAC,CAAA,GAAA,aAAA,WAAA,gCAAA,KAAA,CAAA;YAMA,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,aAAA,WAAA,QAAA,KAAA,CAAA;YAG1B,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,aAAA,WAAA,WAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,UAAA,KAAA,CAAA;YAOzC,SAAS,CAAA,GAAA,aAAA,WAAA,oBAAA,KAAA,CAAA;YAOT,SAAS,CAAA,GAAA,aAAA,WAAA,oBAAA,KAAA,CAAA;YAMT,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,aAAA,WAAA,QAAA,KAAA,CAAA;YAM1B,SAAS,EAAE,WAAW,mBAAmB,CAAC,CAAA,GAAA,aAAA,WAAA,mBAAA,KAAA,CAAA;YAM1C,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,IAAA;2BArP5BC,cAAc,gBAAsB,CAAA,GAAA,YAAA;AA8iBrC,IAAA,qBAAe"}

package/es-custom/components/textarea/stories/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","names":[],"sources":["../../../../src/components/textarea/stories/helpers.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { action } from 'storybook/actions';\n\nconst createProps = ({ boolean, textNullable, number }) => ({\n  cols: number('Number of columns (cols)', 0),\n  disabled: boolean('Disabled (disabled)', false),\n  enableCounter: boolean('Enable character counter (enable-counter)', true),\n  helperText: textNullable('Helper text (helper-text)', 'Textarea helper text'),\n  hideLabel: boolean('Hide label (hide-label)', false),\n  invalid: boolean('Invalid (invalid)', false),\n  invalidText: textNullable('Invalid text (invalid-text)', 'Invalid text'),\n  label: textNullable('Label (label)', 'Textarea label'),\n  maxCount: number('Max character count (max-count', 500),\n  onInput: action('input'),\n  placeholder: textNullable('Placeholder text (placeholder)', ''),\n  readonly: boolean('Read only (readonly)', false),\n  rows: number('Number of rows (rows)', 4),\n  value: textNullable('Value (value)', ''),\n  warn: boolean('Warn (warn)', false),\n  warnText: textNullable('Warn text (warn-text)', 'This is a warning message.'),\n});\n\nexport default createProps;\n"],"mappings":";;;;;;;;;;;;;;;AASA,MAAM,eAAe,EAAE,SAAS,cAAc,cAAc;CAC1D,MAAM,OAAO,4BAA4B,EAAE;CAC3C,UAAU,QAAQ,uBAAuB,MAAM;CAC/C,eAAe,QAAQ,6CAA6C,KAAK;CACzE,YAAY,aAAa,6BAA6B,uBAAuB;CAC7E,WAAW,QAAQ,2BAA2B,MAAM;CACpD,SAAS,QAAQ,qBAAqB,MAAM;CAC5C,aAAa,aAAa,+BAA+B,eAAe;CACxE,OAAO,aAAa,iBAAiB,iBAAiB;CACtD,UAAU,OAAO,kCAAkC,IAAI;CACvD,SAAS,OAAO,QAAQ;CACxB,aAAa,aAAa,kCAAkC,GAAG;CAC/D,UAAU,QAAQ,wBAAwB,MAAM;CAChD,MAAM,OAAO,yBAAyB,EAAE;CACxC,OAAO,aAAa,iBAAiB,GAAG;CACxC,MAAM,QAAQ,eAAe,MAAM;CACnC,UAAU,aAAa,yBAAyB,6BAA6B;CAC9E"}
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../../src/components/textarea/stories/helpers.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { action } from 'storybook/actions';\n\nconst createProps = ({ boolean, textNullable, number }) => ({\n  cols: number('Number of columns (cols)', 0),\n  disabled: boolean('Disabled (disabled)', false),\n  enableCounter: boolean('Enable character counter (enable-counter)', true),\n  helperText: textNullable('Helper text (helper-text)', 'Textarea helper text'),\n  hideLabel: boolean('Hide label (hide-label)', false),\n  invalid: boolean('Invalid (invalid)', false),\n  invalidText: textNullable('Invalid text (invalid-text)', 'Invalid text'),\n  label: textNullable('Label (label)', 'Textarea label'),\n  maxCount: number('Max character count (max-count', 500),\n  onInput: action('input'),\n  placeholder: textNullable('Placeholder text (placeholder)', ''),\n  readonly: boolean('Read only (readonly)', false),\n  rows: number('Number of rows (rows)', 4),\n  value: textNullable('Value (value)', ''),\n  warn: boolean('Warn (warn)', false),\n  warnText: textNullable('Warn text (warn-text)', 'This is a warning message.'),\n});\n\nexport default createProps;\n"],"mappings":";;;;;;;;;;;;;;;AASA,MAAM,eAAe,EAAE,SAAS,cAAc,cAAc;CAC1D,MAAM,OAAO,4BAA4B,CAAC;CAC1C,UAAU,QAAQ,uBAAuB,KAAK;CAC9C,eAAe,QAAQ,6CAA6C,IAAI;CACxE,YAAY,aAAa,6BAA6B,sBAAsB;CAC5E,WAAW,QAAQ,2BAA2B,KAAK;CACnD,SAAS,QAAQ,qBAAqB,KAAK;CAC3C,aAAa,aAAa,+BAA+B,cAAc;CACvE,OAAO,aAAa,iBAAiB,gBAAgB;CACrD,UAAU,OAAO,kCAAkC,GAAG;CACtD,SAAS,OAAO,OAAO;CACvB,aAAa,aAAa,kCAAkC,EAAE;CAC9D,UAAU,QAAQ,wBAAwB,KAAK;CAC/C,MAAM,OAAO,yBAAyB,CAAC;CACvC,OAAO,aAAa,iBAAiB,EAAE;CACvC,MAAM,QAAQ,eAAe,KAAK;CAClC,UAAU,aAAa,yBAAyB,4BAA4B;AAC9E"}

package/es-custom/components/textarea/textarea-skeleton.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 textarea_default from "./textarea.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es-custom/components/textarea/textarea-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/textarea/textarea-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 styles from './textarea.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * @element cds-custom-textarea-skeleton\n *\n * Skeleton of text area.\n */\n@customElement(`${prefix}-textarea-skeleton`)\nclass CDSTextareaSkeleton extends LitElement {\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  render() {\n    const { hideLabel } = this;\n    return html`\n      ${hideLabel\n        ? ''\n        : html`<span class=\"${prefix}--label ${prefix}--skeleton\"></span>`}\n      <div class=\"${prefix}--skeleton ${prefix}--text-area\"></div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTextareaSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,sBAAA,MACM,4BAA4B,WAAW;;;mBAK/B;;CAEZ,SAAS;EACP,MAAM,EAAE,cAAc;AACtB,SAAO,IAAI;QACP,YACE,KACA,IAAI,gBAAA,MAAuB,UAAA,MAAiB,qBAAqB;0BAChD,aAAA,MAAoB;;;;gBAI7BA;;;YAbf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAc,CAAC,CAAA,EAAA,oBAAA,WAAA,aAAA,KAAA,EAAA;kCALrEC,cAAc,wBAA8B,CAAA,EAAA,oBAAA;AAqB7C,IAAA,4BAAe"}
+{"version":3,"file":"textarea-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/textarea/textarea-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 styles from './textarea.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * @element cds-custom-textarea-skeleton\n *\n * Skeleton of text area.\n */\n@customElement(`${prefix}-textarea-skeleton`)\nclass CDSTextareaSkeleton extends LitElement {\n  /**\n   * Specify whether the label should be hidden, or not\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  render() {\n    const { hideLabel } = this;\n    return html`\n      ${hideLabel\n        ? ''\n        : html`<span class=\"${prefix}--label ${prefix}--skeleton\"></span>`}\n      <div class=\"${prefix}--skeleton ${prefix}--text-area\"></div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTextareaSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,sBAAA,MACM,4BAA4B,WAAW;;;mBAK/B;;CAEZ,SAAS;EACP,MAAM,EAAE,cAAc;EACtB,OAAO,IAAI;QACP,YACE,KACA,IAAI,gBAAA,MAAuB,UAAA,MAAiB,qBAAqB;0BAChD,aAAA,MAAoB;;CAE7C;;gBAEgBA;;AAClB;YAdG,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAa,CAAC,CAAA,GAAA,oBAAA,WAAA,aAAA,KAAA,CAAA;kCALpEC,cAAc,uBAA6B,CAAA,GAAA,mBAAA;AAqB5C,IAAA,4BAAe"}

package/es-custom/components/textarea/textarea.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 if_non_empty_default from "../../globals/directives/if-non-empty.js";
 import text_input_default from "../text-input/text-input.js";

package/es-custom/components/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","names":["CDSTextInput","ifNonEmpty","styles","customElement"],"sources":["../../../src/components/textarea/textarea.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport CDSTextInput from '../text-input/text-input';\nimport styles from './textarea.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\n/**\n * Text area.\n *\n * @element cds-custom-textarea\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}-textarea`)\nclass CDSTextarea extends CDSTextInput {\n  /**\n   * Manually handles maxCount for counterMode = 'word'\n   * @param event The keyboard event.\n   */\n  protected _onKeyDown(evt: KeyboardEvent) {\n    if (!this.disabled && this.enableCounter && this.counterMode === 'word') {\n      const currentWordCount = this.value?.match(/\\p{L}+/gu)?.length || 0;\n      if (\n        (this.maxCount &&\n          currentWordCount >= this.maxCount &&\n          evt.key === ' ') ||\n        (this.maxCount &&\n          currentWordCount >= this.maxCount &&\n          evt.key === 'Enter')\n      ) {\n        evt.preventDefault();\n      }\n    }\n  }\n\n  /**\n   * Handles `onPaste` event on the `<input>`.\n   * Manually handles maxCount for counterMode = 'word' when\n   * the user is pasting text\n   *\n   * @param event The clipboard event.\n   */\n  protected _onPaste(evt: ClipboardEvent) {\n    if (\n      this.counterMode === 'word' &&\n      this.enableCounter &&\n      typeof this.maxCount !== 'undefined'\n    ) {\n      const existingWords: string[] =\n        this._textarea.value.match(/\\p{L}+/gu) || [];\n      const pastedWords: string[] =\n        evt.clipboardData?.getData('Text').match(/\\p{L}+/gu) || [];\n\n      const totalWords = existingWords.length + pastedWords.length;\n\n      if (totalWords > this.maxCount) {\n        evt.preventDefault();\n\n        const allowedWords = existingWords\n          .concat(pastedWords)\n          .slice(0, this.maxCount);\n\n        this._textarea.value = allowedWords.join(' ');\n        this._textarea.dispatchEvent(\n          new InputEvent('input', {\n            inputType: 'insertFromPaste',\n            data: allowedWords.join(' '),\n            bubbles: true,\n          })\n        );\n      }\n    }\n  }\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  protected _handleInput({ target }: Event) {\n    this.value = (target as HTMLTextAreaElement).value;\n  }\n\n  /**\n   * The number of columns for the textarea to show by default\n   */\n  @property({ type: Number })\n  cols;\n\n  /**\n   * Specify whether the textarea is fluid or not\n   */\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * Specify the method used for calculating the counter number\n   */\n  @property({\n    type: String,\n    reflect: true,\n    hasChanged(newVal: string, oldVal: string) {\n      if ((newVal === 'character' || newVal === 'word') && newVal !== oldVal) {\n        return true;\n      }\n      return false;\n    },\n    attribute: 'counter-mode',\n  })\n  counterMode: 'character' | 'word' = 'character';\n\n  /**\n   * ID to link the `label` and `textarea`\n   */\n  @property()\n  id = '';\n\n  /**\n   * Pattern to validate the textarea against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The number of rows for the textarea to show by default\n   */\n  @property()\n  rows = 4;\n\n  /**\n   * Get a reference to the underlying textarea so we can directly apply values.\n   * This lets us fixe a bug where after a user would clear text, the value wouldn't update programmatically\n   */\n  @query('textarea')\n  protected _textarea!: HTMLTextAreaElement;\n\n  /**\n   * The previous counterMode selected. This lets the counterMode state update\n   * when the user toggles between both modes.\n   */\n  private _prevCounterMode: 'character' | 'word' = this.counterMode;\n\n  /**\n   * Observes the textarea wrapper’s size to re-measure helper/invalid/warn text width when\n   * cols is updated\n   */\n  private _resizeObserver?: ResizeObserver;\n\n  render() {\n    const { enableCounter, maxCount } = this;\n\n    const textCount = this.value?.length ?? 0;\n    const wordCount = this.value?.match(/\\p{L}+/gu)?.length || 0;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--text-area__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--text-area__invalid-icon ${prefix}--text-area__invalid-icon--warning`,\n    });\n\n    const textareaClasses = classMap({\n      [`${prefix}--text-area`]: true,\n      [`${prefix}--text-area--warn`]: this.warn,\n      [`${prefix}--text-area--invalid`]: this.invalid,\n      [`${prefix}--text-area__wrapper--decorator`]: this._hasAILabel,\n    });\n\n    const textareaWrapperClasses = classMap({\n      [`${prefix}--text-area__wrapper`]: true,\n      [`${prefix}--text-area__wrapper--cols`]: this.cols,\n      [`${prefix}--text-area__wrapper--warn`]: this.warn,\n      [`${prefix}--text-area__wrapper--readonly`]: this.readonly,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: this.hideLabel,\n      [`${prefix}--label--disabled`]: this.disabled,\n    });\n\n    const counterClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: this.disabled,\n      [`${prefix}--text-area__label-counter`]: true,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: this.disabled,\n    });\n\n    const counter =\n      enableCounter && maxCount\n        ? html` <label class=\"${counterClasses}\">\n            <slot name=\"label-text\"\n              >${this.counterMode === 'word'\n                ? wordCount\n                : textCount}/${maxCount}</slot\n            >\n          </label>`\n        : null;\n\n    const icon = () => {\n      if (this.invalid) {\n        return invalidIcon;\n      } else if (this.warn && !this.invalid) {\n        return warnIcon;\n      }\n      return null;\n    };\n\n    const helper = html`\n      <div class=\"${helperTextClasses}\" id=\"helper-text\">\n        <slot name=\"helper-text\">${this.helperText}</slot>\n      </div>\n    `;\n\n    const normalizedProps = {\n      invalid: this.invalid,\n      warn: this.warn,\n      'slot-name': this.invalid ? 'invalid-text' : 'warn-text',\n      'slot-text': this.invalid ? this.invalidText : this.warnText,\n    };\n\n    const validationMessage = html`\n      <div\n        class=\"${prefix}--form-requirement\"\n        ?hidden=\"${!normalizedProps.invalid && !normalizedProps.warn}\">\n        <slot name=\"${normalizedProps['slot-name']}\">\n          ${normalizedProps['slot-text']} ${this.isFluid ? icon() : null}\n        </slot>\n      </div>\n    `;\n\n    return html`\n      <div class=\"${prefix}--text-area__label-wrapper\">\n        <label class=\"${labelClasses}\" for=\"input\">\n          <slot name=\"label-text\"> ${this.label} </slot>\n        </label>\n        ${counter}\n      </div>\n      <div class=\"${textareaWrapperClasses}\" ?data-invalid=\"${this.invalid}\">\n        ${!this.isFluid ? icon() : null}\n        <textarea\n          autocomplete=\"${this.autocomplete}\"\n          ?autofocus=\"${this.autofocus}\"\n          class=\"${textareaClasses}\"\n          cols=\"${ifDefined(this.cols)}\"\n          ?data-invalid=\"${this.invalid}\"\n          ?disabled=\"${this.disabled}\"\n          id=\"input\"\n          name=\"${ifNonEmpty(this.name)}\"\n          pattern=\"${ifNonEmpty(this.pattern)}\"\n          placeholder=\"${ifNonEmpty(this.placeholder)}\"\n          ?readonly=\"${this.readonly}\"\n          ?required=\"${this.required}\"\n          rows=\"${ifDefined(this.rows)}\"\n          .value=\"${this.value}\"\n          maxlength=\"${this.counterMode === 'character'\n            ? ifNonEmpty(this.maxCount)\n            : ''}\"\n          @keydown=\"${this._onKeyDown}\"\n          @paste=\"${this._onPaste}\"\n          @input=\"${this._handleInput}\"></textarea>\n        <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        ${this.isFluid\n          ? html`\n              <hr class=\"${prefix}--text-area__divider\" />\n              ${validationMessage}\n            `\n          : null}\n      </div>\n      ${/* Non-fluid: validation and helper outside field wrapper */ ''}\n      ${!this.isFluid ? html` ${helper} ${validationMessage} ` : null}\n    `;\n  }\n  updated(): void {\n    super.updated?.();\n    if (this.counterMode !== this._prevCounterMode) {\n      const textarea = this._textarea;\n      if (textarea) {\n        if (this.counterMode === 'character') {\n          textarea.setAttribute('maxlength', String(this.maxCount));\n        } else {\n          textarea.removeAttribute('maxlength');\n        }\n      }\n      this._prevCounterMode = this.counterMode;\n    }\n\n    const wrapper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--text-area__wrapper`\n    );\n    if (!wrapper) return;\n\n    this._resizeObserver = new ResizeObserver(() => {\n      this._measureWrapper();\n    });\n    this._resizeObserver.observe(wrapper);\n  }\n\n  /**\n   * Measures the width of the wrapper and applies that to the max-width of the\n   * helper-text and invalid/warn-text\n   */\n  private _measureWrapper() {\n    const wrapper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--text-area__wrapper`\n    );\n\n    const wrapperWidth = wrapper?.scrollWidth;\n\n    const helper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--form__helper-text`\n    );\n    const requirement = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--form-requirement`\n    );\n    [helper, requirement].forEach((el) => {\n      if (el) {\n        el.style.maxWidth = `${wrapperWidth}px`;\n        el.style.overflowWrap = 'break-word';\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this._resizeObserver?.disconnect();\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSTextarea;\n"],"mappings":"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"}
+{"version":3,"file":"textarea.js","names":["CDSTextInput","ifNonEmpty","styles","customElement"],"sources":["../../../src/components/textarea/textarea.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport CDSTextInput from '../text-input/text-input';\nimport styles from './textarea.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\n/**\n * Text area.\n *\n * @element cds-custom-textarea\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}-textarea`)\nclass CDSTextarea extends CDSTextInput {\n  /**\n   * Manually handles maxCount for counterMode = 'word'\n   * @param event The keyboard event.\n   */\n  protected _onKeyDown(evt: KeyboardEvent) {\n    if (!this.disabled && this.enableCounter && this.counterMode === 'word') {\n      const currentWordCount = this.value?.match(/\\p{L}+/gu)?.length || 0;\n      if (\n        (this.maxCount &&\n          currentWordCount >= this.maxCount &&\n          evt.key === ' ') ||\n        (this.maxCount &&\n          currentWordCount >= this.maxCount &&\n          evt.key === 'Enter')\n      ) {\n        evt.preventDefault();\n      }\n    }\n  }\n\n  /**\n   * Handles `onPaste` event on the `<input>`.\n   * Manually handles maxCount for counterMode = 'word' when\n   * the user is pasting text\n   *\n   * @param event The clipboard event.\n   */\n  protected _onPaste(evt: ClipboardEvent) {\n    if (\n      this.counterMode === 'word' &&\n      this.enableCounter &&\n      typeof this.maxCount !== 'undefined'\n    ) {\n      const existingWords: string[] =\n        this._textarea.value.match(/\\p{L}+/gu) || [];\n      const pastedWords: string[] =\n        evt.clipboardData?.getData('Text').match(/\\p{L}+/gu) || [];\n\n      const totalWords = existingWords.length + pastedWords.length;\n\n      if (totalWords > this.maxCount) {\n        evt.preventDefault();\n\n        const allowedWords = existingWords\n          .concat(pastedWords)\n          .slice(0, this.maxCount);\n\n        this._textarea.value = allowedWords.join(' ');\n        this._textarea.dispatchEvent(\n          new InputEvent('input', {\n            inputType: 'insertFromPaste',\n            data: allowedWords.join(' '),\n            bubbles: true,\n          })\n        );\n      }\n    }\n  }\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  protected _handleInput({ target }: Event) {\n    this.value = (target as HTMLTextAreaElement).value;\n  }\n\n  /**\n   * The number of columns for the textarea to show by default\n   */\n  @property({ type: Number })\n  cols;\n\n  /**\n   * Specify whether the textarea is fluid or not\n   */\n  @property({ type: Boolean })\n  isFluid = false;\n\n  /**\n   * Specify the method used for calculating the counter number\n   */\n  @property({\n    type: String,\n    reflect: true,\n    hasChanged(newVal: string, oldVal: string) {\n      if ((newVal === 'character' || newVal === 'word') && newVal !== oldVal) {\n        return true;\n      }\n      return false;\n    },\n    attribute: 'counter-mode',\n  })\n  counterMode: 'character' | 'word' = 'character';\n\n  /**\n   * ID to link the `label` and `textarea`\n   */\n  @property()\n  id = '';\n\n  /**\n   * Pattern to validate the textarea against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The number of rows for the textarea to show by default\n   */\n  @property()\n  rows = 4;\n\n  /**\n   * Get a reference to the underlying textarea so we can directly apply values.\n   * This lets us fixe a bug where after a user would clear text, the value wouldn't update programmatically\n   */\n  @query('textarea')\n  protected _textarea!: HTMLTextAreaElement;\n\n  /**\n   * The previous counterMode selected. This lets the counterMode state update\n   * when the user toggles between both modes.\n   */\n  private _prevCounterMode: 'character' | 'word' = this.counterMode;\n\n  /**\n   * Observes the textarea wrapper’s size to re-measure helper/invalid/warn text width when\n   * cols is updated\n   */\n  private _resizeObserver?: ResizeObserver;\n\n  render() {\n    const { enableCounter, maxCount } = this;\n\n    const textCount = this.value?.length ?? 0;\n    const wordCount = this.value?.match(/\\p{L}+/gu)?.length || 0;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--text-area__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--text-area__invalid-icon ${prefix}--text-area__invalid-icon--warning`,\n    });\n\n    const textareaClasses = classMap({\n      [`${prefix}--text-area`]: true,\n      [`${prefix}--text-area--warn`]: this.warn,\n      [`${prefix}--text-area--invalid`]: this.invalid,\n      [`${prefix}--text-area__wrapper--decorator`]: this._hasAILabel,\n    });\n\n    const textareaWrapperClasses = classMap({\n      [`${prefix}--text-area__wrapper`]: true,\n      [`${prefix}--text-area__wrapper--cols`]: this.cols,\n      [`${prefix}--text-area__wrapper--warn`]: this.warn,\n      [`${prefix}--text-area__wrapper--readonly`]: this.readonly,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: this.hideLabel,\n      [`${prefix}--label--disabled`]: this.disabled,\n    });\n\n    const counterClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: this.disabled,\n      [`${prefix}--text-area__label-counter`]: true,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: this.disabled,\n    });\n\n    const counter =\n      enableCounter && maxCount\n        ? html` <label class=\"${counterClasses}\">\n            <slot name=\"label-text\"\n              >${this.counterMode === 'word'\n                ? wordCount\n                : textCount}/${maxCount}</slot\n            >\n          </label>`\n        : null;\n\n    const icon = () => {\n      if (this.invalid) {\n        return invalidIcon;\n      } else if (this.warn && !this.invalid) {\n        return warnIcon;\n      }\n      return null;\n    };\n\n    const helper = html`\n      <div class=\"${helperTextClasses}\" id=\"helper-text\">\n        <slot name=\"helper-text\">${this.helperText}</slot>\n      </div>\n    `;\n\n    const normalizedProps = {\n      invalid: this.invalid,\n      warn: this.warn,\n      'slot-name': this.invalid ? 'invalid-text' : 'warn-text',\n      'slot-text': this.invalid ? this.invalidText : this.warnText,\n    };\n\n    const validationMessage = html`\n      <div\n        class=\"${prefix}--form-requirement\"\n        ?hidden=\"${!normalizedProps.invalid && !normalizedProps.warn}\">\n        <slot name=\"${normalizedProps['slot-name']}\">\n          ${normalizedProps['slot-text']} ${this.isFluid ? icon() : null}\n        </slot>\n      </div>\n    `;\n\n    return html`\n      <div class=\"${prefix}--text-area__label-wrapper\">\n        <label class=\"${labelClasses}\" for=\"input\">\n          <slot name=\"label-text\"> ${this.label} </slot>\n        </label>\n        ${counter}\n      </div>\n      <div class=\"${textareaWrapperClasses}\" ?data-invalid=\"${this.invalid}\">\n        ${!this.isFluid ? icon() : null}\n        <textarea\n          autocomplete=\"${this.autocomplete}\"\n          ?autofocus=\"${this.autofocus}\"\n          class=\"${textareaClasses}\"\n          cols=\"${ifDefined(this.cols)}\"\n          ?data-invalid=\"${this.invalid}\"\n          ?disabled=\"${this.disabled}\"\n          id=\"input\"\n          name=\"${ifNonEmpty(this.name)}\"\n          pattern=\"${ifNonEmpty(this.pattern)}\"\n          placeholder=\"${ifNonEmpty(this.placeholder)}\"\n          ?readonly=\"${this.readonly}\"\n          ?required=\"${this.required}\"\n          rows=\"${ifDefined(this.rows)}\"\n          .value=\"${this.value}\"\n          maxlength=\"${this.counterMode === 'character'\n            ? ifNonEmpty(this.maxCount)\n            : ''}\"\n          @keydown=\"${this._onKeyDown}\"\n          @paste=\"${this._onPaste}\"\n          @input=\"${this._handleInput}\"></textarea>\n        <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        ${this.isFluid\n          ? html`\n              <hr class=\"${prefix}--text-area__divider\" />\n              ${validationMessage}\n            `\n          : null}\n      </div>\n      ${/* Non-fluid: validation and helper outside field wrapper */ ''}\n      ${!this.isFluid ? html` ${helper} ${validationMessage} ` : null}\n    `;\n  }\n  updated(): void {\n    super.updated?.();\n    if (this.counterMode !== this._prevCounterMode) {\n      const textarea = this._textarea;\n      if (textarea) {\n        if (this.counterMode === 'character') {\n          textarea.setAttribute('maxlength', String(this.maxCount));\n        } else {\n          textarea.removeAttribute('maxlength');\n        }\n      }\n      this._prevCounterMode = this.counterMode;\n    }\n\n    const wrapper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--text-area__wrapper`\n    );\n    if (!wrapper) return;\n\n    this._resizeObserver = new ResizeObserver(() => {\n      this._measureWrapper();\n    });\n    this._resizeObserver.observe(wrapper);\n  }\n\n  /**\n   * Measures the width of the wrapper and applies that to the max-width of the\n   * helper-text and invalid/warn-text\n   */\n  private _measureWrapper() {\n    const wrapper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--text-area__wrapper`\n    );\n\n    const wrapperWidth = wrapper?.scrollWidth;\n\n    const helper = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--form__helper-text`\n    );\n    const requirement = this.shadowRoot?.querySelector<HTMLElement>(\n      `.${prefix}--form-requirement`\n    );\n    [helper, requirement].forEach((el) => {\n      if (el) {\n        el.style.maxWidth = `${wrapperWidth}px`;\n        el.style.overflowWrap = 'break-word';\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this._resizeObserver?.disconnect();\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSTextarea;\n"],"mappings":"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"}

package/es-custom/components/tile/clickable-tile.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 link_default from "../link/link.js";
 import { isFeatureFlagEnabled } from "../feature-flags/index.js";

package/es-custom/components/tile/clickable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"clickable-tile.js","names":["CDSLink","styles","customElement"],"sources":["../../../src/components/tile/clickable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSLink from '../link/link';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport AILabel24 from '@carbon/icons/es/ai-label/24.js';\nimport ArrowRight16 from '@carbon/icons/es/arrow--right/16.js';\nimport Error16 from '@carbon/icons/es/error/16.js';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { isFeatureFlagEnabled } from '../feature-flags';\n\n/**\n * Clickable tile.\n *\n * @element cds-custom-clickable-tile\n */\n@customElement(`${prefix}-clickable-tile`)\nclass CDSClickableTile extends CDSLink {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  protected get _classes(): any {\n    const { colorScheme, disabled, hasRoundedCorners, aiLabel, slug } = this;\n    return classMap({\n      [`${prefix}--link`]: true,\n      [`${prefix}--link--disabled`]: disabled,\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--clickable`]: true,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: (aiLabel || slug) && hasRoundedCorners,\n    });\n  }\n\n  /**\n   * The color scheme.\n   *\n   * @default\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The a11y role for `<a>`.\n   */\n  @property({ attribute: 'link-role' })\n  linkRole = 'button';\n\n  /**\n   * Specify if the `ClickableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  @property({ type: Boolean, attribute: 'ai-label' })\n  aiLabel = false;\n\n  /**\n   * deprecated - remove in v12\n   */\n  @property({ type: Boolean })\n  slug = false;\n\n  /**\n   * If using `slug`, set `ai-label` attribute to true so\n   * the styles are applied for slug as well\n   *\n   * remove in v12\n   */\n  connectedCallback() {\n    if (this.slug) {\n      this.setAttribute('ai-Label', '');\n      this.aiLabel = true;\n    }\n    super.connectedCallback();\n  }\n\n  /**\n   * @returns The inner content.\n   */\n  protected _renderInner() {\n    const v12DefaultIcons = isFeatureFlagEnabled(\n      'enable-v12-tile-default-icons',\n      this\n    );\n\n    const defaultIcon =\n      v12DefaultIcons && !this._hasIcon\n        ? this.disabled\n          ? iconLoader(Error16, { class: `${prefix}--tile--disabled-icon` })\n          : iconLoader(ArrowRight16, { class: `${prefix}--tile--icon` })\n        : '';\n\n    return html`\n      ${super._renderInner()}\n      ${this.aiLabel || this.slug\n        ? iconLoader(AILabel24, { class: `${prefix}--tile--ai-label-icon` })\n        : ''}\n      <slot name=\"decorator\"></slot>\n      ${defaultIcon}\n    `;\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  static styles = styles;\n}\n\nexport default CDSClickableTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,mBAAA,MACM,yBAAyBA,aAAQ;;;;kBA0B1B;2BAOS;iBAGV;cAMH;;CAxCP,IAAc,WAAgB;EAC5B,MAAM,EAAE,aAAa,UAAU,mBAAmB,SAAS,SAAS;AACpE,SAAO,SAAS;IACb,cAAoB;IACpB,wBAA8B;IAC9B,cAAoB;IACpB,yBAA+B;IAC/B,cAAoB,gBAAgB;IACpC,6BAAmC,WAAW,SAAS;GACzD,CAAC;;;;;;;;CAuCJ,oBAAoB;AAClB,MAAI,KAAK,MAAM;AACb,QAAK,aAAa,YAAY,GAAG;AACjC,QAAK,UAAU;;AAEjB,QAAM,mBAAmB;;;;;CAM3B,eAAyB;EAMvB,MAAM,cALkB,qBACtB,iCACA,KACD,IAGoB,CAAC,KAAK,WACrB,KAAK,WACH,WAAW,SAAS,EAAE,OAAO,4BAAkC,CAAC,GAChE,WAAW,cAAc,EAAE,OAAO,mBAAyB,CAAC,GAC9D;AAEN,SAAO,IAAI;QACP,MAAM,cAAc,CAAC;QACrB,KAAK,WAAW,KAAK,OACnB,WAAW,WAAW,EAAE,OAAO,4BAAkC,CAAC,GAClE,GAAG;;QAEL,YAAY;;;;;;;;CASlB,WAAW,WAAW;AACpB,SAAO;;;;;CAMT,WAAW,cAAc;AACvB,SAAO;;;gBAGOC;;;YAjFf,SAAS;CAAE,WAAW;CAAgB,SAAS;CAAM,CAAC,CAAA,EAAA,iBAAA,WAAA,eAAA,KAAA,EAAA;YAMtD,SAAS,EAAE,WAAW,aAAa,CAAC,CAAA,EAAA,iBAAA,WAAA,YAAA,KAAA,EAAA;YAOpC,SAAS;CAAE,MAAM;CAAS,WAAW;CAAuB,CAAC,CAAA,EAAA,iBAAA,WAAA,qBAAA,KAAA,EAAA;YAG7D,SAAS;CAAE,MAAM;CAAS,WAAW;CAAY,CAAC,CAAA,EAAA,iBAAA,WAAA,WAAA,KAAA,EAAA;YAMlD,SAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,iBAAA,WAAA,QAAA,KAAA,EAAA;+BA1C7BC,cAAc,qBAA2B,CAAA,EAAA,iBAAA;AAwG1C,IAAA,yBAAe"}
+{"version":3,"file":"clickable-tile.js","names":["CDSLink","styles","customElement"],"sources":["../../../src/components/tile/clickable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSLink from '../link/link';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport AILabel24 from '@carbon/icons/es/ai-label/24.js';\nimport ArrowRight16 from '@carbon/icons/es/arrow--right/16.js';\nimport Error16 from '@carbon/icons/es/error/16.js';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { isFeatureFlagEnabled } from '../feature-flags';\n\n/**\n * Clickable tile.\n *\n * @element cds-custom-clickable-tile\n */\n@customElement(`${prefix}-clickable-tile`)\nclass CDSClickableTile extends CDSLink {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  protected get _classes(): any {\n    const { colorScheme, disabled, hasRoundedCorners, aiLabel, slug } = this;\n    return classMap({\n      [`${prefix}--link`]: true,\n      [`${prefix}--link--disabled`]: disabled,\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--clickable`]: true,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: (aiLabel || slug) && hasRoundedCorners,\n    });\n  }\n\n  /**\n   * The color scheme.\n   *\n   * @default\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The a11y role for `<a>`.\n   */\n  @property({ attribute: 'link-role' })\n  linkRole = 'button';\n\n  /**\n   * Specify if the `ClickableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  @property({ type: Boolean, attribute: 'ai-label' })\n  aiLabel = false;\n\n  /**\n   * deprecated - remove in v12\n   */\n  @property({ type: Boolean })\n  slug = false;\n\n  /**\n   * If using `slug`, set `ai-label` attribute to true so\n   * the styles are applied for slug as well\n   *\n   * remove in v12\n   */\n  connectedCallback() {\n    if (this.slug) {\n      this.setAttribute('ai-Label', '');\n      this.aiLabel = true;\n    }\n    super.connectedCallback();\n  }\n\n  /**\n   * @returns The inner content.\n   */\n  protected _renderInner() {\n    const v12DefaultIcons = isFeatureFlagEnabled(\n      'enable-v12-tile-default-icons',\n      this\n    );\n\n    const defaultIcon =\n      v12DefaultIcons && !this._hasIcon\n        ? this.disabled\n          ? iconLoader(Error16, { class: `${prefix}--tile--disabled-icon` })\n          : iconLoader(ArrowRight16, { class: `${prefix}--tile--icon` })\n        : '';\n\n    return html`\n      ${super._renderInner()}\n      ${this.aiLabel || this.slug\n        ? iconLoader(AILabel24, { class: `${prefix}--tile--ai-label-icon` })\n        : ''}\n      <slot name=\"decorator\"></slot>\n      ${defaultIcon}\n    `;\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  static styles = styles;\n}\n\nexport default CDSClickableTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,mBAAA,MACM,yBAAyBA,aAAQ;;;;kBA0B1B;2BAOS;iBAGV;cAMH;;CAxCP,IAAc,WAAgB;EAC5B,MAAM,EAAE,aAAa,UAAU,mBAAmB,SAAS,SAAS;EACpE,OAAO,SAAS;IACb,cAAoB;IACpB,wBAA8B;IAC9B,cAAoB;IACpB,yBAA+B;IAC/B,cAAoB,gBAAgB;IACpC,6BAAmC,WAAW,SAAS;EAC1D,CAAC;CACH;;;;;;;CAsCA,oBAAoB;EAClB,IAAI,KAAK,MAAM;GACb,KAAK,aAAa,YAAY,EAAE;GAChC,KAAK,UAAU;EACjB;EACA,MAAM,kBAAkB;CAC1B;;;;CAKA,eAAyB;EAMvB,MAAM,cALkB,qBACtB,iCACA,IAIc,KAAK,CAAC,KAAK,WACrB,KAAK,WACH,WAAW,SAAS,EAAE,OAAO,2BAAiC,CAAC,IAC/D,WAAW,cAAc,EAAE,OAAO,kBAAwB,CAAC,IAC7D;EAEN,OAAO,IAAI;QACP,MAAM,aAAa,EAAE;QACrB,KAAK,WAAW,KAAK,OACnB,WAAW,WAAW,EAAE,OAAO,2BAAiC,CAAC,IACjE,GAAG;;QAEL,YAAY;;CAElB;;;;;;CAOA,WAAW,WAAW;EACpB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;gBAEgBC;;AAClB;YAlFG,SAAS;CAAE,WAAW;CAAgB,SAAS;AAAK,CAAC,CAAA,GAAA,iBAAA,WAAA,eAAA,KAAA,CAAA;YAMrD,SAAS,EAAE,WAAW,YAAY,CAAC,CAAA,GAAA,iBAAA,WAAA,YAAA,KAAA,CAAA;YAOnC,SAAS;CAAE,MAAM;CAAS,WAAW;AAAsB,CAAC,CAAA,GAAA,iBAAA,WAAA,qBAAA,KAAA,CAAA;YAG5D,SAAS;CAAE,MAAM;CAAS,WAAW;AAAW,CAAC,CAAA,GAAA,iBAAA,WAAA,WAAA,KAAA,CAAA;YAMjD,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,iBAAA,WAAA,QAAA,KAAA,CAAA;+BA1C5BC,cAAc,oBAA0B,CAAA,GAAA,gBAAA;AAwGzC,IAAA,yBAAe"}

package/es-custom/components/tile/expandable-tile.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 FocusMixin from "../../globals/mixins/focus.js";
 import HostListener from "../../globals/decorators/host-listener.js";

package/es-custom/components/tile/expandable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"expandable-tile.js","names":["styles","customElement"],"sources":["../../../src/components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Expandable tile.\n *\n * @element cds-custom-expandable-tile\n * @fires cds-custom-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires cds-custom-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass CDSExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSExpandableTile)?.aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSExpandableTile)?.slugItem\n            )\n          : false\n      );\n\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n\n    if (!this._belowTheContentHeight) {\n      const element = getComputedStyle(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n        this.querySelector('cds-custom-tile-below-the-fold-content') as any\n      );\n      this._belowTheContentHeight = parseInt(element.height, 10);\n    }\n    this.requestUpdate();\n  }\n\n  private _handleExpand() {\n    const expanded = !this.expanded;\n    this.focus();\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof CDSExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  }\n\n  @HostListener('click')\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 _handleClick = () => {\n    if (!this.withInteractive) {\n      this._handleExpand();\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  /**\n   * Specify if the `ExpandableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'with-interactive' })\n  withInteractive = false;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    const {\n      expanded,\n      withInteractive,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n\n    const classes = classMap({\n      [`${prefix}--tile__chevron`]: true,\n      [`${prefix}--tile__chevron--interactive`]: withInteractive,\n    });\n    return html`\n      <button\n        class=\"${classes}\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        tabindex=\"0\"\n        @click=\"${withInteractive ? this._handleExpand : ''}\"\n        aria-expanded=\"${String(expanded)}\">\n        ${iconLoader(ChevronDown16, { id: 'icon' })}\n      </button>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"decorator\"></slot>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\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 before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSExpandableTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAA,oBAAA,MACM,0BAA0B,kBAAkB,WAAW,WAAW,CAAC,CAAC;;;gCAIvC;qBAKT;4BA2EK;AAC3B,OAAI,CAAC,KAAK,gBACR,MAAK,eAAe;;;kBAcb;2BAOS;yBAMF;;;;;CAnGlB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,eAAe,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,aAA0C,YACjD,IAEA,KAAqB,QACnB,KAAK,aAA0C,SACjD,GACD,MACL;AAEH,MAAI,WAAW,SAAS,GAAG;AACzB,QAAK,cAAc,QAAQ,WAAW;AACrC,cAAW,GAAmB,aAAa,QAAQ,KAAK;;AAE3D,OAAK,eAAe;;;;;;;CAQtB,qCAA6C,OAAc;AACzD,OAAK,yBAA0B,MAAM,OAClC,eAAe,CACf,QACE,KAAK,SAAS,OAAQ,KAAqB,gBAAgB,IAC5D,EACD;AAEH,MAAI,CAAC,KAAK,wBAAwB;GAChC,MAAM,UAAU,iBAEd,KAAK,cAAc,kCAAkC,CACtD;AACD,QAAK,yBAAyB,SAAS,QAAQ,QAAQ,GAAG;;AAE5D,OAAK,eAAe;;CAGtB,gBAAwB;EACtB,MAAM,WAAW,CAAC,KAAK;AACvB,OAAK,OAAO;EACZ,MAAM,OAAO;GACX,SAAS;GACT,UAAU;GACV,QAAQ,EACN,UACD;GACF;EACD,MAAM,cAAc,KAAK;EACzB,MAAM,oBAAoB,IAAI,YAAY,YAAY,mBAAmB;GACvE,GAAG;GACH,YAAY;GACb,CAAC;AACF,MAAI,KAAK,cAAc,kBAAkB,EAAE;AACzC,QAAK,WAAW;GAChB,MAAM,mBAAmB,IAAI,YAAY,YAAY,aAAa,KAAK;AACvE,QAAK,cAAc,iBAAiB;;;CAsCxC,UAAU;AACR,MAAI,KAAK,YACP,MAAK,aAAa,YAAY,GAAG;MAEjC,MAAK,gBAAgB,WAAW;;CAIpC,SAAS;EACP,MAAM,EACJ,UACA,iBACA,wBAAwB,uBACxB,sCAAsC,wCACpC;AAMJ,SAAO,IAAI;;iBAJK,SAAS;IACtB,uBAA6B;IAC7B,oCAA0C;GAC5C,CAAC,CAGmB;;;;kBAIP,kBAAkB,KAAK,gBAAgB,GAAG;yBACnC,OAAO,SAAS,CAAC;UAChC,WAAW,eAAe,EAAE,IAAI,QAAQ,CAAC,CAAC;;2CAET,KAAK,kBAAkB;uCAC3B,KAAK,kBAAkB;;uCAEtB;;;yBAGd;mBACP,UACP,CAAC,WAAW,KAAA,IAAY,eAAe,sBAAsB,IAC9D,CAAC;+BACmB,oCAAoC;;;;;;;;;;CAWjE,WAAW,WAAW;AACpB,SAAO;;;;;CAMT,WAAW,cAAc;AACvB,SAAO;;;;;;CAOT,WAAW,oBAAoB;AAC7B,SAAO;;;;;CAMT,WAAW,cAAc;AACvB,SAAO;;;gBAGOA;;;YA/Gf,aAAa,QAAQ,CAAA,EAAA,kBAAA,WAAA,gBAAA,KAAA,EAAA;YAYrB,SAAS;CAAE,WAAW;CAAgB,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,eAAA,KAAA,EAAA;YAMtD,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,YAAA,KAAA,EAAA;YAO1C,SAAS;CAAE,MAAM;CAAS,WAAW;CAAuB,CAAC,CAAA,EAAA,kBAAA,WAAA,qBAAA,KAAA,EAAA;YAM7D,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAoB,CAAC,CAAA,EAAA,kBAAA,WAAA,mBAAA,KAAA,EAAA;gCAjH3EC,cAAc,sBAA4B,CAAA,EAAA,kBAAA;AAoM3C,IAAA,0BAAe"}
+{"version":3,"file":"expandable-tile.js","names":["styles","customElement"],"sources":["../../../src/components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Expandable tile.\n *\n * @element cds-custom-expandable-tile\n * @fires cds-custom-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires cds-custom-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass CDSExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSExpandableTile)?.aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSExpandableTile)?.slugItem\n            )\n          : false\n      );\n\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n\n    if (!this._belowTheContentHeight) {\n      const element = getComputedStyle(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n        this.querySelector('cds-custom-tile-below-the-fold-content') as any\n      );\n      this._belowTheContentHeight = parseInt(element.height, 10);\n    }\n    this.requestUpdate();\n  }\n\n  private _handleExpand() {\n    const expanded = !this.expanded;\n    this.focus();\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof CDSExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  }\n\n  @HostListener('click')\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 _handleClick = () => {\n    if (!this.withInteractive) {\n      this._handleExpand();\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  /**\n   * Specify if the `ExpandableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'with-interactive' })\n  withInteractive = false;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    const {\n      expanded,\n      withInteractive,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n\n    const classes = classMap({\n      [`${prefix}--tile__chevron`]: true,\n      [`${prefix}--tile__chevron--interactive`]: withInteractive,\n    });\n    return html`\n      <button\n        class=\"${classes}\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        tabindex=\"0\"\n        @click=\"${withInteractive ? this._handleExpand : ''}\"\n        aria-expanded=\"${String(expanded)}\">\n        ${iconLoader(ChevronDown16, { id: 'icon' })}\n      </button>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"decorator\"></slot>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\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 before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSExpandableTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAA,oBAAA,MACM,0BAA0B,kBAAkB,WAAW,UAAU,CAAC,CAAC,CAAC;;;gCAIvC;qBAKT;4BA2EK;GAC3B,IAAI,CAAC,KAAK,iBACR,KAAK,cAAc;EAEvB;;kBAYW;2BAOS;yBAMF;;;;;CAnGlB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,cAAc,CAAC,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,aAA0C,WAClD,KAEC,KAAqB,QACnB,KAAK,aAA0C,QAClD,IACA,KACN;EAEF,IAAI,WAAW,SAAS,GAAG;GACzB,KAAK,cAAc,QAAQ,UAAU;GACrC,WAAY,EAAE,CAAiB,aAAa,QAAQ,IAAI;EAC1D;EACA,KAAK,cAAc;CACrB;;;;;;CAOA,qCAA6C,OAAc;EACzD,KAAK,yBAA0B,MAAM,OAClC,cAAc,CAAC,CACf,QACE,KAAK,SAAS,OAAQ,KAAqB,gBAAgB,IAC5D,CACF;EAEF,IAAI,CAAC,KAAK,wBAAwB;GAChC,MAAM,UAAU,iBAEd,KAAK,cAAc,iCAAiC,CACtD;GACA,KAAK,yBAAyB,SAAS,QAAQ,QAAQ,EAAE;EAC3D;EACA,KAAK,cAAc;CACrB;CAEA,gBAAwB;EACtB,MAAM,WAAW,CAAC,KAAK;EACvB,KAAK,MAAM;EACX,MAAM,OAAO;GACX,SAAS;GACT,UAAU;GACV,QAAQ,EACN,SACF;EACF;EACA,MAAM,cAAc,KAAK;EACzB,MAAM,oBAAoB,IAAI,YAAY,YAAY,mBAAmB;GACvE,GAAG;GACH,YAAY;EACd,CAAC;EACD,IAAI,KAAK,cAAc,iBAAiB,GAAG;GACzC,KAAK,WAAW;GAChB,MAAM,mBAAmB,IAAI,YAAY,YAAY,aAAa,IAAI;GACtE,KAAK,cAAc,gBAAgB;EACrC;CACF;CAoCA,UAAU;EACR,IAAI,KAAK,aACP,KAAK,aAAa,YAAY,EAAE;OAEhC,KAAK,gBAAgB,UAAU;CAEnC;CAEA,SAAS;EACP,MAAM,EACJ,UACA,iBACA,wBAAwB,uBACxB,sCAAsC,wCACpC;EAMJ,OAAO,IAAI;;iBAJK,SAAS;IACtB,uBAA6B;IAC7B,oCAA0C;EAC7C,CAGmB,EAAE;;;;kBAIP,kBAAkB,KAAK,gBAAgB,GAAG;yBACnC,OAAO,QAAQ,EAAE;UAChC,WAAW,eAAe,EAAE,IAAI,OAAO,CAAC,EAAE;;2CAET,KAAK,kBAAkB;uCAC3B,KAAK,kBAAkB;;uCAEtB;;;yBAGd;mBACP,UACP,CAAC,WAAW,KAAA,IAAY,eAAe,sBAAsB,GAC/D,EAAE;+BACmB,oCAAoC;;;;CAIjE;;;;;;CAOA,WAAW,WAAW;EACpB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;;;;CAMA,WAAW,oBAAoB;EAC7B,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;gBAEgBA;;AAClB;YAhHG,aAAa,OAAO,CAAA,GAAA,kBAAA,WAAA,gBAAA,KAAA,CAAA;YAYpB,SAAS;CAAE,WAAW;CAAgB,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,eAAA,KAAA,CAAA;YAMrD,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,YAAA,KAAA,CAAA;YAOzC,SAAS;CAAE,MAAM;CAAS,WAAW;AAAsB,CAAC,CAAA,GAAA,kBAAA,WAAA,qBAAA,KAAA,CAAA;YAM5D,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAmB,CAAC,CAAA,GAAA,kBAAA,WAAA,mBAAA,KAAA,CAAA;gCAjH1EC,cAAc,qBAA2B,CAAA,GAAA,iBAAA;AAoM1C,IAAA,0BAAe"}

package/es-custom/components/tile/radio-tile.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 { isFeatureFlagEnabled } from "../feature-flags/index.js";
 import selectable_tile_default from "./selectable-tile.js";

package/es-custom/components/tile/radio-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-tile.js","names":["SelectableTile","customElement"],"sources":["../../../src/components/tile/radio-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport SelectableTile from './selectable-tile';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16.js';\nimport RadioButton16 from '@carbon/icons/es/radio-button/16.js';\nimport RadioButtonChecked16 from '@carbon/icons/es/radio-button--checked/16.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { isFeatureFlagEnabled } from '../feature-flags';\n\n/**\n * Radio tile.\n *\n * @element cds-custom-radio-tile\n * @fires cds-custom-radio-tile-selected\n *   The name of the custom event fired after this radio tile changes its selected state.\n */\n@customElement(`${prefix}-radio-tile`)\nclass CDSRadioTile extends SelectableTile {\n  private _hasRadioButtonIcons = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._hasRadioButtonIcons = isFeatureFlagEnabled(\n      'enable-v12-tile-radio-icons',\n      this\n    );\n\n    if (this._hasRadioButtonIcons) {\n      this.setAttribute('enable-v12-tile-radio-icons', '');\n    } else {\n      this.removeAttribute('enable-v12-tile-radio-icons');\n    }\n  }\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = true;\n    const { selected, name } = this;\n    const { eventRadioChange } = this.constructor as typeof CDSRadioTile;\n    this.dispatchEvent(\n      new CustomEvent(eventRadioChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n          name,\n        },\n      })\n    );\n  }\n\n  protected _handleKeydown = (event: KeyboardEvent) => {\n    if (event.key === ' ' || event.key === 'Enter') {\n      event.preventDefault();\n    }\n  };\n\n  protected _renderIcon() {\n    const { selected, checkmarkLabel, _hasRadioButtonIcons } = this;\n\n    let icon;\n    if (_hasRadioButtonIcons) {\n      icon = selected ? RadioButtonChecked16 : RadioButton16;\n    } else {\n      icon = CheckmarkFilled16;\n    }\n\n    return iconLoader(icon, {\n      class: `${prefix}--tile__checkmark`,\n      title: checkmarkLabel,\n    });\n  }\n\n  render() {\n    const {\n      colorScheme,\n      disabled,\n      hasRoundedCorners,\n      name,\n      selected,\n      value,\n      _handleChange: handleChange,\n      _handleKeydown: handleKeydown,\n      _hasAILabel: hasAILabel,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--radio`]: true,\n      [`${prefix}--tile--disabled`]: disabled,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: hasAILabel && hasRoundedCorners,\n    });\n\n    return html`\n      <input\n        type=\"radio\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        ?disabled=\"${disabled}\"\n        tabindex=\"${selected ? 0 : -1}\"\n        name=\"${ifDefined(name)}\"\n        value=\"${ifDefined(value)}\"\n        .checked=${selected}\n        @change=${!disabled ? handleChange : undefined}\n        @keydown=\"${!disabled ? handleKeydown : undefined}\" />\n      <label part=\"label\" for=\"input\" class=\"${classes}\">\n        ${this._renderIcon()}\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n      <slot name=\"decorator\"></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after this selectable tile changes its selected state.\n   */\n  static get eventRadioChange() {\n    return `${prefix}-radio-tile-selected`;\n  }\n}\n\nexport default CDSRadioTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,eAAA,MACM,qBAAqBA,wBAAe;;;8BACT;yBAmCH,UAAyB;AACnD,OAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,QACrC,OAAM,gBAAgB;;;CAnC1B,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,OAAK,uBAAuB,qBAC1B,+BACA,KACD;AAED,MAAI,KAAK,qBACP,MAAK,aAAa,+BAA+B,GAAG;MAEpD,MAAK,gBAAgB,8BAA8B;;;;;CAOvD,gBAA0B;AACxB,OAAK,WAAW;EAChB,MAAM,EAAE,UAAU,SAAS;EAC3B,MAAM,EAAE,qBAAqB,KAAK;AAClC,OAAK,cACH,IAAI,YAAY,kBAAkB;GAChC,SAAS;GACT,UAAU;GACV,QAAQ;IACN;IACA;IACD;GACF,CAAC,CACH;;CASH,cAAwB;EACtB,MAAM,EAAE,UAAU,gBAAgB,yBAAyB;EAE3D,IAAI;AACJ,MAAI,qBACF,QAAO,WAAW,uBAAuB;MAEzC,QAAO;AAGT,SAAO,WAAW,MAAM;GACtB,OAAO;GACP,OAAO;GACR,CAAC;;CAGJ,SAAS;EACP,MAAM,EACJ,aACA,UACA,mBACA,MACA,UACA,OACA,eAAe,cACf,gBAAgB,eAChB,aAAa,eACX;EACJ,MAAM,UAAU,SAAS;IACtB,cAAoB;IACpB,0BAAgC;IAChC,qBAA2B;IAC3B,wBAA8B;IAC9B,2BAAiC;IACjC,cAAoB,gBAAgB;IACpC,4BAAkC,cAAc;GAClD,CAAC;AAEF,SAAO,IAAI;;;;uBAIS;qBACH,SAAS;oBACV,WAAW,IAAI,GAAG;gBACtB,UAAU,KAAK,CAAC;iBACf,UAAU,MAAM,CAAC;mBACf,SAAS;kBACV,CAAC,WAAW,eAAe,KAAA,EAAU;oBACnC,CAAC,WAAW,gBAAgB,KAAA,EAAU;+CACX,QAAQ;UAC7C,KAAK,aAAa,CAAC;4BACA;;;2CAGc,KAAK,kBAAkB;;;;;;CAOhE,WAAW,mBAAmB;AAC5B,SAAO;;;2BA1GVC,cAAc,iBAAuB,CAAA,EAAA,aAAA;AA8GtC,IAAA,qBAAe"}
+{"version":3,"file":"radio-tile.js","names":["SelectableTile","customElement"],"sources":["../../../src/components/tile/radio-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport SelectableTile from './selectable-tile';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16.js';\nimport RadioButton16 from '@carbon/icons/es/radio-button/16.js';\nimport RadioButtonChecked16 from '@carbon/icons/es/radio-button--checked/16.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { isFeatureFlagEnabled } from '../feature-flags';\n\n/**\n * Radio tile.\n *\n * @element cds-custom-radio-tile\n * @fires cds-custom-radio-tile-selected\n *   The name of the custom event fired after this radio tile changes its selected state.\n */\n@customElement(`${prefix}-radio-tile`)\nclass CDSRadioTile extends SelectableTile {\n  private _hasRadioButtonIcons = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._hasRadioButtonIcons = isFeatureFlagEnabled(\n      'enable-v12-tile-radio-icons',\n      this\n    );\n\n    if (this._hasRadioButtonIcons) {\n      this.setAttribute('enable-v12-tile-radio-icons', '');\n    } else {\n      this.removeAttribute('enable-v12-tile-radio-icons');\n    }\n  }\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = true;\n    const { selected, name } = this;\n    const { eventRadioChange } = this.constructor as typeof CDSRadioTile;\n    this.dispatchEvent(\n      new CustomEvent(eventRadioChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n          name,\n        },\n      })\n    );\n  }\n\n  protected _handleKeydown = (event: KeyboardEvent) => {\n    if (event.key === ' ' || event.key === 'Enter') {\n      event.preventDefault();\n    }\n  };\n\n  protected _renderIcon() {\n    const { selected, checkmarkLabel, _hasRadioButtonIcons } = this;\n\n    let icon;\n    if (_hasRadioButtonIcons) {\n      icon = selected ? RadioButtonChecked16 : RadioButton16;\n    } else {\n      icon = CheckmarkFilled16;\n    }\n\n    return iconLoader(icon, {\n      class: `${prefix}--tile__checkmark`,\n      title: checkmarkLabel,\n    });\n  }\n\n  render() {\n    const {\n      colorScheme,\n      disabled,\n      hasRoundedCorners,\n      name,\n      selected,\n      value,\n      _handleChange: handleChange,\n      _handleKeydown: handleKeydown,\n      _hasAILabel: hasAILabel,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--radio`]: true,\n      [`${prefix}--tile--disabled`]: disabled,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: hasAILabel && hasRoundedCorners,\n    });\n\n    return html`\n      <input\n        type=\"radio\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        ?disabled=\"${disabled}\"\n        tabindex=\"${selected ? 0 : -1}\"\n        name=\"${ifDefined(name)}\"\n        value=\"${ifDefined(value)}\"\n        .checked=${selected}\n        @change=${!disabled ? handleChange : undefined}\n        @keydown=\"${!disabled ? handleKeydown : undefined}\" />\n      <label part=\"label\" for=\"input\" class=\"${classes}\">\n        ${this._renderIcon()}\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n      <slot name=\"decorator\"></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after this selectable tile changes its selected state.\n   */\n  static get eventRadioChange() {\n    return `${prefix}-radio-tile-selected`;\n  }\n}\n\nexport default CDSRadioTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,eAAA,MACM,qBAAqBA,wBAAe;;;8BACT;yBAmCH,UAAyB;GACnD,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,SACrC,MAAM,eAAe;EAEzB;;CArCA,oBAAoB;EAClB,MAAM,kBAAkB;EACxB,KAAK,uBAAuB,qBAC1B,+BACA,IACF;EAEA,IAAI,KAAK,sBACP,KAAK,aAAa,+BAA+B,EAAE;OAEnD,KAAK,gBAAgB,6BAA6B;CAEtD;;;;CAKA,gBAA0B;EACxB,KAAK,WAAW;EAChB,MAAM,EAAE,UAAU,SAAS;EAC3B,MAAM,EAAE,qBAAqB,KAAK;EAClC,KAAK,cACH,IAAI,YAAY,kBAAkB;GAChC,SAAS;GACT,UAAU;GACV,QAAQ;IACN;IACA;GACF;EACF,CAAC,CACH;CACF;CAQA,cAAwB;EACtB,MAAM,EAAE,UAAU,gBAAgB,yBAAyB;EAE3D,IAAI;EACJ,IAAI,sBACF,OAAO,WAAW,uBAAuB;OAEzC,OAAO;EAGT,OAAO,WAAW,MAAM;GACtB,OAAO;GACP,OAAO;EACT,CAAC;CACH;CAEA,SAAS;EACP,MAAM,EACJ,aACA,UACA,mBACA,MACA,UACA,OACA,eAAe,cACf,gBAAgB,eAChB,aAAa,eACX;EACJ,MAAM,UAAU,SAAS;IACtB,cAAoB;IACpB,0BAAgC;IAChC,qBAA2B;IAC3B,wBAA8B;IAC9B,2BAAiC;IACjC,cAAoB,gBAAgB;IACpC,4BAAkC,cAAc;EACnD,CAAC;EAED,OAAO,IAAI;;;;uBAIS;qBACH,SAAS;oBACV,WAAW,IAAI,GAAG;gBACtB,UAAU,IAAI,EAAE;iBACf,UAAU,KAAK,EAAE;mBACf,SAAS;kBACV,CAAC,WAAW,eAAe,KAAA,EAAU;oBACnC,CAAC,WAAW,gBAAgB,KAAA,EAAU;+CACX,QAAQ;UAC7C,KAAK,YAAY,EAAE;4BACA;;;2CAGc,KAAK,kBAAkB;;CAEhE;;;;CAKA,WAAW,mBAAmB;EAC5B,OAAO;CACT;AACF;2BA5GCC,cAAc,gBAAsB,CAAA,GAAA,YAAA;AA8GrC,IAAA,qBAAe"}

package/es-custom/components/tile/selectable-tile.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 FocusMixin from "../../globals/mixins/focus.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";

package/es-custom/components/tile/selectable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectable-tile.js","names":["styles","customElement"],"sources":["../../../src/components/tile/selectable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport Checkbox16 from '@carbon/icons/es/checkbox/16.js';\nimport CheckboxCheckedFilled16 from '@carbon/icons/es/checkbox--checked--filled/16.js';\nimport { prefix } from '../../globals/settings';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\n/**\n * Multi-selectable tile.\n *\n * @element cds-custom-selectable-tile\n * @fires cds-custom-selectable-tile-changed - The custom event fired after this selectable tile changes its selected state.\n */\n@customElement(`${prefix}-selectable-tile`)\nclass CDSSelectableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  @query('input')\n  protected _inputNode!: HTMLInputElement;\n\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'checkbox';\n\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSSelectableTile)?.aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelectableTile)?.slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = this._inputNode.checked;\n\n    const selected = this.selected;\n    const { eventChange } = this.constructor as typeof CDSSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles the rendering of the icon.\n   */\n  protected _renderIcon() {\n    const { selected, checkmarkLabel } = this;\n\n    return iconLoader(selected ? CheckboxCheckedFilled16 : Checkbox16, {\n      'aria-label': checkmarkLabel || undefined,\n      class: `${prefix}--selectable-tile__icon`,\n    });\n  }\n\n  /**\n   * Listener function for click interaction.\n   *\n   */\n  private _handleClick = () => {\n    this.selected = !this.selected; // Toggle selection\n    const { eventChange } = this.constructor as typeof CDSSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected: this.selected,\n        },\n      })\n    );\n  };\n\n  /**\n   * Listener function for keyboard interaction.\n   *\n   * @param event to get the key pressed\n   */\n  protected _handleKeydown = (event: KeyboardEvent) => {\n    const { key } = event;\n    if (\n      (key === ' ' || key === 'Enter') &&\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSSelectableTile).aiLabelItem\n      ) &&\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSSelectableTile).slugItem\n      )\n    ) {\n      this.selected = !this.selected;\n    }\n  };\n\n  /**\n   * The a11y text for the checkmark icon of the selected state.\n   */\n  @property({ attribute: 'checkmark-label' })\n  checkmarkLabel!: string;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` if the seletable tile should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify if the `SeletableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  /**\n   * @deprecated\n   *\n   * The form name.\n   */\n  @property()\n  name!: string;\n\n  /**\n   * `true` to show the selected state.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * @deprecated\n   *\n   * The form value.\n   */\n  @property()\n  value!: string;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    const {\n      colorScheme,\n      disabled,\n      hasRoundedCorners,\n      name,\n      selected,\n      value,\n      _handleChange: handleChange,\n      _hasAILabel: hasAILabel,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--disabled`]: disabled,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: hasAILabel && hasRoundedCorners,\n    });\n    return html`\n      <div\n        class=${classes}\n        role=\"checkbox\"\n        aria-checked=${selected}\n        @change=${handleChange}\n        tabindex=${!disabled ? 0 : undefined}\n        name=${name}\n        value=${value}\n        @click=${!disabled ? this._handleClick : undefined}\n        @keydown=${this._handleKeydown}>\n        <span\n          class=\"${prefix}--tile__checkmark ${prefix}--tile__checkmark--persistent\">\n          ${this._renderIcon()}\n        </span>\n        <label class=\"${prefix}--tile-content\">\n          <slot></slot>\n        </label>\n        <slot name=\"decorator\"></slot>\n        <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      </div>\n    `;\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 this selectable tile changes its selected state.\n   */\n  static get eventChange() {\n    return `${prefix}-selectable-tile-changed`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static styles = styles;\n}\n\nexport default CDSSelectableTile;\n"],"mappings":"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"}
+{"version":3,"file":"selectable-tile.js","names":["styles","customElement"],"sources":["../../../src/components/tile/selectable-tile.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 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 { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport Checkbox16 from '@carbon/icons/es/checkbox/16.js';\nimport CheckboxCheckedFilled16 from '@carbon/icons/es/checkbox--checked--filled/16.js';\nimport { prefix } from '../../globals/settings';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\n/**\n * Multi-selectable tile.\n *\n * @element cds-custom-selectable-tile\n * @fires cds-custom-selectable-tile-changed - The custom event fired after this selectable tile changes its selected state.\n */\n@customElement(`${prefix}-selectable-tile`)\nclass CDSSelectableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  @query('input')\n  protected _inputNode!: HTMLInputElement;\n\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'checkbox';\n\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ 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 CDSSelectableTile)?.aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSSelectableTile)?.slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = this._inputNode.checked;\n\n    const selected = this.selected;\n    const { eventChange } = this.constructor as typeof CDSSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles the rendering of the icon.\n   */\n  protected _renderIcon() {\n    const { selected, checkmarkLabel } = this;\n\n    return iconLoader(selected ? CheckboxCheckedFilled16 : Checkbox16, {\n      'aria-label': checkmarkLabel || undefined,\n      class: `${prefix}--selectable-tile__icon`,\n    });\n  }\n\n  /**\n   * Listener function for click interaction.\n   *\n   */\n  private _handleClick = () => {\n    this.selected = !this.selected; // Toggle selection\n    const { eventChange } = this.constructor as typeof CDSSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected: this.selected,\n        },\n      })\n    );\n  };\n\n  /**\n   * Listener function for keyboard interaction.\n   *\n   * @param event to get the key pressed\n   */\n  protected _handleKeydown = (event: KeyboardEvent) => {\n    const { key } = event;\n    if (\n      (key === ' ' || key === 'Enter') &&\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSSelectableTile).aiLabelItem\n      ) &&\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSSelectableTile).slugItem\n      )\n    ) {\n      this.selected = !this.selected;\n    }\n  };\n\n  /**\n   * The a11y text for the checkmark icon of the selected state.\n   */\n  @property({ attribute: 'checkmark-label' })\n  checkmarkLabel!: string;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` if the seletable tile should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify if the `SeletableTile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  /**\n   * @deprecated\n   *\n   * The form name.\n   */\n  @property()\n  name!: string;\n\n  /**\n   * `true` to show the selected state.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * @deprecated\n   *\n   * The form value.\n   */\n  @property()\n  value!: string;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    const {\n      colorScheme,\n      disabled,\n      hasRoundedCorners,\n      name,\n      selected,\n      value,\n      _handleChange: handleChange,\n      _hasAILabel: hasAILabel,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--disabled`]: disabled,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n      [`${prefix}--tile--slug-rounded`]: hasAILabel && hasRoundedCorners,\n    });\n    return html`\n      <div\n        class=${classes}\n        role=\"checkbox\"\n        aria-checked=${selected}\n        @change=${handleChange}\n        tabindex=${!disabled ? 0 : undefined}\n        name=${name}\n        value=${value}\n        @click=${!disabled ? this._handleClick : undefined}\n        @keydown=${this._handleKeydown}>\n        <span\n          class=\"${prefix}--tile__checkmark ${prefix}--tile__checkmark--persistent\">\n          ${this._renderIcon()}\n        </span>\n        <label class=\"${prefix}--tile-content\">\n          <slot></slot>\n        </label>\n        <slot name=\"decorator\"></slot>\n        <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n        <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      </div>\n    `;\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 this selectable tile changes its selected state.\n   */\n  static get eventChange() {\n    return `${prefix}-selectable-tile-changed`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static styles = styles;\n}\n\nexport default CDSSelectableTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,oBAAA,MACM,0BAA0B,kBAAkB,WAAW,UAAU,CAAC,CAAC,CAAC;;;oBAOjD;qBAKC;4BA6DK;GAC3B,KAAK,WAAW,CAAC,KAAK;GACtB,MAAM,EAAE,gBAAgB,KAAK;GAC7B,KAAK,cACH,IAAI,YAAY,aAAa;IAC3B,SAAS;IACT,UAAU;IACV,QAAQ,EACN,UAAU,KAAK,SACjB;GACF,CAAC,CACH;EACF;yBAO4B,UAAyB;GACnD,MAAM,EAAE,QAAQ;GAChB,KACG,QAAQ,OAAO,QAAQ,YACxB,CAAE,MAAM,QAAwB,QAC7B,KAAK,YAAyC,WACjD,KACA,CAAE,MAAM,QAAwB,QAC7B,KAAK,YAAyC,QACjD,GAEA,KAAK,WAAW,CAAC,KAAK;EAE1B;;kBAkBW;2BAOS;kBAcT;;;;;CA/HX,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,cAAc,CAAC,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,aAA0C,WAClD,KAEC,KAAqB,QACnB,KAAK,aAA0C,QAClD,IACA,KACN;EACF,IAAI,WAAW,SAAS,GAAG;GACzB,KAAK,cAAc,QAAQ,UAAU;GACrC,WAAY,EAAE,CAAiB,aAAa,QAAQ,IAAI;EAC1D;EACA,KAAK,cAAc;CACrB;;;;CAKA,gBAA0B;EACxB,KAAK,WAAW,KAAK,WAAW;EAEhC,MAAM,WAAW,KAAK;EACtB,MAAM,EAAE,gBAAgB,KAAK;EAC7B,KAAK,cACH,IAAI,YAAY,aAAa;GAC3B,SAAS;GACT,UAAU;GACV,QAAQ,EACN,SACF;EACF,CAAC,CACH;CACF;;;;CAKA,cAAwB;EACtB,MAAM,EAAE,UAAU,mBAAmB;EAErC,OAAO,WAAW,WAAW,0BAA0B,YAAY;GACjE,cAAc,kBAAkB,KAAA;GAChC,OAAO;EACT,CAAC;CACH;CAuFA,UAAU;EACR,IAAI,KAAK,aACP,KAAK,aAAa,YAAY,EAAE;OAEhC,KAAK,gBAAgB,UAAU;CAEnC;CAEA,SAAS;EACP,MAAM,EACJ,aACA,UACA,mBACA,MACA,UACA,OACA,eAAe,cACf,aAAa,eACX;EASJ,OAAO,IAAI;;gBARK,SAAS;IACtB,cAAoB;IACpB,wBAA8B;IAC9B,0BAAgC;IAChC,2BAAiC;IACjC,cAAoB,gBAAgB;IACpC,4BAAkC,cAAc;EACnD,CAGkB,EAAE;;uBAED,SAAS;kBACd,aAAa;mBACZ,CAAC,WAAW,IAAI,KAAA,EAAU;eAC9B,KAAK;gBACJ,MAAM;iBACL,CAAC,WAAW,KAAK,eAAe,KAAA,EAAU;mBACxC,KAAK,eAAe;;yBAEb,oBAAA,MAA2B;YACzC,KAAK,YAAY,EAAE;;8BAEA;;;;6CAIc,KAAK,kBAAkB;yCAC3B,KAAK,kBAAkB;;;CAG9D;;;;;;CAOA,WAAW,WAAW;EACpB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;2BAE2B;GACzB,GAAG,WAAW;GACd,gBAAgB;EAClB;;;gBAEgBA;;AAClB;YA1OG,MAAM,OAAO,CAAA,GAAA,kBAAA,WAAA,cAAA,KAAA,CAAA;YA6Gb,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,GAAA,kBAAA,WAAA,kBAAA,KAAA,CAAA;YAMzC,SAAS;CAAE,WAAW;CAAgB,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,eAAA,KAAA,CAAA;YAMrD,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,YAAA,KAAA,CAAA;YAOzC,SAAS;CAAE,MAAM;CAAS,WAAW;AAAsB,CAAC,CAAA,GAAA,kBAAA,WAAA,qBAAA,KAAA,CAAA;YAQ5D,SAAS,CAAA,GAAA,kBAAA,WAAA,QAAA,KAAA,CAAA;YAMT,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,YAAA,KAAA,CAAA;YAQzC,SAAS,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;gCAxJXC,cAAc,qBAA2B,CAAA,GAAA,iBAAA;AA8O1C,IAAA,0BAAe"}

package/es-custom/components/tile/tile-group.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 HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
 import "../../globals/internal/radio-group-manager.js";