@luck-design-biz/luckda 1.0.1-6 → 1.0.1-8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +40 -40
- package/es/components/LDActions/index.less +68 -68
- package/es/components/LdFormList/index.js +12 -1
- package/es/components/LdGrid/index.js +4 -4
- package/es/components/LdGridForm/index.less +7 -7
- package/es/components/LdTree/index.less +40 -40
- package/es/helper/action.js +6 -6
- package/es/helper/form.js +14 -14
- package/es/helper/index.less +7 -7
- package/es/lowcode/constants/api-url.js +87 -87
- package/es/lowcode/engine/meta/js-editor/auto-complete.json +28 -28
- package/es/lowcode/engine/meta/table.props.json +1 -1
- package/es/lowcode/engine/provider/ContextProvider/index.js +44 -44
- package/es/lowcode/engine/tools/dataProcess.js +76 -76
- package/es/lowcode/painter/Components.js +2 -2
- package/es/lowcode/painter/components/Collapse.js +26 -26
- package/es/lowcode/painter/components/ColorInput.js +24 -24
- package/es/lowcode/painter/components/ListEditor.js +24 -24
- package/es/lowcode/painter/components/NumberInput.js +28 -28
- package/es/lowcode/painter/components/PanelItem.js +24 -24
- package/es/lowcode/painter/components/PopConfirm.js +8 -8
- package/es/lowcode/painter/components/PopForm.js +27 -27
- package/es/lowcode/painter/components/RuleInput.js +30 -30
- package/es/lowcode/painter/components/SortBox.js +22 -22
- package/es/lowcode/painter/components/code-editor/BaseEditor.js +32 -32
- package/es/lowcode/painter/components/code-editor/CssEditor.js +25 -25
- package/es/lowcode/painter/components/code-editor/FullScreenEditor.js +23 -23
- package/es/lowcode/painter/components/code-editor/JSEditor.js +20 -20
- package/es/lowcode/painter/components/code-editor/JsonEditor.js +25 -25
- package/es/lowcode/painter/panel-section/Icon.js +23 -23
- package/es/lowcode/painter/panel-section/IconSelector.js +16 -16
- package/es/lowcode/painter/panel-section/LayoutRatio.js +21 -21
- package/es/lowcode/painter/panel-section/StylePanel/BackGround.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Border.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/BorderRadius.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/BorderRadiusSelector.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/BorderSelector.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Display.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Font.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/FontEditor.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/GapSelector.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/HighLightPanel.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/HighLigthtSpan.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/HightLightSvg.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/MainPanel.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Margin.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Opacity.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Padding.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Pointer.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Shadow.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/Size.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/StyleContext.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/StyleRow.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/WidthHeight.js +2 -2
- package/es/lowcode/painter/panel-section/StylePanel/index.js +15 -15
- package/es/lowcode/painter/style/action-bind-modal.less +102 -102
- package/es/lowcode/painter/style/actions-editor.less +15 -15
- package/es/lowcode/painter/style/border-editor.less +36 -36
- package/es/lowcode/painter/style/border-radius-selector.less +42 -42
- package/es/lowcode/painter/style/border-selector.less +39 -39
- package/es/lowcode/painter/style/button-type.less +5 -5
- package/es/lowcode/painter/style/collapse.less +28 -28
- package/es/lowcode/painter/style/color-input.less +19 -19
- package/es/lowcode/painter/style/components.less +91 -91
- package/es/lowcode/painter/style/design.less +166 -166
- package/es/lowcode/painter/style/display.less +17 -17
- package/es/lowcode/painter/style/dragdrop.less +10 -10
- package/es/lowcode/painter/style/fields-setting.less +25 -25
- package/es/lowcode/painter/style/font-editor.less +9 -9
- package/es/lowcode/painter/style/fullscreen-editor.less +17 -17
- package/es/lowcode/painter/style/icon-selector.less +22 -22
- package/es/lowcode/painter/style/icon.less +10 -10
- package/es/lowcode/painter/style/impexp.less +7 -7
- package/es/lowcode/painter/style/index.less +6 -6
- package/es/lowcode/painter/style/layout-ratio.less +51 -51
- package/es/lowcode/painter/style/list-editor.less +95 -95
- package/es/lowcode/painter/style/number-input.less +17 -17
- package/es/lowcode/painter/style/outline.less +28 -28
- package/es/lowcode/painter/style/page-layout-display.less +27 -27
- package/es/lowcode/painter/style/page-vars.less +25 -25
- package/es/lowcode/painter/style/panel-attrs.less +43 -43
- package/es/lowcode/painter/style/panel-item.less +54 -54
- package/es/lowcode/painter/style/panel.less +98 -98
- package/es/lowcode/painter/style/pop-confirm.less +17 -17
- package/es/lowcode/painter/style/pop-form.less +19 -19
- package/es/lowcode/painter/style/radio.less +24 -24
- package/es/lowcode/painter/style/ribbon.less +5 -5
- package/es/lowcode/painter/style/rule-input.less +12 -12
- package/es/lowcode/painter/style/split-display.less +18 -18
- package/es/lowcode/painter/style/style-panel.less +37 -37
- package/es/lowcode/painter/style/tabitems.less +90 -90
- package/es/lowcode/painter/style/treedragdrop.less +19 -19
- package/es/lowcode/view/lc-components/Box/index.js +4 -4
- package/es/lowcode/view/lc-components/Box/index.less +14 -14
- package/es/lowcode/view/lc-components/Box/meta.json +40 -40
- package/es/lowcode/view/lc-components/Button/index.js +33 -33
- package/es/lowcode/view/lc-components/Button/meta.json +127 -127
- package/es/lowcode/view/lc-components/Button/style.less +2 -2
- package/es/lowcode/view/lc-components/CardList/meta.json +154 -154
- package/es/lowcode/view/lc-components/Dialog/index.js +13 -13
- package/es/lowcode/view/lc-components/Dialog/index.less +12 -12
- package/es/lowcode/view/lc-components/Dialog/meta.json +204 -204
- package/es/lowcode/view/lc-components/Drawer/index.js +13 -13
- package/es/lowcode/view/lc-components/Drawer/index.less +13 -13
- package/es/lowcode/view/lc-components/Drawer/meta.json +242 -242
- package/es/lowcode/view/lc-components/FieldColor/meta.json +157 -157
- package/es/lowcode/view/lc-components/FieldComplex/meta.json +140 -140
- package/es/lowcode/view/lc-components/FieldDate/meta.json +141 -141
- package/es/lowcode/view/lc-components/FieldDict/meta.json +138 -138
- package/es/lowcode/view/lc-components/FieldEditor/meta.json +138 -138
- package/es/lowcode/view/lc-components/FieldGroup/meta.json +167 -167
- package/es/lowcode/view/lc-components/FieldNumber/meta.json +143 -143
- package/es/lowcode/view/lc-components/FieldRadio/meta.json +115 -115
- package/es/lowcode/view/lc-components/FieldRegion/meta.json +121 -121
- package/es/lowcode/view/lc-components/FieldSelect/meta.json +152 -152
- package/es/lowcode/view/lc-components/FieldString/meta.json +152 -152
- package/es/lowcode/view/lc-components/FieldSwitch/meta.json +125 -125
- package/es/lowcode/view/lc-components/FieldTextarea/meta.json +143 -143
- package/es/lowcode/view/lc-components/FieldUpload/meta.json +165 -165
- package/es/lowcode/view/lc-components/FieldUser/meta.json +176 -176
- package/es/lowcode/view/lc-components/FieldYear/meta.json +129 -129
- package/es/lowcode/view/lc-components/Form/index.js +20 -20
- package/es/lowcode/view/lc-components/Form/meta.json +645 -645
- package/es/lowcode/view/lc-components/Iframe/meta.json +33 -33
- package/es/lowcode/view/lc-components/ImEx/index.js +25 -25
- package/es/lowcode/view/lc-components/ImEx/index.less +7 -7
- package/es/lowcode/view/lc-components/ImEx/meta.json +134 -134
- package/es/lowcode/view/lc-components/Image/meta.json +115 -115
- package/es/lowcode/view/lc-components/JSX/RuntimeComp.js +4 -4
- package/es/lowcode/view/lc-components/JSX/meta.json +28 -28
- package/es/lowcode/view/lc-components/Layout/index.js +16 -16
- package/es/lowcode/view/lc-components/Layout/index.less +5 -5
- package/es/lowcode/view/lc-components/Layout/meta.json +107 -107
- package/es/lowcode/view/lc-components/Link/meta.json +113 -113
- package/es/lowcode/view/lc-components/Page/meta.json +61 -61
- package/es/lowcode/view/lc-components/PageContent/meta.json +9 -9
- package/es/lowcode/view/lc-components/PageFooter/meta.json +9 -9
- package/es/lowcode/view/lc-components/PageHeader/meta.json +9 -9
- package/es/lowcode/view/lc-components/PageLayout/meta.json +59 -59
- package/es/lowcode/view/lc-components/Section/index.less +7 -7
- package/es/lowcode/view/lc-components/Section/meta.json +108 -108
- package/es/lowcode/view/lc-components/Split/meta.json +53 -53
- package/es/lowcode/view/lc-components/Table/index.js +149 -148
- package/es/lowcode/view/lc-components/Table/meta.json +450 -450
- package/es/lowcode/view/lc-components/Tabs/index.js +23 -23
- package/es/lowcode/view/lc-components/Tabs/meta.json +113 -113
- package/es/lowcode/view/lc-components/Text/meta.json +56 -56
- package/es/lowcode/view/lc-components/Tree/index.js +96 -96
- package/es/lowcode/view/lc-components/Tree/index.less +4 -4
- package/es/lowcode/view/lc-components/Tree/meta.json +357 -357
- package/es/lowcode/view/style/canvas.less +5 -5
- package/es/lowcode/view/style/loading.less +98 -98
- package/es/lowcode/view/style/page.less +7 -7
- package/es/upload/FilesWall/index.js +13 -13
- package/es/upload/FilesWall/index.less +74 -74
- package/es/upload/Form/index.less +7 -7
- package/es/upload/FormItem/index.js +15 -15
- package/es/utils/form.js +21 -21
- package/lib/components/LDActions/index.less +68 -68
- package/lib/components/LdFormList/index.js +12 -1
- package/lib/components/LdGrid/index.js +4 -4
- package/lib/components/LdGridForm/index.less +7 -7
- package/lib/components/LdTree/index.less +40 -40
- package/lib/helper/action.js +6 -6
- package/lib/helper/form.js +14 -14
- package/lib/helper/index.less +7 -7
- package/lib/lowcode/constants/api-url.js +87 -87
- package/lib/lowcode/engine/meta/js-editor/auto-complete.json +28 -28
- package/lib/lowcode/engine/meta/table.props.json +1 -1
- package/lib/lowcode/engine/provider/ContextProvider/index.js +44 -44
- package/lib/lowcode/engine/tools/dataProcess.js +76 -76
- package/lib/lowcode/painter/Components.js +2 -2
- package/lib/lowcode/painter/components/Collapse.js +26 -26
- package/lib/lowcode/painter/components/ColorInput.js +24 -24
- package/lib/lowcode/painter/components/ListEditor.js +24 -24
- package/lib/lowcode/painter/components/NumberInput.js +28 -28
- package/lib/lowcode/painter/components/PanelItem.js +24 -24
- package/lib/lowcode/painter/components/PopConfirm.js +8 -8
- package/lib/lowcode/painter/components/PopForm.js +27 -27
- package/lib/lowcode/painter/components/RuleInput.js +30 -30
- package/lib/lowcode/painter/components/SortBox.js +22 -22
- package/lib/lowcode/painter/components/code-editor/BaseEditor.js +32 -32
- package/lib/lowcode/painter/components/code-editor/CssEditor.js +25 -25
- package/lib/lowcode/painter/components/code-editor/FullScreenEditor.js +23 -23
- package/lib/lowcode/painter/components/code-editor/JSEditor.js +20 -20
- package/lib/lowcode/painter/components/code-editor/JsonEditor.js +25 -25
- package/lib/lowcode/painter/panel-section/Icon.js +23 -23
- package/lib/lowcode/painter/panel-section/IconSelector.js +16 -16
- package/lib/lowcode/painter/panel-section/LayoutRatio.js +21 -21
- package/lib/lowcode/painter/panel-section/StylePanel/BackGround.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Border.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/BorderRadius.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/BorderRadiusSelector.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/BorderSelector.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Display.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Font.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/FontEditor.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/GapSelector.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/HighLightPanel.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/HighLigthtSpan.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/HightLightSvg.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/MainPanel.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Margin.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Opacity.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Padding.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Pointer.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Shadow.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/Size.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/StyleContext.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/StyleRow.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/WidthHeight.js +2 -2
- package/lib/lowcode/painter/panel-section/StylePanel/index.js +15 -15
- package/lib/lowcode/painter/style/action-bind-modal.less +102 -102
- package/lib/lowcode/painter/style/actions-editor.less +15 -15
- package/lib/lowcode/painter/style/border-editor.less +36 -36
- package/lib/lowcode/painter/style/border-radius-selector.less +42 -42
- package/lib/lowcode/painter/style/border-selector.less +39 -39
- package/lib/lowcode/painter/style/button-type.less +5 -5
- package/lib/lowcode/painter/style/collapse.less +28 -28
- package/lib/lowcode/painter/style/color-input.less +19 -19
- package/lib/lowcode/painter/style/components.less +91 -91
- package/lib/lowcode/painter/style/design.less +166 -166
- package/lib/lowcode/painter/style/display.less +17 -17
- package/lib/lowcode/painter/style/dragdrop.less +10 -10
- package/lib/lowcode/painter/style/fields-setting.less +25 -25
- package/lib/lowcode/painter/style/font-editor.less +9 -9
- package/lib/lowcode/painter/style/fullscreen-editor.less +17 -17
- package/lib/lowcode/painter/style/icon-selector.less +22 -22
- package/lib/lowcode/painter/style/icon.less +10 -10
- package/lib/lowcode/painter/style/impexp.less +7 -7
- package/lib/lowcode/painter/style/index.less +6 -6
- package/lib/lowcode/painter/style/layout-ratio.less +51 -51
- package/lib/lowcode/painter/style/list-editor.less +95 -95
- package/lib/lowcode/painter/style/number-input.less +17 -17
- package/lib/lowcode/painter/style/outline.less +28 -28
- package/lib/lowcode/painter/style/page-layout-display.less +27 -27
- package/lib/lowcode/painter/style/page-vars.less +25 -25
- package/lib/lowcode/painter/style/panel-attrs.less +43 -43
- package/lib/lowcode/painter/style/panel-item.less +54 -54
- package/lib/lowcode/painter/style/panel.less +98 -98
- package/lib/lowcode/painter/style/pop-confirm.less +17 -17
- package/lib/lowcode/painter/style/pop-form.less +19 -19
- package/lib/lowcode/painter/style/radio.less +24 -24
- package/lib/lowcode/painter/style/ribbon.less +5 -5
- package/lib/lowcode/painter/style/rule-input.less +12 -12
- package/lib/lowcode/painter/style/split-display.less +18 -18
- package/lib/lowcode/painter/style/style-panel.less +37 -37
- package/lib/lowcode/painter/style/tabitems.less +90 -90
- package/lib/lowcode/painter/style/treedragdrop.less +19 -19
- package/lib/lowcode/view/lc-components/Box/index.js +4 -4
- package/lib/lowcode/view/lc-components/Box/index.less +14 -14
- package/lib/lowcode/view/lc-components/Box/meta.json +40 -40
- package/lib/lowcode/view/lc-components/Button/index.js +33 -33
- package/lib/lowcode/view/lc-components/Button/meta.json +127 -127
- package/lib/lowcode/view/lc-components/Button/style.less +2 -2
- package/lib/lowcode/view/lc-components/CardList/meta.json +154 -154
- package/lib/lowcode/view/lc-components/Dialog/index.js +13 -13
- package/lib/lowcode/view/lc-components/Dialog/index.less +12 -12
- package/lib/lowcode/view/lc-components/Dialog/meta.json +204 -204
- package/lib/lowcode/view/lc-components/Drawer/index.js +13 -13
- package/lib/lowcode/view/lc-components/Drawer/index.less +13 -13
- package/lib/lowcode/view/lc-components/Drawer/meta.json +242 -242
- package/lib/lowcode/view/lc-components/FieldColor/meta.json +157 -157
- package/lib/lowcode/view/lc-components/FieldComplex/meta.json +140 -140
- package/lib/lowcode/view/lc-components/FieldDate/meta.json +141 -141
- package/lib/lowcode/view/lc-components/FieldDict/meta.json +138 -138
- package/lib/lowcode/view/lc-components/FieldEditor/meta.json +138 -138
- package/lib/lowcode/view/lc-components/FieldGroup/meta.json +167 -167
- package/lib/lowcode/view/lc-components/FieldNumber/meta.json +143 -143
- package/lib/lowcode/view/lc-components/FieldRadio/meta.json +115 -115
- package/lib/lowcode/view/lc-components/FieldRegion/meta.json +121 -121
- package/lib/lowcode/view/lc-components/FieldSelect/meta.json +152 -152
- package/lib/lowcode/view/lc-components/FieldString/meta.json +152 -152
- package/lib/lowcode/view/lc-components/FieldSwitch/meta.json +125 -125
- package/lib/lowcode/view/lc-components/FieldTextarea/meta.json +143 -143
- package/lib/lowcode/view/lc-components/FieldUpload/meta.json +165 -165
- package/lib/lowcode/view/lc-components/FieldUser/meta.json +176 -176
- package/lib/lowcode/view/lc-components/FieldYear/meta.json +129 -129
- package/lib/lowcode/view/lc-components/Form/index.js +20 -20
- package/lib/lowcode/view/lc-components/Form/meta.json +645 -645
- package/lib/lowcode/view/lc-components/Iframe/meta.json +33 -33
- package/lib/lowcode/view/lc-components/ImEx/index.js +25 -25
- package/lib/lowcode/view/lc-components/ImEx/index.less +7 -7
- package/lib/lowcode/view/lc-components/ImEx/meta.json +134 -134
- package/lib/lowcode/view/lc-components/Image/meta.json +115 -115
- package/lib/lowcode/view/lc-components/JSX/RuntimeComp.js +4 -4
- package/lib/lowcode/view/lc-components/JSX/meta.json +28 -28
- package/lib/lowcode/view/lc-components/Layout/index.js +16 -16
- package/lib/lowcode/view/lc-components/Layout/index.less +5 -5
- package/lib/lowcode/view/lc-components/Layout/meta.json +107 -107
- package/lib/lowcode/view/lc-components/Link/meta.json +113 -113
- package/lib/lowcode/view/lc-components/Page/meta.json +61 -61
- package/lib/lowcode/view/lc-components/PageContent/meta.json +9 -9
- package/lib/lowcode/view/lc-components/PageFooter/meta.json +9 -9
- package/lib/lowcode/view/lc-components/PageHeader/meta.json +9 -9
- package/lib/lowcode/view/lc-components/PageLayout/meta.json +59 -59
- package/lib/lowcode/view/lc-components/Section/index.less +7 -7
- package/lib/lowcode/view/lc-components/Section/meta.json +108 -108
- package/lib/lowcode/view/lc-components/Split/meta.json +53 -53
- package/lib/lowcode/view/lc-components/Table/index.js +149 -148
- package/lib/lowcode/view/lc-components/Table/meta.json +450 -450
- package/lib/lowcode/view/lc-components/Tabs/index.js +23 -23
- package/lib/lowcode/view/lc-components/Tabs/meta.json +113 -113
- package/lib/lowcode/view/lc-components/Text/meta.json +56 -56
- package/lib/lowcode/view/lc-components/Tree/index.js +96 -96
- package/lib/lowcode/view/lc-components/Tree/index.less +4 -4
- package/lib/lowcode/view/lc-components/Tree/meta.json +357 -357
- package/lib/lowcode/view/style/canvas.less +5 -5
- package/lib/lowcode/view/style/loading.less +98 -98
- package/lib/lowcode/view/style/page.less +7 -7
- package/lib/upload/FilesWall/index.js +13 -13
- package/lib/upload/FilesWall/index.less +74 -74
- package/lib/upload/Form/index.less +7 -7
- package/lib/upload/FormItem/index.js +15 -15
- package/lib/utils/form.js +21 -21
- package/lowcode.js +1 -1
- package/package.json +175 -175
- package/upload.js +1 -1
- package/utils.js +1 -1
|
@@ -10,36 +10,36 @@ import { Input, Tooltip } from 'luck-design/antd';
|
|
|
10
10
|
import classNames from 'classnames';
|
|
11
11
|
import styles from "../style/rule-input.less";
|
|
12
12
|
|
|
13
|
-
/**
|
|
14
|
-
* 带校验功能的输入组件。
|
|
15
|
-
*
|
|
16
|
-
* 此组件封装了antd的Input组件,并增加了输入值的校验功能。它允许开发者定义一组校验规则,
|
|
17
|
-
* 以确保用户输入符合特定要求。每条规则由一个校验函数和一个错误信息组成。如果用户的输入
|
|
18
|
-
* 不满足任何一条规则,将展示相应的错误信息提示。
|
|
19
|
-
*
|
|
20
|
-
* @component
|
|
21
|
-
* @example
|
|
22
|
-
* <RuleInput
|
|
23
|
-
* value="示例值"
|
|
24
|
-
* onValueChange={(e, newValue) => console.log('新值:', newValue)}
|
|
25
|
-
* rules={[
|
|
26
|
-
* { func: value => !!value, err: '输入不能为空' },
|
|
27
|
-
* { func: value => /^\d+$/.test(value), err: '只允许输入数字' }
|
|
28
|
-
* ]}
|
|
29
|
-
* />
|
|
30
|
-
*
|
|
31
|
-
* @param {Object} props 组件接收的props
|
|
32
|
-
* @param {string} props.value 输入框当前的值,可以由外部控制以实现受控组件。
|
|
33
|
-
* @param {Function} props.onValueChange 当输入值改变并通过所有校验时,触发的回调函数。
|
|
34
|
-
* 该函数接收原生的事件对象和新的输入值作为参数。
|
|
35
|
-
* @param {Array<{func: (value: string) => boolean, err: string}>} props.rules
|
|
36
|
-
* 定义输入校验规则的数组。每个元素是一个对象,其中`func`属性是一个函数,用于执行校验逻辑,
|
|
37
|
-
* 接收当前输入值作为参数,返回一个布尔值表示校验是否通过;`err`属性是一个字符串,指定当
|
|
38
|
-
* 校验失败时要显示的错误信息。
|
|
39
|
-
* @param {Object} rest 传递给内部Input组件的其他props,如`placeholder`、`disabled`等。
|
|
40
|
-
* @param {React.Ref} ref React ref对象,用于将ref传递给内部的Input DOM元素。
|
|
41
|
-
*
|
|
42
|
-
* @returns React元素,渲染一个带有校验功能的输入框和校验失败时的错误信息提示。
|
|
13
|
+
/**
|
|
14
|
+
* 带校验功能的输入组件。
|
|
15
|
+
*
|
|
16
|
+
* 此组件封装了antd的Input组件,并增加了输入值的校验功能。它允许开发者定义一组校验规则,
|
|
17
|
+
* 以确保用户输入符合特定要求。每条规则由一个校验函数和一个错误信息组成。如果用户的输入
|
|
18
|
+
* 不满足任何一条规则,将展示相应的错误信息提示。
|
|
19
|
+
*
|
|
20
|
+
* @component
|
|
21
|
+
* @example
|
|
22
|
+
* <RuleInput
|
|
23
|
+
* value="示例值"
|
|
24
|
+
* onValueChange={(e, newValue) => console.log('新值:', newValue)}
|
|
25
|
+
* rules={[
|
|
26
|
+
* { func: value => !!value, err: '输入不能为空' },
|
|
27
|
+
* { func: value => /^\d+$/.test(value), err: '只允许输入数字' }
|
|
28
|
+
* ]}
|
|
29
|
+
* />
|
|
30
|
+
*
|
|
31
|
+
* @param {Object} props 组件接收的props
|
|
32
|
+
* @param {string} props.value 输入框当前的值,可以由外部控制以实现受控组件。
|
|
33
|
+
* @param {Function} props.onValueChange 当输入值改变并通过所有校验时,触发的回调函数。
|
|
34
|
+
* 该函数接收原生的事件对象和新的输入值作为参数。
|
|
35
|
+
* @param {Array<{func: (value: string) => boolean, err: string}>} props.rules
|
|
36
|
+
* 定义输入校验规则的数组。每个元素是一个对象,其中`func`属性是一个函数,用于执行校验逻辑,
|
|
37
|
+
* 接收当前输入值作为参数,返回一个布尔值表示校验是否通过;`err`属性是一个字符串,指定当
|
|
38
|
+
* 校验失败时要显示的错误信息。
|
|
39
|
+
* @param {Object} rest 传递给内部Input组件的其他props,如`placeholder`、`disabled`等。
|
|
40
|
+
* @param {React.Ref} ref React ref对象,用于将ref传递给内部的Input DOM元素。
|
|
41
|
+
*
|
|
42
|
+
* @returns React元素,渲染一个带有校验功能的输入框和校验失败时的错误信息提示。
|
|
43
43
|
*/
|
|
44
44
|
export default /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
45
45
|
var onValueChange = _ref.onValueChange,
|
|
@@ -7,17 +7,17 @@ import { DndContext } from '@dnd-kit/core';
|
|
|
7
7
|
import { SortableContext, arrayMove, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';
|
|
8
8
|
import { CSS } from '@dnd-kit/utilities';
|
|
9
9
|
|
|
10
|
-
/**
|
|
11
|
-
* SortBox 是一个使用 dnd-kit 实现拖拽排序的组件。
|
|
12
|
-
* 它允许子元素通过拖拽操作来重新排序,并在排序操作完成后通过 onChange 回调传递新的排序结果。
|
|
13
|
-
*
|
|
14
|
-
* @param {Object} props 组件的 props。
|
|
15
|
-
* @param {Array} props.datas 初始排序的数据数组,通常包含用于排序的唯一标识符。
|
|
16
|
-
* @param {ReactNode} props.children 组件的子元素,通常是需要进行排序的元素集合。
|
|
17
|
-
* @param {Function} props.onChange 当排序操作完成时触发的回调函数,参数为重新排序后的数据数组。
|
|
18
|
-
* @param {Function} [props.strategy=verticalListSortingStrategy] 用于排序的策略。默认为垂直列表排序策略。
|
|
19
|
-
*
|
|
20
|
-
* @returns {ReactNode} 返回一个配置了 DndContext 和 SortableContext 的 React 组件结构。
|
|
10
|
+
/**
|
|
11
|
+
* SortBox 是一个使用 dnd-kit 实现拖拽排序的组件。
|
|
12
|
+
* 它允许子元素通过拖拽操作来重新排序,并在排序操作完成后通过 onChange 回调传递新的排序结果。
|
|
13
|
+
*
|
|
14
|
+
* @param {Object} props 组件的 props。
|
|
15
|
+
* @param {Array} props.datas 初始排序的数据数组,通常包含用于排序的唯一标识符。
|
|
16
|
+
* @param {ReactNode} props.children 组件的子元素,通常是需要进行排序的元素集合。
|
|
17
|
+
* @param {Function} props.onChange 当排序操作完成时触发的回调函数,参数为重新排序后的数据数组。
|
|
18
|
+
* @param {Function} [props.strategy=verticalListSortingStrategy] 用于排序的策略。默认为垂直列表排序策略。
|
|
19
|
+
*
|
|
20
|
+
* @returns {ReactNode} 返回一个配置了 DndContext 和 SortableContext 的 React 组件结构。
|
|
21
21
|
*/
|
|
22
22
|
export var SortBox = function SortBox(_ref) {
|
|
23
23
|
var datas = _ref.datas,
|
|
@@ -57,17 +57,17 @@ export var SortBox = function SortBox(_ref) {
|
|
|
57
57
|
}, children));
|
|
58
58
|
};
|
|
59
59
|
|
|
60
|
-
/**
|
|
61
|
-
* SortItem 组件是一个使用 dnd-kit 实现的可排序项。它通过 useSortable 钩子来提供拖拽功能,
|
|
62
|
-
* 并将必要的属性和监听器传递给其子元素,使得子元素可拖拽。
|
|
63
|
-
*
|
|
64
|
-
* @param {Object} props - 组件的 props。
|
|
65
|
-
* @param {string} props.id - 该排序项的唯一标识符,用于识别不同的可排序元素。
|
|
66
|
-
* @param {ReactNode} props.children - 该组件的子元素。通常是你希望使之可拖拽的元素。
|
|
67
|
-
* SortItem 会将拖拽相关的 props 注入到这个子元素中。
|
|
68
|
-
*
|
|
69
|
-
* @returns {ReactNode} 返回一个增强后的 React 元素,此元素集成了拖拽功能。
|
|
70
|
-
* 它基于原 children 元素,附加了用于拖拽的属性和样式。
|
|
60
|
+
/**
|
|
61
|
+
* SortItem 组件是一个使用 dnd-kit 实现的可排序项。它通过 useSortable 钩子来提供拖拽功能,
|
|
62
|
+
* 并将必要的属性和监听器传递给其子元素,使得子元素可拖拽。
|
|
63
|
+
*
|
|
64
|
+
* @param {Object} props - 组件的 props。
|
|
65
|
+
* @param {string} props.id - 该排序项的唯一标识符,用于识别不同的可排序元素。
|
|
66
|
+
* @param {ReactNode} props.children - 该组件的子元素。通常是你希望使之可拖拽的元素。
|
|
67
|
+
* SortItem 会将拖拽相关的 props 注入到这个子元素中。
|
|
68
|
+
*
|
|
69
|
+
* @returns {ReactNode} 返回一个增强后的 React 元素,此元素集成了拖拽功能。
|
|
70
|
+
* 它基于原 children 元素,附加了用于拖拽的属性和样式。
|
|
71
71
|
*/
|
|
72
72
|
export var SortItem = function SortItem(_ref2) {
|
|
73
73
|
var id = _ref2.id,
|
|
@@ -6,38 +6,38 @@ var _excluded = ["onChange", "isFullscreen", "style"],
|
|
|
6
6
|
import React, { useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
|
|
7
7
|
import * as monaco from 'monaco-editor';
|
|
8
8
|
|
|
9
|
-
/**
|
|
10
|
-
* BaseEditor 组件是一个封装了 monaco 编辑器的 React 组件,支持前向 ref 引用。
|
|
11
|
-
* 该组件允许用户编辑代码,并在代码发生变更时触发回调函数。
|
|
12
|
-
* 它还支持通过 props 控制编辑器的语言、选项以及是否全屏显示。
|
|
13
|
-
*
|
|
14
|
-
* @component
|
|
15
|
-
* @example
|
|
16
|
-
* const handleEditorChange = (newValue, event) => {
|
|
17
|
-
* console.log('Editor content changed: ', newValue);
|
|
18
|
-
* };
|
|
19
|
-
* <BaseEditor
|
|
20
|
-
* language="javascript"
|
|
21
|
-
* onChange={handleEditorChange}
|
|
22
|
-
* isFullscreen={false}
|
|
23
|
-
* width="600px"
|
|
24
|
-
* height="400px"
|
|
25
|
-
* >
|
|
26
|
-
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
27
|
-
* </BaseEditor>
|
|
28
|
-
*
|
|
29
|
-
* @param {Object} props - 组件的属性。
|
|
30
|
-
* @param {Function} props.onChange - 当编辑器内容变更时调用的函数。接收最新的编辑器内容和事件对象作为参数。
|
|
31
|
-
* @param {boolean} props.isFullscreen - 控制编辑器是否全屏显示。
|
|
32
|
-
* @param {string} [props.language='javascript'] - 设置编辑器的编程语言,默认为 'javascript'。
|
|
33
|
-
* @param {Object} [props.options={}] - 用于自定义编辑器的选项。
|
|
34
|
-
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始代码。
|
|
35
|
-
* @param {string} [props.width] - 编辑器的宽度,默认为 '100%'。
|
|
36
|
-
* @param {string} [props.height] - 编辑器的高度,默认为 '100%'。
|
|
37
|
-
* @param {Object} rest - 传递给 div 容器的其它属性。
|
|
38
|
-
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
39
|
-
*
|
|
40
|
-
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个配置好的 monaco 编辑器实例。
|
|
9
|
+
/**
|
|
10
|
+
* BaseEditor 组件是一个封装了 monaco 编辑器的 React 组件,支持前向 ref 引用。
|
|
11
|
+
* 该组件允许用户编辑代码,并在代码发生变更时触发回调函数。
|
|
12
|
+
* 它还支持通过 props 控制编辑器的语言、选项以及是否全屏显示。
|
|
13
|
+
*
|
|
14
|
+
* @component
|
|
15
|
+
* @example
|
|
16
|
+
* const handleEditorChange = (newValue, event) => {
|
|
17
|
+
* console.log('Editor content changed: ', newValue);
|
|
18
|
+
* };
|
|
19
|
+
* <BaseEditor
|
|
20
|
+
* language="javascript"
|
|
21
|
+
* onChange={handleEditorChange}
|
|
22
|
+
* isFullscreen={false}
|
|
23
|
+
* width="600px"
|
|
24
|
+
* height="400px"
|
|
25
|
+
* >
|
|
26
|
+
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
27
|
+
* </BaseEditor>
|
|
28
|
+
*
|
|
29
|
+
* @param {Object} props - 组件的属性。
|
|
30
|
+
* @param {Function} props.onChange - 当编辑器内容变更时调用的函数。接收最新的编辑器内容和事件对象作为参数。
|
|
31
|
+
* @param {boolean} props.isFullscreen - 控制编辑器是否全屏显示。
|
|
32
|
+
* @param {string} [props.language='javascript'] - 设置编辑器的编程语言,默认为 'javascript'。
|
|
33
|
+
* @param {Object} [props.options={}] - 用于自定义编辑器的选项。
|
|
34
|
+
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始代码。
|
|
35
|
+
* @param {string} [props.width] - 编辑器的宽度,默认为 '100%'。
|
|
36
|
+
* @param {string} [props.height] - 编辑器的高度,默认为 '100%'。
|
|
37
|
+
* @param {Object} rest - 传递给 div 容器的其它属性。
|
|
38
|
+
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
39
|
+
*
|
|
40
|
+
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个配置好的 monaco 编辑器实例。
|
|
41
41
|
*/
|
|
42
42
|
var BaseEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
43
43
|
var onChange = _ref.onChange,
|
|
@@ -4,31 +4,31 @@ var _excluded = ["children"];
|
|
|
4
4
|
import React, { forwardRef } from 'react';
|
|
5
5
|
import BaseEditor from "./BaseEditor";
|
|
6
6
|
|
|
7
|
-
/**
|
|
8
|
-
* CssEditor 组件是一个专门用于编辑 CSS 代码的 React 组件,它基于 BaseEditor 组件构建。
|
|
9
|
-
* 该组件通过将 language 属性固定设置为 "css",确保编辑器环境专门用于 CSS 代码编辑。
|
|
10
|
-
* 用户可以传入 CSS 代码作为 children,并通过其他 props 控制 BaseEditor 提供的额外功能。
|
|
11
|
-
*
|
|
12
|
-
* @component
|
|
13
|
-
* @example
|
|
14
|
-
* const handleCssChange = (newCss, event) => {
|
|
15
|
-
* console.log('CSS changed: ', newCss);
|
|
16
|
-
* };
|
|
17
|
-
* <CssEditor
|
|
18
|
-
* onChange={handleCssChange}
|
|
19
|
-
* isFullscreen={false}
|
|
20
|
-
* width="600px"
|
|
21
|
-
* height="400px"
|
|
22
|
-
* >
|
|
23
|
-
* {`body { margin: 0; font-family: Arial, sans-serif; }`}
|
|
24
|
-
* </CssEditor>
|
|
25
|
-
*
|
|
26
|
-
* @param {Object} props - 组件的属性。
|
|
27
|
-
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始 CSS 代码。
|
|
28
|
-
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
29
|
-
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
30
|
-
*
|
|
31
|
-
* @returns {ReactElement} 返回一个 React 元素,该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
|
|
7
|
+
/**
|
|
8
|
+
* CssEditor 组件是一个专门用于编辑 CSS 代码的 React 组件,它基于 BaseEditor 组件构建。
|
|
9
|
+
* 该组件通过将 language 属性固定设置为 "css",确保编辑器环境专门用于 CSS 代码编辑。
|
|
10
|
+
* 用户可以传入 CSS 代码作为 children,并通过其他 props 控制 BaseEditor 提供的额外功能。
|
|
11
|
+
*
|
|
12
|
+
* @component
|
|
13
|
+
* @example
|
|
14
|
+
* const handleCssChange = (newCss, event) => {
|
|
15
|
+
* console.log('CSS changed: ', newCss);
|
|
16
|
+
* };
|
|
17
|
+
* <CssEditor
|
|
18
|
+
* onChange={handleCssChange}
|
|
19
|
+
* isFullscreen={false}
|
|
20
|
+
* width="600px"
|
|
21
|
+
* height="400px"
|
|
22
|
+
* >
|
|
23
|
+
* {`body { margin: 0; font-family: Arial, sans-serif; }`}
|
|
24
|
+
* </CssEditor>
|
|
25
|
+
*
|
|
26
|
+
* @param {Object} props - 组件的属性。
|
|
27
|
+
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始 CSS 代码。
|
|
28
|
+
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
29
|
+
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
30
|
+
*
|
|
31
|
+
* @returns {ReactElement} 返回一个 React 元素,该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
|
|
32
32
|
*/
|
|
33
33
|
var CssEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
34
34
|
var children = _ref.children,
|
|
@@ -8,29 +8,29 @@ import { formatMessage } from '@luck-design-biz/base/utils';
|
|
|
8
8
|
import styles from "../../style/fullscreen-editor.less";
|
|
9
9
|
import { useFullscreen } from 'ahooks';
|
|
10
10
|
|
|
11
|
-
/**
|
|
12
|
-
* FullScreenEditor 组件是一个支持全屏编辑模式的 React 组件,它利用提供的 EditorComponent 来实现代码编辑功能。
|
|
13
|
-
* 该组件使用 ahooks 的 useFullscreen 钩子来实现全屏切换,并在全屏模式下调整编辑器布局。
|
|
14
|
-
* 全屏/非全屏模式下编辑器的某些选项可能会有所不同,以适应不同的布局需求。
|
|
15
|
-
*
|
|
16
|
-
* @component
|
|
17
|
-
* @example
|
|
18
|
-
* const MyEditor = React.forwardRef((props, ref) => <BaseEditor {...props} ref={ref} />);
|
|
19
|
-
* <FullScreenEditor
|
|
20
|
-
* EditorComponent={MyEditor}
|
|
21
|
-
* onLoad={() => console.log('Editor loaded')}
|
|
22
|
-
* >
|
|
23
|
-
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
24
|
-
* </FullScreenEditor>
|
|
25
|
-
*
|
|
26
|
-
* @param {Object} props - 组件的属性。
|
|
27
|
-
* @param {Function} props.EditorComponent - 用于编辑的组件,该组件需要支持 ref 引用以调用编辑器的方法。
|
|
28
|
-
* @param {Function} [props.onLoad] - 编辑器加载完成时的回调函数。
|
|
29
|
-
* @param {React.ReactNode} children - 传递给 EditorComponent 的 children,通常是初始代码或内容。
|
|
30
|
-
* @param {Object} rest - 传递给 EditorComponent 的其他属性。
|
|
31
|
-
* @param {React.Ref} ref - React ref 引用,用于在外部组件中访问 EditorComponent 实例的方法。
|
|
32
|
-
*
|
|
33
|
-
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个具有全屏切换功能的编辑器界面。
|
|
11
|
+
/**
|
|
12
|
+
* FullScreenEditor 组件是一个支持全屏编辑模式的 React 组件,它利用提供的 EditorComponent 来实现代码编辑功能。
|
|
13
|
+
* 该组件使用 ahooks 的 useFullscreen 钩子来实现全屏切换,并在全屏模式下调整编辑器布局。
|
|
14
|
+
* 全屏/非全屏模式下编辑器的某些选项可能会有所不同,以适应不同的布局需求。
|
|
15
|
+
*
|
|
16
|
+
* @component
|
|
17
|
+
* @example
|
|
18
|
+
* const MyEditor = React.forwardRef((props, ref) => <BaseEditor {...props} ref={ref} />);
|
|
19
|
+
* <FullScreenEditor
|
|
20
|
+
* EditorComponent={MyEditor}
|
|
21
|
+
* onLoad={() => console.log('Editor loaded')}
|
|
22
|
+
* >
|
|
23
|
+
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
24
|
+
* </FullScreenEditor>
|
|
25
|
+
*
|
|
26
|
+
* @param {Object} props - 组件的属性。
|
|
27
|
+
* @param {Function} props.EditorComponent - 用于编辑的组件,该组件需要支持 ref 引用以调用编辑器的方法。
|
|
28
|
+
* @param {Function} [props.onLoad] - 编辑器加载完成时的回调函数。
|
|
29
|
+
* @param {React.ReactNode} children - 传递给 EditorComponent 的 children,通常是初始代码或内容。
|
|
30
|
+
* @param {Object} rest - 传递给 EditorComponent 的其他属性。
|
|
31
|
+
* @param {React.Ref} ref - React ref 引用,用于在外部组件中访问 EditorComponent 实例的方法。
|
|
32
|
+
*
|
|
33
|
+
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个具有全屏切换功能的编辑器界面。
|
|
34
34
|
*/
|
|
35
35
|
var FullScreenEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
36
36
|
var EditorComponent = _ref.EditorComponent,
|
|
@@ -105,26 +105,26 @@ var prettierFormetter = function prettierFormetter(unformattedCode) {
|
|
|
105
105
|
}
|
|
106
106
|
};
|
|
107
107
|
|
|
108
|
-
/**
|
|
109
|
-
* JSEditor 组件是一个专为 JavaScript 编辑设计的 React 组件,它基于 BaseEditor 组件构建,并集成了自动完成功能。
|
|
110
|
-
* 该组件利用 monaco-editor 提供的 API,通过 setupAutocomplete 函数设置自动完成项,从而增强代码编辑体验。
|
|
111
|
-
* 自动完成逻辑包括从预定义的自动完成模块中加载补全项,以及在编辑器中键入特定字符(如".")时触发补全建议。
|
|
112
|
-
*
|
|
113
|
-
* @component
|
|
114
|
-
* @example
|
|
115
|
-
* <JSEditor
|
|
116
|
-
* language="javascript"
|
|
117
|
-
* options={{ fontSize: 14 }}
|
|
118
|
-
* >
|
|
119
|
-
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
120
|
-
* </JSEditor>
|
|
121
|
-
*
|
|
122
|
-
* @param {Object} props - 组件的属性。
|
|
123
|
-
* @param {React.ReactNode} children - 传递给 BaseEditor 的 children,通常是初始代码或内容。
|
|
124
|
-
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
125
|
-
* @param {React.Ref} ref - React ref 引用,用于在外部组件中访问 BaseEditor 实例的方法。
|
|
126
|
-
*
|
|
127
|
-
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个具有自动完成功能的 JavaScript 编辑器实例。
|
|
108
|
+
/**
|
|
109
|
+
* JSEditor 组件是一个专为 JavaScript 编辑设计的 React 组件,它基于 BaseEditor 组件构建,并集成了自动完成功能。
|
|
110
|
+
* 该组件利用 monaco-editor 提供的 API,通过 setupAutocomplete 函数设置自动完成项,从而增强代码编辑体验。
|
|
111
|
+
* 自动完成逻辑包括从预定义的自动完成模块中加载补全项,以及在编辑器中键入特定字符(如".")时触发补全建议。
|
|
112
|
+
*
|
|
113
|
+
* @component
|
|
114
|
+
* @example
|
|
115
|
+
* <JSEditor
|
|
116
|
+
* language="javascript"
|
|
117
|
+
* options={{ fontSize: 14 }}
|
|
118
|
+
* >
|
|
119
|
+
* {`function sayHello() {\n console.log('Hello, World!');\n}`}
|
|
120
|
+
* </JSEditor>
|
|
121
|
+
*
|
|
122
|
+
* @param {Object} props - 组件的属性。
|
|
123
|
+
* @param {React.ReactNode} children - 传递给 BaseEditor 的 children,通常是初始代码或内容。
|
|
124
|
+
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
125
|
+
* @param {React.Ref} ref - React ref 引用,用于在外部组件中访问 BaseEditor 实例的方法。
|
|
126
|
+
*
|
|
127
|
+
* @returns {ReactElement} 返回一个 React 元素,其中包含了一个具有自动完成功能的 JavaScript 编辑器实例。
|
|
128
128
|
*/
|
|
129
129
|
var JSEditor = /*#__PURE__*/forwardRef(function (_ref2, outRef) {
|
|
130
130
|
var children = _ref2.children,
|
|
@@ -4,31 +4,31 @@ var _excluded = ["children"];
|
|
|
4
4
|
import React, { forwardRef } from 'react';
|
|
5
5
|
import BaseEditor from "./BaseEditor";
|
|
6
6
|
|
|
7
|
-
/**
|
|
8
|
-
* JsonEditor 组件是一个专门用于编辑 CSS 代码的 React 组件,它基于 BaseEditor 组件构建。
|
|
9
|
-
* 该组件通过将 language 属性固定设置为 "css",确保编辑器环境专门用于 CSS 代码编辑。
|
|
10
|
-
* 用户可以传入 CSS 代码作为 children,并通过其他 props 控制 BaseEditor 提供的额外功能。
|
|
11
|
-
*
|
|
12
|
-
* @component
|
|
13
|
-
* @example
|
|
14
|
-
* const handleCssChange = (newCss, event) => {
|
|
15
|
-
* console.log('CSS changed: ', newCss);
|
|
16
|
-
* };
|
|
17
|
-
* <JsonEditor
|
|
18
|
-
* onChange={handleCssChange}
|
|
19
|
-
* isFullscreen={false}
|
|
20
|
-
* width="600px"
|
|
21
|
-
* height="400px"
|
|
22
|
-
* >
|
|
23
|
-
* {`body { margin: 0; font-family: Arial, sans-serif; }`}
|
|
24
|
-
* </JsonEditor>
|
|
25
|
-
*
|
|
26
|
-
* @param {Object} props - 组件的属性。
|
|
27
|
-
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始 CSS 代码。
|
|
28
|
-
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
29
|
-
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
30
|
-
*
|
|
31
|
-
* @returns {ReactElement} 返回一个 React 元素,该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
|
|
7
|
+
/**
|
|
8
|
+
* JsonEditor 组件是一个专门用于编辑 CSS 代码的 React 组件,它基于 BaseEditor 组件构建。
|
|
9
|
+
* 该组件通过将 language 属性固定设置为 "css",确保编辑器环境专门用于 CSS 代码编辑。
|
|
10
|
+
* 用户可以传入 CSS 代码作为 children,并通过其他 props 控制 BaseEditor 提供的额外功能。
|
|
11
|
+
*
|
|
12
|
+
* @component
|
|
13
|
+
* @example
|
|
14
|
+
* const handleCssChange = (newCss, event) => {
|
|
15
|
+
* console.log('CSS changed: ', newCss);
|
|
16
|
+
* };
|
|
17
|
+
* <JsonEditor
|
|
18
|
+
* onChange={handleCssChange}
|
|
19
|
+
* isFullscreen={false}
|
|
20
|
+
* width="600px"
|
|
21
|
+
* height="400px"
|
|
22
|
+
* >
|
|
23
|
+
* {`body { margin: 0; font-family: Arial, sans-serif; }`}
|
|
24
|
+
* </JsonEditor>
|
|
25
|
+
*
|
|
26
|
+
* @param {Object} props - 组件的属性。
|
|
27
|
+
* @param {React.ReactNode} children - 子组件,通常是编辑器的初始 CSS 代码。
|
|
28
|
+
* @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
|
|
29
|
+
* @param {React.Ref} ref - React ref 引用,用于外部组件调用编辑器实例的方法。
|
|
30
|
+
*
|
|
31
|
+
* @returns {ReactElement} 返回一个 React 元素,该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
|
|
32
32
|
*/
|
|
33
33
|
var JsonEditor = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
34
34
|
var children = _ref.children,
|
|
@@ -2,29 +2,29 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
|
2
2
|
import React, { useState, useLayoutEffect } from 'react';
|
|
3
3
|
import styles from "../style/icon.less";
|
|
4
4
|
import IconFont from "../../../components/IconFont";
|
|
5
|
-
/**
|
|
6
|
-
* 一个简单的图标选择器组件,展示了一个图标并允许用户点击选择。
|
|
7
|
-
* 该组件使用了`Icon.createFromIconfontCN`来创建一个可以从Iconfont.cn加载图标的`IconFont`组件。
|
|
8
|
-
* 当图标被点击时,会调用`onSelect`回调函数,并传递一个对象,其中包含了`field`字段。
|
|
9
|
-
*
|
|
10
|
-
* @component
|
|
11
|
-
* @example
|
|
12
|
-
* ```jsx
|
|
13
|
-
* <IconSelector
|
|
14
|
-
* field="iconField"
|
|
15
|
-
* onSelect={({ field }) => console.log(`Selected icon field: ${field}`)}
|
|
16
|
-
* defaultValue="icon-example"
|
|
17
|
-
* />
|
|
18
|
-
* ```
|
|
19
|
-
*
|
|
20
|
-
* @param {Object} props 组件的props
|
|
21
|
-
* @param {string} props.field 用于识别选择的图标字段的标识符。
|
|
22
|
-
* @param {Function} props.onSelect 当图标被点击时触发的回调函数。
|
|
23
|
-
* 接收一个对象参数,该对象包含`field`字段。
|
|
24
|
-
* @param {string} [props.defaultValue='iconyingyongguanli'] 初始化时图标的类型,
|
|
25
|
-
* 默认为'iconyingyongguanli'。
|
|
26
|
-
*
|
|
27
|
-
* @returns {React.Element} 渲染的React元素。
|
|
5
|
+
/**
|
|
6
|
+
* 一个简单的图标选择器组件,展示了一个图标并允许用户点击选择。
|
|
7
|
+
* 该组件使用了`Icon.createFromIconfontCN`来创建一个可以从Iconfont.cn加载图标的`IconFont`组件。
|
|
8
|
+
* 当图标被点击时,会调用`onSelect`回调函数,并传递一个对象,其中包含了`field`字段。
|
|
9
|
+
*
|
|
10
|
+
* @component
|
|
11
|
+
* @example
|
|
12
|
+
* ```jsx
|
|
13
|
+
* <IconSelector
|
|
14
|
+
* field="iconField"
|
|
15
|
+
* onSelect={({ field }) => console.log(`Selected icon field: ${field}`)}
|
|
16
|
+
* defaultValue="icon-example"
|
|
17
|
+
* />
|
|
18
|
+
* ```
|
|
19
|
+
*
|
|
20
|
+
* @param {Object} props 组件的props
|
|
21
|
+
* @param {string} props.field 用于识别选择的图标字段的标识符。
|
|
22
|
+
* @param {Function} props.onSelect 当图标被点击时触发的回调函数。
|
|
23
|
+
* 接收一个对象参数,该对象包含`field`字段。
|
|
24
|
+
* @param {string} [props.defaultValue='iconyingyongguanli'] 初始化时图标的类型,
|
|
25
|
+
* 默认为'iconyingyongguanli'。
|
|
26
|
+
*
|
|
27
|
+
* @returns {React.Element} 渲染的React元素。
|
|
28
28
|
*/
|
|
29
29
|
export default function (_ref) {
|
|
30
30
|
var defaultValue = _ref.defaultValue,
|
|
@@ -10,22 +10,22 @@ import { formatMessage } from '@luck-design-biz/base/utils';
|
|
|
10
10
|
import { ICONLIST_URL, ICONLIST_JS } from "../../constants/api-url";
|
|
11
11
|
var Search = Input.Search;
|
|
12
12
|
|
|
13
|
-
/**
|
|
14
|
-
* 一个用于选择图标的组件,提供了图标的搜索和选择功能。
|
|
15
|
-
*
|
|
16
|
-
* 该组件首先从预定义的URL加载图标列表,然后显示这些图标。用户可以通过输入框搜索图标,
|
|
17
|
-
* 点击图标时,会通过 `onChange` 回调将选中的图标信息返回给父组件。
|
|
18
|
-
*
|
|
19
|
-
* @component
|
|
20
|
-
* @example
|
|
21
|
-
* ```jsx
|
|
22
|
-
* <IconSelector
|
|
23
|
-
* onChange={(selectedIcon) => console.log(selectedIcon)}
|
|
24
|
-
* />
|
|
25
|
-
* ```
|
|
26
|
-
*
|
|
27
|
-
* @param {Object} props 组件接受的props
|
|
28
|
-
* @param {Function} props.onChange 当图标被选中时触发的回调函数,接受选中图标的信息作为参数
|
|
13
|
+
/**
|
|
14
|
+
* 一个用于选择图标的组件,提供了图标的搜索和选择功能。
|
|
15
|
+
*
|
|
16
|
+
* 该组件首先从预定义的URL加载图标列表,然后显示这些图标。用户可以通过输入框搜索图标,
|
|
17
|
+
* 点击图标时,会通过 `onChange` 回调将选中的图标信息返回给父组件。
|
|
18
|
+
*
|
|
19
|
+
* @component
|
|
20
|
+
* @example
|
|
21
|
+
* ```jsx
|
|
22
|
+
* <IconSelector
|
|
23
|
+
* onChange={(selectedIcon) => console.log(selectedIcon)}
|
|
24
|
+
* />
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* @param {Object} props 组件接受的props
|
|
28
|
+
* @param {Function} props.onChange 当图标被选中时触发的回调函数,接受选中图标的信息作为参数
|
|
29
29
|
*/
|
|
30
30
|
export default function (_ref) {
|
|
31
31
|
var onChange = _ref.onChange,
|
|
@@ -8,27 +8,27 @@ import PanelItem from "../components/PanelItem";
|
|
|
8
8
|
var _RATIOS_ = ['12', '6:6', '3:9', '9:3', '4:4:4', '3:6:3', '3:3:3:3', '2:2:2:2:2:2'];
|
|
9
9
|
var _DEFAULTRATIO_ = '12:3:9';
|
|
10
10
|
|
|
11
|
-
/**
|
|
12
|
-
* `LayoutRatio`组件提供了一个布局比例选择器,允许用户选择或输入特定的比例配置。
|
|
13
|
-
* 支持的比例配置包括预定义的比例数组`_RATIOS_`,用户还可以通过输入框自定义比例,
|
|
14
|
-
* 自定义比例需要符合一定的规则:是数字或数字与冒号的组合,且数字之和必须等于12。
|
|
15
|
-
* ,
|
|
16
|
-
* 允许父组件获取当前选中的布局比例。
|
|
17
|
-
*
|
|
18
|
-
* @component
|
|
19
|
-
* @example
|
|
20
|
-
* ```jsxsdsdsdsdsdsdsd
|
|
21
|
-
* <LayoutRatio
|
|
22
|
-
* value="6:6"
|
|
23
|
-
* onChange={(option) => console.log(option)}
|
|
24
|
-
* />
|
|
25
|
-
* ```
|
|
26
|
-
*
|
|
27
|
-
* @param {Object} props
|
|
28
|
-
* @param {string} [props.value='12'] 初始化时选中的布局比例,默认为"12"。
|
|
29
|
-
* @param {Function} props.onChange 当用户选择一个新的布局比例时调用的回调函数。
|
|
30
|
-
*
|
|
31
|
-
* @returns {React.Element} 渲染的React元素。
|
|
11
|
+
/**
|
|
12
|
+
* `LayoutRatio`组件提供了一个布局比例选择器,允许用户选择或输入特定的比例配置。
|
|
13
|
+
* 支持的比例配置包括预定义的比例数组`_RATIOS_`,用户还可以通过输入框自定义比例,
|
|
14
|
+
* 自定义比例需要符合一定的规则:是数字或数字与冒号的组合,且数字之和必须等于12。
|
|
15
|
+
* ,
|
|
16
|
+
* 允许父组件获取当前选中的布局比例。
|
|
17
|
+
*
|
|
18
|
+
* @component
|
|
19
|
+
* @example
|
|
20
|
+
* ```jsxsdsdsdsdsdsdsd
|
|
21
|
+
* <LayoutRatio
|
|
22
|
+
* value="6:6"
|
|
23
|
+
* onChange={(option) => console.log(option)}
|
|
24
|
+
* />
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* @param {Object} props
|
|
28
|
+
* @param {string} [props.value='12'] 初始化时选中的布局比例,默认为"12"。
|
|
29
|
+
* @param {Function} props.onChange 当用户选择一个新的布局比例时调用的回调函数。
|
|
30
|
+
*
|
|
31
|
+
* @returns {React.Element} 渲染的React元素。
|
|
32
32
|
*/
|
|
33
33
|
var LayoutRatio = function LayoutRatio(_ref) {
|
|
34
34
|
var defaultValue = _ref.defaultValue,
|
|
@@ -9,8 +9,8 @@ import HighLightPanel from "./HighLightPanel";
|
|
|
9
9
|
import HightLightSvg from "./HightLightSvg";
|
|
10
10
|
var textRelatedStyles = ['background-color'];
|
|
11
11
|
|
|
12
|
-
/**
|
|
13
|
-
* 背景设置控件
|
|
12
|
+
/**
|
|
13
|
+
* 背景设置控件
|
|
14
14
|
*/
|
|
15
15
|
export default function () {
|
|
16
16
|
return /*#__PURE__*/React.createElement(HighLightPanel, {
|
|
@@ -11,8 +11,8 @@ var borderMainProps = ['border-radius'];
|
|
|
11
11
|
var borderSideProps = ['border-top-right-radius', 'border-top-left-radius', 'border-bottom-left-radius', 'border-bottom-right-radius'];
|
|
12
12
|
var textRelatedStyles = [].concat(borderMainProps, borderSideProps);
|
|
13
13
|
|
|
14
|
-
/**
|
|
15
|
-
* 圆角样式设置控件
|
|
14
|
+
/**
|
|
15
|
+
* 圆角样式设置控件
|
|
16
16
|
*/
|
|
17
17
|
export default function () {
|
|
18
18
|
return /*#__PURE__*/React.createElement(HighLightPanel, {
|
|
@@ -2,8 +2,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
|
2
2
|
import React, { useState } from 'react';
|
|
3
3
|
import styles from "../../style/border-radius-selector.less";
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* 圆角设置组件
|
|
5
|
+
/**
|
|
6
|
+
* 圆角设置组件
|
|
7
7
|
*/
|
|
8
8
|
export default function (_ref) {
|
|
9
9
|
var onChange = _ref.onChange;
|
|
@@ -2,8 +2,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
|
2
2
|
import React, { useState } from 'react';
|
|
3
3
|
import styles from "../../style/border-selector.less";
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* 边框选择组件
|
|
5
|
+
/**
|
|
6
|
+
* 边框选择组件
|
|
7
7
|
*/
|
|
8
8
|
export default function (_ref) {
|
|
9
9
|
var onChange = _ref.onChange;
|
|
@@ -8,8 +8,8 @@ import { useStyle, useStyleDispatch } from "./StyleContext";
|
|
|
8
8
|
import HighLightPanel from "./HighLightPanel";
|
|
9
9
|
var textRelatedStyles = ['display', 'flex-direction', 'align-items', 'justify-content'];
|
|
10
10
|
|
|
11
|
-
/**
|
|
12
|
-
* 显示样式设置控件
|
|
11
|
+
/**
|
|
12
|
+
* 显示样式设置控件
|
|
13
13
|
*/
|
|
14
14
|
export default function (_ref) {
|
|
15
15
|
var label = _ref.label;
|