@tachybase/client 0.23.8-alpha.21 → 0.23.8-alpha.22

package/lib/schema-component/antd/remote-select/RemoteSelect.mjs

@@ -0,0 +1,291 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_schema__ from "@tachybase/schema";
+import * as __WEBPACK_EXTERNAL_MODULE__ant_design_icons__ from "@ant-design/icons";
+import * as __WEBPACK_EXTERNAL_MODULE_antd__ from "antd";
+import * as __WEBPACK_EXTERNAL_MODULE_dayjs__ from "dayjs";
+import * as __WEBPACK_EXTERNAL_MODULE_lodash__ from "lodash";
+import * as __WEBPACK_EXTERNAL_MODULE__api_client_index_mjs__ from "../../../api-client/index.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__collection_manager_index_mjs__ from "../../../collection-manager/index.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__data_source_data_source_DataSourceProvider_mjs__ from "../../../data-source/data-source/DataSourceProvider.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__data_source_utils_mjs__ from "../../../data-source/utils.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__filter_provider_utils_mjs__ from "../../../filter-provider/utils.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__hooks_index_mjs__ from "../../hooks/index.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__select_index_mjs__ from "../select/index.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__ReadPretty_mjs__ from "./ReadPretty.mjs";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/schema"
+
+;// CONCATENATED MODULE: external "@ant-design/icons"
+
+;// CONCATENATED MODULE: external "antd"
+
+;// CONCATENATED MODULE: external "dayjs"
+
+;// CONCATENATED MODULE: external "lodash"
+
+;// CONCATENATED MODULE: external "../../../api-client/index.mjs"
+
+;// CONCATENATED MODULE: external "../../../collection-manager/index.mjs"
+
+;// CONCATENATED MODULE: external "../../../data-source/data-source/DataSourceProvider.mjs"
+
+;// CONCATENATED MODULE: external "../../../data-source/utils.mjs"
+
+;// CONCATENATED MODULE: external "../../../filter-provider/utils.mjs"
+
+;// CONCATENATED MODULE: external "../../hooks/index.mjs"
+
+;// CONCATENATED MODULE: external "../select/index.mjs"
+
+;// CONCATENATED MODULE: external "./ReadPretty.mjs"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/remote-select/RemoteSelect.tsx?__rslib_entry__
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const EMPTY = 'N/A';
+const InternalRemoteSelect = (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.connect)((props)=>{
+    var _fieldSchema_xcomponentprops, _service_params;
+    const { fieldNames = {}, service = {}, wait = 300, value, defaultValue, objectValue, manual = true, mapOptions, targetField: _targetField, CustomDropdownRender, optionFilter, ...others } = props;
+    const dataSource = (0,__WEBPACK_EXTERNAL_MODULE__data_source_data_source_DataSourceProvider_mjs__.useDataSourceKey)();
+    const headers = (0,__WEBPACK_EXTERNAL_MODULE__data_source_utils_mjs__.useDataSourceHeaders)(dataSource);
+    const [open, setOpen] = (0,__WEBPACK_EXTERNAL_MODULE_react__.useState)(false);
+    const firstRun = (0,__WEBPACK_EXTERNAL_MODULE_react__.useRef)(false);
+    const fieldSchema = (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useFieldSchema)();
+    const isQuickAdd = ((_fieldSchema_xcomponentprops = fieldSchema['x-component-props']) === null || _fieldSchema_xcomponentprops === void 0 ? void 0 : _fieldSchema_xcomponentprops.addMode) === 'quickAdd';
+    const { getField } = (0,__WEBPACK_EXTERNAL_MODULE__collection_manager_index_mjs__.useCollection_deprecated)();
+    const searchData = (0,__WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
+    const { getCollectionJoinField, getInterface } = (0,__WEBPACK_EXTERNAL_MODULE__collection_manager_index_mjs__.useCollectionManager_deprecated)();
+    const colletionFieldName = fieldSchema['x-collection-field'] || fieldSchema.name;
+    const collectionField = getField(colletionFieldName) || getCollectionJoinField(colletionFieldName);
+    const targetField = _targetField || (collectionField === null || collectionField === void 0 ? void 0 : collectionField.target) && (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) && getCollectionJoinField("".concat(collectionField.target, ".").concat(fieldNames.label));
+    const operator = (0,__WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
+        if (targetField === null || targetField === void 0 ? void 0 : targetField.interface) {
+            var _getInterface_filterable_operators_, _getInterface_filterable_operators, _getInterface_filterable, _getInterface;
+            return ((_getInterface = getInterface(targetField.interface)) === null || _getInterface === void 0 ? void 0 : (_getInterface_filterable = _getInterface.filterable) === null || _getInterface_filterable === void 0 ? void 0 : (_getInterface_filterable_operators = _getInterface_filterable.operators) === null || _getInterface_filterable_operators === void 0 ? void 0 : (_getInterface_filterable_operators_ = _getInterface_filterable_operators[0]) === null || _getInterface_filterable_operators_ === void 0 ? void 0 : _getInterface_filterable_operators_.value) || '$includes';
+        }
+        return '$includes';
+    }, [
+        targetField
+    ]);
+    const compile = (0,__WEBPACK_EXTERNAL_MODULE__hooks_index_mjs__.useCompile)();
+    const mapOptionsToTags = (0,__WEBPACK_EXTERNAL_MODULE_react__.useCallback)((options)=>{
+        try {
+            return options.filter((v)=>[
+                    'number',
+                    'string'
+                ].includes(typeof v[fieldNames.value])).map((option)=>{
+                var _targetField_uiSchema;
+                let label = compile(option[fieldNames.label]);
+                if (targetField === null || targetField === void 0 ? void 0 : (_targetField_uiSchema = targetField.uiSchema) === null || _targetField_uiSchema === void 0 ? void 0 : _targetField_uiSchema.enum) {
+                    if (Array.isArray(label)) {
+                        label = label.map((item, index)=>{
+                            const option = targetField.uiSchema.enum.find((i)=>i.value === item);
+                            if (option) {
+                                return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_antd__.Tag, {
+                                    role: "button",
+                                    color: option.color,
+                                    style: {
+                                        marginRight: 3
+                                    },
+                                    children: (option === null || option === void 0 ? void 0 : option.label) || item
+                                }, index);
+                            } else {
+                                return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_antd__.Tag, {
+                                    role: "button",
+                                    children: item
+                                }, item);
+                            }
+                        }).reverse();
+                    } else {
+                        const item = targetField.uiSchema.enum.find((i)=>i.value === label);
+                        if (item) {
+                            label = /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_antd__.Tag, {
+                                role: "button",
+                                color: item.color,
+                                children: item.label
+                            });
+                        }
+                    }
+                }
+                if ((targetField === null || targetField === void 0 ? void 0 : targetField.type) === 'date') {
+                    label = (0,__WEBPACK_EXTERNAL_MODULE_dayjs__["default"])(label).format('YYYY-MM-DD');
+                }
+                if (mapOptions) {
+                    return mapOptions({
+                        [fieldNames.label]: label || EMPTY,
+                        [fieldNames.value]: option[fieldNames.value]
+                    });
+                }
+                return {
+                    ...option,
+                    [fieldNames.label]: label || EMPTY,
+                    [fieldNames.value]: option[fieldNames.value]
+                };
+            }).filter(Boolean);
+        } catch (err) {
+            console.error(err);
+            return options;
+        }
+    }, [
+        targetField === null || targetField === void 0 ? void 0 : targetField.uiSchema,
+        fieldNames
+    ]);
+    const { data, run, loading } = (0,__WEBPACK_EXTERNAL_MODULE__api_client_index_mjs__.useRequest)({
+        action: 'list',
+        ...service,
+        headers,
+        params: {
+            pageSize: fieldNames['formula'] ? 9999 : 200,
+            ...service === null || service === void 0 ? void 0 : service.params,
+            filter: service === null || service === void 0 ? void 0 : (_service_params = service.params) === null || _service_params === void 0 ? void 0 : _service_params.filter
+        }
+    }, {
+        manual,
+        debounceWait: wait
+    });
+    const runDep = (0,__WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>JSON.stringify({
+            service,
+            fieldNames
+        }), [
+        service,
+        fieldNames
+    ]);
+    const CustomRenderCom = (0,__WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
+        if (searchData.current && CustomDropdownRender) {
+            return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(CustomDropdownRender, {
+                search: searchData.current,
+                callBack: ()=>{
+                    searchData.current = null;
+                    setOpen(false);
+                }
+            });
+        }
+        return null;
+    }, [
+        searchData.current
+    ]);
+    (0,__WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        // Lazy load
+        if (firstRun.current) {
+            run();
+        }
+    }, [
+        runDep
+    ]);
+    const onSearch = async (search)=>{
+        var _service_params;
+        run({
+            filter: (0,__WEBPACK_EXTERNAL_MODULE__filter_provider_utils_mjs__.mergeFilter)([
+                search ? {
+                    [fieldNames.label]: {
+                        [operator]: search
+                    }
+                } : {},
+                service === null || service === void 0 ? void 0 : (_service_params = service.params) === null || _service_params === void 0 ? void 0 : _service_params.filter
+            ])
+        });
+        searchData.current = search;
+    };
+    const options = (0,__WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
+        var _data_data;
+        const v = value || defaultValue;
+        if (!(data === null || data === void 0 ? void 0 : (_data_data = data.data) === null || _data_data === void 0 ? void 0 : _data_data.length)) {
+            return v != null ? Array.isArray(v) ? v : [
+                v
+            ] : [];
+        }
+        const valueOptions = v != null && (Array.isArray(v) ? v : [
+            {
+                ...v,
+                [fieldNames.value]: v[fieldNames.value] || v
+            }
+        ]) || [];
+        const filtered = typeof optionFilter === 'function' ? data.data.filter(optionFilter) : data.data;
+        return (0,__WEBPACK_EXTERNAL_MODULE_lodash__.uniqBy)(filtered.concat(valueOptions !== null && valueOptions !== void 0 ? valueOptions : []), fieldNames.value);
+    }, [
+        value,
+        defaultValue,
+        data === null || data === void 0 ? void 0 : data.data,
+        fieldNames.value,
+        optionFilter
+    ]);
+    const onDropdownVisibleChange = (visible)=>{
+        setOpen(visible);
+        searchData.current = null;
+        if (visible) {
+            run();
+        }
+        firstRun.current = true;
+    };
+    return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__select_index_mjs__.Select, {
+        open: open,
+        popupMatchSelectWidth: false,
+        autoClearSearchValue: true,
+        filterOption: false,
+        filterSort: null,
+        fieldNames: fieldNames,
+        onSearch: onSearch,
+        onDropdownVisibleChange: onDropdownVisibleChange,
+        objectValue: objectValue,
+        value: value,
+        defaultValue: defaultValue,
+        ...others,
+        loading: data ? loading : true,
+        options: mapOptionsToTags(options),
+        rawOptions: options,
+        dropdownRender: (menu)=>{
+            const isFullMatch = options.some((v)=>v[fieldNames.label] === searchData.current);
+            return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.Fragment, {
+                children: isQuickAdd ? /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.Fragment, {
+                    children: [
+                        !((data === null || data === void 0 ? void 0 : data.data.length) === 0 && (searchData === null || searchData === void 0 ? void 0 : searchData.current)) && menu,
+                        (data === null || data === void 0 ? void 0 : data.data.length) > 0 && (searchData === null || searchData === void 0 ? void 0 : searchData.current) && !isFullMatch && /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_antd__.Divider, {
+                            style: {
+                                margin: 0
+                            }
+                        }),
+                        !isFullMatch && /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(CustomRenderCom, {})
+                    ]
+                }) : menu
+            });
+        }
+    });
+}, (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.mapProps)({
+    dataSource: 'options'
+}, (props, field)=>{
+    var _fieldSchema_xcomponentprops;
+    const fieldSchema = (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useFieldSchema)();
+    return {
+        ...props,
+        fieldNames: {
+            ...__WEBPACK_EXTERNAL_MODULE__select_index_mjs__.defaultFieldNames,
+            ...props.fieldNames,
+            ...field.componentProps.fieldNames,
+            ...(_fieldSchema_xcomponentprops = fieldSchema['x-component-props']) === null || _fieldSchema_xcomponentprops === void 0 ? void 0 : _fieldSchema_xcomponentprops.fieldNames
+        },
+        suffixIcon: (field === null || field === void 0 ? void 0 : field['loading']) || (field === null || field === void 0 ? void 0 : field['validating']) ? /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__ant_design_icons__.LoadingOutlined, {}) : props.suffixIcon
+    };
+}), (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.mapReadPretty)(__WEBPACK_EXTERNAL_MODULE__ReadPretty_mjs__.ReadPretty));
+const RemoteSelect = InternalRemoteSelect;
+RemoteSelect.ReadPretty = __WEBPACK_EXTERNAL_MODULE__ReadPretty_mjs__.ReadPretty;
+/* ESM default export */ const RemoteSelect_rslib_entry_ = (RemoteSelect);
+
+export { RemoteSelect, RemoteSelect_rslib_entry_ as default };

package/lib/schema-component/antd/remote-select/__tests__/remote-select.test.mjs

@@ -0,0 +1,33 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_test_client__ from "@tachybase/test/client";
+import * as __WEBPACK_EXTERNAL_MODULE__demos_demo1_mjs__ from "../demos/demo1.mjs";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/test/client"
+
+;// CONCATENATED MODULE: external "../demos/demo1.mjs"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/remote-select/__tests__/remote-select.test.tsx?__rslib_entry__
+
+
+
+
+describe('RemoteSelect', ()=>{
+    it('should render correctly', async ()=>{
+        (0,__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.render)(/*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__demos_demo1_mjs__["default"], {}));
+        const selector = document.querySelector('.ant-select-selector');
+        expect(selector).toBeInTheDocument();
+        await __WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.userEvent.click(selector);
+        // 下拉框中显示 loading
+        expect(document.querySelector('.ant-spin')).toBeInTheDocument();
+        // 等待接口返回数据
+        await (0,__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.sleep)(500);
+        expect(__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.screen.getByText('title1')).toBeInTheDocument();
+        expect(__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.screen.getByText('title2')).toBeInTheDocument();
+    });
+});
+

package/lib/schema-component/antd/remote-select/demos/demo1.mjs

@@ -0,0 +1,75 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_client__ from "@tachybase/client";
+import * as __WEBPACK_EXTERNAL_MODULE__testUtils_index_mjs__ from "../../../../testUtils/index.mjs";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/client"
+
+;// CONCATENATED MODULE: external "../../../../testUtils/index.mjs"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/remote-select/demos/demo1.tsx?__rslib_entry__
+
+
+
+
+const { apiClient, mockRequest } = (0,__WEBPACK_EXTERNAL_MODULE__testUtils_index_mjs__.mockAPIClient)();
+mockRequest.onGet('/posts:list').reply(()=>{
+    return [
+        200,
+        {
+            data: [
+                {
+                    id: 1,
+                    title: 'title1'
+                },
+                {
+                    id: 2,
+                    title: 'title2'
+                }
+            ]
+        }
+    ];
+});
+// 写一个简单的 schema
+const schema = {
+    type: 'object',
+    properties: {
+        association: {
+            type: 'array',
+            'x-component': 'RemoteSelect',
+            'x-component-props': {
+                multiple: true,
+                fieldNames: {
+                    label: 'title',
+                    value: 'id'
+                },
+                service: {
+                    resource: 'posts',
+                    action: 'list'
+                },
+                style: {
+                    width: '100%'
+                }
+            }
+        }
+    }
+};
+/* ESM default export */ const demo1_rslib_entry_ = ((()=>{
+    return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_client__.FormProvider, {
+        children: /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_client__.APIClientProvider, {
+            apiClient: apiClient,
+            children: /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_client__.SchemaComponent, {
+                components: {
+                    RemoteSelect: __WEBPACK_EXTERNAL_MODULE__tachybase_client__.RemoteSelect
+                },
+                schema: schema
+            })
+        })
+    });
+}));
+
+export { demo1_rslib_entry_ as default };

package/lib/schema-component/antd/remote-select/index.mjs

@@ -0,0 +1,5 @@
+export * from "./RemoteSelect.mjs";
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/remote-select/index.ts?__rslib_entry__
+
+

package/lib/schema-component/antd/remote-select/shared.mjs

@@ -0,0 +1,11 @@
+import * as __WEBPACK_EXTERNAL_MODULE_lodash__ from "lodash";
+
+;// CONCATENATED MODULE: external "lodash"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/remote-select/shared.ts?__rslib_entry__
+
+const getValues = (values, fieldNames)=>{
+    return (0,__WEBPACK_EXTERNAL_MODULE_lodash__.castArray)(values).filter((item)=>item != null).map((val)=>typeof val === 'object' ? val[fieldNames.value] : val);
+};
+
+export { getValues };

package/lib/schema-component/antd/rich-text/RichText.mjs

@@ -0,0 +1,85 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_schema__ from "@tachybase/schema";
+import * as __WEBPACK_EXTERNAL_MODULE_react_quill__ from "react-quill";
+import * as __WEBPACK_EXTERNAL_MODULE__variables_utils_isVariable_mjs__ from "../../../variables/utils/isVariable.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__input_index_mjs__ from "../input/index.mjs";
+import * as __WEBPACK_EXTERNAL_MODULE__style_mjs__ from "./style.mjs";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/schema"
+
+;// CONCATENATED MODULE: external "react-quill"
+
+;// CONCATENATED MODULE: external "../../../variables/utils/isVariable.mjs"
+
+;// CONCATENATED MODULE: external "../input/index.mjs"
+
+;// CONCATENATED MODULE: external "./style.mjs"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/rich-text/RichText.tsx?__rslib_entry__
+
+
+
+
+
+
+
+const RichText = (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.connect)((props)=>{
+    const { wrapSSR, hashId, componentCls } = (0,__WEBPACK_EXTERNAL_MODULE__style_mjs__.useStyles)();
+    const modules = {
+        toolbar: [
+            [
+                'bold',
+                'italic',
+                'underline',
+                'link'
+            ],
+            [
+                {
+                    list: 'ordered'
+                },
+                {
+                    list: 'bullet'
+                }
+            ],
+            [
+                'clean'
+            ]
+        ]
+    };
+    const formats = [
+        'header',
+        'bold',
+        'italic',
+        'underline',
+        'strike',
+        'blockquote',
+        'list',
+        'bullet',
+        'indent',
+        'link',
+        'image'
+    ];
+    const { value, defaultValue, onChange, disabled } = props;
+    const resultValue = (0,__WEBPACK_EXTERNAL_MODULE__variables_utils_isVariable_mjs__.isVariable)(value || defaultValue) ? undefined : value || defaultValue || '';
+    return wrapSSR(/*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_quill__["default"], {
+        className: "".concat(componentCls, " ").concat(hashId),
+        modules: modules,
+        formats: formats,
+        value: resultValue,
+        onChange: onChange,
+        readOnly: disabled
+    }));
+}, (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.mapProps)({
+    initialValue: 'defaultValue'
+}), (0,__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.mapReadPretty)((props)=>{
+    return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__input_index_mjs__.ReadPretty.Html, {
+        ...props
+    });
+}));
+
+export { RichText };

package/lib/schema-component/antd/rich-text/__tests__/rich-text.test.mjs

@@ -0,0 +1,28 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_test_client__ from "@tachybase/test/client";
+import * as __WEBPACK_EXTERNAL_MODULE__demos_demo1_mjs__ from "../demos/demo1.mjs";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/test/client"
+
+;// CONCATENATED MODULE: external "../demos/demo1.mjs"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/rich-text/__tests__/rich-text.test.tsx?__rslib_entry__
+
+
+
+
+describe('RichText', ()=>{
+    it('should display the value of user input', async ()=>{
+        const { container } = (0,__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.render)(/*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__demos_demo1_mjs__["default"], {}));
+        const editor = container.querySelector('.ql-editor');
+        editor.focus();
+        await __WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.userEvent.type(editor, "Hello World");
+        expect(__WEBPACK_EXTERNAL_MODULE__tachybase_test_client__.screen.queryAllByText('Hello World')).toHaveLength(2);
+    });
+});
+

package/lib/schema-component/antd/rich-text/demos/demo1.mjs

@@ -0,0 +1,61 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_client__ from "@tachybase/client";
+import * as __WEBPACK_EXTERNAL_MODULE__tachybase_components__ from "@tachybase/components";
+import * as __WEBPACK_EXTERNAL_MODULE_react_quill_dist_quill_snow_css__ from "react-quill/dist/quill.snow.css";
+
+;// CONCATENATED MODULE: external "react/jsx-runtime"
+
+;// CONCATENATED MODULE: external "react"
+
+;// CONCATENATED MODULE: external "@tachybase/client"
+
+;// CONCATENATED MODULE: external "@tachybase/components"
+
+;// CONCATENATED MODULE: external "react-quill/dist/quill.snow.css"
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/rich-text/demos/demo1.tsx?__rslib_entry__
+
+
+
+
+ // ES6
+const schema = {
+    type: 'object',
+    properties: {
+        input: {
+            type: 'string',
+            title: "Editable",
+            'x-decorator': 'FormItem',
+            'x-component': 'RichText',
+            'x-reactions': {
+                target: 'read',
+                fulfill: {
+                    state: {
+                        value: '{{$self.value}}'
+                    }
+                }
+            }
+        },
+        read: {
+            type: 'string',
+            title: "Read pretty",
+            'x-read-pretty': true,
+            'x-decorator': 'FormItem',
+            'x-component': 'RichText'
+        }
+    }
+};
+/* ESM default export */ const demo1_rslib_entry_ = ((()=>{
+    return /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_client__.SchemaComponentProvider, {
+        components: {
+            RichText: __WEBPACK_EXTERNAL_MODULE__tachybase_client__.RichText,
+            FormItem: __WEBPACK_EXTERNAL_MODULE__tachybase_components__.FormItem
+        },
+        children: /*#__PURE__*/ (0,__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_client__.SchemaComponent, {
+            schema: schema
+        })
+    });
+}));
+
+export { demo1_rslib_entry_ as default };

package/lib/schema-component/antd/rich-text/index.mjs

@@ -0,0 +1,5 @@
+export * from "./RichText.mjs";
+
+;// CONCATENATED MODULE: ./packages/client/src/schema-component/antd/rich-text/index.ts?__rslib_entry__
+
+