@pisell/materials 1.0.449 → 1.0.451

package/lowcode/submit-button/meta.ts

@@ -0,0 +1,1002 @@
+import { ComponentMetadata, Snippet } from '@alilc/lowcode-types';
+import snippets from './snippets';
+
+const SubmitButtonMeta: ComponentMetadata = {
+  componentName: 'SubmitButton',
+  title: '提交按钮',
+  category: '表单',
+  group: '无代码组件',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.1',
+    exportName: 'SubmitButton',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  generalProps: [
+    {
+      type: 'group',
+      title: {
+        type: 'i18n',
+        'en-US': 'Info',
+        'zh-CN': '信息',
+      },
+      display: 'accordion',
+      items: [
+        {
+          name: 'children',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Text',
+              'zh-CN': '文字',
+            },
+            tip: 'children',
+          },
+          propType: {
+            type: 'oneOfType',
+            value: ['node', 'string'],
+          },
+          setter: ['SlotSetter', 'PisellI18nSetter', 'VariableSetter'],
+        },
+        {
+          name: 'status',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Status',
+              'zh-CN': '状态',
+            },
+          },
+          propType: {
+            type: 'oneOf',
+            value: ['normal', 'disabled', 'hidden'],
+          },
+          setter: {
+            componentName: 'RadioGroupSetter',
+            props: {
+              options: [
+                {
+                  title: '正常',
+                  value: 'normal',
+                },
+                {
+                  title: '禁用',
+                  value: 'disabled',
+                },
+                {
+                  title: '隐藏',
+                  value: 'hidden',
+                },
+              ],
+            },
+          },
+        },
+      ],
+    },
+    {
+      type: 'group',
+      title: {
+        type: 'i18n',
+        'en-US': 'Appearance',
+        'zh-CN': '外观',
+      },
+      display: 'accordion',
+      items: [
+        {
+          name: 'type',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Button type',
+              'zh-CN': '按钮类型',
+            },
+          },
+          propType: {
+            type: 'oneOf',
+            value: [
+              'primary',
+              'default',
+              'ghost',
+              'dashed',
+              'danger',
+              'link',
+              'text',
+            ],
+          },
+          setter: [
+            {
+              componentName: 'SelectSetter',
+              props: {
+                options: [
+                  {
+                    title: 'primary button',
+                    value: 'primary',
+                  },
+                  {
+                    title: 'default button',
+                    value: 'default',
+                  },
+                  {
+                    title: 'dashed button',
+                    value: 'dashed',
+                  },
+                  {
+                    title: 'danger button',
+                    value: 'danger',
+                  },
+                  {
+                    title: 'link button',
+                    value: 'link',
+                  },
+                  {
+                    title: 'text button',
+                    value: 'text',
+                  },
+                ],
+              },
+            },
+            'VariableSetter',
+          ],
+        },
+      ],
+    },
+    {
+      type: 'group',
+      title: {
+        type: 'i18n',
+        'en-US': 'Submission',
+        'zh-CN': '提交',
+      },
+      display: 'accordion',
+      items: [
+        {
+          name: 'confirmConfig',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Confirm before submission',
+              'zh-CN': '提交前确认',
+            },
+          },
+          setter: {
+            componentName: 'ObjectSetter',
+            props: {
+              config: {
+                items: [
+                  {
+                    name: 'enable',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Enable',
+                      'zh-CN': '启用',
+                    },
+                    setter: 'BoolSetter',
+                    isRequired: true,
+                  },
+                  {
+                    name: 'icon',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Icon',
+                      'zh-CN': '图标',
+                    },
+                    setter: [
+                      {
+                        componentName: 'SlotSetter',
+                        initialValue: {
+                          type: 'JSSlot',
+                          value: [
+                            {
+                              componentName: 'Icon',
+                              props: {
+                                type: 'SmileOutlined',
+                                size: 20,
+                                rotate: 0,
+                                spin: false,
+                              },
+                            },
+                          ],
+                        },
+                        defaultValue: null,
+                      },
+                    ],
+                  },
+                  {
+                    name: 'title',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Title',
+                      'zh-CN': '标题',
+                    },
+                    setter: ['PisellI18nSetter', 'VariableSetter'],
+                  },
+                  {
+                    name: 'content',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Helper text',
+                      'zh-CN': '辅助文字',
+                    },
+                    setter: ['PisellI18nSetter', 'VariableSetter'],
+                  },
+                  {
+                    name: 'cancelText',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Cancel button text',
+                      'zh-CN': '取消按钮文字',
+                    },
+                    setter: ['PisellI18nSetter', 'VariableSetter'],
+                  },
+                  {
+                    name: 'okText',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'OK button text',
+                      'zh-CN': '确定按钮文字',
+                    },
+                    setter: ['PisellI18nSetter', 'VariableSetter'],
+                  },
+                ],
+              },
+              columns: 1,
+              forceInline: 1,
+              mode: 'popup',
+            },
+          },
+        },
+      ],
+    },
+    {
+      type: 'group',
+      title: {
+        type: 'i18n',
+        'en-US': 'After submimssion',
+        'zh-CN': '提交后',
+      },
+      display: 'accordion',
+      items: [
+        {
+          name: 'toastConfig',
+          title: '显示提示',
+          setter: {
+            componentName: 'ObjectSetter',
+            props: {
+              config: {
+                items: [
+                  {
+                    name: 'enable',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Enable',
+                      'zh-CN': '启用',
+                    },
+                    setter: 'BoolSetter',
+                    isRequired: true,
+                  },
+                  {
+                    name: 'icon',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Icon',
+                      'zh-CN': '图标',
+                    },
+                    setter: [
+                      {
+                        componentName: 'SlotSetter',
+                        initialValue: {
+                          type: 'JSSlot',
+                          value: [
+                            {
+                              componentName: 'Icon',
+                              props: {
+                                type: 'SmileOutlined',
+                                size: 20,
+                                rotate: 0,
+                                spin: false,
+                              },
+                            },
+                          ],
+                        },
+                        defaultValue: null,
+                      },
+                    ],
+                  },
+                  {
+                    name: 'title',
+                    title: {
+                      type: 'i18n',
+                      'en-US': 'Text',
+                      'zh-CN': '文字',
+                    },
+                    setter: ['PisellI18nSetter', 'VariableSetter'],
+                  },
+                ],
+              },
+              columns: 1,
+              forceInline: 1,
+              mode: 'popup',
+            },
+          },
+        },
+        {
+          name: 'refreshData',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Refresh data',
+              'zh-CN': '刷新数据',
+            },
+          },
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'afterSubmitType',
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Action after submission',
+              'zh-CN': '提交后动作',
+            },
+          },
+          setter: {
+            componentName: 'SelectSetter',
+            props: {
+              options: [
+                {
+                  title: '无操作',
+                  value: 'none',
+                },
+                {
+                  title: '关闭当前抽屉/对话框',
+                  value: 'close',
+                },
+                {
+                  title: '显示模态框',
+                  value: 'showModal',
+                },
+                {
+                  title: '显示通知框',
+                  value: 'showNotification',
+                },
+              ],
+            },
+          },
+        },
+        {
+          name: 'afterSubmitModalConfig',
+          type: 'group',
+          extraProps: {
+            display: 'entry',
+          },
+          condition: (props) => {
+            return props.getPropValue('afterSubmitType') === 'showModal';
+          },
+          title: {
+            label: '模态框配置',
+          },
+          items: [
+            {
+              name: 'afterSubmitModalConfig.title',
+              title: {
+                type: 'i18n',
+                'en-US': 'Title',
+                'zh-CN': '标题',
+              },
+              setter: 'PisellI18nSetter',
+            },
+            {
+              name: 'afterSubmitModalConfig.content',
+              title: {
+                type: 'i18n',
+                'en-US': 'Content',
+                'zh-CN': '内容',
+              },
+              setter: 'PisellI18nSetter',
+            },
+            {
+              name: 'afterSubmitModalConfig.okText',
+              title: {
+                type: 'i18n',
+                'en-US': 'Button text',
+                'zh-CN': '按钮文字',
+              },
+              setter: 'PisellI18nSetter',
+            },
+          ],
+        },
+        {
+          name: 'afterSubmitNotificationConfig',
+          title: {
+            label: '通知框配置',
+          },
+          condition: (props) => {
+            return props.getPropValue('afterSubmitType') === 'showNotification';
+          },
+          type: 'group',
+          extraProps: {
+            display: 'entry',
+          },
+          items: [
+            {
+              name: 'afterSubmitNotificationConfig.icon',
+              title: {
+                type: 'i18n',
+                'en-US': 'Icon',
+                'zh-CN': '图标',
+              },
+              setter: [
+                {
+                  componentName: 'SlotSetter',
+                  initialValue: {
+                    type: 'JSSlot',
+                    value: [
+                      {
+                        componentName: 'Icon',
+                        props: {
+                          type: 'SmileOutlined',
+                          size: 20,
+                          rotate: 0,
+                          spin: false,
+                        },
+                      },
+                    ],
+                  },
+                  defaultValue: null,
+                },
+              ],
+            },
+            {
+              name: 'afterSubmitNotificationConfig.title',
+              title: {
+                type: 'i18n',
+                'en-US': 'Text',
+                'zh-CN': '文字',
+              },
+              setter: 'PisellI18nSetter',
+            },
+            {
+              name: 'afterSubmitNotificationConfig.content',
+              title: {
+                type: 'i18n',
+                'en-US': 'Message',
+                'zh-CN': '消息',
+              },
+              setter: 'PisellI18nSetter',
+            },
+            {
+              name: 'afterSubmitNotificationConfig.placement',
+              title: {
+                type: 'i18n',
+                'en-US': 'Placement',
+                'zh-CN': '位置',
+              },
+              setter: {
+                componentName: 'SelectSetter',
+                props: {
+                  options: [
+                    {
+                      title: 'top',
+                      value: 'top',
+                    },
+                    {
+                      title: 'topLeft',
+                      value: 'topLeft',
+                    },
+                    {
+                      title: 'topRight',
+                      value: 'topRight',
+                    },
+                    {
+                      title: 'bottom',
+                      value: 'bottom',
+                    },
+                    {
+                      title: 'bottomLeft',
+                      value: 'bottomLeft',
+                    },
+                    {
+                      title: 'bottomRight',
+                      value: 'bottomRight',
+                    },
+                  ],
+                },
+              },
+            },
+            {
+              name: 'afterSubmitNotificationConfig.duration',
+              title: {
+                type: 'i18n',
+                'en-US': 'Duration',
+                'zh-CN': '持续时间',
+              },
+              setter: 'NumberSetter',
+            },
+          ],
+        },
+      ],
+    },
+  ],
+  configure: {
+    props: [
+      {
+        title: {
+          label: {
+            type: 'i18n',
+            'en-US': 'Feature',
+            'zh-CN': '功能',
+          },
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'children',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'content',
+                'zh-CN': '内容',
+              },
+              tip: 'children',
+            },
+            propType: {
+              type: 'oneOfType',
+              value: ['node', 'string'],
+            },
+            setter: ['SlotSetter', 'PisellI18nSetter', 'VariableSetter'],
+          },
+          {
+            name: 'htmlType',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'native type',
+                'zh-CN': '原生类型',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US': 'htmlType | Set the native `type` value of `button`',
+                'zh-CN': 'htmlType | 设置 `button` 原生的 `type` 值',
+              },
+            },
+            propType: {
+              type: 'oneOf',
+              value: ['submit', 'reset', 'button'],
+            },
+            setter: [
+              {
+                componentName: 'RadioGroupSetter',
+                props: {
+                  options: [
+                    {
+                      title: 'Submit',
+                      value: 'submit',
+                    },
+                    {
+                      title: 'Reset',
+                      value: 'reset',
+                    },
+                    {
+                      title: 'Button',
+                      value: 'button',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+            defaultValue: 'button',
+          },
+          {
+            name: 'className',
+            title: {
+              label: '样式类名',
+              tip: 'className | 样式类名',
+            },
+            propType: 'string',
+            setter: 'StringSetter',
+          },
+          {
+            name: 'href',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'jump address',
+                'zh-CN': '跳转地址',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US':
+                  'href | click to jump to the address, specify this attribute button behavior is consistent with a link',
+                'zh-CN':
+                  'href | 点击跳转的地址，指定此属性 button 的行为和 a 链接一致',
+              },
+            },
+            propType: 'string',
+            setter: ['StringSetter', 'VariableSetter'],
+          },
+          {
+            name: 'target',
+            title: {
+              label: 'Target',
+              tip: {
+                type: 'i18n',
+                'en-US':
+                  'target | Equivalent to the target attribute of a link, effective when href exists',
+                'zh-CN':
+                  'target | 相当于 a 链接的 target 属性，href 存在时生效',
+              },
+            },
+            propType: {
+              type: 'oneOf',
+              value: ['_self', '_blank', '_parent', '_top'],
+            },
+            setter: [
+              {
+                componentName: 'SelectSetter',
+                props: {
+                  options: [
+                    {
+                      title: {
+                        type: 'i18n',
+                        'en-US': 'Jump to this window',
+                        'zh-CN': '本窗口跳转',
+                      },
+                      value: '_self',
+                    },
+                    {
+                      title: {
+                        type: 'i18n',
+                        'en-US': 'open a new tab',
+                        'zh-CN': '打开新标签页',
+                      },
+                      value: '_blank',
+                    },
+                    {
+                      title: {
+                        type: 'i18n',
+                        'en-US': 'parent window jump',
+                        'zh-CN': '父窗口跳转',
+                      },
+                      value: '_parent',
+                    },
+                    {
+                      title: {
+                        type: 'i18n',
+                        'en-US': 'Top-level window jump',
+                        'zh-CN': '顶层窗口跳转',
+                      },
+                      value: '_top',
+                    },
+                  ],
+                },
+              },
+              'StringSetter',
+              'VariableSetter',
+            ],
+            condition: {
+              type: 'JSFunction',
+              value:
+                'target => !!target.getProps().getPropValue("href")?.trim()',
+            },
+          },
+        ],
+      },
+      {
+        title: {
+          type: 'i18n',
+          'en-US': 'exterior',
+          'zh-CN': '外观',
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'type',
+            title: {
+              label: 'type',
+              tip: 'set button type',
+            },
+            propType: {
+              type: 'oneOf',
+              value: [
+                'primary',
+                'default',
+                'ghost',
+                'dashed',
+                'danger',
+                'link',
+                'text',
+              ],
+            },
+            setter: [
+              {
+                componentName: 'SelectSetter',
+                props: {
+                  options: [
+                    {
+                      title: 'primary button',
+                      value: 'primary',
+                    },
+                    {
+                      title: 'default button',
+                      value: 'default',
+                    },
+                    {
+                      title: 'dashed button',
+                      value: 'dashed',
+                    },
+                    {
+                      title: 'danger button',
+                      value: 'danger',
+                    },
+                    {
+                      title: 'link button',
+                      value: 'link',
+                    },
+                    {
+                      title: 'text button',
+                      value: 'text',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+          },
+          {
+            name: 'size',
+            title: {
+              label: 'size',
+              tip: 'set button size',
+            },
+            propType: { type: 'oneOf', value: ['large', 'middle', 'small'] },
+            setter: [
+              {
+                componentName: 'RadioGroupSetter',
+                props: {
+                  options: [
+                    {
+                      title: 'large',
+                      value: 'large',
+                    },
+                    {
+                      title: 'middle',
+                      value: 'middle',
+                    },
+                    {
+                      title: 'small',
+                      value: 'small',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+            defaultValue: 'middle',
+          },
+          {
+            name: 'shape',
+            title: {
+              label: 'shape',
+              tip: 'shape | Set button shape, optional value is `circle`, `round` or not set',
+            },
+            propType: { type: 'oneOf', value: ['default', 'circle', 'round'] },
+            defaultValue: 'default',
+            setter: [
+              {
+                componentName: 'RadioGroupSetter',
+                props: {
+                  options: [
+                    {
+                      title: 'default',
+                      value: 'default',
+                    },
+                    {
+                      title: 'circle',
+                      value: 'circle',
+                    },
+                    {
+                      title: 'round',
+                      value: 'round',
+                    },
+                  ],
+                },
+              },
+              'VariableSetter',
+            ],
+          },
+          {
+            name: 'icon',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'icon',
+                'zh-CN': '图标',
+              },
+              tip: 'icon | Set the icon component of the button',
+            },
+            propType: { type: 'oneOfType', value: ['node'] },
+            setter: [
+              {
+                componentName: 'SlotSetter',
+                initialValue: {
+                  type: 'JSSlot',
+                  value: [
+                    {
+                      componentName: 'Icon',
+                      props: {
+                        type: 'SmileOutlined',
+                        size: 20,
+                        rotate: 0,
+                        spin: false,
+                      },
+                    },
+                  ],
+                },
+                defaultValue: null,
+              },
+            ],
+          },
+          {
+            name: 'rightIcon',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Right icon',
+                'zh-CN': '右侧图标',
+              },
+              tip: 'icon | Set the icon component of the button',
+            },
+            propType: { type: 'oneOfType', value: ['node'] },
+            setter: [
+              {
+                componentName: 'SlotSetter',
+                initialValue: {
+                  type: 'JSSlot',
+                  value: [
+                    {
+                      componentName: 'Icon',
+                      props: {
+                        type: 'SmileOutlined',
+                        size: 20,
+                        rotate: 0,
+                        spin: false,
+                      },
+                    },
+                  ],
+                },
+                defaultValue: null,
+              },
+            ],
+          },
+          {
+            name: 'block',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'adaptive',
+                'zh-CN': '自适应',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US':
+                  'block | Option to adjust button width to its parent width',
+                'zh-CN': 'block | 将按钮宽度调整为其父宽度的选项',
+              },
+            },
+            propType: 'bool',
+            setter: 'BoolSetter',
+            defaultValue: false,
+          },
+          {
+            name: 'danger',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'danger button',
+                'zh-CN': '危险按钮',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US': 'danger | set hazard button',
+                'zh-CN': 'danger | 设置危险按钮',
+              },
+            },
+            propType: 'bool',
+            setter: 'BoolSetter',
+            defaultValue: false,
+          },
+          {
+            name: 'ghost',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'ghost attribute',
+                'zh-CN': '幽灵属性',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US':
+                  'ghost | Ghost property to make button background transparent',
+                'zh-CN': 'ghost | 幽灵属性，使按钮背景透明',
+              },
+            },
+            propType: 'bool',
+            setter: 'BoolSetter',
+            defaultValue: false,
+          },
+        ],
+      },
+
+      {
+        title: {
+          type: 'i18n',
+          'en-US': 'state',
+          'zh-CN': '状态',
+        },
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'loading',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'loading status',
+                'zh-CN': '载入状态',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US': 'loading | Set button loading state',
+                'zh-CN': 'loading | 设置按钮载入状态',
+              },
+            },
+            propType: 'bool',
+            setter: ['BoolSetter', 'VariableSetter'],
+          },
+          {
+            name: 'disabled',
+            title: {
+              label: {
+                type: 'i18n',
+                'en-US': 'Whether to disable',
+                'zh-CN': '是否禁用',
+              },
+              tip: {
+                type: 'i18n',
+                'en-US': 'disabled | Is it disabled',
+                'zh-CN': 'disabled | 是否为禁用状态',
+              },
+            },
+            propType: 'bool',
+            setter: ['BoolSetter', 'VariableSetter'],
+            defaultValue: false,
+          },
+        ],
+      },
+    ],
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onClick',
+          template:
+            "onClick(event,${extParams}){\n// 点击按钮时的回调\nconsole.log('onClick', event);}",
+        },
+      ],
+    },
+    component: {},
+  },
+};
+
+export default {
+  ...SubmitButtonMeta,
+  snippets,
+};