@lax-wp/design-system 0.3.57 → 0.3.59

package/dist/components/forms/creatable-select/CreatableSelect.d.ts

@@ -1,5 +1,6 @@
-import type { GroupBase, SingleValue, MultiValue, ActionMeta, Props as ReactSelectProps, SelectInstance } from "react-select";
-import type { components } from "react-select";
+import CreatableSelect from "react-select/creatable";
+import type { LabelType } from "../../data-display/label/Label";
+import type { ComponentProps } from "react";
 /**
  * Option type for the CreatableSelect component
  */
@@ -14,67 +15,58 @@ export interface SelectOption {
     data?: Record<string, unknown>;
 }
 /**
- * Props for the CreatableSelect component
+ * Props for the CreatableSelectField component
+ * Matches the lax-web-portal implementation for drop-in replacement
  */
-export interface CreatableSelectProps {
+export type TProps = {
     /** Unique identifier for the select */
     id: string;
     /** Label text to display above the select */
-    label?: string;
+    label: string;
     /** Placeholder text for the select */
     placeholder?: string;
     /** Current value for single select */
-    value?: SelectOption | null;
-    /** Current values for multi select */
-    selectedValues?: SelectOption[];
+    value?: any;
     /** Callback function called when selection changes */
-    onChange: (value: SingleValue<SelectOption> | MultiValue<SelectOption>, actionMeta: ActionMeta<SelectOption>) => void;
-    /** Callback function called when selection changes (legacy) */
-    onColorChange?: (data: SelectOption | SelectOption[] | null) => void;
+    onChange(data: any): void;
+    /** Error message to display below the select */
+    errorMessage?: string;
     /** Array of available options */
-    selectOptions: SelectOption[];
+    selectOptions: any[];
     /** Whether the select is in loading state */
     loading?: boolean;
     /** Whether multiple selections are allowed */
     multiSelect?: boolean;
+    /** Current values for multi select */
+    selectedValues?: any[];
+    /** Custom filter function for options */
+    filterOption?: any;
+    /** Whether to preserve original case in the label */
+    originalCase?: boolean;
     /** Whether the select is disabled */
     disabled?: boolean;
     /** Whether the select is clearable */
     isClearable?: boolean;
     /** Whether the field is required */
     required?: boolean;
-    /** Message to display below the select */
-    message?: string;
-    /** Type of message to display */
-    messageType?: "success" | "error" | "info" | "default";
-    /** Whether to preserve original case in the label */
-    originalCase?: boolean;
-    /** Additional CSS classes for the wrapper container */
-    wrapperClassName?: string;
-    /** Additional CSS classes for the select */
-    selectClassName?: string;
-    /** Additional CSS classes for the label */
-    labelClassName?: string;
-    /** Help text to display below the label */
-    helpText?: string;
-    /** Size variant for the select */
-    size?: "small" | "medium" | "large";
-    /** Custom filter function for options */
-    filterOption?: ReactSelectProps<SelectOption, boolean, GroupBase<SelectOption>>["filterOption"];
-    /** Additional props to pass to the react-select component */
-    selectProps?: Partial<ReactSelectProps<SelectOption, boolean, GroupBase<SelectOption>>>;
-    /** Custom components to override defaults */
-    components?: Partial<typeof components>;
-    /** Array of tags for categorization */
-    tags?: string[];
-    /** Tooltip text */
+    /** Tags/labels to display next to the label */
+    tags?: (string | LabelType)[];
+    /** Tooltip text for the help icon */
     tooltip?: string;
-}
+    /** Additional CSS classes for the wrapper */
+    className?: string;
+    /** Whether the component is in dark mode */
+    isDarkMode?: boolean;
+};
+export type CreatableSelectProps = TProps & ComponentProps<typeof CreatableSelect>;
 /**
- * A highly customizable creatable select component with label, validation, and styling support.
+ * A creatable select component with label, validation, and styling support.
  * Features dark mode support, accessibility enhancements, and comprehensive prop support.
  * Built on top of react-select/creatable for advanced functionality.
  *
+ * This component is designed as a drop-in replacement for the lax-web-portal
+ * CreatableSelectField component.
+ *
  * @example
  * ```tsx
  * <CreatableSelectField
@@ -88,5 +80,7 @@ export interface CreatableSelectProps {
  * />
  * ```
  */
-export declare const CreatableSelectField: import("react").ForwardRefExoticComponent<CreatableSelectProps & import("react").RefAttributes<SelectInstance<SelectOption, boolean, GroupBase<SelectOption>>>>;
-export type TProps = CreatableSelectProps;
+export declare const CreatableSelectField: {
+    ({ id, label, errorMessage, selectOptions, loading, isClearable, multiSelect, selectedValues, disabled, required, value, className, tooltip, tags, originalCase, onChange, filterOption, placeholder, isDarkMode, ...props }: TProps & ComponentProps<typeof CreatableSelect>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};