@carbon/web-components 2.52.0-rc.0 → 2.53.0-rc.0

package/es-custom/components/date-picker/append-to-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"append-to-plugin.js","names":[],"sources":["../../../src/components/date-picker/append-to-plugin.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\n\n/**\n * The configuration for the Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport interface DatePickerAppendToPluginConfig {\n  /**\n   * The floating menu container.\n   */\n  appendTo: HTMLElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport default (config: DatePickerAppendToPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adjusts the floating meun position after Flatpicker sets it.\n     */\n    const handlePreCalendarPosition = async () => {\n      await Promise.resolve();\n      const {\n        calendarContainer,\n        config: fpConfig,\n        _positionElement: positionElement,\n      } = fp;\n      const { appendTo } = fpConfig;\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      const { top: containerTop } = appendTo!.getBoundingClientRect();\n      const { bottom: refBottom } = positionElement.getBoundingClientRect();\n      const isRtl =\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        appendTo!\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          .ownerDocument!.defaultView!.getComputedStyle(appendTo!)\n          .getPropertyValue('direction') === 'rtl';\n      calendarContainer.style.top = `${refBottom - containerTop}px`;\n      calendarContainer.style.left = !isRtl ? '0' : 'auto';\n      calendarContainer.style.right = !isRtl ? 'auto' : '0';\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrAppendToPlugin');\n    };\n\n    return {\n      appendTo: config.appendTo,\n      onReady: register,\n      onPreCalendarPosition: handlePreCalendarPosition,\n    };\n  };\n"],"mappings":";;;;;;;;;;;;AAwBA,gCAAgB,YACb,OAA0B;;;;CAIzB,MAAM,4BAA4B,YAAY;AAC5C,QAAM,QAAQ,SAAS;EACvB,MAAM,EACJ,mBACA,QAAQ,UACR,kBAAkB,oBAChB;EACJ,MAAM,EAAE,aAAa;EAErB,MAAM,EAAE,KAAK,iBAAiB,SAAU,uBAAuB;EAC/D,MAAM,EAAE,QAAQ,cAAc,gBAAgB,uBAAuB;EACrE,MAAM,QAEJ,SAEG,cAAe,YAAa,iBAAiB,SAAU,CACvD,iBAAiB,YAAY,KAAK;AACvC,oBAAkB,MAAM,MAAM,GAAG,YAAY,aAAa;AAC1D,oBAAkB,MAAM,OAAO,CAAC,QAAQ,MAAM;AAC9C,oBAAkB,MAAM,QAAQ,CAAC,QAAQ,SAAS;;;;;;CAOpD,MAAM,iBAAiB;AACrB,KAAG,cAAc,KAAK,gCAAgC;;AAGxD,QAAO;EACL,UAAU,OAAO;EACjB,SAAS;EACT,uBAAuB;EACxB"}
+{"version":3,"file":"append-to-plugin.js","names":[],"sources":["../../../src/components/date-picker/append-to-plugin.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\n\n/**\n * The configuration for the Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport interface DatePickerAppendToPluginConfig {\n  /**\n   * The floating menu container.\n   */\n  appendTo: HTMLElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to put the calendar dropdown in shadow DOM.\n */\nexport default (config: DatePickerAppendToPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adjusts the floating meun position after Flatpicker sets it.\n     */\n    const handlePreCalendarPosition = async () => {\n      await Promise.resolve();\n      const {\n        calendarContainer,\n        config: fpConfig,\n        _positionElement: positionElement,\n      } = fp;\n      const { appendTo } = fpConfig;\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      const { top: containerTop } = appendTo!.getBoundingClientRect();\n      const { bottom: refBottom } = positionElement.getBoundingClientRect();\n      const isRtl =\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        appendTo!\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          .ownerDocument!.defaultView!.getComputedStyle(appendTo!)\n          .getPropertyValue('direction') === 'rtl';\n      calendarContainer.style.top = `${refBottom - containerTop}px`;\n      calendarContainer.style.left = !isRtl ? '0' : 'auto';\n      calendarContainer.style.right = !isRtl ? 'auto' : '0';\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrAppendToPlugin');\n    };\n\n    return {\n      appendTo: config.appendTo,\n      onReady: register,\n      onPreCalendarPosition: handlePreCalendarPosition,\n    };\n  };\n"],"mappings":";;;;;;;;;;;;AAwBA,IAAA,4BAAgB,YACb,OAA0B;;;;CAIzB,MAAM,4BAA4B,YAAY;AAC5C,QAAM,QAAQ,SAAS;EACvB,MAAM,EACJ,mBACA,QAAQ,UACR,kBAAkB,oBAChB;EACJ,MAAM,EAAE,aAAa;EAErB,MAAM,EAAE,KAAK,iBAAiB,SAAU,uBAAuB;EAC/D,MAAM,EAAE,QAAQ,cAAc,gBAAgB,uBAAuB;EACrE,MAAM,QAEJ,SAEG,cAAe,YAAa,iBAAiB,SAAU,CACvD,iBAAiB,YAAY,KAAK;AACvC,oBAAkB,MAAM,MAAM,GAAG,YAAY,aAAa;AAC1D,oBAAkB,MAAM,OAAO,CAAC,QAAQ,MAAM;AAC9C,oBAAkB,MAAM,QAAQ,CAAC,QAAQ,SAAS;;;;;;CAOpD,MAAM,iBAAiB;AACrB,KAAG,cAAc,KAAK,gCAAgC;;AAGxD,QAAO;EACL,UAAU,OAAO;EACjB,SAAS;EACT,uBAAuB;EACxB"}

package/es-custom/components/date-picker/css-class-plugin.js

@@ -6,7 +6,6 @@
  */
 
 import { forEach } from "../../globals/internal/collection-helpers.js";
-
 //#region src/components/date-picker/css-class-plugin.ts
 /**
 * @param config Plugin configuration.
@@ -52,7 +51,7 @@ var css_class_plugin_default = (config) => (fp) => {
 		onReady: [register]
 	};
 };
-
 //#endregion
 export { css_class_plugin_default as default };
+
 //# sourceMappingURL=css-class-plugin.js.map

package/es-custom/components/date-picker/css-class-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"css-class-plugin.js","names":[],"sources":["../../../src/components/date-picker/css-class-plugin.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2022\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 { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport { forEach } from '../../globals/internal/collection-helpers';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerCSSClassPluginConfig {\n  /**\n   * The CSS class for the calendar dropdown.\n   */\n  classCalendarContainer: string;\n\n  /**\n   * The CSS class for the month navigator.\n   */\n  classMonth: string;\n\n  /**\n   * The CSS class for the container of the weekdays.\n   */\n  classWeekdays: string;\n\n  /**\n   * The CSS class for the container of the days.\n   */\n  classDays: string;\n\n  /**\n   * The CSS class applied to each weekdays.\n   */\n  classWeekday: string;\n\n  /**\n   * The CSS class applied to each days.\n   */\n  classDay: string;\n\n  /**\n   * The CSS class applied to the \"today\" highlight if there are any dates selected.\n   */\n  classNoBorder: string;\n\n  /**\n   * The CSS selector for Flatpickr's month navigator.\n   */\n  selectorFlatpickrMonth: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the weekdays.\n   */\n  selectorFlatpickrWeekdays: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the days.\n   */\n  selectorFlatpickrDays: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each weekdays.\n   */\n  selectorFlatpickrWeekday: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each days.\n   */\n  selectorFlatpickrDay: string;\n\n  /**\n   * The CSS class applied to Flatpickr's \"today\" highlight.\n   */\n  classFlatpickrToday: string;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport default (config: DatePickerCSSClassPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adds class names specific to our design system to calendar dropdown.\n     */\n    const ensureClassesInDatePicker = () => {\n      const { calendarContainer, selectedDates } = fp;\n      if (calendarContainer) {\n        const {\n          classCalendarContainer,\n          classMonth,\n          classWeekdays,\n          classDays,\n          classWeekday,\n          classDay,\n          classNoBorder,\n          selectorFlatpickrMonth,\n          selectorFlatpickrWeekdays,\n          selectorFlatpickrDays,\n          selectorFlatpickrWeekday,\n          selectorFlatpickrDay,\n          classFlatpickrToday,\n        } = config;\n        calendarContainer.classList.add(classCalendarContainer);\n        const month = calendarContainer.querySelector(selectorFlatpickrMonth);\n        if (month) {\n          month.classList.add(classMonth);\n        }\n        const weekdays = calendarContainer.querySelector(\n          selectorFlatpickrWeekdays\n        );\n        if (weekdays) {\n          weekdays.classList.add(classWeekdays);\n        }\n        const days = calendarContainer.querySelector(selectorFlatpickrDays);\n        if (days) {\n          days.classList.add(classDays);\n        }\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrWeekday),\n          (item) => {\n            item.innerHTML = item.innerHTML.replace(/\\s+/g, '');\n            item.classList.add(classWeekday);\n          }\n        );\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrDay),\n          (item) => {\n            item.classList.add(classDay);\n            if (\n              item.classList.contains(classFlatpickrToday) &&\n              // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n              selectedDates!.length > 0\n            ) {\n              item.classList.add(classNoBorder);\n            } else if (\n              item.classList.contains(classFlatpickrToday) &&\n              // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n              selectedDates!.length === 0\n            ) {\n              item.classList.remove(classNoBorder);\n            }\n          }\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrCSSClassPlugin');\n    };\n\n    return {\n      onMonthChange: ensureClassesInDatePicker,\n      onYearChange: ensureClassesInDatePicker,\n      onValueUpdate: ensureClassesInDatePicker,\n      onOpen: ensureClassesInDatePicker,\n      onReady: [register],\n    };\n  };\n"],"mappings":";;;;;;;;;;;;;;AAqFA,gCAAgB,YACb,OAA0B;;;;CAIzB,MAAM,kCAAkC;EACtC,MAAM,EAAE,mBAAmB,kBAAkB;AAC7C,MAAI,mBAAmB;GACrB,MAAM,EACJ,wBACA,YACA,eACA,WACA,cACA,UACA,eACA,wBACA,2BACA,uBACA,0BACA,sBACA,wBACE;AACJ,qBAAkB,UAAU,IAAI,uBAAuB;GACvD,MAAM,QAAQ,kBAAkB,cAAc,uBAAuB;AACrE,OAAI,MACF,OAAM,UAAU,IAAI,WAAW;GAEjC,MAAM,WAAW,kBAAkB,cACjC,0BACD;AACD,OAAI,SACF,UAAS,UAAU,IAAI,cAAc;GAEvC,MAAM,OAAO,kBAAkB,cAAc,sBAAsB;AACnE,OAAI,KACF,MAAK,UAAU,IAAI,UAAU;AAE/B,WACE,kBAAkB,iBAAiB,yBAAyB,GAC3D,SAAS;AACR,SAAK,YAAY,KAAK,UAAU,QAAQ,QAAQ,GAAG;AACnD,SAAK,UAAU,IAAI,aAAa;KAEnC;AACD,WACE,kBAAkB,iBAAiB,qBAAqB,GACvD,SAAS;AACR,SAAK,UAAU,IAAI,SAAS;AAC5B,QACE,KAAK,UAAU,SAAS,oBAAoB,IAE5C,cAAe,SAAS,EAExB,MAAK,UAAU,IAAI,cAAc;aAEjC,KAAK,UAAU,SAAS,oBAAoB,IAE5C,cAAe,WAAW,EAE1B,MAAK,UAAU,OAAO,cAAc;KAGzC;;;;;;CAOL,MAAM,iBAAiB;AACrB,KAAG,cAAc,KAAK,gCAAgC;;AAGxD,QAAO;EACL,eAAe;EACf,cAAc;EACd,eAAe;EACf,QAAQ;EACR,SAAS,CAAC,SAAS;EACpB"}
+{"version":3,"file":"css-class-plugin.js","names":[],"sources":["../../../src/components/date-picker/css-class-plugin.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2022\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 { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport { forEach } from '../../globals/internal/collection-helpers';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerCSSClassPluginConfig {\n  /**\n   * The CSS class for the calendar dropdown.\n   */\n  classCalendarContainer: string;\n\n  /**\n   * The CSS class for the month navigator.\n   */\n  classMonth: string;\n\n  /**\n   * The CSS class for the container of the weekdays.\n   */\n  classWeekdays: string;\n\n  /**\n   * The CSS class for the container of the days.\n   */\n  classDays: string;\n\n  /**\n   * The CSS class applied to each weekdays.\n   */\n  classWeekday: string;\n\n  /**\n   * The CSS class applied to each days.\n   */\n  classDay: string;\n\n  /**\n   * The CSS class applied to the \"today\" highlight if there are any dates selected.\n   */\n  classNoBorder: string;\n\n  /**\n   * The CSS selector for Flatpickr's month navigator.\n   */\n  selectorFlatpickrMonth: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the weekdays.\n   */\n  selectorFlatpickrWeekdays: string;\n\n  /**\n   * The CSS selector for Flatpickr's container of the days.\n   */\n  selectorFlatpickrDays: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each weekdays.\n   */\n  selectorFlatpickrWeekday: string;\n\n  /**\n   * The CSS selector applied to Flatpickr's each days.\n   */\n  selectorFlatpickrDay: string;\n\n  /**\n   * The CSS class applied to Flatpickr's \"today\" highlight.\n   */\n  classFlatpickrToday: string;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport default (config: DatePickerCSSClassPluginConfig): Plugin =>\n  (fp: FlatpickrInstance) => {\n    /**\n     * Adds class names specific to our design system to calendar dropdown.\n     */\n    const ensureClassesInDatePicker = () => {\n      const { calendarContainer, selectedDates } = fp;\n      if (calendarContainer) {\n        const {\n          classCalendarContainer,\n          classMonth,\n          classWeekdays,\n          classDays,\n          classWeekday,\n          classDay,\n          classNoBorder,\n          selectorFlatpickrMonth,\n          selectorFlatpickrWeekdays,\n          selectorFlatpickrDays,\n          selectorFlatpickrWeekday,\n          selectorFlatpickrDay,\n          classFlatpickrToday,\n        } = config;\n        calendarContainer.classList.add(classCalendarContainer);\n        const month = calendarContainer.querySelector(selectorFlatpickrMonth);\n        if (month) {\n          month.classList.add(classMonth);\n        }\n        const weekdays = calendarContainer.querySelector(\n          selectorFlatpickrWeekdays\n        );\n        if (weekdays) {\n          weekdays.classList.add(classWeekdays);\n        }\n        const days = calendarContainer.querySelector(selectorFlatpickrDays);\n        if (days) {\n          days.classList.add(classDays);\n        }\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrWeekday),\n          (item) => {\n            item.innerHTML = item.innerHTML.replace(/\\s+/g, '');\n            item.classList.add(classWeekday);\n          }\n        );\n        forEach(\n          calendarContainer.querySelectorAll(selectorFlatpickrDay),\n          (item) => {\n            item.classList.add(classDay);\n            if (\n              item.classList.contains(classFlatpickrToday) &&\n              // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n              selectedDates!.length > 0\n            ) {\n              item.classList.add(classNoBorder);\n            } else if (\n              item.classList.contains(classFlatpickrToday) &&\n              // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n              selectedDates!.length === 0\n            ) {\n              item.classList.remove(classNoBorder);\n            }\n          }\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrCSSClassPlugin');\n    };\n\n    return {\n      onMonthChange: ensureClassesInDatePicker,\n      onYearChange: ensureClassesInDatePicker,\n      onValueUpdate: ensureClassesInDatePicker,\n      onOpen: ensureClassesInDatePicker,\n      onReady: [register],\n    };\n  };\n"],"mappings":";;;;;;;;;;;;;AAqFA,IAAA,4BAAgB,YACb,OAA0B;;;;CAIzB,MAAM,kCAAkC;EACtC,MAAM,EAAE,mBAAmB,kBAAkB;AAC7C,MAAI,mBAAmB;GACrB,MAAM,EACJ,wBACA,YACA,eACA,WACA,cACA,UACA,eACA,wBACA,2BACA,uBACA,0BACA,sBACA,wBACE;AACJ,qBAAkB,UAAU,IAAI,uBAAuB;GACvD,MAAM,QAAQ,kBAAkB,cAAc,uBAAuB;AACrE,OAAI,MACF,OAAM,UAAU,IAAI,WAAW;GAEjC,MAAM,WAAW,kBAAkB,cACjC,0BACD;AACD,OAAI,SACF,UAAS,UAAU,IAAI,cAAc;GAEvC,MAAM,OAAO,kBAAkB,cAAc,sBAAsB;AACnE,OAAI,KACF,MAAK,UAAU,IAAI,UAAU;AAE/B,WACE,kBAAkB,iBAAiB,yBAAyB,GAC3D,SAAS;AACR,SAAK,YAAY,KAAK,UAAU,QAAQ,QAAQ,GAAG;AACnD,SAAK,UAAU,IAAI,aAAa;KAEnC;AACD,WACE,kBAAkB,iBAAiB,qBAAqB,GACvD,SAAS;AACR,SAAK,UAAU,IAAI,SAAS;AAC5B,QACE,KAAK,UAAU,SAAS,oBAAoB,IAE5C,cAAe,SAAS,EAExB,MAAK,UAAU,IAAI,cAAc;aAEjC,KAAK,UAAU,SAAS,oBAAoB,IAE5C,cAAe,WAAW,EAE1B,MAAK,UAAU,OAAO,cAAc;KAGzC;;;;;;CAOL,MAAM,iBAAiB;AACrB,KAAG,cAAc,KAAK,gCAAgC;;AAGxD,QAAO;EACL,eAAe;EACf,cAAc;EACd,eAAe;EACf,QAAQ;EACR,SAAS,CAAC,SAAS;EACpB"}

package/es-custom/components/date-picker/date-picker-input-skeleton.js

@@ -5,15 +5,14 @@
  * 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 { DATE_PICKER_INPUT_KIND } from "./defs.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import "./defs.js";
 import date_picker_default from "./date-picker.scss.js";
 import "./date-picker-input.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
-
 //#region src/components/date-picker/date-picker-input-skeleton.ts
 /**
 * Copyright IBM Corp. 2019, 2025
@@ -28,21 +27,21 @@ let CDSDatePickerInputSkeleton = class CDSDatePickerInputSkeleton extends LitEle
 	constructor(..._args) {
 		super(..._args);
 		this.hideLabel = false;
-		this.kind = DATE_PICKER_INPUT_KIND.SIMPLE;
+		this.kind = "simple";
 		this.range = false;
 	}
 	render() {
 		const { hideLabel, range } = this;
 		return html`
-      <div class="${prefix}--date-picker-input-skeleton-container">
-        ${!hideLabel ? html`<span class="${prefix}--label"></span>` : null}
-        <div class="${prefix}--date-picker__input ${prefix}--skeleton"></div>
+      <div class="${"cds-custom"}--date-picker-input-skeleton-container">
+        ${!hideLabel ? html`<span class="${"cds-custom"}--label"></span>` : null}
+        <div class="${"cds-custom"}--date-picker__input ${"cds-custom"}--skeleton"></div>
       </div>
       ${range ? html`
-            <div class="${prefix}--date-picker-input-skeleton-container">
-              ${!hideLabel ? html`<span class="${prefix}--label"></span>` : null}
+            <div class="${"cds-custom"}--date-picker-input-skeleton-container">
+              ${!hideLabel ? html`<span class="${"cds-custom"}--label"></span>` : null}
               <div
-                class="${prefix}--date-picker__input ${prefix}--skeleton"></div>
+                class="${"cds-custom"}--date-picker__input ${"cds-custom"}--skeleton"></div>
             </div>
           ` : null}
     `;
@@ -62,9 +61,9 @@ __decorate([property({
 	reflect: true,
 	attribute: "range"
 })], CDSDatePickerInputSkeleton.prototype, "range", void 0);
-CDSDatePickerInputSkeleton = __decorate([carbonElement(`${prefix}-date-picker-input-skeleton`)], CDSDatePickerInputSkeleton);
+CDSDatePickerInputSkeleton = __decorate([carbonElement(`cds-custom-date-picker-input-skeleton`)], CDSDatePickerInputSkeleton);
 var date_picker_input_skeleton_default = CDSDatePickerInputSkeleton;
-
 //#endregion
 export { date_picker_input_skeleton_default as default };
+
 //# sourceMappingURL=date-picker-input-skeleton.js.map

package/es-custom/components/date-picker/date-picker-input-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-input-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/date-picker/date-picker-input-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 { DATE_PICKER_INPUT_KIND } from './date-picker-input';\nimport styles from './date-picker.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton version of the input box for date picker.\n */\n@customElement(`${prefix}-date-picker-input-skeleton`)\nclass CDSDatePickerInputSkeleton 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   * * @deprecated use `range` instead\n   * Date picker input kind. Corresponds to the attribute with the same name.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  /**\n   * Specify whether the skeleton should be of range date picker.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'range' })\n  range = false;\n\n  render() {\n    const { hideLabel, range } = this;\n    return html`\n      <div class=\"${prefix}--date-picker-input-skeleton-container\">\n        ${!hideLabel ? html`<span class=\"${prefix}--label\"></span>` : null}\n        <div class=\"${prefix}--date-picker__input ${prefix}--skeleton\"></div>\n      </div>\n      ${range\n        ? html`\n            <div class=\"${prefix}--date-picker-input-skeleton-container\">\n              ${!hideLabel\n                ? html`<span class=\"${prefix}--label\"></span>`\n                : null}\n              <div\n                class=\"${prefix}--date-picker__input ${prefix}--skeleton\"></div>\n            </div>\n          `\n        : null}\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDatePickerInputSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,uCACM,mCAAmC,WAAW;;;mBAKtC;cAOL,uBAAuB;eAMtB;;CAER,SAAS;EACP,MAAM,EAAE,WAAW,UAAU;AAC7B,SAAO,IAAI;oBACK,OAAO;UACjB,CAAC,YAAY,IAAI,gBAAgB,OAAO,oBAAoB,KAAK;sBACrD,OAAO,uBAAuB,OAAO;;QAEnD,QACE,IAAI;0BACY,OAAO;gBACjB,CAAC,YACC,IAAI,gBAAgB,OAAO,oBAC3B,KAAK;;yBAEE,OAAO,uBAAuB,OAAO;;cAGpD,KAAK;;;;gBAIGA;;;YArCf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAc,CAAC;YAOnE,SAAS,EAAE,SAAS,MAAM,CAAC;YAM3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAS,CAAC;yCAlBhEC,cAAc,GAAG,OAAO,6BAA6B;AA6CtD,yCAAe"}
+{"version":3,"file":"date-picker-input-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/date-picker/date-picker-input-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 { DATE_PICKER_INPUT_KIND } from './date-picker-input';\nimport styles from './date-picker.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton version of the input box for date picker.\n */\n@customElement(`${prefix}-date-picker-input-skeleton`)\nclass CDSDatePickerInputSkeleton 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   * * @deprecated use `range` instead\n   * Date picker input kind. Corresponds to the attribute with the same name.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  /**\n   * Specify whether the skeleton should be of range date picker.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'range' })\n  range = false;\n\n  render() {\n    const { hideLabel, range } = this;\n    return html`\n      <div class=\"${prefix}--date-picker-input-skeleton-container\">\n        ${!hideLabel ? html`<span class=\"${prefix}--label\"></span>` : null}\n        <div class=\"${prefix}--date-picker__input ${prefix}--skeleton\"></div>\n      </div>\n      ${range\n        ? html`\n            <div class=\"${prefix}--date-picker-input-skeleton-container\">\n              ${!hideLabel\n                ? html`<span class=\"${prefix}--label\"></span>`\n                : null}\n              <div\n                class=\"${prefix}--date-picker__input ${prefix}--skeleton\"></div>\n            </div>\n          `\n        : null}\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSDatePickerInputSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,6BAAA,MACM,mCAAmC,WAAW;;;mBAKtC;;eAaJ;;CAER,SAAS;EACP,MAAM,EAAE,WAAW,UAAU;AAC7B,SAAO,IAAI;0BACY;UACjB,CAAC,YAAY,IAAI,gBAAA,MAAuB,oBAAoB,KAAK;4BAC9C,uBAAA,MAA8B;;QAEnD,QACE,IAAI;gCACmB;gBACjB,CAAC,YACC,IAAI,gBAAA,MAAuB,oBAC3B,KAAK;;+BAES,uBAAA,MAA8B;;cAGpD,KAAK;;;;gBAIGA;;;YArCf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAc,CAAC,CAAA,EAAA,2BAAA,WAAA,aAAA,KAAA,EAAA;YAOnE,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,2BAAA,WAAA,QAAA,KAAA,EAAA;YAM3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAS,CAAC,CAAA,EAAA,2BAAA,WAAA,SAAA,KAAA,EAAA;yCAlBhEC,cAAc,iCAAuC,CAAA,EAAA,2BAAA;AA6CtD,IAAA,qCAAe"}

package/es-custom/components/date-picker/date-picker-input.js

@@ -5,13 +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 iconLoader from "../../globals/internal/icon-loader.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";
-import { INPUT_SIZE } from "../text-input/defs.js";
+import "../text-input/defs.js";
 import "../text-input/text-input.js";
 import { DATE_PICKER_INPUT_KIND } from "./defs.js";
 import date_picker_default from "./date-picker.scss.js";
@@ -22,7 +22,6 @@ 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";
 import Calendar16 from "@carbon/icons/es/calendar/16.js";
-
 //#region src/components/date-picker/date-picker-input.ts
 /**
 * Copyright IBM Corp. 2019, 2025
@@ -40,16 +39,16 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 		super(..._args);
 		this._hasAILabel = false;
 		this._hasHelperText = false;
-		this.colorScheme = FORM_ELEMENT_COLOR_SCHEME.REGULAR;
+		this.colorScheme = "";
 		this.disabled = false;
 		this.hideLabel = false;
 		this.invalid = false;
 		this.invalidText = "";
-		this.kind = DATE_PICKER_INPUT_KIND.SIMPLE;
+		this.kind = "simple";
 		this.readonly = false;
 		this.required = false;
 		this.short = false;
-		this.size = INPUT_SIZE.MEDIUM;
+		this.size = "md";
 		this.warn = false;
 		this.warnText = "";
 	}
@@ -84,8 +83,8 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 	* @returns The template for the the calendar icon.
 	*/
 	_renderIcon() {
-		return this.kind === DATE_PICKER_INPUT_KIND.SIMPLE ? void 0 : iconLoader(Calendar16, {
-			class: `${prefix}--date-picker__icon`,
+		return this.kind === "simple" ? void 0 : iconLoader(Calendar16, {
+			class: `cds-custom--date-picker__icon`,
 			role: "img",
 			title: "Open calendar"
 		});
@@ -94,13 +93,16 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 	* Handles `slotchange` event on the default `<slot>`.
 	*/
 	_handleSlotChange({ target }) {
-		if (!target.name) this._hasHelperText = target.assignedNodes().some((node) => node.nodeType !== Node.TEXT_NODE || node.textContent.trim());
+		if (!target.name) {
+			const hasContent = target.assignedNodes().some((node) => node.nodeType !== Node.TEXT_NODE || node.textContent.trim());
+			this._hasHelperText = hasContent;
+		}
 	}
 	render() {
 		const constructor = this.constructor;
 		const { disabled, _hasHelperText: hasHelperText, hideLabel, invalid, invalidText, labelText, pattern = constructor.defaultPattern, placeholder, readonly, size, type = constructor.defaultType, value, warn, warnText, _handleClickWrapper: handleClickWrapper, _handleInput: handleInput, _hasAILabel: hasAILabel } = this;
-		const invalidIcon = iconLoader(WarningFilled16, { class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid` });
-		const warnIcon = iconLoader(WarningAltFilled16, { class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn` });
+		const invalidIcon = iconLoader(WarningFilled16, { class: `cds-custom--date-picker__icon cds-custom--date-picker__icon--invalid` });
+		const warnIcon = iconLoader(WarningAltFilled16, { class: `cds-custom--date-picker__icon cds-custom--date-picker__icon--warn` });
 		const normalizedProps = {
 			disabled: disabled && !readonly,
 			invalid: invalid && !readonly && !disabled,
@@ -119,25 +121,25 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 			normalizedProps["slot-text"] = warnText;
 		}
 		const labelClasses = classMap({
-			[`${prefix}--label`]: true,
-			[`${prefix}--visually-hidden`]: hideLabel,
-			[`${prefix}--label--disabled`]: disabled
+			[`cds-custom--label`]: true,
+			[`cds-custom--visually-hidden`]: hideLabel,
+			[`cds-custom--label--disabled`]: disabled
 		});
 		const inputClasses = classMap({
-			[`${prefix}--date-picker__input`]: true,
-			[`${prefix}--date-picker__input--invalid`]: normalizedProps.invalid,
-			[`${prefix}--date-picker__input--warn`]: normalizedProps.warn,
-			[`${prefix}--date-picker__input--${size}`]: size,
-			[`${prefix}--date-picker__input--decorator`]: hasAILabel
+			[`cds-custom--date-picker__input`]: true,
+			[`cds-custom--date-picker__input--invalid`]: normalizedProps.invalid,
+			[`cds-custom--date-picker__input--warn`]: normalizedProps.warn,
+			[`cds-custom--date-picker__input--${size}`]: size,
+			[`cds-custom--date-picker__input--decorator`]: hasAILabel
 		});
 		const inputWrapperClasses = classMap({
-			[`${prefix}--date-picker-input__wrapper`]: true,
-			[`${prefix}--date-picker-input__wrapper--invalid`]: normalizedProps.invalid,
-			[`${prefix}--date-picker-input__wrapper--warn`]: normalizedProps.warn
+			[`cds-custom--date-picker-input__wrapper`]: true,
+			[`cds-custom--date-picker-input__wrapper--invalid`]: normalizedProps.invalid,
+			[`cds-custom--date-picker-input__wrapper--warn`]: normalizedProps.warn
 		});
 		const helperTextClasses = classMap({
-			[`${prefix}--form__helper-text`]: true,
-			[`${prefix}--form__helper-text--disabled`]: disabled
+			[`cds-custom--form__helper-text`]: true,
+			[`cds-custom--form__helper-text--disabled`]: disabled
 		});
 		return html`
       <label for="input" class="${labelClasses}">
@@ -166,7 +168,7 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
         </span>
       </div>
       <div
-        class="${prefix}--form-requirement"
+        class="${"cds-custom"}--form-requirement"
         ?hidden="${!normalizedProps.invalid && !normalizedProps.warn}">
         <slot name="${normalizedProps["slot-name"]}">
           ${normalizedProps["slot-text"]}
@@ -180,8 +182,8 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 	updated() {
 		this.toggleAttribute("ai-label", this._hasAILabel);
 		const label = this.shadowRoot?.querySelector("slot[name='ai-label']");
-		if (label) label?.classList.toggle(`${prefix}--slug--revert`, this.querySelector(`${prefix}-ai-label`)?.hasAttribute("revert-active"));
-		else this.shadowRoot?.querySelector("slot[name='slug']")?.classList.toggle(`${prefix}--slug--revert`, this.querySelector(`${prefix}-slug`)?.hasAttribute("revert-active"));
+		if (label) label?.classList.toggle(`cds-custom--slug--revert`, this.querySelector(`cds-custom-ai-label`)?.hasAttribute("revert-active"));
+		else this.shadowRoot?.querySelector("slot[name='slug']")?.classList.toggle(`cds-custom--slug--revert`, this.querySelector(`cds-custom-slug`)?.hasAttribute("revert-active"));
 	}
 	static {
 		this.defaultPattern = "\\d{1,2}\\/\\d{1,2}\\/\\d{4}";
@@ -193,7 +195,7 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 	* A selector that will return the parent date picker.
 	*/
 	static get selectorParent() {
-		return `${prefix}-date-picker`;
+		return `cds-custom-date-picker`;
 	}
 	/**
 	* A selector that will return the slug item.
@@ -201,13 +203,13 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 	* remove in v12
 	*/
 	static get slugItem() {
-		return `${prefix}-slug`;
+		return `cds-custom-slug`;
 	}
 	/**
 	* A selector that will return the AI Label item.
 	*/
 	static get aiLabelItem() {
-		return `${prefix}-ai-label`;
+		return `cds-custom-ai-label`;
 	}
 	static {
 		this.shadowRootOptions = {
@@ -219,7 +221,7 @@ let CDSDatePickerInput = class CDSDatePickerInput extends FocusMixin(LitElement)
 		this.styles = date_picker_default;
 	}
 };
-__decorate([query(`.${prefix}--date-picker__icon`)], CDSDatePickerInput.prototype, "_iconNode", void 0);
+__decorate([query(`.cds-custom--date-picker__icon`)], CDSDatePickerInput.prototype, "_iconNode", void 0);
 __decorate([state()], CDSDatePickerInput.prototype, "_hasHelperText", void 0);
 __decorate([query("input")], CDSDatePickerInput.prototype, "input", void 0);
 __decorate([property({
@@ -267,9 +269,9 @@ __decorate([property({
 	reflect: true
 })], CDSDatePickerInput.prototype, "warn", void 0);
 __decorate([property({ attribute: "warn-text" })], CDSDatePickerInput.prototype, "warnText", void 0);
-CDSDatePickerInput = __decorate([carbonElement(`${prefix}-date-picker-input`)], CDSDatePickerInput);
+CDSDatePickerInput = __decorate([carbonElement(`cds-custom-date-picker-input`)], CDSDatePickerInput);
 var date_picker_input_default = CDSDatePickerInput;
-
 //#endregion
 export { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND, date_picker_input_default as default };
+
 //# sourceMappingURL=date-picker-input.js.map

package/es-custom/components/date-picker/date-picker-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker-input.js","names":["DATE_PICKER_INPUT_COLOR_SCHEME","styles","customElement"],"sources":["../../../src/components/date-picker/date-picker-input.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 { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND } from './defs';\nimport styles from './date-picker.scss?lit';\nimport Calendar16 from '@carbon/icons/es/calendar/16.js';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\nexport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND };\n\n/**\n * The input box for date picker.\n *\n * @element cds-custom-date-picker-input\n */\n@customElement(`${prefix}-date-picker-input`)\nclass CDSDatePickerInput extends FocusMixin(LitElement) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  private _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleAILabelSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSDatePickerInput).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSDatePickerInput).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  /**\n   * The calendar icon.\n   */\n  @query(`.${prefix}--date-picker__icon`)\n  private _iconNode!: SVGElement;\n\n  /**\n   * Handles `click` event on the calendar icon.\n   *\n   * @param event The event.\n   */\n  private _handleClickWrapper(event: MouseEvent) {\n    if (event.target === this._iconNode) {\n      this.input.focus();\n    }\n  }\n\n  /**\n   * Handles `input` event on `<input>` in the shadow DOM.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput({ target }: Event) {\n    const { value } = target as HTMLInputElement;\n    this.value = value;\n  }\n\n  /**\n   * @returns The template for the the calendar icon.\n   */\n  private _renderIcon() {\n    return this.kind === DATE_PICKER_INPUT_KIND.SIMPLE\n      ? undefined\n      : iconLoader(Calendar16, {\n          class: `${prefix}--date-picker__icon`,\n          role: 'img',\n          title: 'Open calendar',\n        });\n  }\n\n  /**\n   * `true` if there is helper text content.\n   */\n  @state()\n  protected _hasHelperText = false;\n\n  /**\n   * Handles `slotchange` event on the default `<slot>`.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    if (!(target as HTMLSlotElement).name) {\n      const hasContent = (target as HTMLSlotElement).assignedNodes().some(\n        (node) =>\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          node.nodeType !== Node.TEXT_NODE || node!.textContent!.trim()\n      );\n      this._hasHelperText = hasContent;\n    }\n  }\n\n  /**\n   * The `<input>`, used for Flatpickr to grab.\n   */\n  @query('input')\n  input!: HTMLInputElement;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = DATE_PICKER_INPUT_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` if the check box should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if the label should be hidden.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`.\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   * Date picker input kind.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText!: string;\n\n  /**\n   * The `pattern` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  pattern!: string;\n\n  /**\n   * The placeholder text.\n   */\n  @property()\n  placeholder!: string;\n\n  /**\n   * Specify if the component should be read-only\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * `true` if the value is required.\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * true to use the short version.\n   */\n  @property({ type: Boolean, reflect: true })\n  short = false;\n\n  /**\n   * Vertical size of this date picker input.\n   */\n  @property({ attribute: 'size', reflect: true })\n  size = INPUT_SIZE.MEDIUM;\n\n  /**\n   * The `type` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  type!: string;\n\n  /**\n   * The value.\n   */\n  @property()\n  value!: string;\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  render() {\n    const constructor = this.constructor as typeof CDSDatePickerInput;\n    const {\n      disabled,\n      _hasHelperText: hasHelperText,\n      hideLabel,\n      invalid,\n      invalidText,\n      labelText,\n      pattern = constructor.defaultPattern,\n      placeholder,\n      readonly,\n      size,\n      type = constructor.defaultType,\n      value,\n      warn,\n      warnText,\n      _handleClickWrapper: handleClickWrapper,\n      _handleInput: handleInput,\n      _hasAILabel: hasAILabel,\n    } = this;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`,\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: disabled && !readonly,\n      invalid: invalid && !readonly && !disabled,\n      warn: warn && !readonly && !disabled && !invalid,\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 labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: hideLabel,\n      [`${prefix}--label--disabled`]: disabled,\n    });\n    const inputClasses = classMap({\n      [`${prefix}--date-picker__input`]: true,\n      [`${prefix}--date-picker__input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--date-picker__input--warn`]: normalizedProps.warn,\n      [`${prefix}--date-picker__input--${size}`]: size,\n      [`${prefix}--date-picker__input--decorator`]: hasAILabel,\n    });\n\n    const inputWrapperClasses = classMap({\n      [`${prefix}--date-picker-input__wrapper`]: true,\n      [`${prefix}--date-picker-input__wrapper--invalid`]:\n        normalizedProps.invalid,\n      [`${prefix}--date-picker-input__wrapper--warn`]: normalizedProps.warn,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: disabled,\n    });\n\n    return html`\n      <label for=\"input\" class=\"${labelClasses}\">\n        <slot name=\"label-text\">${labelText}</slot>\n      </label>\n      <div class=\"${inputWrapperClasses}\" @click=\"${handleClickWrapper}\">\n        <span>\n          <input\n            id=\"input\"\n            type=\"${type}\"\n            class=\"${inputClasses}\"\n            ?disabled=\"${normalizedProps.disabled}\"\n            pattern=\"${pattern}\"\n            placeholder=\"${ifDefined(placeholder)}\"\n            .value=\"${ifDefined(value)}\"\n            ?data-invalid=\"${normalizedProps.invalid}\"\n            @input=\"${handleInput}\"\n            ?readonly=\"${readonly}\" />\n          ${normalizedProps.icon || this._renderIcon()}\n          <slot\n            name=\"ai-label\"\n            @slotchange=\"${this._handleAILabelSlotChange}\"></slot>\n          <slot\n            name=\"slug\"\n            @slotchange=\"${this._handleAILabelSlotChange}\"></slot>\n        </span>\n      </div>\n      <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      <div ?hidden=\"${hasHelperText}\" class=\"${helperTextClasses}\">\n        <slot name=\"helper-text\" @slotchange=\"${this._handleSlotChange}\"></slot>\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   * The default value for `pattern` property.\n   */\n  static defaultPattern = '\\\\d{1,2}\\\\/\\\\d{1,2}\\\\/\\\\d{4}';\n\n  /**\n   * The default value for `type` property.\n   */\n  static defaultType = 'text';\n\n  /**\n   * A selector that will return the parent date picker.\n   */\n  static get selectorParent() {\n    return `${prefix}-date-picker`;\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 CDSDatePickerInput;\n"],"mappings":"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"}
+{"version":3,"file":"date-picker-input.js","names":["styles","customElement"],"sources":["../../../src/components/date-picker/date-picker-input.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 { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { INPUT_SIZE } from '../text-input/text-input';\nimport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND } from './defs';\nimport styles from './date-picker.scss?lit';\nimport Calendar16 from '@carbon/icons/es/calendar/16.js';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16.js';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { iconLoader } from '../../globals/internal/icon-loader';\n\nexport { DATE_PICKER_INPUT_COLOR_SCHEME, DATE_PICKER_INPUT_KIND };\n\n/**\n * The input box for date picker.\n *\n * @element cds-custom-date-picker-input\n */\n@customElement(`${prefix}-date-picker-input`)\nclass CDSDatePickerInput extends FocusMixin(LitElement) {\n  /**\n   * `true` if there is an AI Label.\n   */\n  private _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleAILabelSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSDatePickerInput).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSDatePickerInput).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  /**\n   * The calendar icon.\n   */\n  @query(`.${prefix}--date-picker__icon`)\n  private _iconNode!: SVGElement;\n\n  /**\n   * Handles `click` event on the calendar icon.\n   *\n   * @param event The event.\n   */\n  private _handleClickWrapper(event: MouseEvent) {\n    if (event.target === this._iconNode) {\n      this.input.focus();\n    }\n  }\n\n  /**\n   * Handles `input` event on `<input>` in the shadow DOM.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput({ target }: Event) {\n    const { value } = target as HTMLInputElement;\n    this.value = value;\n  }\n\n  /**\n   * @returns The template for the the calendar icon.\n   */\n  private _renderIcon() {\n    return this.kind === DATE_PICKER_INPUT_KIND.SIMPLE\n      ? undefined\n      : iconLoader(Calendar16, {\n          class: `${prefix}--date-picker__icon`,\n          role: 'img',\n          title: 'Open calendar',\n        });\n  }\n\n  /**\n   * `true` if there is helper text content.\n   */\n  @state()\n  protected _hasHelperText = false;\n\n  /**\n   * Handles `slotchange` event on the default `<slot>`.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    if (!(target as HTMLSlotElement).name) {\n      const hasContent = (target as HTMLSlotElement).assignedNodes().some(\n        (node) =>\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          node.nodeType !== Node.TEXT_NODE || node!.textContent!.trim()\n      );\n      this._hasHelperText = hasContent;\n    }\n  }\n\n  /**\n   * The `<input>`, used for Flatpickr to grab.\n   */\n  @query('input')\n  input!: HTMLInputElement;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = DATE_PICKER_INPUT_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` if the check box should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if the label should be hidden.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-label' })\n  hideLabel = false;\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`.\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   * Date picker input kind.\n   */\n  @property({ reflect: true })\n  kind = DATE_PICKER_INPUT_KIND.SIMPLE;\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText!: string;\n\n  /**\n   * The `pattern` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  pattern!: string;\n\n  /**\n   * The placeholder text.\n   */\n  @property()\n  placeholder!: string;\n\n  /**\n   * Specify if the component should be read-only\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * `true` if the value is required.\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * true to use the short version.\n   */\n  @property({ type: Boolean, reflect: true })\n  short = false;\n\n  /**\n   * Vertical size of this date picker input.\n   */\n  @property({ attribute: 'size', reflect: true })\n  size = INPUT_SIZE.MEDIUM;\n\n  /**\n   * The `type` attribute for the `<input>` in the shadow DOM.\n   */\n  @property()\n  type!: string;\n\n  /**\n   * The value.\n   */\n  @property()\n  value!: string;\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  render() {\n    const constructor = this.constructor as typeof CDSDatePickerInput;\n    const {\n      disabled,\n      _hasHelperText: hasHelperText,\n      hideLabel,\n      invalid,\n      invalidText,\n      labelText,\n      pattern = constructor.defaultPattern,\n      placeholder,\n      readonly,\n      size,\n      type = constructor.defaultType,\n      value,\n      warn,\n      warnText,\n      _handleClickWrapper: handleClickWrapper,\n      _handleInput: handleInput,\n      _hasAILabel: hasAILabel,\n    } = this;\n\n    const invalidIcon = iconLoader(WarningFilled16, {\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--invalid`,\n    });\n\n    const warnIcon = iconLoader(WarningAltFilled16, {\n      class: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`,\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: disabled && !readonly,\n      invalid: invalid && !readonly && !disabled,\n      warn: warn && !readonly && !disabled && !invalid,\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 labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--visually-hidden`]: hideLabel,\n      [`${prefix}--label--disabled`]: disabled,\n    });\n    const inputClasses = classMap({\n      [`${prefix}--date-picker__input`]: true,\n      [`${prefix}--date-picker__input--invalid`]: normalizedProps.invalid,\n      [`${prefix}--date-picker__input--warn`]: normalizedProps.warn,\n      [`${prefix}--date-picker__input--${size}`]: size,\n      [`${prefix}--date-picker__input--decorator`]: hasAILabel,\n    });\n\n    const inputWrapperClasses = classMap({\n      [`${prefix}--date-picker-input__wrapper`]: true,\n      [`${prefix}--date-picker-input__wrapper--invalid`]:\n        normalizedProps.invalid,\n      [`${prefix}--date-picker-input__wrapper--warn`]: normalizedProps.warn,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: disabled,\n    });\n\n    return html`\n      <label for=\"input\" class=\"${labelClasses}\">\n        <slot name=\"label-text\">${labelText}</slot>\n      </label>\n      <div class=\"${inputWrapperClasses}\" @click=\"${handleClickWrapper}\">\n        <span>\n          <input\n            id=\"input\"\n            type=\"${type}\"\n            class=\"${inputClasses}\"\n            ?disabled=\"${normalizedProps.disabled}\"\n            pattern=\"${pattern}\"\n            placeholder=\"${ifDefined(placeholder)}\"\n            .value=\"${ifDefined(value)}\"\n            ?data-invalid=\"${normalizedProps.invalid}\"\n            @input=\"${handleInput}\"\n            ?readonly=\"${readonly}\" />\n          ${normalizedProps.icon || this._renderIcon()}\n          <slot\n            name=\"ai-label\"\n            @slotchange=\"${this._handleAILabelSlotChange}\"></slot>\n          <slot\n            name=\"slug\"\n            @slotchange=\"${this._handleAILabelSlotChange}\"></slot>\n        </span>\n      </div>\n      <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      <div ?hidden=\"${hasHelperText}\" class=\"${helperTextClasses}\">\n        <slot name=\"helper-text\" @slotchange=\"${this._handleSlotChange}\"></slot>\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   * The default value for `pattern` property.\n   */\n  static defaultPattern = '\\\\d{1,2}\\\\/\\\\d{1,2}\\\\/\\\\d{4}';\n\n  /**\n   * The default value for `type` property.\n   */\n  static defaultType = 'text';\n\n  /**\n   * A selector that will return the parent date picker.\n   */\n  static get selectorParent() {\n    return `${prefix}-date-picker`;\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 CDSDatePickerInput;\n"],"mappings":"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"}

package/es-custom/components/date-picker/date-picker.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 HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
 import FormMixin from "../../globals/mixins/form.js";
@@ -25,7 +25,6 @@ import state_handshake_plugin_default from "./state-handshake-plugin.js";
 import { LitElement, html } from "lit";
 import { property, query } from "lit/decorators.js";
 import flatpickr from "flatpickr";
-
 //#region src/components/date-picker/date-picker.ts
 /**
 * Copyright IBM Corp. 2019, 2025
@@ -33,24 +32,6 @@ import flatpickr from "flatpickr";
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
-/**
-* Date picker modes.
-*/
-var DATE_PICKER_MODE = /* @__PURE__ */ function(DATE_PICKER_MODE) {
-	/**
-	* Simple mode, without calendar dropdown.
-	*/
-	DATE_PICKER_MODE["SIMPLE"] = "simple";
-	/**
-	* Single date mode.
-	*/
-	DATE_PICKER_MODE["SINGLE"] = "single";
-	/**
-	* Range mode.
-	*/
-	DATE_PICKER_MODE["RANGE"] = "range";
-	return DATE_PICKER_MODE;
-}(DATE_PICKER_MODE || {});
 flatpickr.l10ns.en.weekdays.shorthand.forEach((_day, index) => {
 	const currentDay = flatpickr.l10ns.en.weekdays.shorthand;
 	if (currentDay[index] === "Thu" || currentDay[index] === "Th") currentDay[index] = "Th";
@@ -92,9 +73,9 @@ let CDSDatePicker = class CDSDatePicker extends HostListenerMixin(FormMixin(LitE
 	*/
 	get _mode() {
 		const { selectorInputTo } = this.constructor;
-		if (this.querySelector(selectorInputTo)) return DATE_PICKER_MODE.RANGE;
-		if (this.querySelector(`${prefix}-date-picker-input[kind="single"]`)) return DATE_PICKER_MODE.SINGLE;
-		return DATE_PICKER_MODE.SIMPLE;
+		if (this.querySelector(selectorInputTo)) return "range";
+		if (this.querySelector(`cds-custom-date-picker-input[kind="single"]`)) return "single";
+		return "simple";
 	}
 	/**
 	* @returns The Flatpickr plugins to use.
@@ -139,7 +120,7 @@ let CDSDatePicker = class CDSDatePicker extends HostListenerMixin(FormMixin(LitE
 			shadow_dom_events_plugin_default(),
 			state_handshake_plugin_default(this)
 		];
-		if (mode === DATE_PICKER_MODE.RANGE) plugins.push(range_plugin_default({ input: inputTo }));
+		if (mode === "range") plugins.push(range_plugin_default({ input: inputTo }));
 		return plugins;
 	}
 	/**
@@ -282,14 +263,14 @@ let CDSDatePicker = class CDSDatePicker extends HostListenerMixin(FormMixin(LitE
 		const { _handleSlotChange: handleSlotChange } = this;
 		return html`
       <a
-        class="${prefix}--visually-hidden"
+        class="${"cds-custom"}--visually-hidden"
         href="javascript:void 0"
         role="navigation"
         tabindex="-1"></a>
       <slot @slotchange="${handleSlotChange}"></slot>
       <div id="floating-menu-container"></div>
       <a
-        class="${prefix}--visually-hidden"
+        class="${"cds-custom"}--visually-hidden"
         href="javascript:void 0"
         role="navigation"
         tabindex="-1"></a>
@@ -329,37 +310,37 @@ let CDSDatePicker = class CDSDatePicker extends HostListenerMixin(FormMixin(LitE
 	* The CSS class for the calendar dropdown.
 	*/
 	static get classCalendarContainer() {
-		return `${prefix}--date-picker__calendar`;
+		return `cds-custom--date-picker__calendar`;
 	}
 	/**
 	* The CSS class for the month navigator.
 	*/
 	static get classMonth() {
-		return `${prefix}--date-picker__month`;
+		return `cds-custom--date-picker__month`;
 	}
 	/**
 	* The CSS class for the container of the weekdays.
 	*/
 	static get classWeekdays() {
-		return `${prefix}--date-picker__weekdays`;
+		return `cds-custom--date-picker__weekdays`;
 	}
 	/**
 	* The CSS class for the container of the days.
 	*/
 	static get classDays() {
-		return `${prefix}--date-picker__days`;
+		return `cds-custom--date-picker__days`;
 	}
 	/**
 	* The CSS class applied to each weekdays.
 	*/
 	static get classWeekday() {
-		return `${prefix}--date-picker__weekday`;
+		return `cds-custom--date-picker__weekday`;
 	}
 	/**
 	* The CSS class applied to each days.
 	*/
 	static get classDay() {
-		return `${prefix}--date-picker__day`;
+		return `cds-custom--date-picker__day`;
 	}
 	static {
 		this.classNoBorder = "no-border";
@@ -374,25 +355,25 @@ let CDSDatePicker = class CDSDatePicker extends HostListenerMixin(FormMixin(LitE
 	* A selector that will return the `<input>` to enter starting date.
 	*/
 	static get selectorInputFrom() {
-		return `${prefix}-date-picker-input,${prefix}-date-picker-input[kind="from"]`;
+		return `cds-custom-date-picker-input,cds-custom-date-picker-input[kind="from"]`;
 	}
 	/**
 	* A selector that will return the `<input>` to enter end date.
 	*/
 	static get selectorInputTo() {
-		return `${prefix}-date-picker-input[kind="to"]`;
+		return `cds-custom-date-picker-input[kind="to"]`;
 	}
 	/**
 	* The name of the custom event when Flatpickr throws an error.
 	*/
 	static get eventFlatpickrError() {
-		return `${prefix}-date-picker-flatpickr-error`;
+		return `cds-custom-date-picker-flatpickr-error`;
 	}
 	/**
 	* The name of the custom event fired on this element when Flatpickr updates its value.
 	*/
 	static get eventChange() {
-		return `${prefix}-date-picker-changed`;
+		return `cds-custom-date-picker-changed`;
 	}
 	static {
 		this.styles = date_picker_default$1;
@@ -429,9 +410,9 @@ __decorate([property({
 	reflect: true
 })], CDSDatePicker.prototype, "readonly", void 0);
 __decorate([property()], CDSDatePicker.prototype, "value", null);
-CDSDatePicker = __decorate([carbonElement(`${prefix}-date-picker`)], CDSDatePicker);
+CDSDatePicker = __decorate([carbonElement(`cds-custom-date-picker`)], CDSDatePicker);
 var date_picker_default = CDSDatePicker;
-
 //#endregion
 export { date_picker_default as default };
+
 //# sourceMappingURL=date-picker.js.map