@wix/editor-react-components 1.2885.0 → 1.2887.0

package/dist/site/components/Combobox/Combobox.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { ComboboxProps } from './Combobox.types';
+export default function Combobox({ className, direction, disabled, elementProps, errorMessage, helperText, id, label, onValueChange, options, placeholder, previewError, previewList, readOnly, value, wix, ...rest }: ComboboxProps): React.JSX.Element;

package/dist/site/components/{Dropdown/Dropdown.types.d.ts → Combobox/Combobox.types.d.ts}

@@ -1,11 +1,11 @@
 import { Direction } from '@wix/editor-react-types';
-export type DropdownOption = {
+export type ComboboxOption = {
     /** Text shown to the visitor in the list. */
     label: string;
     /** Underlying value emitted when the option is selected. */
     value: string;
 };
-export type DropdownElementProps = {
+export type ComboboxElementProps = {
     label?: {
         className?: string;
     };
@@ -25,13 +25,13 @@ export type DropdownElementProps = {
         className?: string;
     };
 };
-export type DropdownProps = {
-    /** DOM `id` on the root `.dropdown` wrapper. */
+export type ComboboxProps = {
+    /** DOM `id` on the root `.combobox` wrapper. */
     id: string;
-    /** Appended to the root `.dropdown`. Use this for CSS-variable and per-element overrides. */
+    /** Appended to the root `.combobox`. Use this for CSS-variable and per-element overrides. */
     className: string;
     /** The selectable options (static from the editor or from a bound data source). */
-    options?: Array<DropdownOption>;
+    options?: Array<ComboboxOption>;
     /** The current selection: a value string. `undefined` means no selection. */
     value?: string;
     /** Fires with the value of the newly selected option. */
@@ -49,7 +49,7 @@ export type DropdownProps = {
      * `undefined` or empty string hides the message and clears the error state.
      */
     errorMessage?: string;
-    /** Disables interaction with the dropdown. */
+    /** Disables interaction with the combobox. */
     disabled?: boolean;
     /** Preview-only: forces the option list open while the List part is being designed. */
     previewList?: boolean;
@@ -58,7 +58,7 @@ export type DropdownProps = {
     /** Writing direction applied to the root. */
     direction?: Direction;
     /** Per-element className overrides. Keys match the manifest element keys. */
-    elementProps?: DropdownElementProps;
+    elementProps?: ComboboxElementProps;
     /** Platform-provided props. */
     wix?: {
         /** Spread on the preset wrapper. */

package/dist/site/components/Combobox/component.d.ts

@@ -0,0 +1,2 @@
+import { default as Combobox } from './Combobox';
+export default Combobox;

package/dist/site/components/{Dropdown → Combobox}/component.js

@@ -1,28 +1,28 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { c as clsx } from "../chunks/clsx.js";
-import { F as Field, C as Combobox } from "../chunks/index13.js";
+import { F as Field, C as Combobox$1 } from "../chunks/index13.js";
 import { useService } from "@wix/services-manager-react";
 import { u as useCurrentLanguage } from "../chunks/useCurrentLanguage.js";
 import { T as TranslationsDefinition } from "../chunks/index4.js";
 import { a as getDataAttributes } from "../chunks/dataUtils.js";
 import { d as directionStyles } from "../chunks/direction.module.js";
 import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
-import { A as AriaLabels, T as TestIds, e as editorElementClassNames, D as DesignStates } from "../chunks/constants36.js";
-const root = "root__WnTks";
-const input = "input__pbp9w";
-const option = "option__QJeiF";
-const optionLabel = "optionLabel__pBY1S";
-const select = "select__Lo-N7";
-const errorMessage = "errorMessage__iMuAa";
-const label = "label__Q7fZH";
-const helperText = "helperText__M9s0b";
-const positioner = "positioner__YS--m";
-const popup = "popup__GQi1e";
-const list = "list__DruZL";
-const value = "value__pqgtJ";
-const placeholder = "placeholder__qfcAb";
-const arrow = "arrow__Q2E2Y";
+import { A as AriaLabels, T as TestIds, e as editorElementClassNames, D as DesignStates } from "../chunks/constants37.js";
+const root = "root__x-u7O";
+const input = "input__Lq-U0";
+const option = "option__ocFV-";
+const optionLabel = "optionLabel__65M8K";
+const select = "select__eDSgT";
+const errorMessage = "errorMessage__XruRw";
+const label = "label__enEWb";
+const helperText = "helperText__IU0s7";
+const positioner = "positioner__Diaau";
+const popup = "popup__anCjX";
+const list = "list__H5yAH";
+const value = "value__2dHYG";
+const placeholder = "placeholder__H5Pm3";
+const arrow = "arrow__AHeTc";
 const styles = {
   root,
   input,
@@ -41,7 +41,7 @@ const styles = {
 };
 const itemToStringLabel = (item) => (item == null ? void 0 : item.label) ?? "";
 const itemToStringValue = (item) => (item == null ? void 0 : item.value) ?? "";
-function Dropdown({
+function Combobox({
   className,
   direction,
   disabled,
@@ -104,7 +104,7 @@ function Dropdown({
           ...getDataAttributes(rest),
           children: /* @__PURE__ */ jsxs(Field.Root, { className: styles.select, invalid: inErrorState, children: [
             /* @__PURE__ */ jsxs(
-              Combobox.Root,
+              Combobox$1.Root,
               {
                 disabled: disabled || !(options == null ? void 0 : options.length),
                 id: comboboxId,
@@ -118,7 +118,7 @@ function Dropdown({
                 value: selectedOption ?? null,
                 children: [
                   label2 && /* @__PURE__ */ jsx(
-                    Combobox.Label,
+                    Combobox$1.Label,
                     {
                       className: clsx(
                         styles.label,
@@ -130,7 +130,7 @@ function Dropdown({
                     }
                   ),
                   /* @__PURE__ */ jsxs(
-                    Combobox.Trigger,
+                    Combobox$1.Trigger,
                     {
                       "aria-describedby": describedBy,
                       "aria-haspopup": "listbox",
@@ -151,7 +151,7 @@ function Dropdown({
                       ),
                       "data-testid": TestIds.input,
                       children: [
-                        /* @__PURE__ */ jsx(Combobox.Value, { children: /* @__PURE__ */ jsx(
+                        /* @__PURE__ */ jsx(Combobox$1.Value, { children: /* @__PURE__ */ jsx(
                           "span",
                           {
                             className: clsx(
@@ -165,48 +165,55 @@ function Dropdown({
                       ]
                     }
                   ),
-                  /* @__PURE__ */ jsx(Combobox.Portal, { container: popoverContainer, children: /* @__PURE__ */ jsx(Combobox.Positioner, { className: styles.positioner, sideOffset: 4, children: /* @__PURE__ */ jsx(
-                    Combobox.Popup,
+                  /* @__PURE__ */ jsx(Combobox$1.Portal, { container: popoverContainer, children: /* @__PURE__ */ jsx(
+                    Combobox$1.Positioner,
                     {
-                      role: "presentation",
-                      className: clsx(
-                        styles.popup,
-                        editorElementClassNames.list,
-                        (_c = elementProps == null ? void 0 : elementProps.list) == null ? void 0 : _c.className
-                      ),
-                      "data-testid": TestIds.list,
+                      className: styles.positioner,
+                      sideOffset: 4,
                       children: /* @__PURE__ */ jsx(
-                        Combobox.List,
+                        Combobox$1.Popup,
                         {
-                          "aria-label": ariaLabel,
-                          "aria-labelledby": label2 ? `${comboboxId}-label` : void 0,
-                          className: styles.list,
-                          children: options == null ? void 0 : options.map((option2, index) => {
-                            var _a2;
-                            return /* @__PURE__ */ jsx(
-                              Combobox.Item,
-                              {
-                                className: clsx(
-                                  styles.option,
-                                  editorElementClassNames.option,
-                                  (_a2 = elementProps == null ? void 0 : elementProps.option) == null ? void 0 : _a2.className,
-                                  // No native pseudo-class exists for "selected" (see
-                                  // the manifest's `option.states.selected` comment)
-                                  // — applied for real here so the panel's per-state
-                                  // export has a real selector to bind to, not just
-                                  // the editor's own design-preview injection.
-                                  option2 === selectedOption ? DesignStates.option.selected.className : void 0
-                                ),
-                                value: option2,
-                                children: /* @__PURE__ */ jsx("span", { className: styles.optionLabel, children: option2.label })
-                              },
-                              `option-${index}`
-                            );
-                          })
+                          role: "presentation",
+                          className: clsx(
+                            styles.popup,
+                            editorElementClassNames.list,
+                            (_c = elementProps == null ? void 0 : elementProps.list) == null ? void 0 : _c.className
+                          ),
+                          "data-testid": TestIds.list,
+                          children: /* @__PURE__ */ jsx(
+                            Combobox$1.List,
+                            {
+                              "aria-label": ariaLabel,
+                              "aria-labelledby": label2 ? `${comboboxId}-label` : void 0,
+                              className: styles.list,
+                              children: options == null ? void 0 : options.map((option2, index) => {
+                                var _a2;
+                                return /* @__PURE__ */ jsx(
+                                  Combobox$1.Item,
+                                  {
+                                    className: clsx(
+                                      styles.option,
+                                      editorElementClassNames.option,
+                                      (_a2 = elementProps == null ? void 0 : elementProps.option) == null ? void 0 : _a2.className,
+                                      // No native pseudo-class exists for "selected" (see
+                                      // the manifest's `option.states.selected` comment)
+                                      // — applied for real here so the panel's per-state
+                                      // export has a real selector to bind to, not just
+                                      // the editor's own design-preview injection.
+                                      option2 === selectedOption ? DesignStates.option.selected.className : void 0
+                                    ),
+                                    value: option2,
+                                    children: /* @__PURE__ */ jsx("span", { className: styles.optionLabel, children: option2.label })
+                                  },
+                                  `option-${index}`
+                                );
+                              })
+                            }
+                          )
                         }
                       )
                     }
-                  ) }) })
+                  ) })
                 ]
               }
             ),
@@ -245,5 +252,5 @@ function Dropdown({
   );
 }
 export {
-  Dropdown as default
+  Combobox as default
 };

package/dist/site/components/{Dropdown → Combobox}/constants.d.ts

@@ -1,31 +1,31 @@
-export declare const COMPONENT_TYPE = "wixEditorElements.Dropdown__DEV__v6";
+export declare const COMPONENT_TYPE = "wixEditorElements.Combobox";
 export declare const DesignStates: {
     readonly input: {
         readonly hover: {
             readonly displayName: "Hover";
-            readonly className: "dropdown__input--hover";
+            readonly className: "combobox__input--hover";
         };
         readonly focus: {
             readonly displayName: "Focus";
-            readonly className: "dropdown__input--focus";
+            readonly className: "combobox__input--focus";
         };
         readonly error: {
             readonly displayName: "Error";
-            readonly className: "dropdown__input--error";
+            readonly className: "combobox__input--error";
         };
         readonly disabled: {
             readonly displayName: "Disabled";
-            readonly className: "dropdown__input--disabled";
+            readonly className: "combobox__input--disabled";
         };
     };
     readonly option: {
         readonly hover: {
             readonly displayName: "Hover";
-            readonly className: "dropdown__option--hover";
+            readonly className: "combobox__option--hover";
         };
         readonly selected: {
             readonly displayName: "Selected";
-            readonly className: "dropdown__option--selected";
+            readonly className: "combobox__option--selected";
         };
     };
 };
@@ -66,7 +66,7 @@ export declare const DisplayNames: {
             errorMessage: string;
         };
         presets: {
-            baseDropdown: string;
+            baseCombobox: string;
         };
         displayGroups: {
             optionsGroup: string;
@@ -74,21 +74,21 @@ export declare const DisplayNames: {
     };
 };
 export declare const TestIds: {
-    readonly root: "dropdown-root";
-    readonly label: "dropdown-label";
-    readonly input: "dropdown-input";
-    readonly list: "dropdown-list";
-    readonly helperText: "dropdown-helper-text";
-    readonly errorMessage: "dropdown-error-message";
+    readonly root: "combobox-root";
+    readonly label: "combobox-label";
+    readonly input: "combobox-input";
+    readonly list: "combobox-list";
+    readonly helperText: "combobox-helper-text";
+    readonly errorMessage: "combobox-error-message";
 };
 export declare const editorElementClassNames: {
-    readonly root: "dropdown";
-    readonly label: "dropdown-label";
-    readonly input: "dropdown-input";
-    readonly list: "dropdown-list";
-    readonly option: "dropdown-option";
-    readonly helperText: "dropdown-helper-text";
-    readonly errorMessage: "dropdown-error-message";
+    readonly root: "combobox";
+    readonly label: "combobox-label";
+    readonly input: "combobox-input";
+    readonly list: "combobox-list";
+    readonly option: "combobox-option";
+    readonly helperText: "combobox-helper-text";
+    readonly errorMessage: "combobox-error-message";
 };
 export declare const AriaLabels: {
     readonly root: {

package/dist/site/components/{Dropdown → Combobox}/css.css

@@ -1,11 +1,11 @@
-.root__WnTks {
+.root__x-u7O {
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   min-width: max-content !important;
   max-width: 100%;
 }
-.root__WnTks .input__pbp9w {
+.root__x-u7O .input__Lq-U0 {
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -15,41 +15,41 @@
   cursor: pointer;
   height: auto;
 }
-#SITE_CONTAINER.focus-ring-active.keyboard-tabbing-on .root__WnTks .input__pbp9w:focus {
+#SITE_CONTAINER.focus-ring-active.keyboard-tabbing-on .root__x-u7O .input__Lq-U0:focus {
   outline: 2px solid #116dff;
   outline-offset: 1px;
   box-shadow: 0 0 1px 2px #ffffff;
 }
 @media (forced-colors: active) {
-  .root__WnTks .input__pbp9w:focus {
+  .root__x-u7O .input__Lq-U0:focus {
     outline: 3px solid Highlight !important;
     outline-offset: 1px !important;
     box-shadow: none;
   }
 }
-.root__WnTks .input__pbp9w:disabled, .root__WnTks .input__pbp9w.dropdown__input--disabled {
+.root__x-u7O .input__Lq-U0:disabled, .root__x-u7O .input__Lq-U0.combobox__input--disabled {
   cursor: not-allowed;
 }
-.root__WnTks .option__QJeiF {
+.root__x-u7O .option__ocFV- {
   display: flex;
   align-items: center;
   gap: 8px;
   cursor: pointer;
 }
-#SITE_CONTAINER.focus-ring-active.keyboard-tabbing-on .root__WnTks .option__QJeiF[data-highlighted] {
+#SITE_CONTAINER.focus-ring-active.keyboard-tabbing-on .root__x-u7O .option__ocFV-[data-highlighted] {
   outline: 2px solid #116dff;
   outline-offset: 1px;
   box-shadow: 0 0 1px 2px #ffffff;
   outline-offset: -2px;
 }
 @media (forced-colors: active) {
-  .root__WnTks .option__QJeiF[data-highlighted] {
+  .root__x-u7O .option__ocFV-[data-highlighted] {
     outline: 3px solid Highlight !important;
     outline-offset: -3px !important;
     box-shadow: none;
   }
 }
-.root__WnTks .option__QJeiF .optionLabel__pBY1S {
+.root__x-u7O .option__ocFV- .optionLabel__65M8K {
   flex: 1;
   min-width: 100px;
   min-height: 1lh;
@@ -59,37 +59,37 @@
   font: inherit;
 }
 
-.select__Lo-N7 {
+.select__eDSgT {
   flex: 1;
   display: flex;
   flex-direction: column;
 }
 
-.errorMessage__iMuAa {
+.errorMessage__XruRw {
   contain: inline-size;
   overflow-wrap: anywhere;
 }
-.errorMessage__iMuAa svg {
+.errorMessage__XruRw svg {
   display: none;
 }
 
-.label__Q7fZH,
-.helperText__M9s0b {
+.label__enEWb,
+.helperText__IU0s7 {
   contain: inline-size;
   overflow-wrap: anywhere;
 }
 
-.positioner__YS--m {
+.positioner__Diaau {
   width: var(--anchor-width);
   z-index: 100;
 }
 
-.popup__GQi1e {
+.popup__anCjX {
   box-sizing: border-box;
   overflow: hidden;
 }
 
-.list__DruZL {
+.list__H5yAH {
   display: flex;
   flex-direction: column;
   max-height: 300px;
@@ -97,7 +97,7 @@
   row-gap: var(--optionsGap);
 }
 
-.value__pqgtJ {
+.value__2dHYG {
   contain: inline-size;
   flex: 1;
   min-width: 100px;
@@ -110,11 +110,11 @@
   text-overflow: ellipsis;
 }
 
-.placeholder__qfcAb {
+.placeholder__H5Pm3 {
   color: var(--placeholderColor);
 }
 
-.arrow__Q2E2Y {
+.arrow__AHeTc {
   flex: none;
   width: 0;
   height: 0;

package/dist/site/components/Combobox/index.d.ts

@@ -0,0 +1,2 @@
+export * from './component';
+export { default, default as Combobox } from './component';

package/dist/site/components/Combobox/index.js

@@ -0,0 +1,6 @@
+'use client';
+
+import Combobox from './component.js';
+
+export { Combobox };
+export default Combobox;

package/dist/site/components/{Dropdown → Combobox}/manifest.js

@@ -1,11 +1,11 @@
 import { b as DISPLAY_GROUPS, D as DATA, E as ELEMENTS, N as NativeStateType, C as CSS_PROPERTIES, a as ACTIONS, L as LAYOUT, A as Archetype } from "../chunks/chunk-LDITHLYN.js";
-import { a as DisplayNames, F as FunctionalStateKeys, e as editorElementClassNames, D as DesignStates, C as COMPONENT_TYPE } from "../chunks/constants36.js";
+import { a as DisplayNames, F as FunctionalStateKeys, e as editorElementClassNames, D as DesignStates, C as COMPONENT_TYPE } from "../chunks/constants37.js";
 import { T as TEXT_PROP_STATIC_VALUE_MAX_LENGTH } from "../chunks/manifest.js";
-const basePresetName = "baseDropdown";
+const basePresetName = "baseCombobox";
 const manifest = {
-  id: "550ebc8b-39bc-4b95-a76e-57d3b0350a0e",
+  id: "f21254cf-5b14-4d26-8393-38a44c88864c",
   type: COMPONENT_TYPE,
-  description: "A single-select dropdown input. Visitors pick a value from a list of options. Options can be set statically or fed dynamically by a connected data source.",
+  description: "A single-select combobox. Visitors pick a value from a list of options. Options can be set statically or fed dynamically by a connected data source.",
   installation: {
     presets: {
       small: basePresetName,
@@ -31,8 +31,8 @@ const manifest = {
     // pre-fills the panel (see AGENTS.md).
     presets: {
       [basePresetName]: {
-        presetCssUrl: `./site/components/Dropdown/presets/${basePresetName}.css`,
-        displayName: DisplayNames.root.presets.baseDropdown,
+        presetCssUrl: `./site/components/Combobox/presets/${basePresetName}.css`,
+        displayName: DisplayNames.root.presets.baseCombobox,
         presetDefaults: {
           elements: {
             label: {
@@ -270,7 +270,7 @@ const manifest = {
             // No native pseudo-class exists for "invalid" (Base UI's
             // Combobox.Trigger doesn't render as a real `<input>`) — this
             // state's export is scoped to this `className` instead, so
-            // Dropdown.tsx applies it for real whenever `inErrorState` is true
+            // Combobox.tsx applies it for real whenever `inErrorState` is true
             // (not just during design preview), same as Option's `selected`.
             error: {
               displayName: DesignStates.input.error.displayName,
@@ -364,7 +364,7 @@ const manifest = {
             },
             // No native pseudo-class exists for "selected list item" — the
             // panel's export for this state is scoped to this `className`
-            // instead, so Dropdown.tsx applies it for real whenever an
+            // instead, so Combobox.tsx applies it for real whenever an
             // option is actually selected (not just during design preview).
             selected: {
               displayName: DesignStates.option.selected.displayName,
@@ -546,7 +546,8 @@ const manifest = {
   },
   resources: {
     client: {
-      componentUrl: "./site/components/Dropdown/component.tsx",
+      componentUrl: "./site/components/Combobox/component.tsx",
+      moduleSpecifier: "@wix/editor-react-components/Combobox",
       dependencies: {
         serviceDependencies: [
           "@wix/site-service-locale",
@@ -558,8 +559,8 @@ const manifest = {
   },
   moduleConfiguration: {
     package: { name: "@wix/editor-react-components", version: "^1.0.0" },
-    component: { path: "Dropdown" },
-    cssFile: { path: "Dropdown/css" }
+    component: { path: "Combobox" },
+    cssFile: { path: "Combobox/css" }
   }
 };
 export {

package/dist/site/components/DatePicker/component.js

@@ -17,7 +17,7 @@ import { T as TranslationsDefinition } from "../chunks/index4.js";
 import { a as getDataAttributes } from "../chunks/dataUtils.js";
 import { d as directionStyles } from "../chunks/direction.module.js";
 import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
-import { T as TestIds, s as selectors, D as DesignStates, A as ARIA_LABEL_NAMESPACE, d as defaultValues, a as AriaLabels } from "../chunks/constants37.js";
+import { T as TestIds, s as selectors, D as DesignStates, A as ARIA_LABEL_NAMESPACE, d as defaultValues, a as AriaLabels } from "../chunks/constants36.js";
 createContext(null);
 createContext(null);
 createContext(null);
@@ -4243,7 +4243,7 @@ const DatePickerCalendar = ({
     //
     // react-aria's Popover is only the positioner (it owns inline position,
     // z-index and max-height). The Popover design part is the static box inside
-    // it — the same split as Dropdown's Combobox Positioner/Popup — so the
+    // it — the same split as Combobox's Positioner/Popup — so the
     // design panel's border and padding style a plain element.
     /* @__PURE__ */ jsx(
       $07b14b47974efb58$export$5b6b19405a83ff9d,

package/dist/site/components/DatePicker/constants.d.ts

@@ -1,4 +1,4 @@
-export declare const COMPONENT_TYPE = "wixEditorElements.DatePicker__DEV__v5";
+export declare const COMPONENT_TYPE = "wixEditorElements.DatePicker";
 export declare const DisplayNames: {
     root: {
         elementDisplayName: string;

package/dist/site/components/DatePicker/manifest.js

@@ -1,6 +1,6 @@
 import { D as DomEventType } from "../chunks/types.impl.js";
 import { C as CSS_PROPERTIES, N as NativeStateType, b as DISPLAY_GROUPS, D as DATA, E as ELEMENTS, L as LAYOUT, A as Archetype } from "../chunks/chunk-LDITHLYN.js";
-import { F as FunctionalStateKeys, D as DesignStates, d as defaultValues, b as DisplayNames, c as Descriptions, C as COMPONENT_TYPE, s as selectors } from "../chunks/constants37.js";
+import { F as FunctionalStateKeys, D as DesignStates, d as defaultValues, b as DisplayNames, c as Descriptions, C as COMPONENT_TYPE, s as selectors } from "../chunks/constants36.js";
 import { T as TEXT_PROP_STATIC_VALUE_MAX_LENGTH, g as getSelector } from "../chunks/manifest.js";
 import { a as manifestFocusable } from "../chunks/manifestSdkMixins.js";
 const basePresetName = "baseDatePicker";
@@ -80,7 +80,7 @@ const dateInputCssProperties = {
   ...boxPadding
 };
 const manifest = {
-  id: "d68eb609-66b6-4319-8113-7f6e143986ae",
+  id: "a872e574-e3c4-4b09-bf9d-5e1bea826c9e",
   type: COMPONENT_TYPE,
   description: "A date picker input. Visitors pick a date from a segmented field or a calendar popover. The selected date is a local date and can be connected to a data field.",
   installation: {
@@ -102,7 +102,7 @@ const manifest = {
     selector: getSelector(selectors.root),
     displayName: DisplayNames.root.elementDisplayName,
     archetype: Archetype.DatePicker,
-    // Bare component with one minimal preset (Button's and Dropdown's
+    // Bare component with one minimal preset (Button's and Combobox's
     // structure): the module styles carry layout/behaviour only, this preset
     // gives the default look, and Add Panel templates supply real designs.
     // Part declarations have no defaults; `presetDefaults` mirrors the CSS.
@@ -466,6 +466,7 @@ const manifest = {
   resources: {
     client: {
       componentUrl: "./site/components/DatePicker/component.tsx",
+      moduleSpecifier: "@wix/editor-react-components/DatePicker",
       dependencies: {
         serviceDependencies: [
           "@wix/site-service-locale",

package/dist/site/components/TextField/TextField.d.ts

@@ -0,0 +1,4 @@
+import { ITextFieldProps } from './TextField.types';
+import * as React from 'react';
+declare const TextField: (props: ITextFieldProps) => React.JSX.Element;
+export default TextField;

package/dist/site/components/{TextInput/TextInput.types.d.ts → TextField/TextField.types.d.ts}

@@ -7,7 +7,7 @@ import type * as React from 'react';
  * a class token and delivers it here, so every one of these has to reach the
  * matching DOM node or the state silently does nothing.
  */
-export type TextInputElementProps = {
+export type TextFieldElementProps = {
     label?: {
         className?: string;
     };
@@ -21,18 +21,18 @@ export type TextInputElementProps = {
         className?: string;
     };
 };
-export type ITextInputProps = ITextInputMapperProps & {
+export type ITextFieldProps = ITextFieldMapperProps & {
     id: string;
     autoFocus?: boolean;
     className?: string;
     dataTestId?: string;
     contentRef?: React.Ref<HTMLDivElement>;
-    elementProps?: TextInputElementProps;
+    elementProps?: TextFieldElementProps;
     wix?: {
         presetsWrapperProps?: Record<string, unknown>;
     };
 };
-export type ITextInputMapperProps = SdkFunctionFocusableProps<HTMLInputElement> & SdkFunctionInputableProps<HTMLInputElement> & SdkFunctionKeyboardProps<HTMLInputElement> & {
+export type ITextFieldMapperProps = SdkFunctionFocusableProps<HTMLInputElement> & SdkFunctionInputableProps<HTMLInputElement> & SdkFunctionKeyboardProps<HTMLInputElement> & {
     /** Controlled value. Omission renders an empty input; edits require a parent update. */
     value?: string;
     onValueChange?: (value: string) => void;

package/dist/site/components/TextField/component.d.ts

@@ -0,0 +1 @@
+export { default } from './TextField';