@carbon/web-components 2.60.0-rc.0 → 2.61.0-rc.0

package/lib/components/fluid-date-picker/fluid-date-picker-input.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import CDSDatePickerInput from '../date-picker/date-picker-input';
+/**
+ * Fluid date picker input.
+ *
+ * @element cds-fluid-date-picker-input
+ */
+declare class CDSFluidDatePickerInput extends CDSDatePickerInput {
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn: boolean;
+    /**
+     * Provide the text that is displayed when the control is in warning state
+     */
+    warnText: string;
+    /**
+     * Controls the invalid state and visibility of the `validityMessage`.
+     */
+    invalid: boolean;
+    /**
+     * Message which is displayed if the value is invalid.
+     */
+    invalidText: string;
+    /**
+     * Fluid variant is always true for this component.
+     * Overrides the base class default of false.
+     */
+    isFluid: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any[];
+}
+export default CDSFluidDatePickerInput;
+//# sourceMappingURL=fluid-date-picker-input.d.ts.map

package/lib/components/fluid-date-picker/fluid-date-picker-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fluid-date-picker-input.d.ts","sourceRoot":"","sources":["../../../src/components/fluid-date-picker/fluid-date-picker-input.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,OAAO,kBAAkB,MAAM,kCAAkC,CAAC;AAGlE;;;;GAIG;AACH,cACM,uBAAwB,SAAQ,kBAAkB;IACtD;;OAEG;IAEK,IAAI,EAAE,OAAO,CAAC;IAEtB;;OAEG;IAEK,QAAQ,EAAE,MAAM,CAAC;IAEzB;;OAEG;IAEK,OAAO,EAAE,OAAO,CAAC;IAEzB;;OAEG;IAEK,WAAW,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IAEH,OAAO,UAAQ;IAEf,MAAM;IAIN,MAAM,CAAC,MAAM,QAAuC;CACrD;AAED,eAAe,uBAAuB,CAAC"}

package/lib/components/fluid-date-picker/fluid-date-picker-skeleton.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Copyright IBM Corp. 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { LitElement } from 'lit';
+/**
+ * Fluid date picker skeleton.
+ *
+ * @element cds-fluid-date-picker-skeleton
+ */
+declare class CDSFluidDatePickerSkeleton extends LitElement {
+    datePickerType: 'simple' | 'single' | 'range';
+    private _renderContainer;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any[];
+}
+export default CDSFluidDatePickerSkeleton;
+//# sourceMappingURL=fluid-date-picker-skeleton.d.ts.map

package/lib/components/fluid-date-picker/fluid-date-picker-skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fluid-date-picker-skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/fluid-date-picker/fluid-date-picker-skeleton.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAQvC;;;;GAIG;AACH,cACM,0BAA2B,SAAQ,UAAU;IAEjD,cAAc,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAEzD,OAAO,CAAC,gBAAgB;IAgBxB,MAAM;IAkBN,MAAM,CAAC,MAAM,QAAY;CAC1B;AAED,eAAe,0BAA0B,CAAC"}

package/lib/components/fluid-date-picker/fluid-date-picker.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import CDSDatePicker from '../date-picker/date-picker';
+/**
+ * Fluid date picker.
+ *
+ * @element cds-fluid-date-picker
+ * @fires cds-date-picker-changed - The custom event fired on this element when Flatpickr updates its value.
+ * @fires cds-date-picker-flatpickr-error
+ *   The name of the custom event when Flatpickr throws an error.
+ */
+declare class CDSFluidDatePicker extends CDSDatePicker {
+    render(): import("lit-html").TemplateResult<1>;
+    static get selectorInputFrom(): string;
+    static get selectorInputTo(): string;
+    static get selectorInputSingle(): string;
+    static styles: any[];
+}
+export default CDSFluidDatePicker;
+//# sourceMappingURL=fluid-date-picker.d.ts.map

package/lib/components/fluid-date-picker/fluid-date-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fluid-date-picker.d.ts","sourceRoot":"","sources":["../../../src/components/fluid-date-picker/fluid-date-picker.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,OAAO,aAAa,MAAM,4BAA4B,CAAC;AAGvD;;;;;;;GAOG;AACH,cACM,kBAAmB,SAAQ,aAAa;IAC5C,MAAM;IAIN,MAAM,KAAK,iBAAiB,WAE3B;IAED,MAAM,KAAK,eAAe,WAEzB;IAED,MAAM,KAAK,mBAAmB,WAE7B;IAED,MAAM,CAAC,MAAM,QAAkC;CAChD;AAED,eAAe,kBAAkB,CAAC"}

package/lib/components/fluid-date-picker/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright IBM Corp. 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import './fluid-date-picker';
+import './fluid-date-picker-input';
+import './fluid-date-picker-skeleton';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/fluid-date-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/fluid-date-picker/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,qBAAqB,CAAC;AAC7B,OAAO,2BAA2B,CAAC;AACnC,OAAO,8BAA8B,CAAC"}

package/lib/components/password-input/password-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"password-input.d.ts","sourceRoot":"","sources":["../../../src/components/password-input/password-input.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAaH,OAAO,YAAY,CAAC;AACpB,OAAO,4BAA4B,CAAC;AAEpC,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAGpD,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,EACX,MAAM,QAAQ,CAAC;AAEhB,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,GACX,CAAC;AACF;;;;;;;GAOG;AACH,cACM,gBAAiB,SAAQ,YAAY;IACzC;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAC,CAAc;IAEvC;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC;;OAEG;IAMH,iBAAiB,SAAmB;IAEpC;;OAEG;IAMH,iBAAiB,SAAmB;IAEpC;;OAEG;IAEH,IAAI,EAAE,UAAU,CAAuB;IAEvC;;;OAGG;IAMH,gBAAgB,0BAA+B;IAE/C;;OAEG;IAEH,OAAO,UAAS;IAEhB;;;OAGG;IAMH,gBAAgB,0BAAkC;IAElD;;OAEG;IACH,OAAO,CAAC,8BAA8B;IAMtC,MAAM;IAmOA,YAAY;IAMlB;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"password-input.d.ts","sourceRoot":"","sources":["../../../src/components/password-input/password-input.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAaH,OAAO,YAAY,CAAC;AACpB,OAAO,4BAA4B,CAAC;AAEpC,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAGpD,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,EACX,MAAM,QAAQ,CAAC;AAEhB,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,GACX,CAAC;AACF;;;;;;;GAOG;AACH,cACM,gBAAiB,SAAQ,YAAY;IACzC;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAC,CAAc;IAEvC;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC;;OAEG;IAMH,iBAAiB,SAAmB;IAEpC;;OAEG;IAMH,iBAAiB,SAAmB;IAEpC;;OAEG;IAEH,IAAI,EAAE,UAAU,CAAuB;IAEvC;;;OAGG;IAMH,gBAAgB,0BAA+B;IAE/C;;OAEG;IAEH,OAAO,UAAS;IAEhB;;;OAGG;IAMH,gBAAgB,0BAAkC;IAElD;;OAEG;IACH,OAAO,CAAC,8BAA8B;IAMtC,MAAM;IAqOA,YAAY;IAMlB;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,gBAAgB,CAAC"}

package/lib/components/select/select.d.ts

@@ -43,6 +43,14 @@ declare class CDSSelect extends CDSSelect_base {
      * Select all <option> nodes with `selected` attribute
      */
     private _selectedOptionNodes;
+    /**
+     * The `<slot>` element for the AI label in the shadow DOM.
+     */
+    private _slotAILabelNode;
+    /**
+     * The `<slot>` element for the slug in the shadow DOM.
+     */
+    private _slotSlugNode;
     /**
      * Specify whether the textarea is fluid or not
      */

package/lib/components/select/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/select/select.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAUvC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;;;;;;;AAMtD;;;;;;;;;GASG;AACH,cACM,SAAU,SAAQ,cAAqB;IAC3C;;OAEG;IACH,SAAS,CAAC,WAAW,UAAS;IAE9B;;OAEG;IACH,OAAO,CAAC,iBAAiB,CAAiC;IAE1D;;OAEG;IACH,OAAO,CAAC,qBAAqB,CAEf;IAEd;;OAEG;IAEH,OAAO,CAAC,WAAW,CAAqB;IAExC;;OAEG;IAEH,OAAO,CAAC,oBAAoB,CAAuB;IAEnD;;OAEG;IAEH,OAAO,UAAS;IAEhB;;;;;OAKG;IACH,OAAO,CAAC,YAAY;IAepB;;;;;;OAMG;IACH,OAAO,CAAC,eAAe,CAErB;IAEF;;;OAGG;IACH,OAAO,CAAC,YAAY;IAyCpB,eAAe,CAAC,KAAK,EAAE,aAAa;IAQpC;;OAEG;IACH,SAAS,CAAC,wBAAwB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAqBpD;;;OAGG;IACH,IAAI,MAAM,WAET;IAED;;OAEG;IACH,IAAI,OAAO,0BAEV;IAED;;OAEG;IACH,IAAI,IAAI,qCAEP;IAED;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,EAAE,SAAY;IAEd;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,SAAS,SAAM;IAEf;;OAEG;IAEH,kBAAkB,UAAS;IAE3B;;OAEG;IAEH,MAAM,UAAS;IAEf;;OAEG;IACH,IACI,QAAQ,YAEX;IAED;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,uBAAuB,SAAiC;IAExD;;OAEG;IACH,IACI,aAAa,WAEhB;IAED,IAAI,aAAa,CAAC,KAAK,QAAA,EAGtB;IAED;;OAEG;IAEH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;OAEG;IAEH,KAAK,SAAM;IAEX,iBAAiB;IAUjB,oBAAoB;IAQpB,OAAO,CAAC,iBAAiB,KAAA;IA2CzB,MAAM;IAmJN;;OAEG;IACH,MAAM,KAAK,YAAY,WAEtB;IAED;;OAEG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/select/select.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAUvC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;;;;;;;AAMtD;;;;;;;;;GASG;AACH,cACM,SAAU,SAAQ,cAAqB;IAC3C;;OAEG;IACH,SAAS,CAAC,WAAW,UAAS;IAE9B;;OAEG;IACH,OAAO,CAAC,iBAAiB,CAAiC;IAE1D;;OAEG;IACH,OAAO,CAAC,qBAAqB,CAEf;IAEd;;OAEG;IAEH,OAAO,CAAC,WAAW,CAAqB;IAExC;;OAEG;IAEH,OAAO,CAAC,oBAAoB,CAAuB;IAEnD;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAmB;IAE3C;;OAEG;IAEH,OAAO,CAAC,aAAa,CAAmB;IAExC;;OAEG;IAEH,OAAO,UAAS;IAEhB;;;;;OAKG;IACH,OAAO,CAAC,YAAY;IAepB;;;;;;OAMG;IACH,OAAO,CAAC,eAAe,CAErB;IAEF;;;OAGG;IACH,OAAO,CAAC,YAAY;IAyCpB,eAAe,CAAC,KAAK,EAAE,aAAa;IAQpC;;OAEG;IACH,SAAS,CAAC,wBAAwB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAqBpD;;;OAGG;IACH,IAAI,MAAM,WAET;IAED;;OAEG;IACH,IAAI,OAAO,0BAEV;IAED;;OAEG;IACH,IAAI,IAAI,qCAEP;IAED;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,EAAE,SAAY;IAEd;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,SAAS,SAAM;IAEf;;OAEG;IAEH,kBAAkB,UAAS;IAE3B;;OAEG;IAEH,MAAM,UAAS;IAEf;;OAEG;IACH,IACI,QAAQ,YAEX;IAED;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,uBAAuB,SAAiC;IAExD;;OAEG;IACH,IACI,aAAa,WAEhB;IAED,IAAI,aAAa,CAAC,KAAK,QAAA,EAGtB;IAED;;OAEG;IAEH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;OAEG;IAEH,KAAK,SAAM;IAEX,iBAAiB;IAUjB,oBAAoB;IAQpB,OAAO,CAAC,iBAAiB,KAAA;IAyCzB,MAAM;IAmJN;;OAEG;IACH,MAAM,KAAK,YAAY,WAEtB;IAED;;OAEG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,SAAS,CAAC"}

package/lib/components/text-input/text-input.d.ts

@@ -46,6 +46,14 @@ declare class CDSTextInput extends CDSTextInput_base {
      */
     protected _input: HTMLInputElement;
     protected _slotHelperTextNode: HTMLSlotElement;
+    /**
+     * The `<slot>` element for the AI label in the shadow DOM.
+     */
+    private _slotAILabelNode;
+    /**
+     * The `<slot>` element for the slug in the shadow DOM.
+     */
+    private _slotSlugNode;
     /**
      * The internal value.
      */
@@ -57,6 +65,15 @@ declare class CDSTextInput extends CDSTextInput_base {
      * @param event.target The event target.
      */
     protected _handleInput({ target }: Event): void;
+    /**
+     * Handles `onchange` event on the `input`.
+     *
+     * The native `change` event is not composed, so it stops at the shadow root
+     * and never reaches listeners on the host. This re-emits it as a composed event so
+     * consumers can listen for `change` on `<cds-text-input>` exactly as they
+     * would on a native `<input>`.
+     */
+    protected _handleChange(): void;
     _handleFormdata(event: FormDataEvent): void;
     protected _handleHelperTextSlotChange(): void;
     /**

package/lib/components/text-input/text-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../src/components/text-input/text-input.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAavC,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,EACX,MAAM,QAAQ,CAAC;AAGhB,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,GACX,CAAC;;;;;;;;;;;;;;;;;;AAEF;;;;;;;GAOG;AACH,cACM,YAAa,SAAQ,iBAAoC;IAC7D;;OAEG;IACH,SAAS,CAAC,WAAW,UAAS;IAE9B;;OAEG;IACH,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAmB7C;;OAEG;IAEH,SAAS,CAAC,MAAM,EAAG,gBAAgB,CAAC;IAGpC,SAAS,CAAC,mBAAmB,EAAG,eAAe,CAAC;IAEhD;;OAEG;IACH,SAAS,CAAC,MAAM,SAAM;IAEtB;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC,eAAe,CAAC,KAAK,EAAE,aAAa;IAQpC,SAAS,CAAC,2BAA2B;IAIrC;;OAEG;IAEH,YAAY,SAAM;IAElB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,MAAC;IAET;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,uBAAuB,SAAiC;IAExD;;;;OAIG;IAEH,iBAAiB,SAAmB;IAEpC;;;;OAIG;IAEH,iBAAiB,SAAmB;IAEpC;;;;OAIG;IAMH,4BAA4B,UAAS;IAErC;;OAEG;IAEH,IAAI,CAAC,EAAE,UAAU,CAAC;IAGlB,OAAO,UAAS;IAEhB;;OAEG;IAEH,MAAM,UAAS;IAEf;;;OAGG;IAEH,gBAAgB,0BAAkC;IAElD;;;OAGG;IAEH,gBAAgB,0BAAkC;IAElD;;OAEG;IAEH,IAAI,aAAmB;IAEvB;;OAEG;IAEH,eAAe,SAAM;IAErB;;OAEG;IACH,IACI,KAAK,WAQR;IAED,IAAI,KAAK,CAAC,KAAK,QAAA,EAUd;IAED;;;;OAIG;IACH,OAAO,CAAC,wBAAwB;IAKhC,MAAM;IA8ON,OAAO;IAmBP;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,YAAY,CAAC"}
+{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../src/components/text-input/text-input.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAcvC,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,EACX,MAAM,QAAQ,CAAC;AAGhB,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,UAAU,GACX,CAAC;;;;;;;;;;;;;;;;;;AAEF;;;;;;;GAOG;AACH,cACM,YAAa,SAAQ,iBAAoC;IAC7D;;OAEG;IACH,SAAS,CAAC,WAAW,UAAS;IAE9B;;OAEG;IACH,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAmB7C;;OAEG;IAEH,SAAS,CAAC,MAAM,EAAG,gBAAgB,CAAC;IAGpC,SAAS,CAAC,mBAAmB,EAAG,eAAe,CAAC;IAEhD;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAmB;IAE3C;;OAEG;IAEH,OAAO,CAAC,aAAa,CAAmB;IAExC;;OAEG;IACH,SAAS,CAAC,MAAM,SAAM;IAEtB;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC;;;;;;;OAOG;IACH,SAAS,CAAC,aAAa;IAIvB,eAAe,CAAC,KAAK,EAAE,aAAa;IAQpC,SAAS,CAAC,2BAA2B;IAIrC;;OAEG;IAEH,YAAY,SAAM;IAElB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,MAAC;IAET;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,uBAAuB,SAAiC;IAExD;;;;OAIG;IAEH,iBAAiB,SAAmB;IAEpC;;;;OAIG;IAEH,iBAAiB,SAAmB;IAEpC;;;;OAIG;IAMH,4BAA4B,UAAS;IAErC;;OAEG;IAEH,IAAI,CAAC,EAAE,UAAU,CAAC;IAGlB,OAAO,UAAS;IAEhB;;OAEG;IAEH,MAAM,UAAS;IAEf;;;OAGG;IAEH,gBAAgB,0BAAkC;IAElD;;;OAGG;IAEH,gBAAgB,0BAAkC;IAElD;;OAEG;IAEH,IAAI,aAAmB;IAEvB;;OAEG;IAEH,eAAe,SAAM;IAErB;;OAEG;IACH,IACI,KAAK,WAQR;IAED,IAAI,KAAK,CAAC,KAAK,QAAA,EAUd;IAED;;;;OAIG;IACH,OAAO,CAAC,wBAAwB;IAKhC,MAAM;IA0PN,OAAO;IAiBP;;;;OAIG;IACH,MAAM,KAAK,QAAQ,WAElB;IAED;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,YAAY,CAAC"}

package/lib/components/textarea/textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/textarea.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAUH,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAKpD;;;;;;;GAOG;AACH,cACM,WAAY,SAAQ,YAAY;IACpC;;;OAGG;IACH,SAAS,CAAC,UAAU,CAAC,GAAG,EAAE,aAAa;IAgBvC;;;;;;OAMG;IACH,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,cAAc;IA+BtC;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC;;OAEG;IAEH,IAAI,MAAC;IAEL;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAYH,WAAW,EAAE,WAAW,GAAG,MAAM,CAAe;IAEhD;;OAEG;IAEH,EAAE,SAAM;IAER;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,SAAK;IAET;;;OAGG;IAEH,SAAS,CAAC,SAAS,EAAG,mBAAmB,CAAC;IAE1C;;;OAGG;IACH,OAAO,CAAC,gBAAgB,CAA0C;IAElE;;;OAGG;IACH,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,MAAM;IAmIN,OAAO,IAAI,IAAI;IAyBf;;;OAGG;IACH,OAAO,CAAC,eAAe;IAqBvB,oBAAoB;IAKpB,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/textarea.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAUH,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAKpD;;;;;;;GAOG;AACH,cACM,WAAY,SAAQ,YAAY;IACpC;;;OAGG;IACH,SAAS,CAAC,UAAU,CAAC,GAAG,EAAE,aAAa;IAgBvC;;;;;;OAMG;IACH,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,cAAc;IA+BtC;;;;;OAKG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK;IAIxC;;OAEG;IAEH,IAAI,MAAC;IAEL;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAYH,WAAW,EAAE,WAAW,GAAG,MAAM,CAAe;IAEhD;;OAEG;IAEH,EAAE,SAAM;IAER;;OAEG;IAEH,OAAO,SAAM;IAEb;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,IAAI,SAAK;IAET;;;OAGG;IAEH,SAAS,CAAC,SAAS,EAAG,mBAAmB,CAAC;IAE1C;;;OAGG;IACH,OAAO,CAAC,gBAAgB,CAA0C;IAElE;;;OAGG;IACH,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,MAAM;IAoIN,OAAO,IAAI,IAAI;IAyBf;;;OAGG;IACH,OAAO,CAAC,eAAe;IAqBvB,oBAAoB;IAKpB,MAAM,CAAC,iBAAiB;;;;;;;MAGtB;IACF,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,WAAW,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/web-components",
   "description": "Web components for the Carbon Design System",
-  "version": "2.60.0-rc.0",
+  "version": "2.61.0-rc.0",
   "license": "Apache-2.0",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -69,9 +69,9 @@
   },
   "dependencies": {
     "@carbon/icon-helpers": "10.47.0",
-    "@carbon/icons": "^11.85.0-rc.0",
-    "@carbon/styles": "^1.112.0-rc.0",
-    "@carbon/utilities": "^0.17.0",
+    "@carbon/icons": "^11.86.0-rc.0",
+    "@carbon/styles": "^1.113.0-rc.0",
+    "@carbon/utilities": "^0.24.0-rc.0",
     "@floating-ui/dom": "^1.6.3",
     "@ibm/telemetry-js": "^1.10.2",
     "@lit/context": "^1.1.3",
@@ -80,8 +80,8 @@
     "tslib": "^2.6.3"
   },
   "devDependencies": {
-    "@carbon/layout": "^11.56.0-rc.0",
-    "@carbon/motion": "^11.49.0-rc.0",
+    "@carbon/layout": "^11.57.0-rc.0",
+    "@carbon/motion": "^11.50.0-rc.0",
     "@juggle/resize-observer": "^3.4.0",
     "@mordech/vite-lit-loader": "^0.40.0",
     "@open-wc/testing": "^5.0.0",
@@ -92,9 +92,9 @@
     "@types/lodash-es": "^4.17.5",
     "@types/node": "^24.0.0",
     "@web/test-runner": "^0.20.0",
-    "@web/test-runner-commands": "^0.9.0",
-    "@web/test-runner-playwright": "^0.11.0",
-    "@web/test-runner-puppeteer": "^0.18.0",
+    "@web/test-runner-commands": "^1.0.0",
+    "@web/test-runner-playwright": "^1.0.0",
+    "@web/test-runner-puppeteer": "^1.0.0",
     "@webcomponents/webcomponentsjs": "^2.8.0",
     "autoprefixer": "^10.4.0",
     "cssnano": "^8.0.0",
@@ -130,5 +130,5 @@
       }
     ]
   },
-  "gitHead": "a1848fc28d503f5f1cea72516f946d9140cd6399"
+  "gitHead": "82f04fbfdb385323883f4f8e3ce97a14865a744a"
 }

package/scss/components/date-picker/date-picker.scss

@@ -184,3 +184,9 @@ $css--plex: true !default;
   .#{$prefix}--date-picker__input--decorator {
   @include ai-gradient;
 }
+
+.#{$prefix}--form-requirement {
+  box-sizing: border-box;
+  inline-size: 0;
+  min-inline-size: 100%;
+}

package/scss/components/date-picker/next/components/date-picker.scss

@@ -0,0 +1,124 @@
+//
+// Copyright IBM Corp. 2026
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use '@carbon/styles/scss/components/date-picker/date-picker' as *;
+@use '@carbon/styles/scss/components/date-picker/date-picker-next' as
+  date-picker-next;
+@use '@carbon/styles/scss/config' as *;
+@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/styles/scss/utilities' as *;
+
+@include date-picker;
+@include date-picker-next.date-picker-next-rules;
+
+// =============================================================================
+// WEB COMPONENTS SPECIFIC STYLES
+// These styles add :host() selectors and ::slotted() for shadow DOM
+// =============================================================================
+
+:host(#{$prefix}-preview-date-picker) {
+  @extend .#{$prefix}--date-picker;
+
+  position: relative;
+}
+
+:host(#{$prefix}-preview-date-picker-input),
+:host(#{$prefix}-preview-date-picker-input-skeleton) {
+  @extend .#{$prefix}--date-picker-container;
+}
+
+:host(#{$prefix}-preview-date-picker-input[warn]:not([invalid])) {
+  @extend .#{$prefix}--date-picker-container--warn;
+}
+
+:host(#{$prefix}-preview-date-picker-input[kind='simple']),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='simple']) {
+  @extend .#{$prefix}--date-picker-container--simple;
+}
+
+:host(#{$prefix}-preview-date-picker-input[kind='simple'][short]),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='simple'][short]) {
+  @extend .#{$prefix}--date-picker-container--simple;
+  @extend .#{$prefix}--date-picker-container--short;
+}
+
+:host(#{$prefix}-preview-date-picker-input[kind='single']),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='single']) {
+  @extend .#{$prefix}--date-picker-container--single;
+}
+
+:host(#{$prefix}-preview-date-picker-input[kind='from']),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='from']) {
+  @extend .#{$prefix}--date-picker-container--from;
+}
+
+:host(#{$prefix}-preview-date-picker-input[kind='from']),
+:host(#{$prefix}-preview-date-picker-input[kind='to']),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='from']),
+:host(#{$prefix}-preview-date-picker-input-skeleton[kind='to']) {
+  @extend .#{$prefix}--date-picker-container--from;
+}
+
+:host(#{$prefix}-preview-date-picker-input) {
+  .#{$prefix}--date-picker__icon {
+    @extend .#{$prefix}--date-picker__icon;
+  }
+
+  .#{$prefix}--date-picker__icon--warn {
+    @extend .#{$prefix}--date-picker__icon--warn;
+  }
+
+  .#{$prefix}--date-picker__icon--invalid {
+    @extend .#{$prefix}--date-picker__icon--invalid;
+  }
+
+  // Shadow DOM slotted content
+  ::slotted(#{$prefix}-ai-label),
+  ::slotted(#{$prefix}-slug) {
+    position: absolute;
+    inset-block-start: 50%;
+    inset-inline-end: $spacing-08;
+  }
+
+  ::slotted(#{$prefix}-ai-label:not([revert-active])),
+  ::slotted(#{$prefix}-slug:not([revert-active])) {
+    transform: translateY(-50%);
+  }
+}
+
+:host(#{$prefix}-preview-date-picker-input-skeleton) {
+  @extend .#{$prefix}--date-picker-input-skeleton;
+}
+
+:host(#{$prefix}-preview-date-picker-input-skeleton[range]) {
+  @extend .#{$prefix}--date-picker-input-skeleton--range;
+}
+
+:host(#{$prefix}-preview-date-picker-input[ai-label]) {
+  @extend .#{$prefix}--date-picker-container--ai-label;
+}
+
+// Calendar component in shadow DOM
+:host(#{$prefix}-preview-date-picker-calendar) {
+  display: block;
+  outline: none;
+
+  .#{$prefix}--date-picker__calendar {
+    // Override shared styles for Web Components
+    // Use box-sizing to include padding in width calculation
+    // This ensures the 288px includes the padding, making the content area 272px
+    box-sizing: border-box;
+    inline-size: rem(288px);
+    max-inline-size: rem(288px);
+  }
+
+  .#{$prefix}--date-picker__day,
+  .#{$prefix}--date-picker__month-nav {
+    font-family: inherit;
+  }
+}

package/scss/components/fluid-date-picker/fluid-date-picker.scss

@@ -0,0 +1,282 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+$css--plex: true !default;
+
+@use '@carbon/styles/scss/config' as *;
+@use '@carbon/styles/scss/theme' as *;
+@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/layout' as *;
+@use '@carbon/styles/scss/utilities/convert';
+@use '@carbon/styles/scss/utilities/skeleton' as *;
+@use '@carbon/styles/scss/components/fluid-date-picker' as *;
+@use '@carbon/styles/scss/components/date-picker/index';
+@use '@carbon/styles/scss/utilities/focus-outline' as *;
+
+// ── Fluid date picker (wrapper) ──────────────────────────────────────────────
+
+:host(#{$prefix}-fluid-date-picker) {
+  @extend .#{$prefix}--date-picker--fluid;
+  @include emit-layout-tokens();
+
+  display: inline-flex;
+  inline-size: fit-content;
+  max-inline-size: 100%;
+
+  #floating-menu-container {
+    position: absolute;
+    inline-size: 100%;
+  }
+
+  .#{$prefix}--date-picker__calendar.open {
+    margin-block-start: 0;
+  }
+
+  .flatpickr-next-month,
+  .flatpickr-prev-month {
+    svg {
+      transform: rotate(0) #{'/*rtl:rotate(180deg)*/'};
+    }
+  }
+
+  .#{$prefix}--date-picker__day.flatpickr-disabled,
+  .flatpickr-day.flatpickr-disabled {
+    color: $layer-selected-inverse;
+    cursor: not-allowed;
+    opacity: 0.5;
+
+    &:hover {
+      background: transparent;
+    }
+  }
+
+  .flatpickr-next-month.flatpickr-disabled,
+  .flatpickr-prev-month.flatpickr-disabled {
+    svg {
+      cursor: not-allowed;
+      fill: $layer-selected-inverse;
+      opacity: 0.5;
+    }
+
+    &:hover {
+      svg {
+        fill: $layer-selected-inverse;
+      }
+    }
+  }
+}
+
+:host(#{$prefix}-fluid-date-picker[invalid]) {
+  @extend .#{$prefix}--date-picker--fluid--invalid;
+}
+
+:host(#{$prefix}-fluid-date-picker[warn]:not([invalid])) {
+  @extend .#{$prefix}--date-picker--fluid--warn;
+}
+
+:host(#{$prefix}-fluid-date-picker[readonly]) {
+  @extend .#{$prefix}--date-picker--fluid--readonly;
+}
+
+// ── Fluid date picker input ──────────────────────────────────────────────────
+
+:host(#{$prefix}-fluid-date-picker-input) {
+  position: relative;
+  display: block;
+  box-sizing: border-box;
+  background: $field;
+  block-size: convert.to-rem(64px);
+  border-block-end: 1px solid $border-strong;
+  inline-size: 100%;
+  max-inline-size: 100%;
+  outline: none;
+}
+
+:host(#{$prefix}-fluid-date-picker-input[disabled]),
+:host(#{$prefix}-fluid-date-picker-input[readonly]) {
+  border-block-end: 1px solid $border-subtle;
+}
+
+// When invalid or warn, allow host to grow beyond 64px for error message
+:host(
+    #{$prefix}-fluid-date-picker-input[invalid]:not([disabled]):not([readonly])
+  ),
+:host(
+    #{$prefix}-fluid-date-picker-input[warn]:not([invalid]):not([disabled]):not(
+        [readonly]
+      )
+  ) {
+  block-size: auto;
+  border-block-end: none;
+  min-block-size: convert.to-rem(64px);
+}
+
+// Divider between input area and error/warn message
+:host(#{$prefix}-fluid-date-picker-input) .#{$prefix}--date-picker__divider {
+  border-style: solid;
+  border-color: $border-subtle;
+  margin: 0 1rem;
+  border-block-end: none;
+  inline-size: calc(100% - 2rem);
+}
+
+// Hide divider when disabled or readonly
+:host(#{$prefix}-fluid-date-picker-input[disabled])
+  .#{$prefix}--date-picker__divider,
+:host(#{$prefix}-fluid-date-picker-input[readonly])
+  .#{$prefix}--date-picker__divider {
+  display: none;
+}
+
+// Error / warn message padding
+:host(
+    #{$prefix}-fluid-date-picker-input[invalid]:not([disabled]):not([readonly])
+  )
+  .#{$prefix}--form-requirement,
+:host(
+    #{$prefix}-fluid-date-picker-input[warn]:not([invalid]):not([disabled]):not(
+        [readonly]
+      )
+  )
+  .#{$prefix}--form-requirement {
+  padding: $spacing-03 convert.to-rem(40px) $spacing-03 $spacing-05;
+  margin: 0;
+}
+
+// Hide form requirement when disabled or readonly
+:host(#{$prefix}-fluid-date-picker-input[disabled])
+  .#{$prefix}--form-requirement,
+:host(#{$prefix}-fluid-date-picker-input[readonly])
+  .#{$prefix}--form-requirement {
+  display: none;
+}
+
+:host(#{$prefix}-fluid-date-picker-input[warn]:not([invalid])) {
+  .#{$prefix}--form-requirement {
+    color: $text-primary;
+  }
+}
+
+:host(#{$prefix}-fluid-date-picker-input[kind='single']) {
+  max-inline-size: convert.to-rem(288px);
+
+  .#{$prefix}--date-picker__input {
+    inline-size: convert.to-rem(288px);
+  }
+}
+
+:host(#{$prefix}-fluid-date-picker-input[kind='from']),
+:host(#{$prefix}-fluid-date-picker-input[kind='to']) {
+  inline-size: convert.to-rem(143.5px);
+
+  .#{$prefix}--date-picker__input {
+    inline-size: convert.to-rem(143.5px);
+  }
+}
+
+:host(#{$prefix}-fluid-date-picker-input[kind='to']) {
+  border-inline-start: 1px solid $border-strong;
+}
+
+:host(#{$prefix}-fluid-date-picker-input[kind='to'][disabled]),
+:host(#{$prefix}-fluid-date-picker-input[kind='to'][readonly]) {
+  border-inline-start: 1px solid $border-subtle;
+}
+
+:host(
+    #{$prefix}-fluid-date-picker-input[invalid]:not([disabled]):not([readonly])
+  ) {
+  @extend .#{$prefix}--date-picker--fluid--invalid;
+  @include focus-outline('invalid');
+}
+
+:host(#{$prefix}-fluid-date-picker-input[warn]:not([invalid])) {
+  @extend .#{$prefix}--date-picker--fluid--warn;
+}
+
+:host(#{$prefix}-fluid-date-picker-input[readonly]) {
+  @extend .#{$prefix}--date-picker--fluid--readonly;
+}
+
+:host(#{$prefix}-fluid-date-picker-input) .#{$prefix}--label {
+  position: absolute;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  margin: 0;
+  block-size: convert.to-rem(16px);
+  inline-size: calc(100% - 2rem);
+  inset-block-start: convert.to-rem(13px);
+  inset-inline-start: $spacing-05;
+}
+
+:host(#{$prefix}-fluid-date-picker-input) .#{$prefix}--date-picker__input {
+  border: none;
+  background: transparent;
+  block-size: calc(100% - #{convert.to-rem(1px)});
+  inline-size: 100%;
+  max-inline-size: 100%;
+  outline: none;
+  padding-block-end: convert.to-rem(13px);
+  padding-block-start: convert.to-rem(32px);
+  padding-inline: $spacing-05;
+
+  &:focus {
+    @include focus-outline('outline');
+  }
+}
+
+// Push the calendar icon down to account for the floating label above the input value
+:host(#{$prefix}-fluid-date-picker-input) .#{$prefix}--date-picker__icon {
+  inset-block-start: convert.to-rem(43px);
+}
+
+:host(#{$prefix}-fluid-date-picker-input[invalid])
+  .#{$prefix}--date-picker__icon--invalid,
+:host(#{$prefix}-fluid-date-picker-input[warn]:not([invalid]))
+  .#{$prefix}--date-picker__icon--warn {
+  inset-block-start: convert.to-rem(80px);
+}
+
+:host(#{$prefix}-fluid-date-picker-input[invalid])
+  .#{$prefix}--date-picker__icon:not(.#{$prefix}--date-picker__icon--invalid),
+:host(#{$prefix}-fluid-date-picker-input[warn]:not([invalid]))
+  .#{$prefix}--date-picker__icon:not(.#{$prefix}--date-picker__icon--warn) {
+  display: block;
+}
+
+:host(#{$prefix}-fluid-date-picker-input[kind='simple'][invalid])
+  .#{$prefix}--date-picker__icon--invalid,
+:host(#{$prefix}-fluid-date-picker-input[kind='simple'][warn]:not([invalid]))
+  .#{$prefix}--date-picker__icon--warn {
+  display: block;
+}
+
+// ── Fluid date picker skeleton ───────────────────────────────────────────────
+
+:host(#{$prefix}-fluid-date-picker-skeleton) {
+  @extend .#{$prefix}--date-picker--fluid__skeleton;
+
+  display: block;
+}
+
+.#{$prefix}--skeleton {
+  &::before {
+    position: absolute;
+    animation: 3000ms ease-in-out #{$prefix}--skeleton infinite;
+    background: $skeleton-element;
+    block-size: 100%;
+    content: '';
+    inline-size: 100%;
+    inset-inline-start: 0;
+    will-change: transform-origin, transform, opacity;
+
+    @media (prefers-reduced-motion: reduce) {
+      animation: none;
+    }
+  }
+}