@thienvu18/designable-react-settings-form 2.0.1 → 2.0.2

package/lib/components/ValueInput/index.js

@@ -1,84 +1,101 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ValueInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const PolyInput_1 = require("../PolyInput");
-const antd_1 = require("antd");
-const MonacoInput_1 = require("../MonacoInput");
-const designable_react_1 = require("@thienvu18/designable-react");
-const STARTTAG_REX = /<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/;
-const EXPRESSION_REX = /^\{\{([\s\S]*)\}\}$/;
-const isNumber = (value) => typeof value === 'number';
-const isBoolean = (value) => typeof value === 'boolean';
+'use strict'
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.ValueInput = void 0
+const jsx_runtime_1 = require('react/jsx-runtime')
+const PolyInput_1 = require('../PolyInput')
+const antd_1 = require('antd')
+const MonacoInput_1 = require('../MonacoInput')
+const designable_react_1 = require('@thienvu18/designable-react')
+const STARTTAG_REX =
+  /<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/
+const EXPRESSION_REX = /^\{\{([\s\S]*)\}\}$/
+const isNumber = (value) => typeof value === 'number'
+const isBoolean = (value) => typeof value === 'boolean'
 const isExpression = (value) => {
-    return typeof value === 'string' && EXPRESSION_REX.test(value);
-};
+  return typeof value === 'string' && EXPRESSION_REX.test(value)
+}
 const isRichText = (value) => {
-    return typeof value === 'string' && STARTTAG_REX.test(value);
-};
+  return typeof value === 'string' && STARTTAG_REX.test(value)
+}
 const isNormalText = (value) => {
-    return typeof value === 'string' && !isExpression(value) && !isRichText(value);
-};
+  return typeof value === 'string' && !isExpression(value) && !isRichText(value)
+}
 const takeNumber = (value) => {
-    const num = String(value).replace(/[^\d\.]+/, '');
-    if (num === '')
-        return;
-    return Number(num);
-};
+  const num = String(value).replace(/[^\d\.]+/, '')
+  if (num === '') return
+  return Number(num)
+}
 exports.ValueInput = (0, PolyInput_1.createPolyInput)([
-    {
-        type: 'TEXT',
-        icon: 'Text',
-        component: antd_1.Input,
-        checker: isNormalText,
+  {
+    type: 'TEXT',
+    icon: 'Text',
+    component: antd_1.Input,
+    checker: isNormalText,
+  },
+  {
+    type: 'EXPRESSION',
+    icon: 'Expression',
+    component: (props) => {
+      return (0, jsx_runtime_1.jsx)(antd_1.Popover, {
+        content: (0, jsx_runtime_1.jsx)('div', {
+          style: {
+            width: 400,
+            height: 200,
+            marginLeft: -16,
+            marginRight: -16,
+            marginBottom: -12,
+          },
+          children: (0, jsx_runtime_1.jsx)(MonacoInput_1.MonacoInput, {
+            ...props,
+            language: 'javascript.expression',
+          }),
+        }),
+        trigger: 'click',
+        children: (0, jsx_runtime_1.jsx)(antd_1.Button, {
+          block: true,
+          children: (0, jsx_runtime_1.jsx)(designable_react_1.TextWidget, {
+            token: 'SettingComponents.ValueInput.expression',
+          }),
+        }),
+      })
     },
-    {
-        type: 'EXPRESSION',
-        icon: 'Expression',
-        component: (props) => {
-            return ((0, jsx_runtime_1.jsx)(antd_1.Popover, { content: (0, jsx_runtime_1.jsx)("div", { style: {
-                        width: 400,
-                        height: 200,
-                        marginLeft: -16,
-                        marginRight: -16,
-                        marginBottom: -12,
-                    }, children: (0, jsx_runtime_1.jsx)(MonacoInput_1.MonacoInput, { ...props, language: "javascript.expression" }) }), trigger: "click", children: (0, jsx_runtime_1.jsx)(antd_1.Button, { block: true, children: (0, jsx_runtime_1.jsx)(designable_react_1.TextWidget, { token: "SettingComponents.ValueInput.expression" }) }) }));
-        },
-        checker: isExpression,
-        toInputValue: (value) => {
-            if (!value || value === '{{}}')
-                return;
-            const matched = String(value).match(EXPRESSION_REX);
-            return matched?.[1] || value || '';
-        },
-        toChangeValue: (value) => {
-            if (!value || value === '{{}}')
-                return;
-            const matched = String(value).match(EXPRESSION_REX);
-            return `{{${matched?.[1] || value || ''}}}`;
-        },
+    checker: isExpression,
+    toInputValue: (value) => {
+      if (!value || value === '{{}}') return
+      const matched = String(value).match(EXPRESSION_REX)
+      return matched?.[1] || value || ''
     },
-    {
-        type: 'BOOLEAN',
-        icon: 'Boolean',
-        component: (props) => ((0, jsx_runtime_1.jsx)(antd_1.Select, { ...props, options: [
-                { label: 'True', value: true },
-                { label: 'False', value: false },
-            ] })),
-        checker: isBoolean,
-        toInputValue: (value) => {
-            return !!value;
-        },
-        toChangeValue: (value) => {
-            return !!value;
-        },
+    toChangeValue: (value) => {
+      if (!value || value === '{{}}') return
+      const matched = String(value).match(EXPRESSION_REX)
+      return `{{${matched?.[1] || value || ''}}}`
     },
-    {
-        type: 'NUMBER',
-        icon: 'Number',
-        component: antd_1.InputNumber,
-        checker: isNumber,
-        toInputValue: takeNumber,
-        toChangeValue: takeNumber,
+  },
+  {
+    type: 'BOOLEAN',
+    icon: 'Boolean',
+    component: (props) =>
+      (0, jsx_runtime_1.jsx)(antd_1.Select, {
+        ...props,
+        options: [
+          { label: 'True', value: true },
+          { label: 'False', value: false },
+        ],
+      }),
+    checker: isBoolean,
+    toInputValue: (value) => {
+      return !!value
     },
-]);
+    toChangeValue: (value) => {
+      return !!value
+    },
+  },
+  {
+    type: 'NUMBER',
+    icon: 'Number',
+    component: antd_1.InputNumber,
+    checker: isNumber,
+    toInputValue: takeNumber,
+    toChangeValue: takeNumber,
+  },
+])

package/lib/components/index.d.ts

@@ -1,20 +1,20 @@
-export * from './ColorInput';
-export * from './CornerInput';
-export * from './ImageInput';
-export * from './PositionInput';
-export * from './SizeInput';
-export * from './PolyInput';
-export * from './ValueInput';
-export * from './MonacoInput';
-export * from './DrawerSetter';
-export * from './BoxStyleSetter';
-export * from './BorderStyleSetter';
-export * from './BorderRadiusStyleSetter';
-export * from './BackgroundStyleSetter';
-export * from './BoxShadowStyleSetter';
-export * from './FontStyleSetter';
-export * from './DisplayStyleSetter';
-export * from './FlexStyleSetter';
-export * from './FoldItem';
-export * from './CollapseItem';
-export * from './InputItems';
+export * from './BackgroundStyleSetter'
+export * from './BorderRadiusStyleSetter'
+export * from './BorderStyleSetter'
+export * from './BoxShadowStyleSetter'
+export * from './BoxStyleSetter'
+export * from './CollapseItem'
+export * from './ColorInput'
+export * from './CornerInput'
+export * from './DisplayStyleSetter'
+export * from './DrawerSetter'
+export * from './FlexStyleSetter'
+export * from './FoldItem'
+export * from './FontStyleSetter'
+export * from './ImageInput'
+export * from './InputItems'
+export * from './MonacoInput'
+export * from './PolyInput'
+export * from './PositionInput'
+export * from './SizeInput'
+export * from './ValueInput'

package/lib/components/index.js

@@ -1,36 +1,52 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./ColorInput"), exports);
-__exportStar(require("./CornerInput"), exports);
-__exportStar(require("./ImageInput"), exports);
-__exportStar(require("./PositionInput"), exports);
-__exportStar(require("./SizeInput"), exports);
-__exportStar(require("./PolyInput"), exports);
-__exportStar(require("./ValueInput"), exports);
-__exportStar(require("./MonacoInput"), exports);
-__exportStar(require("./DrawerSetter"), exports);
-__exportStar(require("./BoxStyleSetter"), exports);
-__exportStar(require("./BorderStyleSetter"), exports);
-__exportStar(require("./BorderRadiusStyleSetter"), exports);
-__exportStar(require("./BackgroundStyleSetter"), exports);
-__exportStar(require("./BoxShadowStyleSetter"), exports);
-__exportStar(require("./FontStyleSetter"), exports);
-__exportStar(require("./DisplayStyleSetter"), exports);
-__exportStar(require("./FlexStyleSetter"), exports);
-__exportStar(require("./FoldItem"), exports);
-__exportStar(require("./CollapseItem"), exports);
-__exportStar(require("./InputItems"), exports);
+'use strict'
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        var desc = Object.getOwnPropertyDescriptor(m, k)
+        if (
+          !desc ||
+          ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)
+        ) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k]
+            },
+          }
+        }
+        Object.defineProperty(o, k2, desc)
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        o[k2] = m[k]
+      })
+var __exportStar =
+  (this && this.__exportStar) ||
+  function (m, exports) {
+    for (var p in m)
+      if (p !== 'default' && !Object.prototype.hasOwnProperty.call(exports, p))
+        __createBinding(exports, m, p)
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+__exportStar(require('./ColorInput'), exports)
+__exportStar(require('./CornerInput'), exports)
+__exportStar(require('./ImageInput'), exports)
+__exportStar(require('./PositionInput'), exports)
+__exportStar(require('./SizeInput'), exports)
+__exportStar(require('./PolyInput'), exports)
+__exportStar(require('./ValueInput'), exports)
+__exportStar(require('./MonacoInput'), exports)
+__exportStar(require('./DrawerSetter'), exports)
+__exportStar(require('./BoxStyleSetter'), exports)
+__exportStar(require('./BorderStyleSetter'), exports)
+__exportStar(require('./BorderRadiusStyleSetter'), exports)
+__exportStar(require('./BackgroundStyleSetter'), exports)
+__exportStar(require('./BoxShadowStyleSetter'), exports)
+__exportStar(require('./FontStyleSetter'), exports)
+__exportStar(require('./DisplayStyleSetter'), exports)
+__exportStar(require('./FlexStyleSetter'), exports)
+__exportStar(require('./FoldItem'), exports)
+__exportStar(require('./CollapseItem'), exports)
+__exportStar(require('./InputItems'), exports)

package/lib/effects/index.d.ts

@@ -1,2 +1,2 @@
-export * from './useLocales';
-export * from './useSnapshot';
+export * from './useLocales'
+export * from './useSnapshot'

package/lib/effects/index.js

@@ -1,18 +1,34 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./useLocales"), exports);
-__exportStar(require("./useSnapshot"), exports);
+'use strict'
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        var desc = Object.getOwnPropertyDescriptor(m, k)
+        if (
+          !desc ||
+          ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)
+        ) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k]
+            },
+          }
+        }
+        Object.defineProperty(o, k2, desc)
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        o[k2] = m[k]
+      })
+var __exportStar =
+  (this && this.__exportStar) ||
+  function (m, exports) {
+    for (var p in m)
+      if (p !== 'default' && !Object.prototype.hasOwnProperty.call(exports, p))
+        __createBinding(exports, m, p)
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+__exportStar(require('./useLocales'), exports)
+__exportStar(require('./useSnapshot'), exports)

package/lib/effects/useLocales.d.ts

@@ -1,2 +1,2 @@
-import { TreeNode } from '@thienvu18/designable-core';
-export declare const useLocales: (node: TreeNode) => void;
+import { TreeNode } from '@thienvu18/designable-core'
+export declare const useLocales: (node: TreeNode) => void

package/lib/effects/useLocales.js

@@ -1,67 +1,71 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLocales = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@formily/core");
-const designable_core_1 = require("@thienvu18/designable-core");
-const designable_shared_1 = require("@thienvu18/designable-shared");
-const designable_react_1 = require("@thienvu18/designable-react");
+'use strict'
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.useLocales = void 0
+const jsx_runtime_1 = require('react/jsx-runtime')
+const core_1 = require('@formily/core')
+const designable_core_1 = require('@thienvu18/designable-core')
+const designable_shared_1 = require('@thienvu18/designable-shared')
+const designable_react_1 = require('@thienvu18/designable-react')
 const takeIcon = (message) => {
-    if (!(0, designable_shared_1.isStr)(message))
-        return;
-    const matched = message.match(/@([^:\s]+)(?:\s*\:\s*([\s\S]+))?/);
-    if (matched)
-        return [matched[1], matched[2]];
-    return;
-};
+  if (!(0, designable_shared_1.isStr)(message)) return
+  const matched = message.match(/@([^:\s]+)(?:\s*\:\s*([\s\S]+))?/)
+  if (matched) return [matched[1], matched[2]]
+  return
+}
 const mapEnum = (dataSource) => (item, index) => {
-    const label = dataSource[index] || dataSource[item.value] || item.label;
-    const icon = takeIcon(label);
-    return {
-        ...item,
-        value: item?.value ?? null,
-        label: icon ? ((0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: icon[0], tooltip: icon[1] })) : (label?.label ?? label ?? 'Unknow'),
-    };
-};
+  const label = dataSource[index] || dataSource[item.value] || item.label
+  const icon = takeIcon(label)
+  return {
+    ...item,
+    value: item?.value ?? null,
+    label: icon
+      ? (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, {
+          infer: icon[0],
+          tooltip: icon[1],
+        })
+      : label?.label ?? label ?? 'Unknow',
+  }
+}
 const useLocales = (node) => {
-    (0, core_1.onFieldReact)('*', (field) => {
-        const path = field.path.toString().replace(/\.[\d+]/g, '');
-        const takeMessage = (prop) => {
-            const token = `settings.${path}${prop ? `.${prop}` : ''}`;
-            return node.getMessage(token) || designable_core_1.GlobalRegistry.getDesignerMessage(token);
-        };
-        const title = takeMessage('title') || takeMessage();
-        const description = takeMessage('description');
-        const tooltip = takeMessage('tooltip');
-        const dataSource = takeMessage('dataSource');
-        const placeholder = takeMessage('placeholder');
-        if (title) {
-            field.title = title;
+  ;(0, core_1.onFieldReact)('*', (field) => {
+    const path = field.path.toString().replace(/\.[\d+]/g, '')
+    const takeMessage = (prop) => {
+      const token = `settings.${path}${prop ? `.${prop}` : ''}`
+      return (
+        node.getMessage(token) ||
+        designable_core_1.GlobalRegistry.getDesignerMessage(token)
+      )
+    }
+    const title = takeMessage('title') || takeMessage()
+    const description = takeMessage('description')
+    const tooltip = takeMessage('tooltip')
+    const dataSource = takeMessage('dataSource')
+    const placeholder = takeMessage('placeholder')
+    if (title) {
+      field.title = title
+    }
+    if (description) {
+      field.description = description
+    }
+    if (tooltip) {
+      field.decorator[1] = field.decorator[1] || []
+      field.decorator[1].tooltip = tooltip
+    }
+    if (placeholder) {
+      field.component[1] = field.component[1] || []
+      field.component[1].placeholder = placeholder
+    }
+    if (!(0, core_1.isVoidField)(field)) {
+      if (dataSource?.length) {
+        if (field.dataSource?.length) {
+          field.dataSource = field.dataSource.map(mapEnum(dataSource))
+        } else {
+          field.dataSource = dataSource.slice()
         }
-        if (description) {
-            field.description = description;
-        }
-        if (tooltip) {
-            field.decorator[1] = field.decorator[1] || [];
-            field.decorator[1].tooltip = tooltip;
-        }
-        if (placeholder) {
-            field.component[1] = field.component[1] || [];
-            field.component[1].placeholder = placeholder;
-        }
-        if (!(0, core_1.isVoidField)(field)) {
-            if (dataSource?.length) {
-                if (field.dataSource?.length) {
-                    field.dataSource = field.dataSource.map(mapEnum(dataSource));
-                }
-                else {
-                    field.dataSource = dataSource.slice();
-                }
-            }
-            else {
-                field.dataSource = field.dataSource?.filter(Boolean);
-            }
-        }
-    });
-};
-exports.useLocales = useLocales;
+      } else {
+        field.dataSource = field.dataSource?.filter(Boolean)
+      }
+    }
+  })
+}
+exports.useLocales = useLocales

package/lib/effects/useSnapshot.d.ts

@@ -1,2 +1,2 @@
-import { Operation } from '@thienvu18/designable-core';
-export declare const useSnapshot: (operation: Operation) => void;
+import { Operation } from '@thienvu18/designable-core'
+export declare const useSnapshot: (operation: Operation) => void

package/lib/effects/useSnapshot.js

@@ -1,14 +1,14 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSnapshot = void 0;
-const core_1 = require("@formily/core");
-let timeRequest = null;
+'use strict'
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.useSnapshot = void 0
+const core_1 = require('@formily/core')
+let timeRequest = null
 const useSnapshot = (operation) => {
-    (0, core_1.onFieldInputValueChange)('*', () => {
-        clearTimeout(timeRequest);
-        timeRequest = setTimeout(() => {
-            operation.snapshot('update:node:props');
-        }, 1000);
-    });
-};
-exports.useSnapshot = useSnapshot;
+  ;(0, core_1.onFieldInputValueChange)('*', () => {
+    clearTimeout(timeRequest)
+    timeRequest = setTimeout(() => {
+      operation.snapshot('update:node:props')
+    }, 1000)
+  })
+}
+exports.useSnapshot = useSnapshot

package/lib/index.d.ts

@@ -1,5 +1,5 @@
-import './locales';
-export * from './registry';
-export * from './components';
-export * from './SchemaField';
-export * from './SettingsForm';
+import './locales'
+export * from './SchemaField'
+export * from './SettingsForm'
+export * from './components'
+export * from './registry'

package/lib/index.js

@@ -1,21 +1,37 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-require("./locales");
-__exportStar(require("./registry"), exports);
-__exportStar(require("./components"), exports);
-__exportStar(require("./SchemaField"), exports);
-__exportStar(require("./SettingsForm"), exports);
+'use strict'
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        var desc = Object.getOwnPropertyDescriptor(m, k)
+        if (
+          !desc ||
+          ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)
+        ) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k]
+            },
+          }
+        }
+        Object.defineProperty(o, k2, desc)
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k
+        o[k2] = m[k]
+      })
+var __exportStar =
+  (this && this.__exportStar) ||
+  function (m, exports) {
+    for (var p in m)
+      if (p !== 'default' && !Object.prototype.hasOwnProperty.call(exports, p))
+        __createBinding(exports, m, p)
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+require('./locales')
+__exportStar(require('./registry'), exports)
+__exportStar(require('./components'), exports)
+__exportStar(require('./SchemaField'), exports)
+__exportStar(require('./SettingsForm'), exports)

package/lib/locales/en-US.d.ts

@@ -1,13 +1,13 @@
 declare const _default: {
-    'en-US': {
-        SettingComponents: {
-            ValueInput: {
-                expression: string;
-            };
-            MonacoInput: {
-                helpDocument: string;
-            };
-        };
-    };
-};
-export default _default;
+  'en-US': {
+    SettingComponents: {
+      ValueInput: {
+        expression: string
+      }
+      MonacoInput: {
+        helpDocument: string
+      }
+    }
+  }
+}
+export default _default