@carbon/web-components 2.52.0 → 2.53.0

package/es/components/slider/slider-input.js

@@ -5,9 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import slider_default from "./slider.scss.js";
@@ -17,7 +17,6 @@ import { classMap } from "lit/directives/class-map.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 import WarningFilled16 from "@carbon/icons/es/warning--filled/16.js";
 import WarningAltFilled16 from "@carbon/icons/es/warning--alt--filled/16.js";
-
 //#region src/components/slider/slider-input.ts
 /**
 * Copyright IBM Corp. 2019, 2023
@@ -141,13 +140,13 @@ let CDSSliderInput = class CDSSliderInput extends FocusMixin(LitElement) {
 			warn: isInteractive && !invalid && warn
 		};
 		const classes = classMap({
-			[`${prefix}--text-input`]: true,
-			[`${prefix}--slider-text-input`]: true,
-			[`${prefix}--text-input--invalid`]: normalizedProps.invalid,
-			[`${prefix}--slider-text-input--warn`]: normalizedProps.warn
+			[`cds--text-input`]: true,
+			[`cds--slider-text-input`]: true,
+			[`cds--text-input--invalid`]: normalizedProps.invalid,
+			[`cds--slider-text-input--warn`]: normalizedProps.warn
 		});
-		const invalidIcon = iconLoader(WarningFilled16, { class: `${prefix}--slider__invalid-icon` });
-		const warnIcon = iconLoader(WarningAltFilled16, { class: `${prefix}--slider__invalid-icon ${prefix}--slider__invalid-icon--warning` });
+		const invalidIcon = iconLoader(WarningFilled16, { class: `cds--slider__invalid-icon` });
+		const warnIcon = iconLoader(WarningAltFilled16, { class: `cds--slider__invalid-icon cds--slider__invalid-icon--warning` });
 		return html`
       <input
         ?disabled="${disabled}"
@@ -169,13 +168,13 @@ let CDSSliderInput = class CDSSliderInput extends FocusMixin(LitElement) {
 	* A selector that will return the parent slider.
 	*/
 	static get selectorParent() {
-		return `${prefix}-slider`;
+		return `cds-slider`;
 	}
 	/**
 	* The name of the custom event fired after the value is changed by user gesture.
 	*/
 	static get eventChange() {
-		return `${prefix}-slider-input-changed`;
+		return `cds-slider-input-changed`;
 	}
 	static {
 		this.shadowRootOptions = {
@@ -218,9 +217,9 @@ __decorate([property({
 	type: Boolean,
 	reflect: true
 })], CDSSliderInput.prototype, "readonly", void 0);
-CDSSliderInput = __decorate([carbonElement(`${prefix}-slider-input`)], CDSSliderInput);
+CDSSliderInput = __decorate([carbonElement(`cds-slider-input`)], CDSSliderInput);
 var slider_input_default = CDSSliderInput;
-
 //#endregion
 export { slider_input_default as default };
+
 //# sourceMappingURL=slider-input.js.map

package/es/components/slider/slider-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider-input.js","names":["styles","customElement"],"sources":["../../../src/components/slider/slider-input.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 } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport FocusMixin from '../../globals/mixins/focus';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport styles from './slider.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * The `<input>` box for slider.\n *\n * @element cds-slider-input\n * @fires cds-slider-input-changed - The custom event fired after the value is changed by user gesture.\n */\n@customElement(`${prefix}-slider-input`)\nclass CDSSliderInput extends FocusMixin(LitElement) {\n  /**\n   * The internal value of `max` property.\n   */\n  private _max = '100';\n\n  /**\n   * The internal value of `min` property.\n   */\n  private _min = '0';\n\n  /**\n   * The internal value of `step` property.\n   */\n  private _step = '1';\n\n  /**\n   * Handles `change` event to fire a normalized custom event.\n   */\n  private _handleChange({ target }: Event) {\n    const min = Number(this.min);\n    const max = Number(this.max);\n    const intermediate = this.value;\n    const newValue = (target as HTMLInputElement).value;\n    const newValueNumber = Number(newValue);\n    if (newValueNumber >= min && newValueNumber <= max && newValue !== '') {\n      this.value = newValueNumber;\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSSliderInput).eventChange,\n          {\n            bubbles: true,\n            composed: true,\n            detail: {\n              value: this.value,\n              intermediate,\n            },\n          }\n        )\n      );\n    } else {\n      this.invalid = newValue === '';\n      this.warn =\n        (newValueNumber < min || newValueNumber > max) && newValue !== '';\n      const intermediate = this.value;\n      if (newValue !== '') {\n        this.value = newValueNumber < min ? min : max;\n      } else {\n        this.value = '';\n      }\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSSliderInput).eventChange,\n          {\n            bubbles: true,\n            composed: true,\n            detail: {\n              value: this.value,\n              intermediate,\n            },\n          }\n        )\n      );\n    }\n  }\n\n  /**\n   * Handles `input` event to fire a normalized custom event.\n   */\n  private _handleInput({ target }: Event) {\n    const newValue = (target as HTMLInputElement).value;\n    if (newValue) {\n      this.value = Number(newValue);\n      this.invalid = false;\n      if (this.value >= Number(this.min) && this.value <= Number(this.max)) {\n        this.warn = false;\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSliderInput).eventChange,\n            {\n              bubbles: true,\n              composed: true,\n              detail: {\n                value: this.value,\n                intermediate: true,\n              },\n            }\n          )\n        );\n      }\n    }\n  }\n\n  /**\n   * `true` if the input should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * true to specify if the control is invalid.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * true to specify if the control should display warn icon and text.\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * true to specify if the control should display warn icon and text.\n   */\n  @property({ type: Boolean })\n  hideTextInput = false;\n\n  /**\n   * The maximum value.\n   */\n  @property({ type: Number, reflect: true })\n  get max() {\n    return this._max.toString();\n  }\n\n  set max(value) {\n    const { max: oldMax } = this;\n    this._max = value;\n    this.requestUpdate('max', oldMax);\n  }\n\n  /**\n   * The minimum value.\n   */\n  @property({ type: Number, reflect: true })\n  get min() {\n    return this._min.toString();\n  }\n\n  set min(value) {\n    const { min: oldMin } = this;\n    this._min = value;\n    this.requestUpdate('min', oldMin);\n  }\n\n  /**\n   * The snapping step of the value.\n   */\n  @property({ type: Number, reflect: true })\n  get step() {\n    return this._step.toString();\n  }\n\n  set step(value) {\n    const { step: oldStep } = this;\n    this._step = value;\n    this.requestUpdate('step', oldStep);\n  }\n\n  /**\n   * The type of the `<input>`.\n   */\n  @property()\n  type = 'number';\n\n  /**\n   * The value.\n   */\n  @property({ type: Number })\n  value;\n\n  /**\n   * true` if the input should be readonly.\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  render() {\n    const {\n      disabled,\n      hideTextInput,\n      max,\n      min,\n      readonly,\n      step,\n      type,\n      value,\n      invalid,\n      warn,\n      _handleChange: handleChange,\n      _handleInput: handleInput,\n    } = this;\n\n    const isInteractive = !readonly && !disabled;\n\n    const normalizedProps: {\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      invalid: isInteractive && invalid,\n      warn: isInteractive && !invalid && warn,\n    };\n\n    const classes = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--slider-text-input`]: true,\n      [`${prefix}--text-input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--slider-text-input--warn`]: normalizedProps.warn,\n    });\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--slider__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--slider__invalid-icon ${prefix}--slider__invalid-icon--warning`,\n    });\n    return html`\n      <input\n        ?disabled=\"${disabled}\"\n        ?data-invalid=\"${normalizedProps.invalid}\"\n        type=\"${hideTextInput ? 'hidden' : ifDefined(type)}\"\n        class=\"${classes}\"\n        max=\"${max}\"\n        min=\"${min}\"\n        ?readonly=\"${ifDefined(readonly)}\"\n        step=\"${step}\"\n        .value=\"${value}\"\n        @change=\"${handleChange}\"\n        @input=\"${handleInput}\" />\n      ${!hideTextInput && normalizedProps.invalid ? html`${invalidIcon}` : null}\n      ${!hideTextInput && normalizedProps.warn ? html`${warnIcon}` : null}\n    `;\n  }\n\n  /**\n   * A selector that will return the parent slider.\n   */\n  static get selectorParent() {\n    return `${prefix}-slider`;\n  }\n\n  /**\n   * The name of the custom event fired after the value is changed by user gesture.\n   */\n  static get eventChange() {\n    return `${prefix}-slider-input-changed`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSliderInput;\n"],"mappings":"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"}
+{"version":3,"file":"slider-input.js","names":["styles","customElement"],"sources":["../../../src/components/slider/slider-input.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 } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport FocusMixin from '../../globals/mixins/focus';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport styles from './slider.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * The `<input>` box for slider.\n *\n * @element cds-slider-input\n * @fires cds-slider-input-changed - The custom event fired after the value is changed by user gesture.\n */\n@customElement(`${prefix}-slider-input`)\nclass CDSSliderInput extends FocusMixin(LitElement) {\n  /**\n   * The internal value of `max` property.\n   */\n  private _max = '100';\n\n  /**\n   * The internal value of `min` property.\n   */\n  private _min = '0';\n\n  /**\n   * The internal value of `step` property.\n   */\n  private _step = '1';\n\n  /**\n   * Handles `change` event to fire a normalized custom event.\n   */\n  private _handleChange({ target }: Event) {\n    const min = Number(this.min);\n    const max = Number(this.max);\n    const intermediate = this.value;\n    const newValue = (target as HTMLInputElement).value;\n    const newValueNumber = Number(newValue);\n    if (newValueNumber >= min && newValueNumber <= max && newValue !== '') {\n      this.value = newValueNumber;\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSSliderInput).eventChange,\n          {\n            bubbles: true,\n            composed: true,\n            detail: {\n              value: this.value,\n              intermediate,\n            },\n          }\n        )\n      );\n    } else {\n      this.invalid = newValue === '';\n      this.warn =\n        (newValueNumber < min || newValueNumber > max) && newValue !== '';\n      const intermediate = this.value;\n      if (newValue !== '') {\n        this.value = newValueNumber < min ? min : max;\n      } else {\n        this.value = '';\n      }\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSSliderInput).eventChange,\n          {\n            bubbles: true,\n            composed: true,\n            detail: {\n              value: this.value,\n              intermediate,\n            },\n          }\n        )\n      );\n    }\n  }\n\n  /**\n   * Handles `input` event to fire a normalized custom event.\n   */\n  private _handleInput({ target }: Event) {\n    const newValue = (target as HTMLInputElement).value;\n    if (newValue) {\n      this.value = Number(newValue);\n      this.invalid = false;\n      if (this.value >= Number(this.min) && this.value <= Number(this.max)) {\n        this.warn = false;\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSSliderInput).eventChange,\n            {\n              bubbles: true,\n              composed: true,\n              detail: {\n                value: this.value,\n                intermediate: true,\n              },\n            }\n          )\n        );\n      }\n    }\n  }\n\n  /**\n   * `true` if the input should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * true to specify if the control is invalid.\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * true to specify if the control should display warn icon and text.\n   */\n  @property({ type: Boolean, reflect: true })\n  warn = false;\n\n  /**\n   * true to specify if the control should display warn icon and text.\n   */\n  @property({ type: Boolean })\n  hideTextInput = false;\n\n  /**\n   * The maximum value.\n   */\n  @property({ type: Number, reflect: true })\n  get max() {\n    return this._max.toString();\n  }\n\n  set max(value) {\n    const { max: oldMax } = this;\n    this._max = value;\n    this.requestUpdate('max', oldMax);\n  }\n\n  /**\n   * The minimum value.\n   */\n  @property({ type: Number, reflect: true })\n  get min() {\n    return this._min.toString();\n  }\n\n  set min(value) {\n    const { min: oldMin } = this;\n    this._min = value;\n    this.requestUpdate('min', oldMin);\n  }\n\n  /**\n   * The snapping step of the value.\n   */\n  @property({ type: Number, reflect: true })\n  get step() {\n    return this._step.toString();\n  }\n\n  set step(value) {\n    const { step: oldStep } = this;\n    this._step = value;\n    this.requestUpdate('step', oldStep);\n  }\n\n  /**\n   * The type of the `<input>`.\n   */\n  @property()\n  type = 'number';\n\n  /**\n   * The value.\n   */\n  @property({ type: Number })\n  value;\n\n  /**\n   * true` if the input should be readonly.\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  render() {\n    const {\n      disabled,\n      hideTextInput,\n      max,\n      min,\n      readonly,\n      step,\n      type,\n      value,\n      invalid,\n      warn,\n      _handleChange: handleChange,\n      _handleInput: handleInput,\n    } = this;\n\n    const isInteractive = !readonly && !disabled;\n\n    const normalizedProps: {\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      invalid: isInteractive && invalid,\n      warn: isInteractive && !invalid && warn,\n    };\n\n    const classes = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--slider-text-input`]: true,\n      [`${prefix}--text-input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--slider-text-input--warn`]: normalizedProps.warn,\n    });\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--slider__invalid-icon`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--slider__invalid-icon ${prefix}--slider__invalid-icon--warning`,\n    });\n    return html`\n      <input\n        ?disabled=\"${disabled}\"\n        ?data-invalid=\"${normalizedProps.invalid}\"\n        type=\"${hideTextInput ? 'hidden' : ifDefined(type)}\"\n        class=\"${classes}\"\n        max=\"${max}\"\n        min=\"${min}\"\n        ?readonly=\"${ifDefined(readonly)}\"\n        step=\"${step}\"\n        .value=\"${value}\"\n        @change=\"${handleChange}\"\n        @input=\"${handleInput}\" />\n      ${!hideTextInput && normalizedProps.invalid ? html`${invalidIcon}` : null}\n      ${!hideTextInput && normalizedProps.warn ? html`${warnIcon}` : null}\n    `;\n  }\n\n  /**\n   * A selector that will return the parent slider.\n   */\n  static get selectorParent() {\n    return `${prefix}-slider`;\n  }\n\n  /**\n   * The name of the custom event fired after the value is changed by user gesture.\n   */\n  static get eventChange() {\n    return `${prefix}-slider-input-changed`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSSliderInput;\n"],"mappings":"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"}

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

@@ -5,14 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import slider_default from "./slider.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
-
 //#region src/components/slider/slider-skeleton.ts
 /**
 * Copyright IBM Corp. 2019, 2023
@@ -31,40 +30,40 @@ let CDSSliderSkeleton = class CDSSliderSkeleton extends LitElement {
 	render() {
 		const { twoHandles } = this;
 		const containerClasses = classMap({
-			[`${prefix}--slider-container`]: true,
-			[`${prefix}--skeleton`]: true,
-			[`${prefix}--slider-container--two-handles`]: twoHandles
+			[`cds--slider-container`]: true,
+			[`cds--skeleton`]: true,
+			[`cds--slider-container--two-handles`]: twoHandles
 		});
 		const lowerThumbClasses = classMap({
-			[`${prefix}--slider__thumb`]: true,
-			[`${prefix}--slider__thumb--lower`]: twoHandles
+			[`cds--slider__thumb`]: true,
+			[`cds--slider__thumb--lower`]: twoHandles
 		});
 		const upperThumbClasses = classMap({
-			[`${prefix}--slider__thumb`]: true,
-			[`${prefix}--slider__thumb--upper`]: twoHandles
+			[`cds--slider__thumb`]: true,
+			[`cds--slider__thumb--upper`]: twoHandles
 		});
 		const lowerThumbWrapperClasses = classMap({
-			[`${prefix}--slider__thumb-wrapper`]: true,
-			[`${prefix}--slider__thumb-wrapper--lower`]: twoHandles
+			[`cds--slider__thumb-wrapper`]: true,
+			[`cds--slider__thumb-wrapper--lower`]: twoHandles
 		});
 		const upperThumbWrapperClasses = classMap({
-			[`${prefix}--slider__thumb-wrapper`]: true,
-			[`${prefix}--slider__thumb-wrapper--upper`]: twoHandles
+			[`cds--slider__thumb-wrapper`]: true,
+			[`cds--slider__thumb-wrapper--upper`]: twoHandles
 		});
 		return html`
-      <span class="${prefix}--label ${prefix}--skeleton"></span>
+      <span class="${"cds"}--label ${"cds"}--skeleton"></span>
       <div class="${containerClasses}">
-        <span class="${prefix}--slider__range-label"></span>
-        <div class="${prefix}--slider">
-          <div class="${prefix}--slider__track"></div>
-          <div class="${prefix}--slider__filled-track"></div>
+        <span class="${"cds"}--slider__range-label"></span>
+        <div class="${"cds"}--slider">
+          <div class="${"cds"}--slider__track"></div>
+          <div class="${"cds"}--slider__filled-track"></div>
           ${twoHandles ? html`
                 <div class="${lowerThumbWrapperClasses}">
                   <div class="${lowerThumbClasses}">
                     <svg
                       xmlns="http://www.w3.org/2000/svg"
                       viewBox="0 0 16 24"
-                      class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower">
+                      class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--lower">
                       <path
                         d="M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z"></path>
                       <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -77,7 +76,7 @@ let CDSSliderSkeleton = class CDSSliderSkeleton extends LitElement {
                   <svg
                     xmlns="http://www.w3.org/2000/svg"
                     viewBox="0 0 16 24"
-                    class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper">
+                    class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--upper">
                     <path
                       d="M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z"></path>
                     <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -85,7 +84,7 @@ let CDSSliderSkeleton = class CDSSliderSkeleton extends LitElement {
                 </div>
               </div>` : void 0}
         </div>
-        <span class="${prefix}--slider__range-label"></span>
+        <span class="${"cds"}--slider__range-label"></span>
       </div>
     `;
 	}
@@ -97,9 +96,9 @@ __decorate([property({
 	type: Boolean,
 	reflect: true
 })], CDSSliderSkeleton.prototype, "twoHandles", void 0);
-CDSSliderSkeleton = __decorate([carbonElement(`${prefix}-slider-skeleton`)], CDSSliderSkeleton);
+CDSSliderSkeleton = __decorate([carbonElement(`cds-slider-skeleton`)], CDSSliderSkeleton);
 var slider_skeleton_default = CDSSliderSkeleton;
-
 //#endregion
 export { slider_skeleton_default as default };
+
 //# sourceMappingURL=slider-skeleton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"slider-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/slider/slider-skeleton.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 { LitElement, html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './slider.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton of slider.\n */\n@customElement(`${prefix}-slider-skeleton`)\nclass CDSSliderSkeleton extends LitElement {\n  /**\n   * `Turn the slider into a range slider.\n   */\n  @property({ type: Boolean, reflect: true })\n  twoHandles = false;\n\n  render() {\n    const { twoHandles } = this;\n    const containerClasses = classMap({\n      [`${prefix}--slider-container`]: true,\n      [`${prefix}--skeleton`]: true,\n      [`${prefix}--slider-container--two-handles`]: twoHandles,\n    });\n    const lowerThumbClasses = classMap({\n      [`${prefix}--slider__thumb`]: true,\n      [`${prefix}--slider__thumb--lower`]: twoHandles,\n    });\n    const upperThumbClasses = classMap({\n      [`${prefix}--slider__thumb`]: true,\n      [`${prefix}--slider__thumb--upper`]: twoHandles,\n    });\n    const lowerThumbWrapperClasses = classMap({\n      [`${prefix}--slider__thumb-wrapper`]: true,\n      [`${prefix}--slider__thumb-wrapper--lower`]: twoHandles,\n    });\n    const upperThumbWrapperClasses = classMap({\n      [`${prefix}--slider__thumb-wrapper`]: true,\n      [`${prefix}--slider__thumb-wrapper--upper`]: twoHandles,\n    });\n    return html`\n      <span class=\"${prefix}--label ${prefix}--skeleton\"></span>\n      <div class=\"${containerClasses}\">\n        <span class=\"${prefix}--slider__range-label\"></span>\n        <div class=\"${prefix}--slider\">\n          <div class=\"${prefix}--slider__track\"></div>\n          <div class=\"${prefix}--slider__filled-track\"></div>\n          ${twoHandles\n            ? html`\n                <div class=\"${lowerThumbWrapperClasses}\">\n                  <div class=\"${lowerThumbClasses}\">\n                    <svg\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 16 24\"\n                      class=\"${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower\">\n                      <path\n                        d=\"M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z\"></path>\n                      <path fill=\"none\" d=\"M-4 0h24v24H-4z\"></path>\n                    </svg>\n                  </div>\n                </div>\n              `\n            : html` <div class=\"${lowerThumbClasses}\"></div> `}\n          ${twoHandles\n            ? html` <div class=\"${upperThumbWrapperClasses}\">\n                <div class=\"${upperThumbClasses}\">\n                  <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    viewBox=\"0 0 16 24\"\n                    class=\"${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper\">\n                    <path\n                      d=\"M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z\"></path>\n                    <path fill=\"none\" d=\"M-4 0h24v24H-4z\"></path>\n                  </svg>\n                </div>\n              </div>`\n            : undefined}\n        </div>\n        <span class=\"${prefix}--slider__range-label\"></span>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSliderSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,8BACM,0BAA0B,WAAW;;;oBAK5B;;CAEb,SAAS;EACP,MAAM,EAAE,eAAe;EACvB,MAAM,mBAAmB,SAAS;IAC/B,GAAG,OAAO,sBAAsB;IAChC,GAAG,OAAO,cAAc;IACxB,GAAG,OAAO,mCAAmC;GAC/C,CAAC;EACF,MAAM,oBAAoB,SAAS;IAChC,GAAG,OAAO,mBAAmB;IAC7B,GAAG,OAAO,0BAA0B;GACtC,CAAC;EACF,MAAM,oBAAoB,SAAS;IAChC,GAAG,OAAO,mBAAmB;IAC7B,GAAG,OAAO,0BAA0B;GACtC,CAAC;EACF,MAAM,2BAA2B,SAAS;IACvC,GAAG,OAAO,2BAA2B;IACrC,GAAG,OAAO,kCAAkC;GAC9C,CAAC;EACF,MAAM,2BAA2B,SAAS;IACvC,GAAG,OAAO,2BAA2B;IACrC,GAAG,OAAO,kCAAkC;GAC9C,CAAC;AACF,SAAO,IAAI;qBACM,OAAO,UAAU,OAAO;oBACzB,iBAAiB;uBACd,OAAO;sBACR,OAAO;wBACL,OAAO;wBACP,OAAO;YACnB,aACE,IAAI;8BACY,yBAAyB;gCACvB,kBAAkB;;;;+BAInB,OAAO,uBAAuB,OAAO;;;;;;;kBAQtD,IAAI,gBAAgB,kBAAkB,WAAW;YACnD,aACE,IAAI,gBAAgB,yBAAyB;8BAC7B,kBAAkB;;;;6BAInB,OAAO,uBAAuB,OAAO;;;;;;wBAOpD,OAAU;;uBAED,OAAO;;;;;gBAKZA;;;YArEf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;gCAL5CC,cAAc,GAAG,OAAO,kBAAkB;AA6E3C,8BAAe"}
+{"version":3,"file":"slider-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/slider/slider-skeleton.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 { LitElement, html } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './slider.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton of slider.\n */\n@customElement(`${prefix}-slider-skeleton`)\nclass CDSSliderSkeleton extends LitElement {\n  /**\n   * `Turn the slider into a range slider.\n   */\n  @property({ type: Boolean, reflect: true })\n  twoHandles = false;\n\n  render() {\n    const { twoHandles } = this;\n    const containerClasses = classMap({\n      [`${prefix}--slider-container`]: true,\n      [`${prefix}--skeleton`]: true,\n      [`${prefix}--slider-container--two-handles`]: twoHandles,\n    });\n    const lowerThumbClasses = classMap({\n      [`${prefix}--slider__thumb`]: true,\n      [`${prefix}--slider__thumb--lower`]: twoHandles,\n    });\n    const upperThumbClasses = classMap({\n      [`${prefix}--slider__thumb`]: true,\n      [`${prefix}--slider__thumb--upper`]: twoHandles,\n    });\n    const lowerThumbWrapperClasses = classMap({\n      [`${prefix}--slider__thumb-wrapper`]: true,\n      [`${prefix}--slider__thumb-wrapper--lower`]: twoHandles,\n    });\n    const upperThumbWrapperClasses = classMap({\n      [`${prefix}--slider__thumb-wrapper`]: true,\n      [`${prefix}--slider__thumb-wrapper--upper`]: twoHandles,\n    });\n    return html`\n      <span class=\"${prefix}--label ${prefix}--skeleton\"></span>\n      <div class=\"${containerClasses}\">\n        <span class=\"${prefix}--slider__range-label\"></span>\n        <div class=\"${prefix}--slider\">\n          <div class=\"${prefix}--slider__track\"></div>\n          <div class=\"${prefix}--slider__filled-track\"></div>\n          ${twoHandles\n            ? html`\n                <div class=\"${lowerThumbWrapperClasses}\">\n                  <div class=\"${lowerThumbClasses}\">\n                    <svg\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      viewBox=\"0 0 16 24\"\n                      class=\"${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower\">\n                      <path\n                        d=\"M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z\"></path>\n                      <path fill=\"none\" d=\"M-4 0h24v24H-4z\"></path>\n                    </svg>\n                  </div>\n                </div>\n              `\n            : html` <div class=\"${lowerThumbClasses}\"></div> `}\n          ${twoHandles\n            ? html` <div class=\"${upperThumbWrapperClasses}\">\n                <div class=\"${upperThumbClasses}\">\n                  <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    viewBox=\"0 0 16 24\"\n                    class=\"${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper\">\n                    <path\n                      d=\"M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z\"></path>\n                    <path fill=\"none\" d=\"M-4 0h24v24H-4z\"></path>\n                  </svg>\n                </div>\n              </div>`\n            : undefined}\n        </div>\n        <span class=\"${prefix}--slider__range-label\"></span>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSSliderSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,oBAAA,MACM,0BAA0B,WAAW;;;oBAK5B;;CAEb,SAAS;EACP,MAAM,EAAE,eAAe;EACvB,MAAM,mBAAmB,SAAS;IAC/B,0BAAgC;IAChC,kBAAwB;IACxB,uCAA6C;GAC/C,CAAC;EACF,MAAM,oBAAoB,SAAS;IAChC,uBAA6B;IAC7B,8BAAoC;GACtC,CAAC;EACF,MAAM,oBAAoB,SAAS;IAChC,uBAA6B;IAC7B,8BAAoC;GACtC,CAAC;EACF,MAAM,2BAA2B,SAAS;IACvC,+BAAqC;IACrC,sCAA4C;GAC9C,CAAC;EACF,MAAM,2BAA2B,SAAS;IACvC,+BAAqC;IACrC,sCAA4C;GAC9C,CAAC;AACF,SAAO,IAAI;2BACa,UAAA,MAAiB;oBACzB,iBAAiB;6BACP;4BACD;8BACE;8BACA;YACnB,aACE,IAAI;8BACY,yBAAyB;gCACvB,kBAAkB;;;;qCAIZ,uBAAA,MAA8B;;;;;;;kBAQtD,IAAI,gBAAgB,kBAAkB,WAAW;YACnD,aACE,IAAI,gBAAgB,yBAAyB;8BAC7B,kBAAkB;;;;mCAIZ,uBAAA,MAA8B;;;;;;wBAOpD,KAAA,EAAU;;6BAEM;;;;;gBAKZA;;;YArEf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,cAAA,KAAA,EAAA;gCAL5CC,cAAc,sBAA4B,CAAA,EAAA,kBAAA;AA6E3C,IAAA,0BAAe"}

package/es/components/slider/slider.js

@@ -5,9 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
@@ -18,7 +18,6 @@ import { LitElement, html } from "lit";
 import { property, query } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import throttle from "lodash-es/throttle";
-
 //#region src/components/slider/slider.ts
 /**
 * Copyright IBM Corp. 2019, 2026
@@ -184,7 +183,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 	}
 	_setThumbTooltipOpen(thumb, open) {
 		if (!this.hideTextInput || !thumb) return;
-		const tooltip = thumb.closest(`${prefix}-tooltip`);
+		const tooltip = thumb.closest(`cds-tooltip`);
 		if (tooltip) tooltip.open = open;
 	}
 	_handleFormdata(event) {
@@ -240,7 +239,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 	_startDrag(event) {
 		if (!this.readonly && !this.disabled) {
 			let eventContainer = event.target.id;
-			if (!eventContainer) eventContainer = event.target.closest(`.${prefix}--slider__thumb`)?.id ?? "";
+			if (!eventContainer) eventContainer = event.target.closest(`.cds--slider__thumb`)?.id ?? "";
 			if (eventContainer === "thumb") {
 				this._dragging = true;
 				this._thumbNode.style.touchAction = "none";
@@ -257,7 +256,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 	*/
 	_handleClick(event) {
 		let eventContainer = event.target.id;
-		if (!eventContainer) eventContainer = event.target.closest(`.${prefix}--slider__thumb`)?.id ?? "";
+		if (!eventContainer) eventContainer = event.target.closest(`.cds--slider__thumb`)?.id ?? "";
 		if (!this.disabled && !this.readonly) {
 			const { _trackNode: trackNode } = this;
 			const isRtl = trackNode.ownerDocument.defaultView.getComputedStyle(trackNode).getPropertyValue("direction") === "rtl";
@@ -404,7 +403,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 		super.disconnectedCallback();
 	}
 	updated() {
-		const sliderfilledTrack = this?.shadowRoot?.querySelector(`.${prefix}--slider__filled-track`);
+		const sliderfilledTrack = this?.shadowRoot?.querySelector(`.cds--slider__filled-track`);
 		if (sliderfilledTrack) if (this.unstable_valueUpper || this.unstable_valueUpper === "") sliderfilledTrack.style.transform = this.unstable_valueUpper ? `translate(${this._rate * 100}%, -50%) scaleX(${this._rateUpper - this._rate})` : `translate(0%, -50%) scaleX(${this._rate})`;
 		else sliderfilledTrack.style.transform = this.unstable_valueUpper ? `translate(${this._rate * 100}%, -50%) scaleX(${this._rateUpper - this._rate})` : `translate(0%, -50%) scaleX(${this._rate})`;
 	}
@@ -458,42 +457,42 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 			warn: isInteractive && isValid && warn
 		};
 		const labelClasses = classMap({
-			[`${prefix}--label`]: true,
-			[`${prefix}--visually-hidden`]: hideLabel,
-			[`${prefix}--label--disabled`]: disabled
+			[`cds--label`]: true,
+			[`cds--visually-hidden`]: hideLabel,
+			[`cds--label--disabled`]: disabled
 		});
 		const sliderClasses = classMap({
-			[`${prefix}--slider`]: true,
-			[`${prefix}--slider--disabled`]: disabled,
-			[`${prefix}--slider--readonly`]: readonly
+			[`cds--slider`]: true,
+			[`cds--slider--disabled`]: disabled,
+			[`cds--slider--readonly`]: readonly
 		});
 		const thumbLowerWrapperClasses = classMap({
-			[`${prefix}--icon-tooltip`]: true,
-			[`${prefix}--slider__thumb-wrapper`]: true,
-			[`${prefix}--slider__thumb-wrapper--lower`]: unstable_valueUpper || unstable_valueUpper === ""
+			[`cds--icon-tooltip`]: true,
+			[`cds--slider__thumb-wrapper`]: true,
+			[`cds--slider__thumb-wrapper--lower`]: unstable_valueUpper || unstable_valueUpper === ""
 		});
 		const thumbLowerClasses = classMap({
-			[`${prefix}--slider__thumb`]: true,
-			[`${prefix}--slider__thumb--lower`]: unstable_valueUpper || unstable_valueUpper === "",
-			[`${prefix}--slider__thumb-disabled`]: disabled
+			[`cds--slider__thumb`]: true,
+			[`cds--slider__thumb--lower`]: unstable_valueUpper || unstable_valueUpper === "",
+			[`cds--slider__thumb-disabled`]: disabled
 		});
 		const thumbUpperWrapperClasses = classMap({
-			[`${prefix}--icon-tooltip`]: true,
-			[`${prefix}--slider__thumb-wrapper`]: true,
-			[`${prefix}--slider__thumb-wrapper--upper`]: true
+			[`cds--icon-tooltip`]: true,
+			[`cds--slider__thumb-wrapper`]: true,
+			[`cds--slider__thumb-wrapper--upper`]: true
 		});
 		const thumbUpperClasses = classMap({
-			[`${prefix}--slider__thumb`]: true,
-			[`${prefix}--slider__thumb--upper`]: true,
-			[`${prefix}--slider__thumb-disabled`]: disabled
+			[`cds--slider__thumb`]: true,
+			[`cds--slider__thumb--upper`]: true,
+			[`cds--slider__thumb-disabled`]: disabled
 		});
 		return html`
       <label class="${labelClasses}" @click="${handleClickLabel}">
         <slot name="label-text">${labelText}</slot>
       </label>
-      <div class="${prefix}--slider-container">
+      <div class="${"cds"}--slider-container">
         ${unstable_valueUpper || unstable_valueUpper === "" ? html` <slot name="lower-input"></slot>` : ""}
-        <span class="${prefix}--slider__range-label">
+        <span class="${"cds"}--slider__range-label">
           <slot name="min-text">${formatMinText(min, minLabel)}</slot>
         </span>
         <div
@@ -524,7 +523,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                           <svg
                             xmlns="http://www.w3.org/2000/svg"
                             viewBox="0 0 16 24"
-                            class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower">
+                            class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--lower">
                             <path
                               d="M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z"></path>
                             <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -532,7 +531,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                           <svg
                             xmlns="http://www.w3.org/2000/svg"
                             viewBox="0 0 16 24"
-                            class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower cds--slider__thumb-icon--focus">
+                            class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--lower cds--slider__thumb-icon--focus">
                             <path
                               d="M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z"></path>
                             <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -564,7 +563,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                           <svg
                             xmlns="http://www.w3.org/2000/svg"
                             viewBox="0 0 16 24"
-                            class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower">
+                            class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--lower">
                             <path
                               d="M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z"></path>
                             <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -572,7 +571,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                           <svg
                             xmlns="http://www.w3.org/2000/svg"
                             viewBox="0 0 16 24"
-                            class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--lower cds--slider__thumb-icon--focus">
+                            class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--lower cds--slider__thumb-icon--focus">
                             <path
                               d="M15.08 6.46H16v11.08h-.92zM4.46 17.54c-.25 0-.46-.21-.46-.46V6.92a.465.465 0 0 1 .69-.4l8.77 5.08a.46.46 0 0 1 0 .8l-8.77 5.08c-.07.04-.15.06-.23.06Z"></path>
                             <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -603,7 +602,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
                         viewBox="0 0 16 24"
-                        class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper">
+                        class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--upper">
                         <path
                           d="M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z"></path>
                         <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -611,7 +610,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
                         viewBox="0 0 16 24"
-                        class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper cds--slider__thumb-icon--focus">
+                        class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--upper cds--slider__thumb-icon--focus">
                         <path
                           d="M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z"></path>
                         <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -641,7 +640,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
                         viewBox="0 0 16 24"
-                        class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper">
+                        class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--upper">
                         <path
                           d="M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z"></path>
                         <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -649,7 +648,7 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                       <svg
                         xmlns="http://www.w3.org/2000/svg"
                         viewBox="0 0 16 24"
-                        class="${prefix}--slider__thumb-icon ${prefix}--slider__thumb-icon--upper cds--slider__thumb-icon--focus">
+                        class="${"cds"}--slider__thumb-icon ${"cds"}--slider__thumb-icon--upper cds--slider__thumb-icon--focus">
                         <path
                           d="M0 6.46h.92v11.08H0zM11.54 6.46c.25 0 .46.21.46.46v10.15a.465.465 0 0 1-.69.4L2.54 12.4a.46.46 0 0 1 0-.8l8.77-5.08c.07-.04.15-.06.23-.06Z"></path>
                         <path fill="none" d="M-4 0h24v24H-4z"></path>
@@ -660,12 +659,12 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
                     </div>
                   </div>
                 ` : html``}
-          <div id="track" class="${prefix}--slider__track"></div>
-          ${unstable_valueUpper || unstable_valueUpper === "" ? html` <div class="${prefix}--slider__filled-track"></div> ` : html` <div class="${prefix}-ce--slider__filled-track-container">
-                <div class="${prefix}--slider__filled-track"></div>
+          <div id="track" class="${"cds"}--slider__track"></div>
+          ${unstable_valueUpper || unstable_valueUpper === "" ? html` <div class="${"cds"}--slider__filled-track"></div> ` : html` <div class="${"cds"}-ce--slider__filled-track-container">
+                <div class="${"cds"}--slider__filled-track"></div>
               </div>`}
         </div>
-        <span class="${prefix}--slider__range-label">
+        <span class="${"cds"}--slider__range-label">
           <slot name="max-text">${formatMaxText(max, maxLabel)}</slot>
         </span>
         <slot></slot>
@@ -673,12 +672,12 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 
       ${normalizedProps.invalid ? html`
             <div
-              class="${prefix}--slider__validation-msg ${prefix}--slider__validation-msg--invalid ${prefix}--form-requirement">
+              class="${"cds"}--slider__validation-msg ${"cds"}--slider__validation-msg--invalid ${"cds"}--form-requirement">
               ${invalidText}
             </div>
           ` : null}
       ${normalizedProps.warn ? html`<div
-            class="${prefix}--slider__validation-msg ${prefix}--form-requirement">
+            class="${"cds"}--slider__validation-msg ${"cds"}--form-requirement">
             ${warnText}
           </div>` : null}
     `;
@@ -687,19 +686,19 @@ let CDSSlider = class CDSSlider extends HostListenerMixin(FormMixin(FocusMixin(L
 	* A selector that will return the `<input>` box got entering the value directly.
 	*/
 	static get selectorInput() {
-		return `${prefix}-slider-input`;
+		return `cds-slider-input`;
 	}
 	/**
 	* The name of the custom event fired after the value is changed by user gesture.
 	*/
 	static get eventChange() {
-		return `${prefix}-slider-changed`;
+		return `cds-slider-changed`;
 	}
 	/**
 	* The name of the custom event fired after the value is changed in `<cds-slider-input>` by user gesture.
 	*/
 	static get eventChangeInput() {
-		return `${prefix}-slider-input-changed`;
+		return `cds-slider-input-changed`;
 	}
 	static {
 		this.shadowRootOptions = {
@@ -784,9 +783,9 @@ __decorate([property({
 })], CDSSlider.prototype, "stepMultiplier", null);
 __decorate([property({ type: Number })], CDSSlider.prototype, "value", void 0);
 __decorate([property({ type: Boolean })], CDSSlider.prototype, "isValid", void 0);
-CDSSlider = __decorate([carbonElement(`${prefix}-slider`)], CDSSlider);
+CDSSlider = __decorate([carbonElement(`cds-slider`)], CDSSlider);
 var slider_default = CDSSlider;
-
 //#endregion
 export { slider_default as default };
+
 //# sourceMappingURL=slider.js.map