@cloudbase/weda-ui 3.4.2 → 3.4.4

package/dist/configs/components/wd-image.js

@@ -0,0 +1,164 @@
+import { Type, Tuple, defineConfig } from '../type-utils';
+const data = Type.Object({
+    src: Type.Optional(Type.String({
+        title: '地址',
+        type: 'string',
+        default: 'https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg',
+        description: '更改需要展示的图片',
+        'x-category': '基础属性',
+        'x-index': 1,
+        'x-component': 'image',
+        'x-rules': [
+            {
+                message: '请输入合法的图片地址',
+                pattern: '^(((https?)://)|/resources/)[^\\s]+$',
+            },
+        ],
+    })),
+    fit: Type.Optional(Type.StringEnum({
+        title: '布局模式',
+        type: 'string',
+        default: 'widthFix',
+        description: '更改图片的布局模式',
+        'x-category': '基础属性',
+        'x-index': 2,
+        enum: Tuple([
+            {
+                value: 'cover',
+                label: '裁剪填满',
+            },
+            {
+                value: 'contain',
+                label: '等比缩放',
+            },
+            {
+                value: 'fill',
+                label: '拉伸填满',
+            },
+            {
+                value: 'widthFix',
+                label: '高度自适应',
+            },
+            {
+                value: 'heightFix',
+                label: '宽度自适应',
+            },
+        ]),
+    })),
+    imgPreview: Type.Optional(Type.Boolean({
+        title: '点击预览大图',
+        type: 'boolean',
+        default: false,
+        description: '开启后，点击图片后图片会展示为大图',
+        'x-category': '基础属性',
+        'x-index': 3,
+        'x-linkages': [
+            {
+                type: 'value:visible',
+                target: 'maskClosable',
+                condition: '{{ $self.value }}',
+            },
+        ],
+    })),
+    maskClosable: Type.Boolean({
+        title: '再次点击关闭预览',
+        type: 'boolean',
+        default: true,
+        description: '开启后，再次点击蒙层会关闭图片预览',
+        'x-category': '基础属性',
+        'x-index': 4,
+    }),
+    alt: Type.String({
+        title: '替代文字',
+        type: 'string',
+        default: '[图片]',
+        description: '<img> 标签的 alt 属性',
+        'x-category': '高级属性',
+        'x-index': 5,
+    }),
+    showMenuByLongpress: Type.Optional(Type.Boolean({
+        title: '识别小程序码',
+        type: 'boolean',
+        default: true,
+        description: '小程序专有属性，长按图片可唤起识别小程序码功能',
+        'x-category': '高级属性',
+        'x-index': 6,
+        'x-platforms': ['MP'],
+    })),
+    lazyLoad: Type.Boolean({
+        title: '懒加载',
+        type: 'boolean',
+        default: false,
+        description: '图片按需加载，若图片没有被展示，则不会加载',
+        'x-index': 7,
+        'x-category': '高级属性',
+    }),
+});
+const properties = Type.Pick(data, ['fit', 'src', 'alt']);
+const config = defineConfig({
+    $schema: 'https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json',
+    data,
+    properties,
+    events: [
+        {
+            name: 'load',
+            title: '加载成功',
+        },
+        {
+            name: 'error',
+            title: '加载失败',
+        },
+        {
+            name: 'tap',
+            title: '点击',
+        },
+    ],
+    classes: [
+        {
+            name: '根元素',
+            selector: '.wd-image',
+            description: '图片组件根元素',
+        },
+        {
+            name: 'PC 端根元素',
+            selector: '.wd-pc-image',
+            description: '可以为 PC 端的图片编写样式',
+        },
+        {
+            name: 'H5 端根元素',
+            selector: '.wd-h5-image',
+            description: '可以为 H5 端的按钮编写样式',
+        },
+        {
+            name: '小程序端根元素',
+            selector: '.wd-mp-image',
+            description: '可以为小程序端的图片编写样式',
+        },
+        {
+            name: '预览背景',
+            selector: '.wd-image-mask',
+            description: '点击预览图片时的蒙层',
+        },
+        {
+            name: '关闭按钮',
+            selector: '.wd-image-mask__icon-close',
+            description: '点击预览图片时的右上角的关闭按钮',
+        },
+    ],
+    meta: {
+        title: '图片',
+        description: '用于在页面进行图片的展示。',
+        category: '展示',
+        icon: '../icons/Image.svg',
+        categoryOrder: 400,
+        componentOrder: 230,
+        visible: ['APP'],
+    },
+    configMeta: {
+        docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/show/WdImage',
+        shortcut: {
+            props: ['src'],
+        },
+    },
+});
+export default config;

package/dist/configs/components/wd-link.js

@@ -0,0 +1,234 @@
+import { defineConfig, Type, Tuple } from '../type-utils';
+import { WD_ICON_ENUM, WD_ICON_TYPE, WD_LINK_ICON_TYPE, WD_LINK_ICON_POSITION, } from '../../enum';
+const btnTemplate = `
+[attributes]
+enableSlot = false
+`;
+// 属性类型定义
+const data = Type.Object({
+    content: Type.String({
+        title: '文本内容',
+        default: '这是一个链接',
+        type: 'string',
+        description: '跳转的文字',
+        'x-category': '基础属性',
+        'x-index': 10,
+    }),
+    url: Type.String({
+        title: '跳转页面',
+        default: '',
+        type: 'string',
+        description: '通过下拉选择应用页面，可以实现内部页面跳转',
+        'x-component': 'page-list',
+        'x-category': '基础属性',
+        'x-component-props': {
+            hideAddPlatform: ['MP'],
+        },
+        'x-index': 20,
+    }),
+    isOpenInNewWindow: Type.Optional(Type.Boolean({
+        title: '是否打开新窗口',
+        default: false,
+        type: 'boolean',
+        description: '仅外部链接生效',
+        'x-category': '基础属性',
+        'x-index': 30,
+    })),
+    params: Type.Readonly(Type.Array(Type.Object({
+        key: Type.String({ title: 'key', default: 'key' }),
+        value: Type.String({ title: 'value', default: 'value' }),
+    }), {
+        title: '携带参数',
+        default: [],
+        type: 'array',
+        description: '填写跳转页面时携带的参数，用于页面传参',
+        'x-category': '基础属性',
+        'x-index': 40,
+    })),
+    enableSlot: Type.Optional(Type.Boolean({
+        title: '展示内容插槽',
+        description: '是否展示链接中插槽的内容',
+        'x-category': '基础属性',
+        'x-index': 45,
+        default: true,
+    })),
+    // 规范化新增，展示图标
+    iconType: Type.Optional(Type.StringEnum({
+        title: '展示图标',
+        'x-index': 50,
+        default: 'none',
+        enum: Tuple(WD_LINK_ICON_TYPE),
+        'x-linkages': [
+            {
+                type: 'value:visible',
+                target: '*(iconSource)',
+                condition: "{{$self.value!=='none' && !$form.values.loading}}",
+            },
+            {
+                type: 'value:visible',
+                target: '*(icon)',
+                condition: "{{$self.value!=='none' && !$form.values.loading}}",
+            },
+            {
+                type: 'value:visible',
+                target: '*(iconPosition)',
+                condition: "{{$self.value =='text-with-icon' && !$form.values.loading}}",
+            },
+        ],
+        description: '设置图标按钮',
+        'x-category': '高级属性',
+    })),
+    // 规范化新增，图标类型
+    iconSource: Type.Optional(Type.StringEnum({
+        enum: Tuple(WD_ICON_TYPE),
+        title: '图标类型',
+        default: 'inner',
+        description: '选择图标的类型',
+        'x-index': 55,
+        'x-linkages': [
+            {
+                type: 'value:visible',
+                target: '*(icon)',
+                condition: "{{$self.value=='inner'}}",
+            },
+            {
+                type: 'value:visible',
+                target: '*(iconSrc)',
+                condition: "{{$self.value=='custom'}}",
+            },
+        ],
+        'x-category': '高级属性',
+    })),
+    // 规范化新增，图标样式
+    icon: Type.Optional(Type.StringEnum({
+        enum: Tuple(WD_ICON_ENUM.map((item) => ({ label: item, value: item }))),
+        title: '图标样式',
+        default: 'td:link',
+        description: '选择预置图标',
+        'x-index': 60,
+        'x-component': 'icon2',
+        'x-category': '高级属性',
+    })),
+    // 规范化新增，图标样式 支持自定义图片
+    iconSrc: Type.Optional(Type.FormatTypeUnion({
+        type: 'image',
+        'x-rules': [
+            {
+                message: '请输入合法的图片地址',
+                pattern: '^(((https?)://)|/resources/)[^\\s]+$',
+            },
+        ],
+        title: '自定义图标',
+        default: '',
+        description: '设置自定义图标地址',
+        'x-index': 70,
+        'x-category': '高级属性',
+    })),
+    iconPosition: Type.Optional(Type.StringEnum({
+        title: '图标位置',
+        'x-index': 80,
+        default: 'before',
+        enum: Tuple(WD_LINK_ICON_POSITION),
+        description: '设置图标位置',
+        'x-category': '高级属性',
+    })),
+    disabled: Type.Optional(Type.Boolean({
+        title: '是否禁用',
+        default: false,
+        description: '开启后链接将无法进行点击',
+        'x-category': '高级属性',
+        'x-index': 90,
+    })),
+    contentSlot: Type.Optional(Type.Slot()),
+});
+// 组件对外暴露的只读属性
+// 未来可通过 widget API 开放，应用可以获取到组件的实例属性
+// 组件对外先规范定义，暂时不对外开放
+const properties = Type.Pick(data, ['content', 'url', 'disabled']);
+// export default
+const config = defineConfig({
+    $schema: 'https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json',
+    // 属性定义
+    data,
+    // 只读属性定义
+    properties,
+    // 样式API
+    classes: [
+        {
+            name: '根元素',
+            selector: '.wd-link',
+            description: '链接组件根元素',
+        },
+        {
+            name: '图标',
+            selector: '.wd-link__icon',
+            description: '链接的图标元素（共享样式）',
+        },
+        {
+            name: '前置图标',
+            selector: '.wd-link__before-icon',
+            description: '链接内的前置图标',
+        },
+        {
+            name: '后置图标',
+            selector: '.wd-link__after-icon',
+            description: '链接内的后置图标',
+        },
+        {
+            name: '文本',
+            selector: '.wd-link__text',
+            description: '链接内显示的文本',
+        },
+        {
+            name: '禁用状态',
+            selector: '.wd-link__icon.is-disabled',
+            description: '链接禁用状态',
+        },
+        {
+            name: 'PC 端链接根元素',
+            selector: '.wd-pc-link',
+            description: '可以为 PC 端的链接编写样式',
+        },
+        {
+            name: 'H5 端链接根元素',
+            selector: '.wd-h5-link',
+            description: '可以为 H5 端的链接编写样式',
+        },
+    ],
+    // 组件方法
+    methods: [],
+    // 组件对外暴露事件
+    events: [
+        {
+            title: '点击',
+            name: 'tap',
+            'x-platforms': ['WEB'],
+        },
+    ],
+    // 组件元信息
+    meta: {
+        name: 'WdLink',
+        title: '链接',
+        description: '当操作命令需要用户点击，用以触发特定事件的发生，如点击事件、信息提交等。',
+        icon: '../../icons/Link.svg',
+        category: '展示',
+        categoryOrder: 1,
+        componentOrder: 1,
+        platform: ['MOBILEWEB', 'PCWEB'],
+        visible: ['APP'],
+        templates: [
+            {
+                to: 'contentSlot',
+                body: btnTemplate,
+            },
+        ],
+    },
+    configMeta: {
+        docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/show/WdLink',
+        // 快捷编辑时展示在编辑区的属性
+        shortcut: {
+            props: ['content', 'url'],
+        },
+    },
+});
+export default config;

package/dist/configs/components/wd-table.js

@@ -0,0 +1,59 @@
+import { defineConfig, Tuple, Type } from '../type-utils';
+// 属性类型定义
+const data = Type.Object({
+    type: Type.StringEnum({
+        title: '风格',
+        type: 'string',
+        'x-index': 10,
+        default: 'solid',
+        enum: Tuple([
+            {
+                label: '实线',
+                value: 'solid',
+            },
+            // default -> secondary
+            {
+                label: '虚线',
+                value: 'dashed',
+            },
+        ]),
+        'x-category': '基础属性',
+    }),
+});
+const properties = Type.Pick(data, ['type']);
+// export default
+const config = defineConfig({
+    $schema: 'https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json',
+    // 属性定义
+    data,
+    // 只读属性定义
+    properties,
+    // 样式API
+    classes: [
+        {
+            name: '根元素',
+            selector: '.wd-table',
+            description: '分割线组件根元素',
+        },
+    ],
+    // 组件方法
+    methods: [],
+    // 组件对外暴露事件
+    events: [],
+    // 组件元信息
+    meta: {
+        name: 'WdTable',
+        title: '表格',
+        description: '用于显示分割线。',
+        icon: '../../icons/Divider.svg',
+        category: '展示',
+        categoryOrder: 1,
+        componentOrder: 1,
+        // 快捷编辑时展示在编辑区的属性
+        shortcut: {
+            props: [],
+        },
+        visible: [],
+    },
+});
+export default config;

package/dist/configs/components/wd-text.js

@@ -0,0 +1,142 @@
+import { defineConfig, Type, Tuple } from '../type-utils';
+import { WD_TEXT_LEVEL, WD_TEXT_MAX_LINES } from '../../enum';
+// 属性类型定义
+const data = Type.Object({
+    text: Type.String({
+        title: '文本内容',
+        'x-component': 'textarea',
+        default: '文本内容',
+        'x-category': '基础属性',
+        'x-index': 10,
+        description: '设置文本的内容',
+    }),
+    level: Type.Optional(Type.StringEnum({
+        title: '文本格式',
+        type: 'string',
+        default: 'body-default',
+        enum: Tuple(WD_TEXT_LEVEL),
+        description: '设置文本格式，支持正文(小,中,大)和标题(H1-H6)',
+        'x-category': '基础属性',
+        'x-index': 20,
+    })),
+    overflow: Type.Optional(Type.Boolean({
+        title: '溢出省略',
+        type: 'boolean',
+        default: false,
+        'x-linkages': [
+            {
+                type: 'value:visible',
+                target: 'maxLines',
+                condition: '{{$self.value === true}}',
+            },
+        ],
+        'x-category': '高级属性',
+        description: '文本长度超过最大行数用省略展示,开启后,会添加display:-webkit-box !import 样式,可能会导致文本布局失效',
+        'x-index': 30,
+    })),
+    maxLines: Type.Optional(Type.StringEnum({
+        title: '最大行数',
+        type: 'string',
+        description: '若文本长度超过最大行数，超出内容以省略号代替；因小程序侧限制，应用发布为小程序时，开启文本可选中会导致最大行数的配置不生效',
+        'x-helper-text': '若文本长度超过最大行数，超出内容以省略号代替；因小程序侧限制，应用发布为小程序时，开启文本可选中会导致最大行数的配置不生效',
+        default: '1',
+        enum: Tuple(WD_TEXT_MAX_LINES),
+        'x-index': 40,
+        'x-category': '高级属性',
+    })),
+    tips: Type.Optional(Type.Boolean({
+        title: '展示文本气泡',
+        type: 'boolean',
+        description: '开启后鼠标悬停在文本组件上会展示文本气泡,仅PC端有效',
+        default: true,
+        'x-category': '高级属性',
+        'x-index': 50,
+    })),
+    space: Type.Optional(Type.Boolean({
+        title: '连续空格',
+        type: 'boolean',
+        default: false,
+        'x-category': '高级属性',
+        description: '是否显示连续空格,开启后文本组件将支持识别多个空格字符，关闭后文本组件仅支持识别单个空格字符(多空格字符会自动转换成单个空格字符)',
+        'x-index': 60,
+    })),
+    userSelect: Type.Optional(Type.Boolean({
+        title: '是否可选中',
+        type: 'boolean',
+        default: true,
+        'x-index': 70,
+        'x-category': '高级属性',
+        description: '是否可选中文本,关闭后文本将不支持进行选中，无法进行复制等常见文本操作',
+    })),
+});
+// 组件对外暴露的只读属性
+// 未来可通过 widget API 开放，应用可以获取到组件的实例属性
+// 组件对外先规范定义，暂时不对外开放
+const properties = Type.Pick(data, [
+    'text',
+    'level',
+    'overflow',
+    'maxLines',
+    'space',
+    'userSelect',
+    'tips',
+]);
+// export default
+const config = defineConfig({
+    $schema: 'https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json',
+    // 属性定义
+    data,
+    // 只读属性定义
+    properties,
+    // 样式API
+    classes: [
+        {
+            name: '根元素',
+            selector: '.wd-typography',
+            description: '文本组件根元素',
+        },
+        {
+            name: 'PC 端文本根元素',
+            selector: '.wd-pc-typography',
+            description: '可以为 PC 端的文本编写样式',
+        },
+        {
+            name: 'H5 端文本根元素',
+            selector: '.wd-h5-typography',
+            description: '可以为 H5 端的文本编写样式',
+        },
+        {
+            name: '小程序端文本根元素',
+            selector: '.wd-mp-typography',
+            description: '可以为小程序端的文本编写样式',
+        },
+    ],
+    // 组件方法
+    methods: [],
+    // 组件对外暴露事件
+    events: [
+        {
+            name: 'tap',
+            title: '点击',
+        },
+    ],
+    // 组件元信息
+    meta: {
+        name: 'WdText',
+        title: '文本',
+        description: '用于展示页面中的文本/标题内容。',
+        icon: '../../icons/Text.svg',
+        category: '展示',
+        categoryOrder: 1,
+        componentOrder: 1,
+        visible: ['APP'],
+    },
+    configMeta: {
+        docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/show/WdText',
+        // 快捷编辑时展示在编辑区的属性
+        shortcut: {
+            props: ['text', 'level'],
+        },
+    },
+});
+export default config;

package/dist/configs/components/wedaVideo.json

@@ -83,7 +83,12 @@
         "title": "视频播放",
         "description": "用于视频播放",
         "icon": "../icons/WedaVideo.svg",
-        "category": "多媒体",
-        "visible": ["APP"]
+        "category": "展示",
+        "visible": ["APP"],
+        "categoryOrder": 400,
+        "componentOrder": 320
+    },
+    "configMeta": {
+        "docsUrl": "https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/show/WedaVideo"
     }
 }