@xinghunm/compass-ui 0.1.0 → 0.2.0

package/dist/index.d.mts

@@ -1,24 +1,16 @@
 import * as React$1 from 'react';
 import React__default, { CSSProperties, ReactElement, ReactNode } from 'react';
 import { Placement } from '@floating-ui/react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { RuleItem } from 'async-validator';
 
-interface ButtonBaseProps {
+interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     /** Whether to enable ripple effect */
     hasRipple?: boolean;
-    /** Custom class name */
-    className?: string;
-    /** Custom style */
-    style?: React.CSSProperties;
-    /** Whether the button is disabled */
-    disabled?: boolean;
     /** Ripple background color */
     rippleBgColor?: string;
     /** Ripple opacity */
     rippleOpacity?: number;
-    /** Button content */
-    children?: React.ReactNode;
-    /** Click event handler */
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
 }
 
 interface ButtonProps extends ButtonBaseProps {
@@ -854,8 +846,19 @@ interface Theme {
         select: SelectTheme;
         pagination: PaginationTheme;
         tree: TreeTheme;
+        form: FormTheme;
     };
 }
+interface FormTheme {
+    itemMarginBottom: string;
+    labelColor: string;
+    labelFontSize: string;
+    labelMarginBottom: string;
+    errorColor: string;
+    errorFontSize: string;
+    errorMarginTop: string;
+    errorMarginBottom: string;
+}
 interface TreeTheme {
     nodeSelectedBg: string;
     nodeHoverBg: string;
@@ -1151,4 +1154,107 @@ interface InputNumberProps extends Omit<InputFieldProps, 'onChange' | 'value' |
 
 declare const InputNumber: React__default.ForwardRefExoticComponent<InputNumberProps & React__default.RefAttributes<HTMLInputElement>>;
 
-export { Button, type ButtonProps, ConfigProvider, type ConfigProviderProps, type DataNode, DatePicker, type DatePickerProps, type DateRangePickerProps, Dropdown, type DropdownProps, InputField, type InputFieldProps, InputNumber, type InputNumberProps, type ItemType, Menu, type MenuItemProps, type MenuProps, messageWithHook as Message, type MessageProps, ModalWithStatics as Modal, type ModalBaseProps as ModalProps, Pagination, type PaginationProps, Progress, type ProgressProps, Select, type SelectOption, type SelectProps, type SelectValue, Steps, type StepsProps, Tree, type TreeNodeProps, type TreeProps };
+type StoreValue = unknown;
+type Store = Record<string, StoreValue>;
+interface FieldData {
+    name: string;
+    value?: StoreValue;
+    touched?: boolean;
+    validating?: boolean;
+    errors?: string[];
+}
+/**
+ * Interface for Field Entity (FormItem)
+ */
+interface FieldEntity {
+    onStoreChange: () => void;
+    validateRules: () => Promise<string[] | null>;
+    getName: () => string;
+    getErrors: () => string[];
+    props: {
+        name?: string;
+        rules?: RuleItem[];
+        dependencies?: string[];
+        initialValue?: unknown;
+    };
+}
+interface Callbacks<Values = Record<string, unknown>> {
+    onValuesChange?: (changedValues: Store, values: Values) => void;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (errorInfo: ValidateErrorEntity<Values>) => void;
+}
+interface ValidateErrorEntity<Values = Record<string, unknown>> {
+    values: Values;
+    errorFields: {
+        name: string;
+        errors: string[];
+    }[];
+    outOfDate: boolean;
+}
+interface InternalHooks {
+    registerField: (entity: FieldEntity) => () => void;
+    setInitialValues: (values: Store, init: boolean) => void;
+    setCallbacks: (callbacks: Callbacks) => void;
+    dispatch: (action: ReducerAction) => void;
+    getFieldValue: (name: string) => StoreValue;
+}
+interface FormInstance<Values = Record<string, unknown>> {
+    getFieldValue: (name: string) => StoreValue;
+    getFieldsValue: () => Values;
+    getFieldError: (name: string) => string[];
+    isFieldsTouched: (nameList?: string[]) => boolean;
+    isFieldTouched: (name: string) => boolean;
+    isFieldValidating: (name: string) => boolean;
+    resetFields: (fields?: string[]) => void;
+    setFields: (fields: FieldData[]) => void;
+    setFieldValue: (name: string, value: unknown) => void;
+    setFieldsValue: (values: RecursivePartial<Values>) => void;
+    validateFields: (nameList?: string[]) => Promise<Values>;
+    submit: () => void;
+    getInternalHooks: (secret: string) => InternalHooks | null;
+}
+type RecursivePartial<T> = {
+    [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial<U>[] : T[P] extends object ? RecursivePartial<T[P]> : T[P];
+};
+interface ReducerAction {
+    type: string;
+    payload: unknown;
+}
+
+interface FormProps<Values = Record<string, unknown>> {
+    form?: FormInstance<Values>;
+    initialValues?: Store;
+    children?: ReactNode;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (errorInfo: ValidateErrorEntity<Values>) => void;
+    onValuesChange?: (changedValues: Store, values: Values) => void;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const Form$1: <Values extends Record<string, unknown> = Record<string, unknown>>({ form, initialValues, children, onFinish, onFinishFailed, onValuesChange, className, style, }: FormProps<Values>) => react_jsx_runtime.JSX.Element;
+
+interface FormItemProps {
+    name?: string;
+    label?: string;
+    rules?: RuleItem[];
+    children: ReactElement;
+    validateTrigger?: string | string[];
+    initialValue?: unknown;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const FormItem: React__default.FC<FormItemProps>;
+
+declare const useForm: <Values extends Record<string, unknown> = Record<string, unknown>>(form?: FormInstance<Values>) => [FormInstance<Values>];
+
+type InternalFormType = typeof Form$1;
+interface FormInterface extends InternalFormType {
+    Item: typeof FormItem;
+    useForm: typeof useForm;
+}
+declare const Form: FormInterface & {
+    Item: typeof FormItem;
+    useForm: typeof useForm;
+};
+
+export { Button, type ButtonProps, ConfigProvider, type ConfigProviderProps, type DataNode, DatePicker, type DatePickerProps, type DateRangePickerProps, Dropdown, type DropdownProps, type FieldData, Form, type FormInstance, type FormItemProps, type FormProps, InputField, type InputFieldProps, InputNumber, type InputNumberProps, type ItemType, Menu, type MenuItemProps, type MenuProps, messageWithHook as Message, type MessageProps, ModalWithStatics as Modal, type ModalBaseProps as ModalProps, Pagination, type PaginationProps, Progress, type ProgressProps, Select, type SelectOption, type SelectProps, type SelectValue, Steps, type StepsProps, Tree, type TreeNodeProps, type TreeProps, type ValidateErrorEntity };

package/dist/index.d.ts

@@ -1,24 +1,16 @@
 import * as React$1 from 'react';
 import React__default, { CSSProperties, ReactElement, ReactNode } from 'react';
 import { Placement } from '@floating-ui/react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { RuleItem } from 'async-validator';
 
-interface ButtonBaseProps {
+interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     /** Whether to enable ripple effect */
     hasRipple?: boolean;
-    /** Custom class name */
-    className?: string;
-    /** Custom style */
-    style?: React.CSSProperties;
-    /** Whether the button is disabled */
-    disabled?: boolean;
     /** Ripple background color */
     rippleBgColor?: string;
     /** Ripple opacity */
     rippleOpacity?: number;
-    /** Button content */
-    children?: React.ReactNode;
-    /** Click event handler */
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
 }
 
 interface ButtonProps extends ButtonBaseProps {
@@ -854,8 +846,19 @@ interface Theme {
         select: SelectTheme;
         pagination: PaginationTheme;
         tree: TreeTheme;
+        form: FormTheme;
     };
 }
+interface FormTheme {
+    itemMarginBottom: string;
+    labelColor: string;
+    labelFontSize: string;
+    labelMarginBottom: string;
+    errorColor: string;
+    errorFontSize: string;
+    errorMarginTop: string;
+    errorMarginBottom: string;
+}
 interface TreeTheme {
     nodeSelectedBg: string;
     nodeHoverBg: string;
@@ -1151,4 +1154,107 @@ interface InputNumberProps extends Omit<InputFieldProps, 'onChange' | 'value' |
 
 declare const InputNumber: React__default.ForwardRefExoticComponent<InputNumberProps & React__default.RefAttributes<HTMLInputElement>>;
 
-export { Button, type ButtonProps, ConfigProvider, type ConfigProviderProps, type DataNode, DatePicker, type DatePickerProps, type DateRangePickerProps, Dropdown, type DropdownProps, InputField, type InputFieldProps, InputNumber, type InputNumberProps, type ItemType, Menu, type MenuItemProps, type MenuProps, messageWithHook as Message, type MessageProps, ModalWithStatics as Modal, type ModalBaseProps as ModalProps, Pagination, type PaginationProps, Progress, type ProgressProps, Select, type SelectOption, type SelectProps, type SelectValue, Steps, type StepsProps, Tree, type TreeNodeProps, type TreeProps };
+type StoreValue = unknown;
+type Store = Record<string, StoreValue>;
+interface FieldData {
+    name: string;
+    value?: StoreValue;
+    touched?: boolean;
+    validating?: boolean;
+    errors?: string[];
+}
+/**
+ * Interface for Field Entity (FormItem)
+ */
+interface FieldEntity {
+    onStoreChange: () => void;
+    validateRules: () => Promise<string[] | null>;
+    getName: () => string;
+    getErrors: () => string[];
+    props: {
+        name?: string;
+        rules?: RuleItem[];
+        dependencies?: string[];
+        initialValue?: unknown;
+    };
+}
+interface Callbacks<Values = Record<string, unknown>> {
+    onValuesChange?: (changedValues: Store, values: Values) => void;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (errorInfo: ValidateErrorEntity<Values>) => void;
+}
+interface ValidateErrorEntity<Values = Record<string, unknown>> {
+    values: Values;
+    errorFields: {
+        name: string;
+        errors: string[];
+    }[];
+    outOfDate: boolean;
+}
+interface InternalHooks {
+    registerField: (entity: FieldEntity) => () => void;
+    setInitialValues: (values: Store, init: boolean) => void;
+    setCallbacks: (callbacks: Callbacks) => void;
+    dispatch: (action: ReducerAction) => void;
+    getFieldValue: (name: string) => StoreValue;
+}
+interface FormInstance<Values = Record<string, unknown>> {
+    getFieldValue: (name: string) => StoreValue;
+    getFieldsValue: () => Values;
+    getFieldError: (name: string) => string[];
+    isFieldsTouched: (nameList?: string[]) => boolean;
+    isFieldTouched: (name: string) => boolean;
+    isFieldValidating: (name: string) => boolean;
+    resetFields: (fields?: string[]) => void;
+    setFields: (fields: FieldData[]) => void;
+    setFieldValue: (name: string, value: unknown) => void;
+    setFieldsValue: (values: RecursivePartial<Values>) => void;
+    validateFields: (nameList?: string[]) => Promise<Values>;
+    submit: () => void;
+    getInternalHooks: (secret: string) => InternalHooks | null;
+}
+type RecursivePartial<T> = {
+    [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial<U>[] : T[P] extends object ? RecursivePartial<T[P]> : T[P];
+};
+interface ReducerAction {
+    type: string;
+    payload: unknown;
+}
+
+interface FormProps<Values = Record<string, unknown>> {
+    form?: FormInstance<Values>;
+    initialValues?: Store;
+    children?: ReactNode;
+    onFinish?: (values: Values) => void;
+    onFinishFailed?: (errorInfo: ValidateErrorEntity<Values>) => void;
+    onValuesChange?: (changedValues: Store, values: Values) => void;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const Form$1: <Values extends Record<string, unknown> = Record<string, unknown>>({ form, initialValues, children, onFinish, onFinishFailed, onValuesChange, className, style, }: FormProps<Values>) => react_jsx_runtime.JSX.Element;
+
+interface FormItemProps {
+    name?: string;
+    label?: string;
+    rules?: RuleItem[];
+    children: ReactElement;
+    validateTrigger?: string | string[];
+    initialValue?: unknown;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const FormItem: React__default.FC<FormItemProps>;
+
+declare const useForm: <Values extends Record<string, unknown> = Record<string, unknown>>(form?: FormInstance<Values>) => [FormInstance<Values>];
+
+type InternalFormType = typeof Form$1;
+interface FormInterface extends InternalFormType {
+    Item: typeof FormItem;
+    useForm: typeof useForm;
+}
+declare const Form: FormInterface & {
+    Item: typeof FormItem;
+    useForm: typeof useForm;
+};
+
+export { Button, type ButtonProps, ConfigProvider, type ConfigProviderProps, type DataNode, DatePicker, type DatePickerProps, type DateRangePickerProps, Dropdown, type DropdownProps, type FieldData, Form, type FormInstance, type FormItemProps, type FormProps, InputField, type InputFieldProps, InputNumber, type InputNumberProps, type ItemType, Menu, type MenuItemProps, type MenuProps, messageWithHook as Message, type MessageProps, ModalWithStatics as Modal, type ModalBaseProps as ModalProps, Pagination, type PaginationProps, Progress, type ProgressProps, Select, type SelectOption, type SelectProps, type SelectValue, Steps, type StepsProps, Tree, type TreeNodeProps, type TreeProps, type ValidateErrorEntity };