@lax-wp/design-system 0.3.60 → 0.3.62

package/dist/components/forms/debounce-input/DebounceInputField.d.ts

@@ -1,65 +1,51 @@
+import { DebounceInput } from "react-debounce-input";
+import type { LabelType } from "../../data-display/label/Label";
+import type { ComponentProps } from "react";
 /**
  * Props for the DebounceInputField component
+ * Drop-in replacement matching the lax-web-portal API
  */
-export interface DebounceInputFieldProps {
-    /** Unique identifier for the input */
-    id: string;
-    /** Label text to display above the input */
-    label?: string;
+export type DebounceInputFieldProps = ComponentProps<typeof DebounceInput> & {
     /** Current value of the input */
-    value?: string;
+    value: string;
+    /** Callback function called when the input value changes (debounced) */
+    onChange(data: any): void;
+    /** Error message to display */
+    errorMessage: string;
     /** Default value for the input */
     defaultValue?: string;
-    /** Callback function called when value changes (debounced) */
-    onChange: (value: string) => void;
-    /** Callback function called on every keystroke (immediate) */
-    onImmediateChange?: (value: string) => void;
     /** Whether the input is disabled */
     disabled?: boolean;
+    /** Maximum value for number inputs */
+    max?: number;
+    /** Minimum value for number inputs */
+    min?: number;
     /** Whether the field is required */
     required?: boolean;
-    /** Placeholder text for the input */
+    /** Background color class */
+    bg?: string;
+    /** Tags to display with the label */
+    tags?: (string | LabelType)[];
+    /** Text color class */
+    color?: string;
+    /** Unique identifier for the input */
+    id: string;
+    /** Label text for the input */
+    label?: string;
+    /** Input type (text, email, password, number, etc.) */
+    type?: string;
+    /** Placeholder text */
     placeholder?: string;
-    /** Message to display below the input */
-    message?: string;
-    /** Type of message to display */
-    messageType?: "success" | "error" | "info" | "default";
-    /** Additional CSS classes for the wrapper container */
-    wrapperClassName?: string;
-    /** Additional CSS classes for the input */
-    inputClassName?: string;
-    /** Additional CSS classes for the label */
-    labelClassName?: string;
-    /** Help text to display below the label */
-    helpText?: string;
-    /** Size variant for the input */
-    size?: "small" | "medium" | "large";
-    /** Input type */
-    type?: "text" | "email" | "url" | "search" | "tel" | "password";
     /** Debounce timeout in milliseconds */
     debounceTimeout?: number;
-    /** Minimum value for number inputs */
-    min?: number;
-    /** Maximum value for number inputs */
-    max?: number;
-    /** Maximum length for text inputs */
-    maxLength?: number;
-    /** Pattern for input validation */
-    pattern?: string;
-    /** Additional props to pass to the input element */
-    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
-    /** Inline styles for the input element */
-    inputStyle?: React.CSSProperties;
-    /** Callback for key down events */
-    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    /** Callback for focus events */
-    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
-    /** Callback for blur events */
-    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
-}
+    /** Additional CSS classes */
+    className?: string;
+    /** Whether dark mode is enabled (optional - uses CSS dark: classes if not provided) */
+    isDarkMode?: boolean;
+};
 /**
- * A highly customizable debounced input component with label, validation, and styling support.
- * Features configurable debounce timing, immediate change callbacks, and comprehensive prop support.
+ * A debounced input field component that delays onChange calls until the user stops typing.
+ * This is a drop-in replacement for the lax-web-portal DebounceInputField component.
  *
  * @example
  * ```tsx
@@ -70,7 +56,11 @@ export interface DebounceInputFieldProps {
  *   onChange={(value) => setSearchTerm(value)}
  *   debounceTimeout={300}
  *   placeholder="Type to search..."
+ *   errorMessage=""
  * />
  * ```
  */
-export declare const DebounceInputField: import("react").ForwardRefExoticComponent<DebounceInputFieldProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const DebounceInputField: {
+    ({ id, label, onChange, errorMessage, required, bg, tags, color, debounceTimeout, className, isDarkMode, ...props }: DebounceInputFieldProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};