module.exports = {
  group: '原子组件',
  componentName: 'Box',
  title: '容器',
  category: '布局容器类',
  icon: 'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_table.png',
  docUrl: '',
  screenshot: '',
  npm: {
    "package": '@alilc/lowcode-materials',
    version: '{{version}}',
    exportName: 'Box',
    main: '',
    destructuring: true,
    subName: ''
  },
  props: [{
    name: 'style',
    propType: 'object',
    description: '自定义内敛样式'
  }, {
    name: 'direction',
    title: '对齐方向',
    defaultValue: 'column',
    initialValue: 'column',
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: 'column',
      defaultValue: 'column',
      props: {
        defaultValue: 'column',
        options: [{
          // "title": "| 垂直",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 9 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M0 6h9v5H0zm5 9v-3H4v3H2l2.5 3L7 15H5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M1 1h7v3H1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M1 1v3h7V1H1zM0 0h9v5H0V0z"
          }))),
          value: 'column'
        }, {
          // "title": "- 水平",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 19 9"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M16 4h-4v1h4v2l3-2.5L16 2v2zM6 0h5v9H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M1 1h3v7H1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M1 1v7h3V1H1zM0 0h5v9H0V0z"
          }))),
          value: 'row'
        }]
      }
    }
  }, {
    name: 'justify',
    title: '主轴对齐',
    defaultValue: 'center',
    initialValue: 'center',
    condition: function condition(target) {
      return target.parent.getPropValue('direction') === 'row';
    },
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: 'center',
      defaultValue: 'center',
      props: {
        defaultValue: 'center',
        options: [{
          // "title": "| 左",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h1v17H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M8 4h5v9H8z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M3 5h3v7H3z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M3 5v7h3V5H3zM2 4h5v9H2V4z"
          }))),
          value: 'flex-start'
        }, {
          // "title": "中",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 13 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M6 0h1v17H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M8 4h5v9H8z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M1 5h3v7H1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M1 5v7h3V5H1zM0 4h5v9H0V4z"
          }))),
          value: 'center'
        }, {
          // "title": "右 |",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M23 0h1v17h-1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M17 4h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M12 5h3v7h-3z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M12 5v7h3V5h-3zm-1-1h5v9h-5V4z"
          }))),
          value: 'flex-end'
        }, {
          // "title": "两端",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h1v17H0zm23 0h1v17h-1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M17 4h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M3 5h3v7H3z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M3 5v7h3V5H3zM2 4h5v9H2V4z"
          }))),
          value: 'space-between'
        }, {
          // "title": "等分",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 16 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M2 0h1v17H2V0zm0 3.5h1v10H2v-10zM13 0h1v17h-1V0zm0 3.5h1v10h-1v-10z",
            opacity: ".5"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 4h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M1 5h3v7H1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M1 5v7h3V5H1zM0 4h5v9H0V4z"
          }))),
          value: 'space-around'
        }]
      }
    }
  }, {
    name: 'justify',
    title: '主轴对齐',
    defaultValue: 'center',
    initialValue: 'center',
    condition: function condition(target) {
      return target.parent.getPropValue('direction') === 'column';
    },
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: 'center',
      defaultValue: 'center',
      props: {
        defaultValue: 'center',
        options: [{
          // "title": "上",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 8h9v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M7 3h7v3H7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M7 3v3h7V3H7zM6 2h9v5H6V2z"
          }))),
          value: 'flex-start'
        }, {
          // "title": "中",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 13"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 6h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 8h9v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M7 1h7v3H7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M7 1v3h7V1H7zM6 0h9v5H6V0z"
          }))),
          value: 'center'
        }, {
          // "title": "下",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M6 11h9v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M7 6h7v3H7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M7 6v3h7V6H7zM6 5h9v5H6V5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 17h21v1H0z"
          }))),
          value: 'flex-end'
        }, {
          // "title": "两端",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h21v1H0zm0 17h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 11h9v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M7 3h7v3H7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M7 3v3h7V3H7zM6 2h9v5H6V2z"
          }))),
          value: 'space-between'
        }, {
          // "title": "等分",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 13"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M0 2h21v1H0V2zm5.5 0h10v1h-10V2zM0 10h21v1H0v-1zm5.5 0h10v1h-10v-1z",
            opacity: ".5"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 8h9v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M7 1h7v3H7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M7 1v3h7V1H7zM6 0h9v5H6V0z"
          }))),
          value: 'space-around'
        }]
      }
    }
  }, {
    name: 'align',
    title: '交叉轴对齐',
    defaultValue: 'center',
    initialValue: 'center',
    condition: function condition(target) {
      return target.parent.getPropValue('direction') === 'row';
    },
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: 'center',
      props: {
        defaultValue: 'center',
        options: [{
          // "title": "上",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 2h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M6 3h3v7H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 3v7h3V3H6zM5 2h5v9H5V2z"
          }))),
          value: 'flex-start'
        }, {
          // "title": "中",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 9"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M0 4h21v1H0V4zm4.5 0h6v1h-6V4zm6 0h6v1h-6V4z",
            opacity: ".5"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 0h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M6 1h3v7H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 1v7h3V1H6zM5 0h5v9H5V0z"
          }))),
          value: 'center'
        }, {
          // "title": "下",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 17h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 7h5v9h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M6 8h3v7H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 8v7h3V8H6zM5 7h5v9H5V7z"
          }))),
          value: 'flex-end'
        }, {
          // "title": "等高",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 18"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 17h21v1H0zM0 0h21v1H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 2h5v14h-5z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M6 3h3v12H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 3v12h3V3H6zM5 2h5v14H5V2z"
          }))),
          value: 'stretch'
        }, {
          // "title": "基线",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 21 11"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M0 5h21v1H0V5zm4.5 0h6v1h-6V5zm6 0h6v1h-6V5z",
            opacity: ".5"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M11 1h5v9h-5V1zm1 1h3v3h-3V2z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M6 5h3v5H6z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M6 3v7h3V3H6zM5 2h5v9H5V2z"
          }))),
          value: 'baseline'
        }]
      }
    }
  }, {
    name: 'align',
    title: '交叉轴对齐',
    defaultValue: 'center',
    initialValue: 'center',
    condition: function condition(target) {
      return target.parent.getPropValue('direction') === 'column';
    },
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: 'center',
      props: {
        defaultValue: 'center',
        options: [{
          // "title": '| 左',
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h1v17H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M2 9h9v5H2z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M3 4h7v3H3z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M3 4v3h7V4H3zM2 3h9v5H2V3z"
          }))),
          value: 'flex-start'
        }, {
          // "title": "中",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 9 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            d: "M4 0h1v17H4V0zm0 8.5h1v6H4v-6zm0-6h1v6H4v-6z",
            opacity: ".5"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M0 9h9v5H0z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M1 4h7v3H1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M1 4v3h7V4H1zM0 3h9v5H0V3z"
          }))),
          value: 'center'
        }, {
          // "title": "右 |",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M23 0h1v17h-1z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M13 9h9v5h-9z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M14 4h7v3h-7z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M14 4v3h7V4h-7zm-1-1h9v5h-9V3z"
          }))),
          value: 'flex-end'
        }, {
          // "title": "等宽",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M23 0h1v17h-1zM0 0h1v17H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M2 9h20v5H2z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M3 4h18v3H3z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M3 4v3h18V4H3zM2 3h20v5H2V3z"
          }))),
          value: 'stretch'
        }, {
          // "title": "基线",
          title: /*#__PURE__*/React.createElement("svg", {
            fill: "currentColor",
            preserveAspectRatio: "xMidYMid meet",
            width: "20",
            height: "20",
            viewBox: "0 0 24 17"
          }, /*#__PURE__*/React.createElement("g", {
            fillRule: "evenodd"
          }, /*#__PURE__*/React.createElement("path", {
            opacity: ".5",
            d: "M0 0h1v17H0z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M2 9h9v5H2V9zm1 1h2v3H3v-3z"
          }), /*#__PURE__*/React.createElement("path", {
            opacity: ".4",
            d: "M5 4h5v3H5z"
          }), /*#__PURE__*/React.createElement("path", {
            d: "M3 4v3h7V4H3zM2 3h9v5H2V3z"
          }))),
          value: 'baseline'
        }]
      }
    }
  }, {
    name: 'style.width',
    title: '宽度',
    defaultValue: '',
    initialValue: '',
    setter: {
      componentName: 'RadioGroupSetter',
      initialValue: '',
      props: {
        defaultValue: '',
        options: [{
          title: '默认',
          value: ''
        }, {
          title: '铺满',
          value: '100%'
        }]
      }
    }
  }, {
    name: 'spacing',
    title: '内容间距',
    defaultValue: 0,
    initialValue: 0,
    setter: {
      componentName: 'NumberSetter',
      props: {
        step: 4
      }
    }
  }],
  configure: {
    component: {
      isContainer: true
    },
    supports: {
      style: true,
      loop: false
    }
  },
  snippets: [{
    title: 'Box',
    screenshot: 'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_table.png',
    schema: {
      componentName: 'Box',
      props: {}
    }
  }]
};