@react-fabric/form 1.0.0-beta.5 → 1.0.0-beta.51

package/dist/types/input/AvatarInput.d.ts

@@ -10,14 +10,17 @@ export interface Props extends RefProp {
      */
     value?: string;
     /**
-     * avatar stream src
+     * avatar name
      */
-    src?: string;
+    avatarName?: string;
     size?: string | number;
     /**
      * upload handler to store file in temp storage
      */
     uploadHandler: UploadHandler;
+    /**
+     * file stream path
+     */
     fileUrl?: (path: string) => string;
     /**
      * change handler
@@ -28,4 +31,4 @@ export interface Props extends RefProp {
      */
     onChange?: (path: string) => void;
 }
-export declare const AvatarInput: ({ src, size, fileUrl, uploadHandler, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const AvatarInput: ({ size, avatarName, value, fileUrl, uploadHandler, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Checkbox.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import { type RefProp } from "@react-fabric/core/dist/types/types";
-export interface CheckboxProps extends RefProp<HTMLInputElement> {
+interface CheckboxProps extends RefProp<HTMLInputElement> {
     /**
      * checkbox label
      */
@@ -16,7 +15,7 @@ export interface CheckboxProps extends RefProp<HTMLInputElement> {
     /**
      * on checked change
      */
-    onChange?: (checked: boolean | string | number) => void;
+    onChange?: (checked: boolean) => void;
     /**
      * disabled input
      */
@@ -43,4 +42,5 @@ export interface CheckboxProps extends RefProp<HTMLInputElement> {
     iconChecked?: string;
     name?: string;
 }
-export declare const Checkbox: ({ ref, label, value, name, checked, invalid, disabled, error, width, icon, iconChecked, onChange, ...rest }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Checkbox: ({ ref, label, value, name, checked, invalid, disabled, error, width, icon, iconChecked, required, onChange, ...rest }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/input/ColorInput.d.ts

@@ -1,10 +1,10 @@
 import { type RefProp } from "@react-fabric/core/dist/types/types";
 import { type InputProps } from "../types";
 import { type ColorProps } from "./ColorPicker";
-export interface ColorInputProps extends InputProps, ColorProps, RefProp {
+export interface ColorInputProps extends InputProps, Omit<ColorProps, "onChange">, RefProp {
     /**
      * show eydrop picker
      */
     showPicker?: boolean;
 }
-export declare const ColorInput: ({ ref, required, disabled, allowClear, invalid, error, value, showPicker, defaultColor, decorateEnd, decorateStart, onChange, noOutline, ...rest }: ColorInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ColorInput: ({ ref, required, disabled, readOnly, invalid, error, value, showPicker, defaultColor, onBlur, onFocus, onChange, noOutline, ...rest }: ColorInputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/ColorPicker.d.ts

@@ -15,7 +15,7 @@ export interface ColorProps {
     /**
      * color value
      */
-    value?: string;
+    value?: string | null;
     /**
      * change handler
      */

package/dist/types/input/DateInput.d.ts

@@ -0,0 +1,19 @@
+import { type RefProp } from "@react-fabric/core/dist/types/types";
+import { type DateLike } from "@react-fabric/date";
+import { type InputProps } from "../types";
+export interface DateProps extends InputProps<string>, RefProp<HTMLInputElement> {
+    type?: "date" | "datetime";
+    /**
+     * date format
+     */
+    format?: string;
+    /**
+     * minimum value
+     */
+    min?: DateLike;
+    /**
+     * maximum value
+     */
+    max?: DateLike;
+}
+export declare const DateInput: ({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, type, onBlur, onFocus, onChange, onEnterPressed, format, min, max, ...rest }: DateProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Field.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type ChildrenProp, type CssProp } from "@react-fabric/core/dist/types/types";
 export interface FieldProps extends ChildrenProp, CssProp {
     /**

package/dist/types/input/Input.d.ts

@@ -6,4 +6,4 @@ export interface TextInputProps extends InputProps, RefProp<HTMLInputElement> {
      */
     type?: "email" | "file" | "search" | "tel" | "text" | "url";
 }
-export declare const Input: ({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, type, onChange, onEnterPressed, ...rest }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Input: ({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, monospace, type, onBlur, onFocus, onChange, onEnterPressed, ...rest }: TextInputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Number.d.ts

@@ -14,4 +14,4 @@ export interface NumberProps extends InputProps<number>, RefProp<HTMLInputElemen
      */
     step?: number;
 }
-export declare const Number: ({ ref, value, invalid, readOnly, disabled, required, placeholder, autoFocus, name, min, max, step, onChange, onEnterPressed, ...rest }: NumberProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Number: ({ ref, value, invalid, readOnly, disabled, required, placeholder, autoFocus, name, min, max, step, onBlur, onFocus, onChange, onEnterPressed, ...rest }: NumberProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Password.d.ts

@@ -10,4 +10,4 @@ export interface PasswordProps extends InputProps, RefProp<HTMLInputElement> {
      */
     strength?: number;
 }
-export declare const Password: ({ ref, value, name, strength, invalid, readOnly, disabled, required, placeholder, autoFocus, showToggle, onChange, onEnterPressed, ...rest }: PasswordProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Password: ({ ref, value, name, strength, invalid, readOnly, disabled, required, placeholder, autoFocus, showToggle, onBlur, onFocus, onChange, onEnterPressed, ...rest }: PasswordProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Radio.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type RefProp } from "@react-fabric/core/dist/types/types";
 export interface RadioProps extends RefProp<HTMLInputElement> {
     name?: string;

package/dist/types/input/RadioGroup.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { type CssProp, type ChildrenProp } from "@react-fabric/core/dist/types/types";
+import { type ChildrenProp, type CssProp } from "@react-fabric/core/dist/types/types";
 import { type Radio } from "./Radio";
 export interface RadioGroupProps extends ChildrenProp<typeof Radio>, CssProp {
     /**
@@ -14,6 +13,22 @@ export interface RadioGroupProps extends ChildrenProp<typeof Radio>, CssProp {
      * field info
      */
     info?: string;
+    /**
+     * field width
+     */
+    width?: number | string;
+    /**
+     * inline label and input
+     */
+    inline?: boolean;
+    /**
+     * label width for inline
+     */
+    labelWidth?: string;
+    /**
+     * label width for inline
+     */
+    optionWidth?: string;
     /**
      * field name
      */
@@ -27,4 +42,4 @@ export interface RadioGroupProps extends ChildrenProp<typeof Radio>, CssProp {
      */
     onChange?: (value: AnyObject) => void;
 }
-export declare const RadioGroup: ({ children, name, className, onChange, ...rest }: RadioGroupProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RadioGroup: ({ children, name, className, optionWidth, onChange, ...rest }: RadioGroupProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/{Range.d.ts → RangeSlider.d.ts}

@@ -56,4 +56,4 @@ export interface RangeProps extends Omit<InputProps<[number, number]>, "placehol
 /**
  * Number Range input
  */
-export declare const Range: ({ error, name, value, step, min, max, height, color, vertical, showLabels, showValue, minLabel, maxLabel, ranges, format, autoFocus, disabled, readOnly, onBlur, onChange, onEnterPressed, onFocus, onSlide, invalid, ...rest }: RangeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RangeSlider: ({ error, name, value, step, min, max, height, color, vertical, showLabels, showValue, minLabel, maxLabel, ranges, format, autoFocus, disabled, readOnly, onBlur, onChange, onEnterPressed, onFocus, onSlide, invalid, ...rest }: RangeProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Search.d.ts

@@ -9,9 +9,13 @@ export interface SearchProps extends InputProps, RefProp<HTMLInputElement> {
      * search on value change
      */
     searchOnChange?: boolean;
+    /**
+     * hide search action handle
+     */
+    hideHandle?: boolean;
     /**
      * search handler
      */
     onSearch?: (query?: string) => void;
 }
-export declare const Search: ({ ref, value, name, invalid, readOnly, disabled, required, searching, placeholder, autoFocus, allowClear, searchOnChange, decorateEnd, decorateStart, onSearch, onChange, onEnterPressed, ...rest }: SearchProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Search: ({ ref, value, name, invalid, readOnly, disabled, required, searching, placeholder, autoFocus, hideHandle, allowClear, searchOnChange, onBlur, onFocus, onSearch, onChange, onEnterPressed, ...rest }: SearchProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Switch.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type ColorType, type RefProp } from "@react-fabric/core/dist/types/types";
 export interface SwitchProps extends RefProp<HTMLInputElement> {
     /**
@@ -32,11 +31,15 @@ export interface SwitchProps extends RefProp<HTMLInputElement> {
     /**
      * cutom Switch icon
      */
-    color?: ColorType;
+    color?: string | ColorType;
     /**
      * cutom Switch icon
      */
-    defaultColor?: ColorType;
+    defaultColor?: string | ColorType;
     name?: string;
+    onLabel?: string;
+    onLabelColor?: string | ColorType;
+    offLabel?: string;
+    offLabelColor?: string | ColorType;
 }
-export declare const Switch: ({ ref, label, checked, invalid, disabled, error, width, color, name, defaultColor, onChange, ...rest }: SwitchProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Switch: ({ ref, label, checked, invalid, disabled, error, width, color, name, onLabel, offLabel, onLabelColor, offLabelColor, defaultColor, required, onChange, ...rest }: SwitchProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/input/Textarea.d.ts

@@ -13,5 +13,9 @@ export interface TextareaProps extends InputProps, RefProp<HTMLTextAreaElement>
      * increment rows on value change
      */
     variableRows?: boolean;
+    /**
+     * expandable textarea
+     */
+    expandable?: boolean;
 }
-export declare const Textarea: ({ ref, value, name, invalid, readOnly, disabled, required, placeholder, autoFocus, rows, maxRows, variableRows, onChange, onEnterPressed, ...rest }: TextareaProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Textarea: ({ ref, value, name, invalid, readOnly, disabled, required, placeholder, autoFocus, rows, maxRows, variableRows, expandable, onBlur, onFocus, onChange, onEnterPressed, ...rest }: TextareaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/internal/FieldWrapper.d.ts

@@ -1 +1 @@
-export declare const FieldWrapper: ({ label, appendLabel, width, labelWidth, inline, info, disabled, required, children, listing, className, "data-inner": isInner, }: KeyValue) => import("react/jsx-runtime").JSX.Element;
+export declare const FieldWrapper: ({ label, appendLabel, width, labelWidth, inline, info, disabled, required, children, listing, className, invalid, error, "data-inner": isInner, }: KeyValue) => import("react/jsx-runtime").JSX.Element;

package/dist/types/internal/InputWrapper.d.ts

@@ -1 +1 @@
-export declare const InputWrapper: ({ invalid, error, allowClear, showClear, decorateStart, decorateEnd, children, onClear, noOutline, noBorder, textarea, "data-inner": isInner, "data-open": isOpen, floatingExpand, wrapperRef, width, ...rest }: KeyValue) => import("react/jsx-runtime").JSX.Element;
+export declare const InputWrapper: ({ invalid, error, allowClear, showClear, decorateStart, decorateEnd, decorateEndShowWhenEmpty, decorateEndHideWhenEmpty, children, onClear, noOutline, noBorder, actionButton, textarea, textareaExpandable, "data-inner": isInner, "data-open": isOpen, floatingExpand, wrapperRef, width, ...rest }: KeyValue) => import("react/jsx-runtime").JSX.Element;

package/dist/types/ranger/index.d.ts

@@ -18,7 +18,7 @@ type RangerConfig = {
     steps: number[];
 });
 export declare const useRanger: (opts: RangerConfig) => {
-    trackElRef: import("react").RefObject<HTMLDivElement>;
+    trackElRef: import("react").RefObject<HTMLDivElement | null>;
     activeHandleIndex: number | undefined;
     ticks: {
         key: number;
@@ -33,7 +33,7 @@ export declare const useRanger: (opts: RangerConfig) => {
         value: number;
         active: boolean;
         props: {
-            ref: import("react").RefObject<HTMLDivElement>;
+            ref: import("react").RefObject<HTMLDivElement | null>;
             onMouseDownCapture: (e: ME) => void;
             onTouchStartCapture: (e: TE) => void;
         } | {

package/dist/types/select/AutoComplete.d.ts

@@ -13,5 +13,5 @@ type AutoCompleteProps = Omit<SelectProps<string>, "options" | "allowCreate" | "
      */
     onInput?: (query: string) => void;
 };
-export declare const AutoComplete: ({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, expandOnEdit, error, history, multiple, onChange, onSelect, onInput, onFocus, onBlur, onEnterPressed, ...rest }: AutoCompleteProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AutoComplete: ({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, expandOnEdit, error, history, multiple, onChange, onSelect, onInput, onFocus, onBlur, onQuery, onEnterPressed, ...rest }: AutoCompleteProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/select/DualList.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { type RefProp } from "@react-fabric/core/dist/types/types";
+import { type ReactElement } from "react";
 import { type FieldProps } from "../input/Field";
 export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<HTMLInputElement> {
     /**
@@ -26,6 +26,10 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
      * value property name
      */
     valueProperty?: keyof T;
+    /**
+     * empty list display
+     */
+    emptyDisplay?: ReactElement;
     /**
      * item renderer
      */
@@ -35,4 +39,4 @@ export interface DualListProps<T> extends Omit<FieldProps, "children">, RefProp<
      */
     onChange?: (value?: string[]) => void;
 }
-export declare const DualList: <T extends unknown = string>({ ref, value, options, groupProperty, height, labelProperty, valueProperty, renderer, onChange, name, invalid, readOnly, disabled, placeholder, autoFocus, error, ...rest }: DualListProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const DualList: <T extends unknown = string>({ ref, value, options, emptyDisplay, groupProperty, height, labelProperty, valueProperty, renderer, onChange, name, invalid, readOnly, disabled, placeholder, autoFocus, error, ...rest }: DualListProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/select/List.d.ts

@@ -1,4 +1,4 @@
 import { type SelectProps } from "../types";
-export declare const List: <T extends unknown = string>({ ref, name, value, readOnly, disabled, required, placeholder, autoFocus, options, height, groupProperty, labelProperty, valueProperty, multiple, allowCreate, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, invalid, error, allowClear, decorateStart, decorateEnd, "data-inner": isInner, "data-hide-selected": hideSelected, ...rest }: SelectProps<T> & {
+export declare const List: <T extends unknown = string>({ ref, name, value, readOnly, disabled, required, placeholder, autoFocus, options, height, groupProperty, labelProperty, valueProperty, sortProperty, multiple, allowCreate, searchable, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, emptyDisplay, invalid, error, allowClear, decorateStart, decorateEnd, "data-inner": isInner, "data-hide-selected": hideSelected, ...rest }: Omit<SelectProps<T>, "defaultOpen" | "hideHandle"> & {
     height?: string | number;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/types/select/Select.d.ts

@@ -1,2 +1,2 @@
 import { type SelectProps } from "../types";
-export declare const Select: <T extends unknown = string>({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, options, groupProperty, labelProperty, valueProperty, multiple, searchable, allowCreate, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, ...rest }: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Select: <T extends unknown = string>({ ref, name, value, invalid, readOnly, disabled, required, placeholder, autoFocus, error, options, defaultOpen, hideHandle, groupProperty, labelProperty, valueProperty, sortProperty, multiple, searchable, allowCreate, emptyDisplay, createOption, matcher, renderer, onQuery, onChange, onSelect, onEnterPressed, ...rest }: SelectProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/select/useSelect.d.ts

@@ -10,14 +10,16 @@ interface State {
     query?: string;
     items: AnyObject[];
 }
-export declare const useSelect: ({ options, value, autoComplete, multiple, allowCreate, groupProperty, valueProperty, labelProperty, createOption, matcher, onQuery, onChange, onSelect, }: {
+export declare const useSelect: ({ options, value, defaultOpen, autoComplete, multiple, allowCreate, groupProperty, valueProperty, labelProperty, sortProperty, createOption, matcher, onQuery, onChange, onSelect, }: {
     value?: AnyObject;
     options?: AnyObject[];
     multiple?: boolean;
+    defaultOpen?: boolean;
     allowCreate?: boolean;
     groupProperty?: AnyObject;
     valueProperty?: AnyObject;
     labelProperty?: AnyObject;
+    sortProperty?: AnyObject;
     autoComplete?: boolean;
     matcher?: (item: AnyObject, query: string) => boolean;
     createOption?: (query: string) => AnyObject;
@@ -25,20 +27,10 @@ export declare const useSelect: ({ options, value, autoComplete, multiple, allow
     onSelect?: (item: AnyObject) => void;
     onChange?: (value: AnyObject) => void;
 }) => {
-    state: State | {
-        value: any;
-        activeIndex: null;
-        selectedIndex: any;
-        multiple: boolean;
-        emptyValue: AnyObject;
-        open: boolean;
-        loading: boolean;
-        query?: string | undefined;
-        items: AnyObject[];
-    };
-    listRef: import("react").MutableRefObject<HTMLElement[]>;
-    focusableRef: import("react").RefObject<HTMLElement>;
-    listContentRef: import("react").MutableRefObject<any[]>;
+    state: State;
+    listRef: import("react").RefObject<HTMLElement[]>;
+    focusableRef: import("react").RefObject<HTMLElement | null>;
+    listContentRef: import("react").RefObject<any[]>;
     handleChange: (value?: AnyObject) => void;
     handleRemove: (index?: number) => void;
     handleQuery: (query: string) => void;

package/dist/types/types/index.d.ts

@@ -1,14 +1,14 @@
-/// <reference types="react" />
-import { type RefProp } from "@react-fabric/core/dist/types/types";
-export interface InputProps<V = string> {
+import { type RefProp, type TestProps } from "@react-fabric/core/dist/types/types";
+import { type ReactElement } from "react";
+export interface InputProps<V = string> extends TestProps {
     /**
      * value
      */
-    value?: V;
+    value?: V | null;
     /**
      * change handler
      */
-    onChange?: (value?: V) => void;
+    onChange?: (value: V | null) => void;
     /**
      * on focus event handler
      */
@@ -45,10 +45,13 @@ export interface InputProps<V = string> {
      *
      */
     decorateEnd?: JSX.Element | string | number | boolean;
+    decorateEndShowWhenEmpty?: boolean;
+    decorateEndHideWhenEmpty?: boolean;
     /**
      * info label at bottom
      */
     info?: string;
+    monospace?: boolean;
     /**
      * required
      */
@@ -90,7 +93,15 @@ export interface InputProps<V = string> {
      */
     labelWidth?: string;
 }
-export interface BaseSelectProps<T> extends RefProp<HTMLInputElement>, Omit<InputProps, "value" | "onChange"> {
+export interface BaseSelectProps<T extends AnyObject = string> {
+    /**
+     * open dropdown by default
+     */
+    defaultOpen?: boolean;
+    /**
+     * hide dropdown handle
+     */
+    hideHandle?: boolean;
     /**
      * list options
      */
@@ -107,6 +118,10 @@ export interface BaseSelectProps<T> extends RefProp<HTMLInputElement>, Omit<Inpu
      * value property name
      */
     valueProperty?: keyof T;
+    /**
+     * value property name
+     */
+    sortProperty?: keyof T | true;
     /**
      * searchable list
      */
@@ -115,6 +130,10 @@ export interface BaseSelectProps<T> extends RefProp<HTMLInputElement>, Omit<Inpu
      * allow create item
      */
     allowCreate?: boolean;
+    /**
+     * empty list display
+     */
+    emptyDisplay?: ReactElement;
     /**
      * create new item object
      */
@@ -132,7 +151,8 @@ export interface BaseSelectProps<T> extends RefProp<HTMLInputElement>, Omit<Inpu
      */
     matcher?: (option: T, query: string) => boolean;
 }
-export type SelectProps<T> = BaseSelectProps<T> & ({
+type BaseSelectType<T> = BaseSelectProps<T> & RefProp<HTMLInputElement> & Omit<InputProps, "value" | "onChange">;
+export type SelectProps<T> = BaseSelectType<T> & ({
     /**
      * is multiple selection
      */
@@ -167,3 +187,4 @@ export type SelectProps<T> = BaseSelectProps<T> & ({
      */
     onChange?: (value?: string[]) => void;
 });
+export {};

package/dist/types/types/schema.d.ts

@@ -1,59 +1,104 @@
-interface BaseSchemaDef {
+import { type Elements } from "@react-fabric/core/dist/types/types";
+import { type DateLike } from "@react-fabric/date";
+export declare enum DATA_TYPES {
+    TEXT = "text",
+    COLOR = "color",
+    BOOL = "bool",
+    DATE = "date",
+    DATETIME = "datetime",
+    STRING = "string",
+    NUMBER = "number",
+    RANGE = "range",
+    FILE = "file",
+    AVATAR = "avatar",
+    SCHEMA = "schema"
+}
+export declare const SCHEMA_CUSTOM_LIST = "--CUSTOM--";
+interface SingleValue {
+    multiple?: false;
+    minItems?: never;
+    maxItems?: never;
+}
+interface MultipleValue {
+    multiple: true;
+    minItems?: number;
+    maxItems?: number;
+}
+export type ValueType = SingleValue | MultipleValue;
+interface BaseSchema {
     id: string;
     label: string;
     datatype: string;
     required?: boolean;
-    multiple?: boolean;
-    defaultValue?: AnyObject;
 }
-interface SchemaDef extends BaseSchemaDef {
-    datatype: "text" | "color";
+export interface DefaultSchema extends BaseSchema {
+    datatype: DATA_TYPES.TEXT | DATA_TYPES.COLOR;
 }
-interface BooleanSchema extends BaseSchemaDef {
-    datatype: "boolean";
-    defaultValue?: boolean;
+export interface BooleanSchema extends BaseSchema {
+    datatype: DATA_TYPES.BOOL;
 }
-interface StringSchema extends BaseSchemaDef {
-    datatype: "string";
-    options?: string[];
+export interface StringSchema extends BaseSchema {
+    datatype: DATA_TYPES.STRING;
     regex?: string;
-    identifierType?: string;
+    options?: string[];
+    optionList?: string;
+    allowCustom?: boolean;
 }
-interface RangeSchema extends BaseSchemaDef {
-    datatype: "range";
+export interface RangeSchema extends BaseSchema {
+    datatype: DATA_TYPES.RANGE;
     min?: number;
     max?: number;
     step?: number;
-    defaultValue?: [number, number];
 }
-interface NumberSchema extends BaseSchemaDef {
-    datatype: "number";
-    min?: number;
-    max?: number;
-    step?: number;
-    defaultValue?: number;
+export interface DateSchema extends BaseSchema {
+    datatype: DATA_TYPES.DATE | DATA_TYPES.DATETIME;
+    min?: DateLike;
+    max?: DateLike;
 }
-interface DecimalSchema extends BaseSchemaDef {
-    datatype: "decimal";
+export interface NumberSchema extends BaseSchema {
+    datatype: DATA_TYPES.NUMBER;
     min?: number;
     max?: number;
     step?: number;
-    defaultValue?: number;
 }
-export interface FileSchema extends BaseSchemaDef {
-    datatype: "file";
+export interface FileSchema extends BaseSchema {
+    datatype: DATA_TYPES.FILE;
     accept?: string;
 }
-export interface AvatarSchema extends BaseSchemaDef {
-    datatype: "avatar";
+export interface AvatarSchema extends BaseSchema {
+    datatype: DATA_TYPES.AVATAR;
     multiple?: false;
 }
-export type SchemaType = SchemaDef | BooleanSchema | StringSchema | RangeSchema | NumberSchema | DecimalSchema | FileSchema | AvatarSchema;
-export interface ChildSchema extends BaseSchemaDef {
-    datatype: "schema";
+export type SchemaType = (DefaultSchema & ValueType) | (BooleanSchema & ValueType) | (StringSchema & ValueType) | (RangeSchema & ValueType) | (DateSchema & ValueType) | (NumberSchema & ValueType) | (FileSchema & ValueType) | (AvatarSchema & ValueType);
+export interface ChildSchema extends BaseSchema {
+    datatype: DATA_TYPES.SCHEMA;
     inline?: boolean;
     schema: SchemaType[];
-    defaultValue?: never;
 }
-export type FormSchema = SchemaType | ChildSchema;
+export type SchemaDef = SchemaType | (ChildSchema & ValueType);
+export type FormSchema = SchemaDef[];
+export interface SchemaEditorProps {
+    /**
+     * default form schema
+     */
+    schemaDef: FormSchema;
+    /**
+     * is dynamic schema (allow add/remove)
+     */
+    dynamic?: boolean;
+    /**
+     * acceptable list of data types
+     */
+    acceptableTypes?: DATA_TYPES[];
+    /**
+     * available option lists in application
+     */
+    optionLists?: string[];
+    /**
+     * footer actions
+     */
+    children?: Elements<JSX.Element> | Array<Elements<JSX.Element>>;
+    onChange?: (schema: FormSchema) => void;
+    onSubmit?: (schema: FormSchema) => void;
+}
 export {};

package/dist/types/utils/eventHandlers.d.ts

@@ -1,6 +1,6 @@
 import { type KeyboardEvent, type MouseEvent } from "react";
 /** ***************** common handler for enter press *******************/
-export declare const handleEnter: (callback?: (e: KeyboardEvent) => void, { stopPropagation, preventDefault, }?: {
+export declare const useHandleEnter: (callback?: (e: KeyboardEvent) => void, { stopPropagation, preventDefault, }?: {
     stopPropagation?: boolean;
     preventDefault?: boolean;
 }) => (e: KeyboardEvent) => false | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-fabric/form",
-  "version": "1.0.0-beta.5",
+  "version": "1.0.0-beta.51",
   "description": "RUF: Form package",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
@@ -11,9 +11,11 @@
   "types": "dist/types/index.d.ts",
   "directories": {
     "src": "src",
+    "styles": "css",
     "test": "tests"
   },
   "files": [
+    "css",
     "src",
     "dist"
   ],
@@ -33,24 +35,25 @@
     "watch": "npm-run-all -p watch:rollup watch:dts"
   },
   "dependencies": {
-    "@dnd-kit/core": "^6.1.0",
-    "@dnd-kit/modifiers": "^7.0.0",
-    "@dnd-kit/sortable": "^8.0.0",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
-    "@floating-ui/react": "0.26.24",
+    "@floating-ui/react": "^0.27.9",
     "@hookform/resolvers": "^3.9.0",
-    "@react-fabric/core": "^1.0.0-beta.5",
-    "@react-fabric/utilities": "^1.0.0-beta.5",
+    "@react-fabric/core": "^1.0.0-beta.51",
+    "@react-fabric/date": "^1.0.0-beta.51",
+    "@react-fabric/utilities": "^1.0.0-beta.50",
     "classnames": "^2.5.1",
     "color": "^4.2.3",
     "react-color": "^2.19.3",
     "react-hook-form": "^7.52.1"
   },
   "peerDependencies": {
-    "i18next": "^23.15.1",
-    "react": ">=18.0.0 <20.0.0",
-    "react-dom": ">=18.0.0 <20.0.0",
-    "react-i18next": "^15.0.2"
+    "i18next": "^25.2.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-i18next": "^15.5.2"
   },
   "devDependencies": {
     "@types/axios": "^0.14.0",
@@ -60,5 +63,5 @@
     "node": ">=18.12.0",
     "npm": ">=8.19.0"
   },
-  "gitHead": "7d4a7ed1ea9890652826bef58d01c31280d761c8"
+  "gitHead": "a1b04de4663045f82992bff2aef8db26608eac74"
 }