foxit-component 0.0.1-alpha.1 → 0.0.1-alpha.2

package/es/Button/Button.d.ts

@@ -1,15 +1,12 @@
-import "./button.css";
+import './button.css';
+import React from 'react';
 export interface ButtonProps {
-    /** Is this the principal call to action on the page? */
     primary?: boolean;
-    /** What background color to use */
-    backgroundColor?: string;
-    /** How large should the button be? */
-    size?: "small" | "medium" | "large";
-    /** Button contents */
-    label: string;
-    /** Optional click handler */
+    size?: 'small' | 'medium' | 'large';
+    children?: React.ReactNode;
     onClick?: () => void;
+    className?: string;
+    style?: React.CSSProperties;
+    [key: string]: unknown;
 }
-/** Primary UI component for user interaction */
-export declare const Button: ({ primary, size, backgroundColor, label, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Button: ({ primary, size, children, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/es/Button/Button.js

@@ -1,14 +1,12 @@
 import { __rest, __assign } from '../node_modules/tslib/tslib.es6.js';
 import { jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
 import './button.css.js';
 
-/** Primary UI component for user interaction */
 var Button = function (_a) {
-    var _b = _a.primary, primary = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, backgroundColor = _a.backgroundColor, label = _a.label, props = __rest(_a, ["primary", "size", "backgroundColor", "label"]);
-    var mode = primary
-        ? "storybook-button--primary"
-        : "storybook-button--secondary";
-    return (jsx("button", __assign({ type: "button", className: ["storybook-button", "storybook-button--".concat(size), mode].join(" "), style: { backgroundColor: backgroundColor } }, props, { children: label })));
+    var _b = _a.primary, primary = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? 'large' : _c, _d = _a.children, children = _d === void 0 ? '' : _d, props = __rest(_a, ["primary", "size", "children"]);
+    var mode = primary ? 'foxit-button-primary' : 'foxit-button-secondary';
+    return (jsx("button", __assign({ type: "button", className: classNames('foxit-button', "foxit-button-".concat(size), mode, props.className), style: props.style }, props, { children: children })));
 };
 
 export { Button };

package/es/Button/button.css.js

@@ -1,6 +1,6 @@
 import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".storybook-button {\n  display: inline-block;\n  cursor: pointer;\n  border: 0;\n  border-radius: 3em;\n  font-weight: 700;\n  line-height: 1;\n  font-family: \"Nunito Sans\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n}\n.storybook-button--primary {\n  background-color: #555ab9;\n  color: white;\n}\n.storybook-button--secondary {\n  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;\n  background-color: transparent;\n  color: #333;\n}\n.storybook-button--small {\n  padding: 10px 16px;\n  font-size: 12px;\n}\n.storybook-button--medium {\n  padding: 11px 20px;\n  font-size: 14px;\n}\n.storybook-button--large {\n  padding: 12px 24px;\n  font-size: 16px;\n}\n";
+var css_248z = ".foxit-button {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  border: 0;\n  border-radius: 10px;\n  font-weight: 600;\n  font-size: 14px;\n  line-height: 18px;\n  padding: 19px 32px;\n  letter-spacing: 0.42px;\n}\n.foxit-button-primary {\n  background-color: #ff5f00;\n  color: white;\n}\n.foxit-button-secondary {\n  border: 2px solid #ff5f00;\n  background-color: white;\n  color: #ff5f00;\n}\n.foxit-button-small {\n  padding: 10px 24px;\n  border-radius: 5px;\n}\n.foxit-button-medium {\n  padding: 13px 32px;\n  border-radius: 5px;\n}\n.foxit-button-large {\n  padding: 19px 32px;\n}\n";
 styleInject(css_248z);
 
 export { css_248z as default };

package/es/Checkbox/Checkbox.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './checkbox.css';
+interface CheckboxProps {
+    onChange?: (checked: boolean) => void;
+    checked?: boolean;
+    disabled?: boolean;
+    children: React.ReactNode;
+}
+declare const Checkbox: React.FC<CheckboxProps>;
+export default Checkbox;

package/es/Checkbox/Checkbox.js

@@ -0,0 +1,19 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import './checkbox.css.js';
+
+var Checkbox = function (_a) {
+    var onChange = _a.onChange, checked = _a.checked, _b = _a.disabled, disabled = _b === void 0 ? false : _b, children = _a.children;
+    var _c = useState(checked || false), internalChecked = _c[0], setInternalChecked = _c[1];
+    var handleChange = function (e) {
+        var newChecked = e.target.checked;
+        setInternalChecked(newChecked);
+        if (onChange) {
+            onChange(newChecked);
+        }
+    };
+    return (jsxs("label", __assign({ className: "foxit-checkbox-container ".concat(disabled ? 'disabled' : '') }, { children: [jsx("input", { type: "checkbox", checked: checked !== undefined ? checked : internalChecked, disabled: disabled, onChange: handleChange }), jsx("span", { className: "foxit-checkbox-checkmark ".concat(disabled ? 'disabled' : '') }), jsx("span", __assign({ className: "foxit-checkbox-content" }, { children: children }))] })));
+};
+
+export { Checkbox as default };

package/es/Checkbox/checkbox.css.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".foxit-checkbox-container {\n  display: inline-block;\n  position: relative;\n  padding-left: 25px;\n  cursor: pointer;\n  -webkit-user-select: none;\n          user-select: none;\n}\n\n.foxit-checkbox-container input {\n  position: absolute;\n  opacity: 0;\n  cursor: pointer;\n}\n\n.foxit-checkbox-checkmark {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 20px;\n  width: 20px;\n  background-color: #fff;\n  border: 1px solid #b3b3b3;\n  border-radius: 4px;\n}\n\n.foxit-checkbox-content {\n  line-height: 20px;\n}\n\n.foxit-checkbox-container input:checked ~ .foxit-checkbox-checkmark {\n  background-color: #ff5f00;\n  border: none;\n}\n\n.foxit-checkbox-checkmark:after {\n  content: '';\n  position: absolute;\n  display: none;\n}\n\n.foxit-checkbox-container input:checked ~ .foxit-checkbox-checkmark:after {\n  display: block;\n}\n\n.foxit-checkbox-container .foxit-checkbox-checkmark:after {\n  left: 7px;\n  top: 4px;\n  width: 6px;\n  height: 10px;\n  border: solid white;\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg);\n}\n\n.foxit-checkbox-container.disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n  color: #00000040;\n}\n\n.foxit-checkbox-checkmark.disabled {\n  background-color: #f5f5f5;\n  border: 1px solid #d9d9d9;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/Empty/Empty.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import './empty.css';
+interface EmptyProps {
+    description?: React.ReactNode;
+}
+declare const Empty: React.FC<EmptyProps>;
+export default Empty;

package/es/Empty/Empty.js

@@ -0,0 +1,11 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Icon } from '../Icon/index.js';
+import './empty.css.js';
+
+var Empty = function (_a) {
+    var description = _a.description;
+    return (jsxs("div", __assign({ className: "foxit-empty" }, { children: [jsx("div", __assign({ className: "foxit-empty-image" }, { children: jsx(Icon, { name: "EmptyColoursOutlined" }) })), jsx("div", __assign({ className: "foxit-empty-description" }, { children: description }))] })));
+};
+
+export { Empty as default };

package/es/Empty/empty.css.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".foxit-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: 20px;\n}\n\n.foxit-empty-image {\n  margin-bottom: 16px;\n}\n\n.foxit-empty-description {\n  font-size: 14px;\n  color: #757575;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/Form/Form.d.ts

@@ -0,0 +1,14 @@
+import React, { ReactNode } from 'react';
+import { FormRefInstance } from './Form.types';
+import FormItem from './FormItem';
+export type { FormRefInstance } from './Form.types';
+interface FormProps {
+    children: ReactNode;
+    onFinish?: (values: unknown) => void;
+    initialValues?: {
+        [key: string]: unknown;
+    };
+}
+export { FormItem };
+declare const _default: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<FormRefInstance>>;
+export default _default;

package/es/Form/Form.js

@@ -0,0 +1,38 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useRef, useCallback, useImperativeHandle } from 'react';
+import FormProvider from './FormProvider.js';
+import './FormContext.js';
+import './form.css.js';
+
+var Form = function (_a, ref) {
+    var children = _a.children, onFinish = _a.onFinish, initialValues = _a.initialValues;
+    var formRef = useRef(null);
+    var handleSubmit = useCallback(function (e) {
+        var _a;
+        e.preventDefault();
+        if (onFinish) {
+            if (onFinish && formRef.current) {
+                (_a = formRef === null || formRef === void 0 ? void 0 : formRef.current) === null || _a === void 0 ? void 0 : _a.validateFields().then(function (values) {
+                    onFinish(values);
+                }).catch(function (errors) {
+                    console.error('Validation errors:', errors);
+                });
+            }
+        }
+    }, [onFinish]);
+    useImperativeHandle(ref, function () {
+        var _a, _b, _c, _d, _e;
+        return ({
+            setFieldsValue: (_a = formRef.current) === null || _a === void 0 ? void 0 : _a.setFieldsValue,
+            getFieldsValue: (_b = formRef.current) === null || _b === void 0 ? void 0 : _b.getFieldsValue,
+            resetFields: (_c = formRef.current) === null || _c === void 0 ? void 0 : _c.resetFields,
+            validateFields: (_d = formRef.current) === null || _d === void 0 ? void 0 : _d.validateFields,
+            setFieldsStatus: (_e = formRef.current) === null || _e === void 0 ? void 0 : _e.setFieldsStatus
+        });
+    });
+    return (jsx(FormProvider, __assign({ initialValues: initialValues, ref: formRef }, { children: jsx("form", __assign({ onSubmit: handleSubmit }, { children: children })) })));
+};
+var Form$1 = forwardRef(Form);
+
+export { Form$1 as default };

package/es/Form/Form.types.d.ts

@@ -0,0 +1,39 @@
+export interface FormField {
+    value: unknown;
+    error?: string;
+    warning?: string;
+    rules?: ValidationRule[];
+}
+export interface ValidationRule {
+    required?: boolean;
+    message?: string;
+    type?: 'email' | 'number' | 'string' | 'min' | 'max';
+    min?: number;
+    max?: number;
+}
+export interface FormInstance {
+    setFieldsValue: (values: {
+        [key: string]: unknown;
+    }) => void;
+    getFieldsValue: (names?: string[]) => {
+        [key: string]: unknown;
+    };
+    resetFields: (names?: string[]) => void;
+    validateFields: (names?: string[]) => Promise<{
+        [key: string]: unknown;
+    }>;
+    setFieldsStatus: (status: {
+        type: 'error' | 'warning';
+        name: string | string[];
+        message: string;
+    }[]) => void;
+    registerField: (name: string, rules: ValidationRule[]) => void;
+    unregisterField: (name: string) => void;
+}
+export type FormRefInstance = Omit<FormInstance, 'registerField' | 'unregisterField'>;
+export interface FormContextProps {
+    form: FormInstance;
+    formFields: {
+        [key: string]: FormField;
+    };
+}

package/es/Form/FormContext.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FormContextProps } from './Form.types';
+export declare const FormContext: import("react").Context<FormContextProps | null>;

package/es/Form/FormContext.js

@@ -0,0 +1,5 @@
+import { createContext } from 'react';
+
+var FormContext = createContext(null);
+
+export { FormContext };

package/es/Form/FormItem.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+import './form.css';
+interface FormItemProps {
+    name: string;
+    label?: string;
+    rules?: {
+        required?: boolean;
+        message?: string;
+        type?: 'email' | 'number' | 'string' | 'min' | 'max';
+        min?: number;
+        max?: number;
+    }[];
+    children: ReactNode;
+}
+declare const FormItem: React.FC<FormItemProps>;
+export default FormItem;

package/es/Form/FormItem.js

@@ -0,0 +1,35 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React, { useContext, useEffect, useCallback } from 'react';
+import { FormContext } from './FormContext.js';
+import './form.css.js';
+
+var FormItem = function (_a) {
+    var _b, _c, _d;
+    var name = _a.name, label = _a.label, _e = _a.rules, rules = _e === void 0 ? [] : _e, children = _a.children;
+    var _f = useContext(FormContext), form = _f.form, formFields = _f.formFields;
+    // Register field when component mounts
+    useEffect(function () {
+        form.registerField(name, rules);
+        return function () {
+            form.unregisterField(name);
+        };
+    }, []);
+    var error = (_b = formFields[name]) === null || _b === void 0 ? void 0 : _b.error;
+    var warning = (_c = formFields[name]) === null || _c === void 0 ? void 0 : _c.warning;
+    var value = (_d = formFields[name]) === null || _d === void 0 ? void 0 : _d.value;
+    var handleChange = useCallback(function (e) {
+        var _a;
+        var _b;
+        var newValue = ((_b = e === null || e === void 0 ? void 0 : e.target) === null || _b === void 0 ? void 0 : _b.value) !== undefined ? e.target.value : e;
+        form.setFieldsValue((_a = {}, _a[name] = newValue, _a));
+    }, [form, name]);
+    return (jsxs("div", __assign({ className: "foxit-form-item" }, { children: [label && jsx("label", { children: label }), jsx("span", __assign({ className: "".concat(error ? 'foxit-form-error-component' : warning ? 'foxit-form-warning-component' : '') }, { children: React.Children.map(children, function (child) {
+                    return React.cloneElement(child, {
+                        value: value,
+                        onChange: handleChange
+                    });
+                }) })), error && jsx("div", __assign({ className: "foxit-form-error-text" }, { children: error })), warning && jsx("div", __assign({ className: "foxit-form-warning-text" }, { children: warning }))] })));
+};
+
+export { FormItem as default };

package/es/Form/FormProvider.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { FormInstance } from './Form.types';
+interface FormProviderProps {
+    children: React.ReactNode;
+    initialValues?: {
+        [key: string]: unknown;
+    };
+}
+declare const _default: React.ForwardRefExoticComponent<FormProviderProps & React.RefAttributes<FormInstance>>;
+export default _default;

package/es/Form/FormProvider.js

@@ -0,0 +1,227 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useState, useRef, useEffect, useCallback, useImperativeHandle } from 'react';
+import { FormContext } from './FormContext.js';
+
+var FormProvider = function (_a, ref) {
+    var children = _a.children, _b = _a.initialValues, initialValues = _b === void 0 ? {} : _b;
+    var _c = useState({}), formFields = _c[0], setFormFields = _c[1];
+    var formInstanceRef = useRef({});
+    // 初始值的设置
+    useEffect(function () {
+        if (Object.keys(initialValues).length > 0) {
+            setFormFields(function (prevFields) {
+                var newFields = __assign({}, prevFields);
+                for (var key in initialValues) {
+                    if (!newFields[key]) {
+                        newFields[key] = { value: initialValues[key], rules: [] };
+                    }
+                    else {
+                        newFields[key] = __assign(__assign({}, newFields[key]), { value: initialValues[key] });
+                    }
+                }
+                return newFields;
+            });
+        }
+    }, [initialValues]);
+    // 注册字段
+    var registerField = useCallback(function (name, rules) {
+        setFormFields(function (prevFields) {
+            var _a;
+            return (__assign(__assign({}, prevFields), (_a = {}, _a[name] = __assign(__assign({}, prevFields[name]), { rules: rules || [] }), _a)));
+        });
+    }, []);
+    // 销毁字段
+    var unregisterField = useCallback(function (name) {
+        setFormFields(function (prevFields) {
+            var newFields = __assign({}, prevFields);
+            delete newFields[name];
+            return newFields;
+        });
+    }, []);
+    // 验证字段
+    var validateField = useCallback(function (name, value, rules) {
+        for (var _i = 0, rules_1 = rules; _i < rules_1.length; _i++) {
+            var rule = rules_1[_i];
+            if (rule.required &&
+                (value === undefined ||
+                    value === '' ||
+                    value === null ||
+                    (Array.isArray(value) && value.length === 0) ||
+                    (typeof value === 'object' && Object.keys(value).length === 0))) {
+                return { type: 'error', message: rule.message || 'This field is required' };
+            }
+            if (rule.type === 'email' && value && !/\S+@\S+\.\S+/.test(value)) {
+                return { type: 'error', message: rule.message || 'The input is not valid E-mail' };
+            }
+            if (rule.type === 'number' && value && isNaN(Number(value))) {
+                return { type: 'error', message: rule.message || 'The input is not a number' };
+            }
+            if (rule.type === 'string' && typeof value !== 'string') {
+                return { type: 'error', message: rule.message || 'The input is not a string' };
+            }
+            if (rule.min !== undefined && typeof value === 'string' && value.length < rule.min) {
+                return {
+                    type: 'error',
+                    message: rule.message || "The input is less than ".concat(rule.min, " characters")
+                };
+            }
+            if (rule.max !== undefined && typeof value === 'string' && value.length > rule.max) {
+                return {
+                    type: 'error',
+                    message: rule.message || "The input is more than ".concat(rule.max, " characters")
+                };
+            }
+        }
+        return undefined;
+    }, []);
+    // 设置字段值
+    var setFieldsValue = useCallback(function (values) {
+        setFormFields(function (prevFields) {
+            var _a;
+            var newFields = __assign({}, prevFields);
+            for (var key in values) {
+                if (Object.prototype.hasOwnProperty.call(values, key)) {
+                    var newValue = values[key];
+                    newFields[key] = __assign(__assign({}, newFields[key]), { value: newValue });
+                    // 验证字段
+                    var validation = validateField(key, newValue, ((_a = newFields[key]) === null || _a === void 0 ? void 0 : _a.rules) || []);
+                    if (validation) {
+                        if (validation.type === 'error') {
+                            newFields[key] = __assign(__assign({}, newFields[key]), { error: validation.message, warning: undefined // Clear any previous warnings
+                             });
+                        }
+                        else if (validation.type === 'warning') {
+                            newFields[key] = __assign(__assign({}, newFields[key]), { warning: validation.message, error: undefined // Clear any previous errors
+                             });
+                        }
+                    }
+                    else {
+                        newFields[key] = __assign(__assign({}, newFields[key]), { error: undefined, warning: undefined });
+                    }
+                }
+            }
+            return newFields;
+        });
+    }, [formFields, validateField]);
+    // 获取字段值
+    var getFieldsValue = useCallback(function (names) {
+        if (!names) {
+            return Object.keys(formFields).reduce(function (acc, key) {
+                acc[key] = formFields[key].value;
+                return acc;
+            }, {});
+        }
+        return names.reduce(function (acc, key) {
+            var _a;
+            acc[key] = (_a = formFields[key]) === null || _a === void 0 ? void 0 : _a.value;
+            return acc;
+        }, {});
+    }, [formFields]);
+    // 重置字段
+    var resetFields = useCallback(function (names) {
+        setFormFields(function (prevFields) {
+            var newFields = __assign({}, prevFields);
+            if (names) {
+                names.forEach(function (name) {
+                    if (newFields[name]) {
+                        newFields[name].value = initialValues[name] || '';
+                        newFields[name].error = undefined;
+                        newFields[name].warning = undefined;
+                    }
+                });
+            }
+            else {
+                Object.keys(newFields).forEach(function (key) {
+                    newFields[key].value = initialValues[key] || '';
+                    newFields[key].error = undefined;
+                    newFields[key].warning = undefined;
+                });
+            }
+            return newFields;
+        });
+    }, [formFields, initialValues]);
+    var validateFields = useCallback(function (names) {
+        return new Promise(function (resolve, reject) {
+            var fieldsToValidate = names || Object.keys(formFields);
+            var values = getFieldsValue(fieldsToValidate);
+            var errors = {};
+            for (var _i = 0, fieldsToValidate_1 = fieldsToValidate; _i < fieldsToValidate_1.length; _i++) {
+                var key = fieldsToValidate_1[_i];
+                var field = formFields[key];
+                if (!field)
+                    continue; // Skip if field is not registered
+                var validation = validateField(key, values[key], field.rules || []);
+                if (validation) {
+                    if (validation.type === 'error') {
+                        errors[key] = validation.message;
+                    }
+                    else if (validation.type === 'warning') {
+                        validation.message;
+                    }
+                }
+            }
+            if (Object.keys(errors).length > 0) {
+                setFormFields(function (prevFields) {
+                    var newFields = __assign({}, prevFields);
+                    for (var key in errors) {
+                        newFields[key] = __assign(__assign({}, newFields[key]), { error: errors[key] });
+                    }
+                    return newFields;
+                });
+                reject(errors);
+            }
+            else {
+                resolve(values);
+            }
+        });
+    }, [formFields, getFieldsValue, validateField]);
+    var setFieldsStatus = useCallback(function (status) {
+        setFormFields(function (prevFields) {
+            var newFields = __assign({}, prevFields);
+            status.forEach(function (_a) {
+                var type = _a.type, name = _a.name, message = _a.message;
+                if (Array.isArray(name)) {
+                    name.forEach(function (n) {
+                        if (newFields[n]) {
+                            // Only update if field exists
+                            if (type === 'error') {
+                                newFields[n] = __assign(__assign({}, newFields[n]), { error: message });
+                            }
+                            else if (type === 'warning') {
+                                newFields[n] = __assign(__assign({}, newFields[n]), { warning: message });
+                            }
+                        }
+                    });
+                }
+                else {
+                    if (newFields[name]) {
+                        // Only update if field exists
+                        if (type === 'error') {
+                            newFields[name] = __assign(__assign({}, newFields[name]), { error: message });
+                        }
+                        else if (type === 'warning') {
+                            newFields[name] = __assign(__assign({}, newFields[name]), { warning: message });
+                        }
+                    }
+                }
+            });
+            return newFields;
+        });
+    }, [formFields]);
+    // 暴露给外部的方法
+    useImperativeHandle(ref, function () { return (__assign({}, formInstanceRef.current)); });
+    formInstanceRef.current = {
+        setFieldsValue: setFieldsValue,
+        getFieldsValue: getFieldsValue,
+        resetFields: resetFields,
+        validateFields: validateFields,
+        setFieldsStatus: setFieldsStatus,
+        registerField: registerField,
+        unregisterField: unregisterField
+    };
+    return (jsx(FormContext.Provider, __assign({ value: { form: formInstanceRef.current, formFields: formFields } }, { children: children })));
+};
+var FormProvider$1 = forwardRef(FormProvider);
+
+export { FormProvider$1 as default };

package/es/Form/form.css.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".foxit-form-item {\n  margin-bottom: 16px;\n}\n\n.foxit-form-item label {\n  display: block;\n  margin-bottom: 8px;\n  font-weight: 500;\n  font-size: 14px;\n  color: #525252;\n}\n\n.foxit-form-error-text {\n  margin-top: 8px;\n  color: red;\n}\n\n.foxit-form-warning-text {\n  margin-top: 8px;\n  color: orange;\n}\n\n.foxit-form-item > .foxit-form-error-component .foxit-input-wrapper,\n.foxit-form-item > .foxit-form-error-component .foxit-select-wrapper > :nth-child(3),\n.foxit-form-item > .foxit-form-error-component .foxit-checkbox-container,\n.foxit-form-item > .foxit-form-error-component .foxit-radio-container {\n  border: 1px solid red !important;\n}\n\n.foxit-form-item > .foxit-form-warning-component .foxit-input-wrapper,\n.foxit-form-item > .foxit-form-warning-component .foxit-select-wrapper > :nth-child(3),\n.foxit-form-item > .foxit-form-warning-component .foxit-checkbox-container,\n.foxit-form-item > .foxit-form-warning-component .foxit-radio-container {\n  border-color: orange !important;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/Icon/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { AppIconsType } from '../constants/icons';
+export interface IconProps {
+    name: AppIconsType;
+    className?: string;
+}
+export declare const Icon: React.FC<IconProps>;

package/es/Icon/index.js

@@ -0,0 +1,9 @@
+import { ICONS } from '../constants/icons.js';
+
+var Icon = function (_a) {
+    var _b;
+    var name = _a.name, className = _a.className;
+    return (_b = ICONS[name]) === null || _b === void 0 ? void 0 : _b.call(ICONS, className);
+};
+
+export { Icon };

package/es/Input/Input.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './input.css';
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    addonAfter?: React.ReactNode;
+}
+declare const Input: React.FC<InputProps>;
+interface SearchInputProps extends InputProps {
+    onSearch?: (value: string) => void;
+}
+declare const SearchInput: React.FC<SearchInputProps>;
+declare const PasswordInput: React.FC<InputProps>;
+export default Input;
+export { SearchInput, PasswordInput };

package/es/Input/Input.js

@@ -0,0 +1,28 @@
+import { __rest, __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import './input.css.js';
+import { Icon } from '../Icon/index.js';
+
+var Input = function (_a) {
+    var addonAfter = _a.addonAfter, rest = __rest(_a, ["addonAfter"]);
+    return (jsxs("div", __assign({ className: "foxit-input-wrapper" }, { children: [jsx("input", __assign({}, rest, { className: "foxit-input-element" })), addonAfter && jsx("div", __assign({ className: "foxit-input-addon" }, { children: addonAfter }))] })));
+};
+var SearchInput = function (_a) {
+    var onSearch = _a.onSearch, rest = __rest(_a, ["onSearch"]);
+    var handleSearch = function () {
+        if (onSearch) {
+            onSearch(rest.value);
+        }
+    };
+    return (jsx(Input, __assign({}, rest, { addonAfter: jsx("div", __assign({ style: { display: 'flex' }, onClick: handleSearch }, { children: jsx(Icon, { name: "SearchOutlined" }) })) })));
+};
+var PasswordInput = function (props) {
+    var _a = useState(false), visible = _a[0], setVisible = _a[1];
+    var toggleVisibility = function () {
+        setVisible(!visible);
+    };
+    return (jsx(Input, __assign({}, props, { type: visible ? 'text' : 'password', addonAfter: jsx("div", __assign({ style: { display: 'flex' }, onClick: toggleVisibility }, { children: jsx(Icon, { name: visible ? 'EyeOutlined' : 'EyeInvisibleOutlined' }) })) })));
+};
+
+export { PasswordInput, SearchInput, Input as default };

package/es/Input/input.css.js

@@ -0,0 +1,6 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".foxit-input-wrapper {\n  display: flex;\n  align-items: center;\n  border: 1px solid #d9d9d9;\n  border-radius: 10px;\n  padding: 11px 16px;\n  transition: border-color 0.3s;\n  font-size: 14px;\n  font-weight: 400;\n}\n\n.foxit-input-wrapper:focus-within {\n  border-color: #ff5f00 !important;\n}\n.foxit-input-wrapper:hover {\n  border-color: #757575;\n}\n\n.foxit-input-element {\n  flex: 1;\n  border: none;\n  outline: none;\n  color: #525252;\n  line-height: 24px;\n}\n\n.foxit-input-element::placeholder {\n  color: #b3b3b3;\n}\n\n.foxit-input-addon {\n  display: flex;\n  align-items: center;\n  padding: 0 8px;\n  cursor: pointer;\n  color: #b3b3b3;\n  transition: color 0.3s;\n}\n\n.foxit-input-wrapper:focus-within .foxit-input-addon {\n  color: #ff5f00 !important;\n}\n.foxit-input-wrapper:hover .foxit-input-addon {\n  color: #757575;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };

package/es/Menu/Menu.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import type { ReactNode, Key } from 'react';
+import './menu.css';
+export interface MenuItem {
+    key: Key;
+    icon?: ReactNode;
+    children?: MenuItem[];
+    label: ReactNode;
+    type?: 'group';
+}
+interface MenuProps {
+    items: MenuItem[];
+    onClick?: (e: {
+        key: string;
+    }) => void;
+    defaultSelectedKeys?: string[];
+    defaultOpenKeys?: string[];
+    style?: React.CSSProperties;
+}
+export declare const getItem: (label: ReactNode, key: Key, icon?: ReactNode, children?: MenuItem[], type?: 'group') => MenuItem;
+declare const Menu: React.FC<MenuProps>;
+export default Menu;