@lax-wp/design-system 0.3.65 → 0.3.67

package/dist/components/forms/dynamic-data-input/DynamicDataInput.d.ts

@@ -0,0 +1,64 @@
+import { FC } from "react";
+import type { LabelType } from "../../data-display/label/Label";
+/**
+ * Props for the DynamicDataInput component
+ * Drop-in replacement matching the lax-web-portal API
+ */
+export type DynamicDataInputProps = {
+    /** Unique identifier for the input */
+    id: string;
+    /** Label text to display above the input */
+    label?: string;
+    /** Input type (text, email, password, number, etc.) */
+    type?: string;
+    /** Placeholder text for the input */
+    placeholder?: string;
+    /** Current value of the input (JSON string for dynamic data) */
+    value: string;
+    /** Callback function called when value changes */
+    onChange: (value: string) => void;
+    /** Error message to display below the input */
+    errorMessage?: string;
+    /** Whether to preserve original case in the label */
+    originalCase?: boolean;
+    /** Whether the field is required */
+    required?: boolean;
+    /** Background color class */
+    bg?: string;
+    /** Tags/labels to display next to the label */
+    tags?: (string | LabelType)[];
+    /** Index prop used for resetting input state */
+    index?: number;
+    /** Additional CSS classes for the wrapper */
+    className?: string;
+    /** Tooltip text for the help icon */
+    tooltip?: string;
+    /** Whether to use simple mode (no label, just input with edit button) */
+    simpleMode?: boolean;
+    /** Additional CSS classes for the input field in simple mode */
+    inputFieldClassName?: string;
+    /** Whether the value was AI extracted */
+    isAiExtracted?: boolean;
+    /** Whether the input is disabled */
+    disabled?: boolean;
+} & Record<string, any>;
+/**
+ * A dynamic data input component that displays a text input with a button to open
+ * a modal for editing JSON data. The input shows "{DYNAMIC}" when there's a value.
+ *
+ * This is a drop-in replacement for the lax-web-portal DynamicDataInput component.
+ *
+ * @example
+ * ```tsx
+ * <DynamicDataInput
+ *   id="dynamic-field"
+ *   label="Dynamic Field"
+ *   type="text"
+ *   placeholder="Enter value..."
+ *   value={jsonData}
+ *   onChange={(value) => setJsonData(value)}
+ *   errorMessage=""
+ * />
+ * ```
+ */
+export declare const DynamicDataInput: FC<DynamicDataInputProps>;

package/dist/components/icons/EditIcon.d.ts

@@ -0,0 +1,7 @@
+import React, { SVGAttributes } from 'react';
+export interface EditIconProps extends SVGAttributes<SVGElement> {
+    fill?: string;
+    size?: string | number;
+    className?: string;
+}
+export declare const EditIcon: React.FC<EditIconProps>;

package/dist/index.d.ts

@@ -34,6 +34,8 @@ export { DebounceInputField } from "./components/forms/debounce-input/DebounceIn
 export type { DebounceInputFieldProps } from "./components/forms/debounce-input/DebounceInputField";
 export { DynamicDataInputField } from "./components/forms/dynamic-data-input/DynamicDataInputField";
 export type { DynamicDataInputFieldProps, DynamicDataModalProps as DynamicDataInputModalProps, RiskDetails as DynamicDataInputFieldRiskDetails, RiskDetailsCardProps as DynamicDataInputFieldRiskDetailsCardProps, } from "./components/forms/dynamic-data-input/DynamicDataInputField";
+export { DynamicDataInput } from "./components/forms/dynamic-data-input/DynamicDataInput";
+export type { DynamicDataInputProps } from "./components/forms/dynamic-data-input/DynamicDataInput";
 export { PercentageInputField } from "./components/forms/percentage-input/PercentageInputField";
 export type { PercentageInputFieldProps, RiskDetails as PercentageInputFieldRiskDetails, RiskDetailsCardProps as PercentageInputFieldRiskDetailsCardProps, } from "./components/forms/percentage-input/PercentageInputField";
 export { Toggle } from "./components/forms/toggle/Toggle";
@@ -90,7 +92,9 @@ export { getFlagComponent, getFlagComponentSm, getFlagComponentRectangle, getFla
 export { LaxIcon } from "./components/icons/LaxIcon";
 export { ComingSoonIcon } from "./components/icons/ComingSoonIcon";
 export { CheckSmallIcon } from "./components/icons/CheckSmallIcon";
+export { EditIcon } from "./components/icons/EditIcon";
 export type { IconProps } from "./components/icons/LaxIcon";
+export type { EditIconProps } from "./components/icons/EditIcon";
 export { AccessDeniedModal } from "./components/data-display/access-denied-modal/AccessDeniedModal";
 export type { AccessDeniedModalProps } from "./components/data-display/access-denied-modal/AccessDeniedModal";
 export { InProgress } from "./components/data-display/in-progress/InProgress";