@cloudbase/weda-ui 0.2.7 → 0.2.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "0.2.7",
+  "version": "0.2.11",
   "main": "./src/index.js",
   "module": "./src/index",
   "miniprogram": "mpdist",
@@ -45,10 +45,8 @@
     "object.fromentries": "^2.0.4",
     "prop-types": "^15.7.2",
     "react-easy-swipe": "^0.0.21",
-    "react-markdown": "^5.0.3",
-    "react-syntax-highlighter": "^15.4.3",
     "react-use": "^15.3.4",
-    "tea-component": "^2.6.22",
+    "tea-component": "^2.7.3",
     "uuid": "8.3.2",
     "weui": "^2.4.4",
     "weui.js": "1.2.2"

package/src/configs/components/container.json

@@ -41,6 +41,7 @@
     "title": "普通容器",
     "category": "布局容器",
     "description": "通用块状容器",
-    "componentOrder": 1000
+    "componentOrder": 1000,
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/Container.svg"
   }
 }

package/src/configs/components/form/richText.json

@@ -113,7 +113,8 @@
   "meta": {
       "title": "富文本",
       "description": "富文本编辑器",
-      "category": "表单"
+      "category": "表单",
+      "icon": "//main.qcloudimg.com/raw/adc8cd1b6eb93c0f890ca2322e509a6b/RichText.svg"
   },
   "events": [
     {

package/src/configs/components/form/uploader.json

@@ -8,7 +8,7 @@
         "default": ["image/*"],
         "x-category": "基础属性",
         "x-index": 6,
-        "x-platforms": ["PCWEB"],
+        "x-platforms": ["WEB"],
         "items": {
           "type": "string",
           "enum": [
@@ -66,8 +66,7 @@
         "default": 10,
         "title": "单张大小(M)",
         "x-category": "基础属性",
-        "x-index": 5,
-        "x-platforms": ["PCWEB"]
+        "x-index": 5
       },
       "maxUploadCount": {
         "type": "number",
@@ -136,6 +135,7 @@
   "meta": {
     "title": "上传图片",
     "description": "上传图片组件",
-    "category": "表单"
+    "category": "表单",
+    "icon": "//main.qcloudimg.com/raw/f781e6bc48efa1cf926fc768fceeab5e/Uploader.svg"
   }
 }

package/src/configs/components/image.json

@@ -145,6 +145,7 @@
   "meta": {
     "title": "图片",
     "description": "图片组件",
-    "category": "多媒体"
+    "category": "多媒体",
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/Image.svg"
   }
 }

package/src/configs/components/link.json

@@ -53,7 +53,8 @@
     "title": "链接",
     "description": "",
     "category": "文本",
-    "componentOrder": 10
+    "componentOrder": 10,
+    "icon": "//main.qcloudimg.com/raw/eb8a45dc259eb4925d89ac88be1ecdd9/Link.svg"
   },
   "events": [
     {

package/src/configs/components/richtextview.json

@@ -16,6 +16,7 @@
     "title": "富文本展示",
     "description": "富文本展示",
     "category": "文本",
-    "componentOrder": 0
+    "componentOrder": 0,
+    "icon": "//main.qcloudimg.com/raw/9c42d779f51105715a032d139344c508/RichTextView.svg"
   }
 }

package/src/configs/components/scrollVeiw.json

@@ -209,7 +209,8 @@
     "title": "滚动容器",
     "description": "滚动容器",
     "category": "布局容器",
-    "componentOrder": 80
+    "componentOrder": 80,
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/ScrollView.svg"
   },
   "isContainer": true,
   "mpOrigin": "scroll-view"

package/src/configs/components/swiper.json

@@ -70,7 +70,8 @@
     "title": "轮播",
     "description": "轮播图组件",
     "category": "展示",
-    "componentOrder": 80
+    "componentOrder": 80,
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/Swiper.svg"
   },
   "isContainer": true,
   "mpOrigin": "swiper"

package/src/configs/components/tabs.json

@@ -70,6 +70,7 @@
     "name": "Tabs",
     "title": "选项卡",
     "description": "选项卡组件",
-    "category": "展示"
+    "category": "展示",
+    "icon": "//qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/release/_files/static/comp/icons/Tabs.svg"
   }
 }

package/src/configs/components/text.json

@@ -41,6 +41,7 @@
     "title": "文本",
     "description": "文本内容",
     "category": "文本",
-    "componentOrder": 100
+    "componentOrder": 100,
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/Text.svg"
   }
 }

package/src/configs/index.js

@@ -1,7 +1,6 @@
-import Button from './components/button';
-import Markdown from './components/markdown';
-import Text from './components/text';
-import Container from './components/container';
+import Button from './components/button.json';
+import Text from './components/text.json';
+import Container from './components/container.json';
 import Image from './components/image.json';
 import Link from './components/link.json';
 // import Picker from './components/picker/picker.json';
@@ -32,7 +31,6 @@ import showModal from './actions/showModal';
 
 export const components = {
   Button,
-  Markdown,
   Text,
   Container,
   Image,
@@ -59,8 +57,7 @@ export const components = {
   RichTextView,
   Link,
   Drawer,
-  Tabs
-  
+  Tabs,
 };
 
 export const actions = {

package/src/mp/components/form/uploader/index.js

@@ -37,6 +37,10 @@ Component({
     single: {
       type: Boolean,
       value: false
+    },
+    maxSize: {
+      type: Number,
+      value: 10
     }
   },
   data: {
@@ -93,14 +97,17 @@ Component({
     }
   },
   observers: {
-    'defaultValue': function(value) {
-      if(!deepEqual(value, this.data.urls)) {
-        this.setData({
-          files: value.map(f => ({url: f})),
-          urls: value
-        });
-      }
-    },
+    // 'defaultValue': function(value) {
+    //   if(!deepEqual(value, this.data.urls)) {
+    //     if(!Array.isArray(value)) {
+    //       value = [value].filter(v => v.length > 0);
+    //     }
+    //     this.setData({
+    //       files: value.map(f => ({url: f})),
+    //       urls: value
+    //     });
+    //   }
+    // },
     'maxUploadCount, single': function(maxUploadCount, single) {
       const maxCount = single ? 1 : maxUploadCount;
       this.setData({

package/src/mp/components/form/uploader/index.wxml

@@ -1,6 +1,6 @@
 <mp-cells>
     <mp-cell>
-        <mp-uploader files="{{files}}" showDelete="{{true}}" ext-class="{{layout}}" bindfail="uploadError" bindsuccess="uploadSuccess" select="{{selectFile}}" upload="{{uploadFile}}" maxCount="{{maxUploadCount}}" title="{{title}}" tips="{{tips}}" binddelete="onDelete"></mp-uploader>
+        <mp-uploader max-size="{{maxSize  * 1024 * 1024}}" files="{{files}}" showDelete="{{true}}" ext-class="{{layout}}" bindfail="uploadError" bindsuccess="uploadSuccess" select="{{selectFile}}" upload="{{uploadFile}}" maxCount="{{maxCount}}" title="{{title}}" tips="{{tips}}" binddelete="onDelete"></mp-uploader>
     </mp-cell>
 </mp-cells>
 <!-- uploader delete 实际代码接受 showDelete

package/src/web/components/form/enumSelect/MultipleSelect.jsx

@@ -0,0 +1,89 @@
+import * as React from 'react';
+import { SelectMultiple } from 'tea-component';
+
+import SelectContainer from './SelectContainer';
+
+import { normalProps } from './props/defaultProps';
+import { propTypes } from './props/propsTypes';
+
+const MultipleSelect = ({
+  // 系统属性
+  id,
+  style,
+  className,
+  events,
+  // weda 组件属性
+  label,
+  labelVisible,
+  layout,
+  requiredFlag,
+  decorator,
+  // tea组件属性
+  value,
+  placeholder,
+  disabled,
+  onChange,
+  clearable,
+  appearance,
+  allOption,
+  matchButtonWidth,
+  virtual,
+  searchable,
+  size,
+  options,
+  // 业务属性
+  isModelApp,
+}) => {
+  const onSelectChange = (values) => {
+    // @ts-ignore
+    events.change && events.change({ value: values });
+    if (onChange) {
+      onChange(values);
+    }
+  };
+
+  const multipleSelectProps = {
+    placeholder,
+    disabled,
+    clearable,
+    appearance,
+    key: id,
+    options,
+    onChange: onSelectChange,
+    matchButtonWidth,
+    searchable,
+    size,
+    defaultValue: value || [],
+    allOption,
+    staging: false,
+    virtual,
+  };
+
+  if (isModelApp) {
+    return <SelectMultiple {...multipleSelectProps} />;
+  }
+  return (
+    <SelectContainer
+      style={style}
+      className={className}
+      label={label}
+      labelVisible={labelVisible}
+      layout={layout}
+      // @ts-ignore
+      multiCell={false}
+      requiredFlag={requiredFlag}
+      decorator={decorator}
+      id={id}
+    >
+      <SelectMultiple {...multipleSelectProps} />
+    </SelectContainer>
+  );
+};
+MultipleSelect.propTypes = {
+  ...propTypes,
+};
+MultipleSelect.defaultProps = {
+  ...normalProps,
+};
+
+export default MultipleSelect;

package/src/web/components/form/enumSelect/NormalSelect.jsx

@@ -0,0 +1,101 @@
+import * as React from 'react';
+import { Select } from 'tea-component';
+
+import SelectContainer from './SelectContainer';
+
+import { multipleProps } from './props/defaultProps';
+import { propTypes } from './props/propsTypes';
+
+const { useState, useEffect } = React;
+
+const useValue = (value) => {
+  const [selectedValue, setSelectedValue] = useState('');
+
+  useEffect(() => {
+    setSelectedValue(value);
+  }, [value]);
+
+  return [selectedValue, setSelectedValue];
+};
+
+const NormalSelect = ({
+  // 系统属性
+  id,
+  style,
+  className,
+  events,
+  // weda 组件属性
+  label,
+  labelVisible,
+  layout,
+  requiredFlag,
+  decorator,
+  // tea组件属性
+  value,
+  placeholder,
+  disabled,
+  onChange,
+  clearable,
+  appearance,
+  matchButtonWidth,
+  virtual,
+  searchable,
+  size,
+  options,
+  // 业务属性
+  isModelApp,
+}) => {
+  const [selectedValue, setSelectedValue] = useValue(value);
+
+  const onSelectChange = (value) => {
+    // @ts-ignore
+    setSelectedValue(value);
+    events.change && events.change({ value });
+    if (onChange) {
+      onChange(value || '');
+    }
+  };
+
+  const singleSelectProps = {
+    placeholder,
+    disabled,
+    clearable,
+    appearance,
+    key: id,
+    options,
+    onChange: onSelectChange,
+    value: selectedValue,
+    matchButtonWidth,
+    virtual,
+    searchable,
+    size,
+  };
+
+  if (isModelApp) {
+    return <Select {...singleSelectProps} />;
+  }
+  return (
+    <SelectContainer
+      style={style}
+      className={className}
+      label={label}
+      labelVisible={labelVisible}
+      layout={layout}
+      // @ts-ignore
+      multiCell={false}
+      requiredFlag={requiredFlag}
+      decorator={decorator}
+      id={id}
+    >
+      <Select {...singleSelectProps} />
+    </SelectContainer>
+  );
+};
+NormalSelect.propTypes = {
+  ...propTypes,
+};
+NormalSelect.defaultProps = {
+  ...multipleProps,
+};
+
+export default NormalSelect;

package/src/web/components/form/enumSelect/SelectContainer.jsx

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import classNames from '../../../utils/classnames';
+import { selectContainerPropsTypes } from './props/propsTypes';
+import { renderDecorator } from '../renderDecorator';
+
+const SelectContainer = ({
+  style,
+  className,
+  // weda 组件属性
+  id,
+  label,
+  labelVisible,
+  layout,
+  requiredFlag,
+  decorator,
+  children,
+}) => {
+  const cls = classNames({
+    'weda-ui': true,
+    [className]: className,
+  });
+  const subCls = classNames({
+    'weui-cell': true,
+    'weui-cell_active': true,
+    'weui-cell_form': true,
+    'weui-cell_disabled': true,
+  });
+  const SelectComponent = <div className={subCls}>{children}</div>;
+  return renderDecorator(
+    SelectComponent,
+    decorator
+  )({
+    id,
+    className: cls,
+    style,
+    label: labelVisible ? label : null,
+    layout,
+    multiCell: false,
+    requiredFlag,
+  });
+};
+SelectContainer.propTypes = selectContainerPropsTypes;
+export default SelectContainer;

package/src/web/components/form/enumSelect/index.jsx

@@ -0,0 +1,9 @@
+import MultipleSelect from './MultipleSelect';
+import NormalSelect from './NormalSelect';
+
+const EnumSelect = NormalSelect;
+
+// @ts-ignore
+EnumSelect.MultipleSelect = MultipleSelect;
+
+export default EnumSelect;

package/src/web/components/form/enumSelect/props/defaultProps.js

@@ -0,0 +1,39 @@
+const commonProps = {
+  // 系统属性
+  events: {},
+  // weda 组件属性
+  label: '标题',
+  labelVisible: true,
+  layout: 'horizontal',
+  requiredFlag: false,
+  // tea组件属性
+  name: 'enumSelect',
+  placeholder: '请选择',
+  disabled: false,
+  onChange: () => {},
+  options: [],
+  clearable: true,
+  appearance: 'button',
+  matchButtonWidth: true,
+  virtual: true,
+  searchable: true,
+  size: 'm',
+  // 业务属性
+  enumType: '',
+  customEnum: [],
+  optionId: null,
+  isModelApp: false,
+};
+export const normalProps = {
+  ...commonProps,
+  value: '',
+};
+export const multipleProps = {
+  ...commonProps,
+  value: [],
+  allOption: {
+    value: 'all',
+    text: '全选',
+    tooltip: '全选',
+  },
+};

package/src/web/components/form/enumSelect/props/propsTypes.js

@@ -0,0 +1,50 @@
+import * as PropTypes from 'prop-types';
+
+const commonPropsTypes = {
+  // 系统属性
+  id: PropTypes.string,
+  style: PropTypes.string,
+  className: PropTypes.string,
+  // weda 组件属性
+  label: PropTypes.string,
+  labelVisible: PropTypes.bool,
+  layout: PropTypes.string,
+  requiredFlag: PropTypes.bool,
+};
+export const propTypes = {
+  ...commonPropsTypes,
+  // 系统属性
+  events: PropTypes.object,
+  // tea组件属性
+  defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  name: PropTypes.string,
+  placeholder: PropTypes.string,
+  disabled: PropTypes.bool,
+  onChange: PropTypes.func,
+  options: PropTypes.array,
+  clearable: PropTypes.bool,
+  appearance: PropTypes.string,
+  allOption: PropTypes.object,
+  matchButtonWidth: PropTypes.bool,
+  virtual: PropTypes.bool,
+  searchable: PropTypes.bool,
+  size: PropTypes.string,
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
+  // 业务属性
+  enumType: PropTypes.string,
+  customEnum: PropTypes.array,
+  optionId: PropTypes.string,
+  isModelApp: PropTypes.bool,
+};
+
+export const formContainerPropsTypes = {
+  ...commonPropsTypes,
+  children: PropTypes.element,
+  decorator: PropTypes.element,
+};
+
+export const selectContainerPropsTypes = {
+  ...commonPropsTypes,
+  children: PropTypes.element,
+  decorator: PropTypes.element,
+};

package/src/web/components/form/select/region/{cities.json → cities.js}

@@ -1,4 +1,4 @@
-[
+export const cities = [
   {
     "level": 2,
     "code": "1101",
@@ -2407,4 +2407,4 @@
     "parent_code": "65",
     "en": "County-level administrative divisions directly under the Central Government"
   }
-]
+];

package/src/web/components/form/select/region/index.js

@@ -1,7 +1,7 @@
 // 暂时把地区信息打包在本地, 后续移到COS桶内
-import provinces from './provinces.json';
-import cities from './cities.json';
-import regions from './regions.json';
+import {provinces} from './provinces.js';
+import {cities} from './cities.js';
+import {regions} from './regions.js';
 import weui from '../../../../utils/weui';
 
 let tree;

package/src/web/components/form/select/region/{provinces.json → provinces.js}

@@ -1,4 +1,4 @@
-[
+export const provinces = [
   {
     "level": 1,
     "code": "11",
@@ -237,4 +237,4 @@
     "parent_code": "",
     "en": "Taiwan"
   }
-]
+];

package/src/web/components/form/select/region/{regions.json → regions.js}

@@ -1,4 +1,4 @@
-[
+export const regions = [
   {
     "level": 3,
     "code": "110101",
@@ -20642,4 +20642,4 @@
     "parent_code": "620201",
     "en": "Changcheng District"
   }
-]
+];

package/src/web/components/form/switch/index.jsx

@@ -70,6 +70,7 @@ export default function Switch({
   (
     <TeaSwitch
       id={_id}
+      value={checked}
       disabled={disabled}
       onChange={onChange}
     />