@ywfe/materials-design/lowcode/_base/button-base-props.ts

YwDesign for lowcode

import { IPublicTypeFieldConfig } from '@alilc/lowcode-types';
// import AntdIconSetter from '../_setters/antd-icon-setter';
import { getPropValueWithPath } from '../_utils';

const YwButtonBaseProps: IPublicTypeFieldConfig[] = [
  {
    title: {
      label: '按钮文字',
      tip: 'btnText | 按钮文字',
    },
    name: 'btnText',
    display: 'block',
    description: '按钮文字',
    supportVariable: false,
    setter: {
      componentName: 'StringSetter',
      initialValue: '按钮',
      props: {
        placeholder: '请输入',
      },
    },
  },
  {
    title: {
      label: '按钮类型',
      tip: 'btnType | 按钮类型',
    },
    display: 'block',
    supportVariable: false,
    name: 'btnType',
    description: '按钮类型',
    defaultValue: 'default',
    setter: {
      componentName: 'SelectSetter',
      props: {
        options: [
          {
            label: '主按钮',
            value: 'primary',
          },
          {
            label: '次按钮',
            value: 'default',
          },
          {
            label: '虚线按钮',
            value: 'dashed',
          },
          {
            label: '链接按钮',
            value: 'link',
          },
          {
            label: '文本按钮',
            value: 'text',
          },
          {
            label: '自定义按钮',
            value: '',
          },
        ],
      },
      initialValue: 'primary',
    },
  },
  {
    title: {
      label: '危险操作按钮',
      tip: 'danger | 危险操作按钮',
    },
    display: 'block',
    supportVariable: false,
    name: 'danger',
    setter: {
      componentName: 'BoolSetter',
      isRequired: false,
    },
  },
  {
    title: { label: '是否禁用', tip: 'disabled | 是否禁用' },
    name: 'disabled',
    display: 'block',
    //   条件渲染setter 后面补充
    setter: 'BoolSetter',
  },
  // {
  //   title: {
  //     label: '跳转类型',
  //     tip: 'target | 是否新开浏览器页面，默认当前页跳转',
  //   },
  //   supportVariable: false,
  //   name: 'target',
  //   setter: {
  //     componentName: 'SelectSetter',
  //     props: {
  //       options: [
  //         {
  //           label: '当前页面',
  //           value: '_self',
  //         },
  //         {
  //           label: '新开页面',
  //           value: '_blank',
  //         },
  //       ],
  //     },
  //   },
  // },
  // {
  //   title: {
  //     label: '跳转链接',
  //     tip: 'href | 跳转链接',
  //   },
  //   name: 'href',
  //   setter: {
  //     componentName: 'StringSetter',
  //     isRequired: false,
  //     initialValue: null,
  //   },
  // },
  // {
  //   title: {
  //     label: '左侧icon',
  //     tip: 'leftIcon | 左侧icon',
  //   },
  //   supportVariable: false,
  //   name: 'leftIcon',
  //   description: '左侧icon',
  //   setter: {
  //     componentName: AntdIconSetter,
  //     props: {
  //       type: 'node',
  //     },
  //   },
  // },
  // {
  //   title: {
  //     label: '右侧icon',
  //     tip: 'rightIcon | 右侧icon',
  //   },
  //   supportVariable: false,
  //   name: 'rightIcon',
  //   description: '右侧icon',
  //   setter: {
  //     componentName: AntdIconSetter,
  //     props: {
  //       type: 'node',
  //     },
  //   },
  // },
  {
    title: {
      label: '自定义按钮',
      tip: 'children | 自定义按钮',
    },
    display: 'block',
    supportVariable: false,
    name: 'children',
    setter: {
      componentName: 'SlotSetter',
      title: '组件坑位',
      initialValue: {
        type: 'JSSlot',
        value: [],
      },
    },
    condition: (target: any) => {
      return getPropValueWithPath(target, '.btnType') === '';
    },
  },
];

export default YwButtonBaseProps;