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

package/lib/components/FontStyleSetter/index.js

@@ -1,94 +1,219 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FontStyleSetter = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const designable_react_1 = require("@thienvu18/designable-react");
-const react_1 = require("@formily/react");
-const formily_antd_v6_1 = require("@thienvu18/formily-antd-v6");
-const FoldItem_1 = require("../FoldItem");
-const InputItems_1 = require("../InputItems");
-const SizeInput_1 = require("../SizeInput");
-const ColorInput_1 = require("../ColorInput");
-const classnames_1 = __importDefault(require("classnames"));
+'use strict'
+var __importDefault =
+  (this && this.__importDefault) ||
+  function (mod) {
+    return mod && mod.__esModule ? mod : { default: mod }
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.FontStyleSetter = void 0
+const jsx_runtime_1 = require('react/jsx-runtime')
+const designable_react_1 = require('@thienvu18/designable-react')
+const react_1 = require('@formily/react')
+const formily_antd_v6_1 = require('@thienvu18/formily-antd-v6')
+const FoldItem_1 = require('../FoldItem')
+const InputItems_1 = require('../InputItems')
+const SizeInput_1 = require('../SizeInput')
+const ColorInput_1 = require('../ColorInput')
+const classnames_1 = __importDefault(require('classnames'))
 const createFontFamilyOptions = (fonts) => {
-    return fonts.map((font) => {
-        const splited = font.split('=');
-        const label = splited?.[0];
-        const value = splited?.[1];
-        return {
-            label: (0, jsx_runtime_1.jsx)("span", { style: { fontFamily: value }, children: label }),
-            value,
-        };
-    });
-};
+  return fonts.map((font) => {
+    const splited = font.split('=')
+    const label = splited?.[0]
+    const value = splited?.[1]
+    return {
+      label: (0, jsx_runtime_1.jsx)('span', {
+        style: { fontFamily: value },
+        children: label,
+      }),
+      value,
+    }
+  })
+}
 const FontFamilyOptions = createFontFamilyOptions([
-    '宋体=SimSun',
-    '微软雅黑=Microsoft Yahei',
-    '苹方=PingFang SC',
-    'Andale Mono=andale mono,monospace',
-    'Arial=arial,helvetica,sans-serif',
-    'Arial Black=arial black,sans-serif',
-    'Book Antiqua=book antiqua,palatino,serif',
-    'Comic Sans MS=comic sans ms,sans-serif',
-    'Courier New=courier new,courier,monospace',
-    'Georgia=georgia,palatino,serif',
-    'Helvetica Neue=Helvetica Neue',
-    'Helvetica=helvetica,arial,sans-serif',
-    'Impact=impact,sans-serif',
-    'Symbol=symbol',
-    'Tahoma=tahoma,arial,helvetica,sans-serif',
-    'Terminal=terminal,monaco,monospace',
-    'Times New Roman=times new roman,times,serif',
-    'Trebuchet MS=trebuchet ms,geneva,sans-serif',
-    'Verdana=verdana,geneva,sans-serif',
-]);
+  '宋体=SimSun',
+  '微软雅黑=Microsoft Yahei',
+  '苹方=PingFang SC',
+  'Andale Mono=andale mono,monospace',
+  'Arial=arial,helvetica,sans-serif',
+  'Arial Black=arial black,sans-serif',
+  'Book Antiqua=book antiqua,palatino,serif',
+  'Comic Sans MS=comic sans ms,sans-serif',
+  'Courier New=courier new,courier,monospace',
+  'Georgia=georgia,palatino,serif',
+  'Helvetica Neue=Helvetica Neue',
+  'Helvetica=helvetica,arial,sans-serif',
+  'Impact=impact,sans-serif',
+  'Symbol=symbol',
+  'Tahoma=tahoma,arial,helvetica,sans-serif',
+  'Terminal=terminal,monaco,monospace',
+  'Times New Roman=times new roman,times,serif',
+  'Trebuchet MS=trebuchet ms,geneva,sans-serif',
+  'Verdana=verdana,geneva,sans-serif',
+])
 exports.FontStyleSetter = (0, react_1.observer)((props) => {
-    const field = (0, react_1.useField)();
-    const prefix = (0, designable_react_1.usePrefix)('font-style-setter');
-    return ((0, jsx_runtime_1.jsxs)(FoldItem_1.FoldItem, { label: field.title, className: (0, classnames_1.default)(prefix, props.className), style: props.style, children: [(0, jsx_runtime_1.jsx)(FoldItem_1.FoldItem.Base, { children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "fontFamily", basePath: field.address.parent(), component: [
-                        formily_antd_v6_1.Select,
-                        { style: { width: '100%' }, placeholder: 'Helvetica Neue' },
-                    ], dataSource: FontFamilyOptions }) }), (0, jsx_runtime_1.jsx)(FoldItem_1.FoldItem.Extra, { children: (0, jsx_runtime_1.jsxs)(InputItems_1.InputItems, { children: [(0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "FontWeight", width: "50%", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "fontWeight", basePath: field.address.parent(), component: [formily_antd_v6_1.NumberPicker, { placeholder: '400' }] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "FontStyle", width: "50%", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "fontStyle", basePath: field.address.parent(), dataSource: [
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "NormalFontStyle" }),
-                                        value: 'normal',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "ItalicFontStyle" }),
-                                        value: 'italic',
-                                    },
-                                ], component: [formily_antd_v6_1.Radio.Group, { optionType: 'button' }] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "FontColor", width: "100%", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "color", basePath: field.address.parent(), component: [ColorInput_1.ColorInput] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "FontSize", width: "50%", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "fontSize", basePath: field.address.parent(), component: [SizeInput_1.SizeInput, { exclude: ['auto'] }] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "LineHeight", width: "50%", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "lineHeight", basePath: field.address.parent(), component: [SizeInput_1.SizeInput, { exclude: ['auto'] }] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "TextAlign", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "textAlign", basePath: field.address.parent(), dataSource: [
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextAlignLeft" }),
-                                        value: 'left',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextAlignCenter" }),
-                                        value: 'center',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextAlignRight" }),
-                                        value: 'right',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextAlignJustify" }),
-                                        value: 'justify',
-                                    },
-                                ], component: [formily_antd_v6_1.Radio.Group, { optionType: 'button' }] }) }), (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, { icon: "TextDecoration", children: (0, jsx_runtime_1.jsx)(react_1.Field, { name: "textDecoration", basePath: field.address.parent(), dataSource: [
-                                    {
-                                        label: '--',
-                                        value: 'none',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextUnderline" }),
-                                        value: 'underline',
-                                    },
-                                    {
-                                        label: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "TextLineThrough" }),
-                                        value: 'line-through',
-                                    },
-                                ], component: [formily_antd_v6_1.Radio.Group, { optionType: 'button' }] }) })] }) })] }));
-});
+  const field = (0, react_1.useField)()
+  const prefix = (0, designable_react_1.usePrefix)('font-style-setter')
+  return (0, jsx_runtime_1.jsxs)(FoldItem_1.FoldItem, {
+    label: field.title,
+    className: (0, classnames_1.default)(prefix, props.className),
+    style: props.style,
+    children: [
+      (0, jsx_runtime_1.jsx)(FoldItem_1.FoldItem.Base, {
+        children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+          name: 'fontFamily',
+          basePath: field.address.parent(),
+          component: [
+            formily_antd_v6_1.Select,
+            { style: { width: '100%' }, placeholder: 'Helvetica Neue' },
+          ],
+          dataSource: FontFamilyOptions,
+        }),
+      }),
+      (0, jsx_runtime_1.jsx)(FoldItem_1.FoldItem.Extra, {
+        children: (0, jsx_runtime_1.jsxs)(InputItems_1.InputItems, {
+          children: [
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'FontWeight',
+              width: '50%',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'fontWeight',
+                basePath: field.address.parent(),
+                component: [
+                  formily_antd_v6_1.NumberPicker,
+                  { placeholder: '400' },
+                ],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'FontStyle',
+              width: '50%',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'fontStyle',
+                basePath: field.address.parent(),
+                dataSource: [
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'NormalFontStyle' }
+                    ),
+                    value: 'normal',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'ItalicFontStyle' }
+                    ),
+                    value: 'italic',
+                  },
+                ],
+                component: [
+                  formily_antd_v6_1.Radio.Group,
+                  { optionType: 'button' },
+                ],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'FontColor',
+              width: '100%',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'color',
+                basePath: field.address.parent(),
+                component: [ColorInput_1.ColorInput],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'FontSize',
+              width: '50%',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'fontSize',
+                basePath: field.address.parent(),
+                component: [SizeInput_1.SizeInput, { exclude: ['auto'] }],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'LineHeight',
+              width: '50%',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'lineHeight',
+                basePath: field.address.parent(),
+                component: [SizeInput_1.SizeInput, { exclude: ['auto'] }],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'TextAlign',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'textAlign',
+                basePath: field.address.parent(),
+                dataSource: [
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextAlignLeft' }
+                    ),
+                    value: 'left',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextAlignCenter' }
+                    ),
+                    value: 'center',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextAlignRight' }
+                    ),
+                    value: 'right',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextAlignJustify' }
+                    ),
+                    value: 'justify',
+                  },
+                ],
+                component: [
+                  formily_antd_v6_1.Radio.Group,
+                  { optionType: 'button' },
+                ],
+              }),
+            }),
+            (0, jsx_runtime_1.jsx)(InputItems_1.InputItems.Item, {
+              icon: 'TextDecoration',
+              children: (0, jsx_runtime_1.jsx)(react_1.Field, {
+                name: 'textDecoration',
+                basePath: field.address.parent(),
+                dataSource: [
+                  {
+                    label: '--',
+                    value: 'none',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextUnderline' }
+                    ),
+                    value: 'underline',
+                  },
+                  {
+                    label: (0, jsx_runtime_1.jsx)(
+                      designable_react_1.IconWidget,
+                      { infer: 'TextLineThrough' }
+                    ),
+                    value: 'line-through',
+                  },
+                ],
+                component: [
+                  formily_antd_v6_1.Radio.Group,
+                  { optionType: 'button' },
+                ],
+              }),
+            }),
+          ],
+        }),
+      }),
+    ],
+  })
+})

package/lib/components/ImageInput/index.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
-import { InputProps } from 'antd';
-import './styles.less';
+import { InputProps } from 'antd'
+import React from 'react'
+import './styles.less'
 export interface ImageInputProps extends Omit<InputProps, 'onChange'> {
-    value?: string;
-    onChange?: (value: string) => void;
+  value?: string
+  onChange?: (value: string) => void
 }
-export declare const ImageInput: React.FC<ImageInputProps>;
-export declare const BackgroundImageInput: React.FC<ImageInputProps>;
+export declare const ImageInput: React.FC<ImageInputProps>
+export declare const BackgroundImageInput: React.FC<ImageInputProps>

package/lib/components/ImageInput/index.js

@@ -1,49 +1,71 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BackgroundImageInput = exports.ImageInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const antd_1 = require("antd");
-const designable_react_1 = require("@thienvu18/designable-react");
-const context_1 = require("../../shared/context");
-const classnames_1 = __importDefault(require("classnames"));
-require("./styles.less");
+'use strict'
+var __importDefault =
+  (this && this.__importDefault) ||
+  function (mod) {
+    return mod && mod.__esModule ? mod : { default: mod }
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.BackgroundImageInput = exports.ImageInput = void 0
+const jsx_runtime_1 = require('react/jsx-runtime')
+const react_1 = require('react')
+const antd_1 = require('antd')
+const designable_react_1 = require('@thienvu18/designable-react')
+const context_1 = require('../../shared/context')
+const classnames_1 = __importDefault(require('classnames'))
+require('./styles.less')
 const ImageInput = ({ className, style, ...props }) => {
-    const prefix = (0, designable_react_1.usePrefix)('image-input');
-    const context = (0, react_1.useContext)(context_1.SettingsFormContext);
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(prefix, className), style: style, children: (0, jsx_runtime_1.jsx)(antd_1.Input, { ...props, onChange: (e) => {
-                props.onChange?.(e?.target?.['value']);
-            }, prefix: (0, jsx_runtime_1.jsx)(antd_1.Upload, { action: context.uploadAction, itemRender: () => null, maxCount: 1, onChange: (params) => {
-                    const response = params.file?.response;
-                    const url = response?.url ||
-                        response?.downloadURL ||
-                        response?.imageURL ||
-                        response?.thumbUrl;
-                    if (!url)
-                        return;
-                    props.onChange?.(url);
-                }, children: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: "CloudUpload", style: { cursor: 'pointer' } }) }) }) }));
-};
-exports.ImageInput = ImageInput;
+  const prefix = (0, designable_react_1.usePrefix)('image-input')
+  const context = (0, react_1.useContext)(context_1.SettingsFormContext)
+  return (0, jsx_runtime_1.jsx)('div', {
+    className: (0, classnames_1.default)(prefix, className),
+    style: style,
+    children: (0, jsx_runtime_1.jsx)(antd_1.Input, {
+      ...props,
+      onChange: (e) => {
+        props.onChange?.(e?.target?.['value'])
+      },
+      prefix: (0, jsx_runtime_1.jsx)(antd_1.Upload, {
+        action: context.uploadAction,
+        itemRender: () => null,
+        maxCount: 1,
+        onChange: (params) => {
+          const response = params.file?.response
+          const url =
+            response?.url ||
+            response?.downloadURL ||
+            response?.imageURL ||
+            response?.thumbUrl
+          if (!url) return
+          props.onChange?.(url)
+        },
+        children: (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, {
+          infer: 'CloudUpload',
+          style: { cursor: 'pointer' },
+        }),
+      }),
+    }),
+  })
+}
+exports.ImageInput = ImageInput
 const BackgroundImageInput = (props) => {
-    const addBgValue = (value) => {
-        if (/url\([^)]+\)/.test(value)) {
-            return value;
-        }
-        return `url(${value})`;
-    };
-    const removeBgValue = (value) => {
-        const matched = String(value).match(/url\(\s*([^)]+)\s*\)/);
-        if (matched?.[1]) {
-            return matched?.[1];
-        }
-        return value;
-    };
-    return ((0, jsx_runtime_1.jsx)(exports.ImageInput, { value: removeBgValue(props.value), onChange: (url) => {
-            props.onChange?.(addBgValue(url));
-        } }));
-};
-exports.BackgroundImageInput = BackgroundImageInput;
+  const addBgValue = (value) => {
+    if (/url\([^)]+\)/.test(value)) {
+      return value
+    }
+    return `url(${value})`
+  }
+  const removeBgValue = (value) => {
+    const matched = String(value).match(/url\(\s*([^)]+)\s*\)/)
+    if (matched?.[1]) {
+      return matched?.[1]
+    }
+    return value
+  }
+  return (0, jsx_runtime_1.jsx)(exports.ImageInput, {
+    value: removeBgValue(props.value),
+    onChange: (url) => {
+      props.onChange?.(addBgValue(url))
+    },
+  })
+}
+exports.BackgroundImageInput = BackgroundImageInput

package/lib/components/InputItems/index.d.ts

@@ -1,23 +1,25 @@
-import React from 'react';
-import './styles.less';
+import React from 'react'
+import './styles.less'
 export interface IInputItemsContext {
-    width?: string | number;
-    vertical?: boolean;
+  width?: string | number
+  vertical?: boolean
 }
 export interface IInputItemsProps {
-    className?: string;
-    style?: React.CSSProperties;
-    width?: string | number;
-    vertical?: boolean;
+  className?: string
+  style?: React.CSSProperties
+  width?: string | number
+  vertical?: boolean
 }
 export interface IInputItemProps {
-    className?: string;
-    style?: React.CSSProperties;
-    icon?: React.ReactNode;
-    width?: string | number;
-    vertical?: boolean;
-    title?: React.ReactNode;
+  className?: string
+  style?: React.CSSProperties
+  icon?: React.ReactNode
+  width?: string | number
+  vertical?: boolean
+  title?: React.ReactNode
+}
+export declare const InputItems: React.FC<
+  React.PropsWithChildren<IInputItemsProps>
+> & {
+  Item: React.FC<React.PropsWithChildren<IInputItemProps>>
 }
-export declare const InputItems: React.FC<React.PropsWithChildren<IInputItemsProps>> & {
-    Item: React.FC<React.PropsWithChildren<IInputItemProps>>;
-};

package/lib/components/InputItems/index.js

@@ -1,48 +1,103 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InputItems = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const designable_react_1 = require("@thienvu18/designable-react");
-const classnames_1 = __importDefault(require("classnames"));
-require("./styles.less");
-const InputItemsContext = react_1.default.createContext(null);
+'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 __setModuleDefault =
+  (this && this.__setModuleDefault) ||
+  (Object.create
+    ? function (o, v) {
+        Object.defineProperty(o, 'default', { enumerable: true, value: v })
+      }
+    : function (o, v) {
+        o['default'] = v
+      })
+var __importStar =
+  (this && this.__importStar) ||
+  function (mod) {
+    if (mod && mod.__esModule) return mod
+    var result = {}
+    if (mod != null)
+      for (var k in mod)
+        if (k !== 'default' && Object.prototype.hasOwnProperty.call(mod, k))
+          __createBinding(result, mod, k)
+    __setModuleDefault(result, mod)
+    return result
+  }
+var __importDefault =
+  (this && this.__importDefault) ||
+  function (mod) {
+    return mod && mod.__esModule ? mod : { default: mod }
+  }
+Object.defineProperty(exports, '__esModule', { value: true })
+exports.InputItems = void 0
+const jsx_runtime_1 = require('react/jsx-runtime')
+const react_1 = __importStar(require('react'))
+const designable_react_1 = require('@thienvu18/designable-react')
+const classnames_1 = __importDefault(require('classnames'))
+require('./styles.less')
+const InputItemsContext = react_1.default.createContext(null)
 const InputItems = (props) => {
-    const { width = '100%', className, style, children } = props;
-    const prefix = (0, designable_react_1.usePrefix)('input-items');
-    return ((0, jsx_runtime_1.jsx)(InputItemsContext.Provider, { value: { width, vertical: props.vertical }, children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(prefix, className), style: style, children: children }) }));
-};
-exports.InputItems = InputItems;
+  const { width = '100%', className, style, children } = props
+  const prefix = (0, designable_react_1.usePrefix)('input-items')
+  return (0, jsx_runtime_1.jsx)(InputItemsContext.Provider, {
+    value: { width, vertical: props.vertical },
+    children: (0, jsx_runtime_1.jsx)('div', {
+      className: (0, classnames_1.default)(prefix, className),
+      style: style,
+      children: children,
+    }),
+  })
+}
+exports.InputItems = InputItems
 exports.InputItems.Item = (props) => {
-    const prefix = (0, designable_react_1.usePrefix)('input-items-item');
-    const ctx = (0, react_1.useContext)(InputItemsContext);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(prefix, props.className, {
-            vertical: props.vertical || ctx?.vertical,
-        }), style: { width: props.width || ctx?.width, ...props.style }, children: [props.icon && ((0, jsx_runtime_1.jsx)("div", { className: prefix + '-icon', children: typeof props.icon === 'string' ? ((0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, { infer: props.icon, size: 16 })) : (props.icon) })), props.title && (0, jsx_runtime_1.jsx)("div", { className: prefix + '-title', children: props.title }), (0, jsx_runtime_1.jsx)("div", { className: prefix + '-controller', children: props.children })] }));
-};
+  const prefix = (0, designable_react_1.usePrefix)('input-items-item')
+  const ctx = (0, react_1.useContext)(InputItemsContext)
+  return (0, jsx_runtime_1.jsxs)('div', {
+    className: (0, classnames_1.default)(prefix, props.className, {
+      vertical: props.vertical || ctx?.vertical,
+    }),
+    style: { width: props.width || ctx?.width, ...props.style },
+    children: [
+      props.icon &&
+        (0, jsx_runtime_1.jsx)('div', {
+          className: prefix + '-icon',
+          children:
+            typeof props.icon === 'string'
+              ? (0, jsx_runtime_1.jsx)(designable_react_1.IconWidget, {
+                  infer: props.icon,
+                  size: 16,
+                })
+              : props.icon,
+        }),
+      props.title &&
+        (0, jsx_runtime_1.jsx)('div', {
+          className: prefix + '-title',
+          children: props.title,
+        }),
+      (0, jsx_runtime_1.jsx)('div', {
+        className: prefix + '-controller',
+        children: props.children,
+      }),
+    ],
+  })
+}