@cloudbase/weda-ui 3.5.0 → 3.5.1

package/dist/configs/components/wd-modal.d.ts

@@ -0,0 +1,128 @@
+/// <reference types="react" />
+import { Static } from '../type-utils';
+import type { Simplify } from 'type-fest';
+declare const data: import("@sinclair/typebox").TObject<{
+    defaultShow: import("@sinclair/typebox").TBoolean;
+    position: import("@sinclair/typebox").TString<"string" | "boolean" | "object" | "function" | "tel" | "x-long-text" | "phone" | "datetime" | "array" | "url" | "x-image" | "x-rtf" | "x-enum" | "x-location" | "x-file" | "x-autonumber" | "x-area-code" | "related" | "father-son" | "many-many">;
+    closeType: import("@sinclair/typebox").TArray<import("@sinclair/typebox").TString<"string" | "boolean" | "object" | "function" | "tel" | "x-long-text" | "phone" | "datetime" | "array" | "url" | "x-image" | "x-rtf" | "x-enum" | "x-location" | "x-file" | "x-autonumber" | "x-area-code" | "related" | "father-son" | "many-many">>;
+    defaultMaskShow: import("@sinclair/typebox").TBoolean;
+    headerSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+    contentSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+    footerSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+}>;
+declare const properties: import("@sinclair/typebox").TObject<{
+    modalState: import("@sinclair/typebox").TUnsafe<string>;
+}>;
+export type DataType = Simplify<Static<typeof data>>;
+export type PropsType = Simplify<Static<typeof properties>>;
+declare const config: {
+    readonly $schema: "https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json";
+    readonly data: import("@sinclair/typebox").TObject<{
+        defaultShow: import("@sinclair/typebox").TBoolean;
+        position: import("@sinclair/typebox").TString<"string" | "boolean" | "object" | "function" | "tel" | "x-long-text" | "phone" | "datetime" | "array" | "url" | "x-image" | "x-rtf" | "x-enum" | "x-location" | "x-file" | "x-autonumber" | "x-area-code" | "related" | "father-son" | "many-many">;
+        closeType: import("@sinclair/typebox").TArray<import("@sinclair/typebox").TString<"string" | "boolean" | "object" | "function" | "tel" | "x-long-text" | "phone" | "datetime" | "array" | "url" | "x-image" | "x-rtf" | "x-enum" | "x-location" | "x-file" | "x-autonumber" | "x-area-code" | "related" | "father-son" | "many-many">>;
+        defaultMaskShow: import("@sinclair/typebox").TBoolean;
+        headerSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+        contentSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+        footerSlot: import("@sinclair/typebox").TUnsafe<import("react").ReactNode>;
+    }>;
+    readonly properties: import("@sinclair/typebox").TObject<{
+        modalState: import("@sinclair/typebox").TUnsafe<string>;
+    }>;
+    readonly classes: readonly [{
+        readonly name: "根元素";
+        readonly selector: ".wd-modal";
+        readonly description: "组件根元素";
+    }, {
+        readonly name: "PC 端根元素";
+        readonly selector: ".wd-pc-modal";
+        readonly description: "可以为 PC 端的编写样式";
+    }, {
+        readonly name: "H5 端根元素";
+        readonly selector: ".wd-h5-modal";
+        readonly description: "可以为 H5 端的编写样式";
+    }, {
+        readonly name: "小程序 端根元素";
+        readonly selector: ".wd-mp-modal";
+        readonly description: "可以为 小程序 端的编写样式";
+    }, {
+        readonly name: "弹窗遮罩层样式";
+        readonly selector: ".wd-modal-mask";
+        readonly description: "可以为遮罩层编写样式";
+    }, {
+        readonly name: "弹窗主体容器样式";
+        readonly selector: ".wd-modal-bd";
+        readonly description: "可以为主体容器编写样式";
+    }, {
+        readonly name: "弹窗标题区样式";
+        readonly selector: ".wd-modal-bd__hd";
+        readonly description: "可以为标题区编写样式";
+    }, {
+        readonly name: "弹窗内容区样式";
+        readonly selector: ".wd-modal-bd__main";
+        readonly description: "可以为内容区编写样式";
+    }, {
+        readonly name: "弹窗按钮区样式";
+        readonly selector: ".wd-modal-bd__ft";
+        readonly description: "可以为按钮区编写样式";
+    }];
+    readonly methods: readonly [{
+        readonly name: "open";
+        readonly label: "打开弹窗";
+        readonly params: import("@sinclair/typebox").TObject<{
+            info: import("@sinclair/typebox").TUnknown;
+        }>;
+    }, {
+        readonly name: "close";
+        readonly label: "关闭弹窗";
+        readonly params: import("@sinclair/typebox").TObject<{
+            info: import("@sinclair/typebox").TUnknown;
+        }>;
+    }];
+    readonly events: readonly [{
+        readonly title: "弹窗打开时";
+        readonly name: "open";
+        readonly detail: import("@sinclair/typebox").TObject<{
+            info: import("@sinclair/typebox").TUnknown;
+        }>;
+    }, {
+        readonly title: "弹窗关闭时";
+        readonly name: "close";
+        readonly detail: import("@sinclair/typebox").TObject<{
+            info: import("@sinclair/typebox").TUnknown;
+        }>;
+    }];
+    readonly meta: {
+        readonly name: "WdModal";
+        readonly componentName: "Modal";
+        readonly title: "弹窗";
+        readonly description: "用于实现基础的弹窗（对话框）展示效果。";
+        readonly propertyPanelTips: "在小程序中使用时，不建议嵌套在其他容器/组件中，以免弹窗被遮盖";
+        readonly icon: "../../icons/Modal.svg";
+        readonly category: "布局";
+        readonly categoryOrder: 200;
+        readonly componentOrder: 140;
+        readonly visible: readonly ["APP", "COMPONENT"];
+        readonly docsUrl: "https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/grid/WdModal";
+        readonly group: {
+            readonly 基础属性: {
+                readonly 'x-index': 1;
+                readonly expand: true;
+            };
+            readonly 高级属性: {
+                readonly 'x-index': 2;
+                readonly expand: false;
+            };
+        };
+        readonly templates: readonly [{
+            readonly when: "$attached";
+            readonly to: "headerSlot";
+            readonly body: string;
+        }, {
+            readonly when: "$attached";
+            readonly to: "footerSlot";
+            readonly body: string;
+        }];
+    };
+};
+export default config;

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

@@ -0,0 +1,308 @@
+import { defineConfig, Type, Tuple } from '../type-utils';
+// 生成随机id
+const getRandomId = () => `wdModal${Math.floor(Math.random() * 10000)}`;
+/**
+ * 模板内组件绑定对应的event事件
+ * @returns
+ */
+const getEventListener = ({ event = 'tap', // 绑定的event名称
+parentId = '{{$self.id}}', // 绑定的关联组件
+method, // 要绑定关联组件的方法
+info = '', // 关联event的入参
+ }) => {
+    return `
+  [[template.listeners]]
+  id = "${getRandomId()}"
+  eventName = "${event}"
+  type = "platform"
+  [template.listeners.handler]
+  name = "invoke"
+  module = "platform"
+  [template.listeners.handler.params]
+  component = "${parentId}"
+  method = "${method}"
+  [template.listeners.handler.params.params]
+  info = "${info}"
+  `;
+};
+// 弹窗顶部插槽模板
+const HEADER_TPL = `
+{{#with $self as |$self|}}
+[[template]]
+component = "WdText"
+label = "弹窗标题"
+  [template.attributes]
+  text = "弹窗标题"
+  ":level" = "$w.wedaContext?.platforms?.includes(\`MOBILEWEB\`)?\`title-6\`:\`body-lg\`"
+  [template.extra.commonStyle.self]
+  fontWeight = "bolder"
+
+[[template]]
+component = "WdIcon"
+label = "关闭按钮"
+  [template.attributes]
+  name = "td:close"
+  ":size" = "$w.wedaContext?.platforms?.includes(\`MOBILEWEB\`)?\`md\`:\`sm\`"
+  ${getEventListener({ method: 'close', info: 'icon' })}
+  [template.extra.commonStyle.text]
+  color = "rgba(0, 0, 0, 0.6)"
+{{/with}}
+`;
+// 弹窗按钮区插槽模板
+const FOOTER_TPL = `
+{{#with $self as |$self|}}
+[[template]]
+component = "WdButton"
+label = "取消按钮"
+  [template.attributes]
+  text = "取消"
+  theme = "secondary"
+  variant = "outline"
+  ${getEventListener({ method: 'close', info: 'cancel' })}
+
+[[template]]
+component = "WdButton"
+label = "确认按钮"
+
+  [template.attributes]
+  text = "确认"
+  ${getEventListener({ method: 'close', info: 'confirm' })}
+
+{{/with}}
+`;
+const data = Type.Object({
+    defaultShow: Type.Boolean({
+        title: '默认打开弹窗',
+        default: true,
+        'x-index': 10,
+        'x-category': '基础属性',
+        'x-helper-text': '设置默认打开状态。在【事件-组件方法】中调用弹窗的打开/关闭方法，可动态控制弹窗开关。[查看指引](https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/grid/WdModal)',
+    }),
+    position: Type.String({
+        title: '移动端弹窗位置',
+        'x-category': '基础属性',
+        default: 'bottom',
+        description: 'bottom-在下方弹出弹窗，center-在页面中间弹出弹窗',
+        enum: Tuple([
+            {
+                label: '底部',
+                value: 'bottom',
+                tooltip: '弹窗显示在窗口底部',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/0f63c89a-131e-4ab2-9c67-f226180ed2b0.svg',
+            },
+            {
+                label: '居中',
+                value: 'center',
+                tooltip: '弹窗显示在窗口中间',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/93734140-6df8-4901-a70e-111423bd5d0e.svg',
+            },
+        ]),
+        'x-platforms': ['MP', 'MOBILEWEB'],
+        'x-index': 20,
+        'x-component': 'data-sources-template-selector',
+        'x-props': {
+            'data-hidebind': true,
+        },
+    }),
+    closeType: Type.Array(Type.String(), {
+        title: '关闭方式',
+        default: ['mask'],
+        description: '多选模式，mask-点击遮罩层关闭，esc-点击键盘ESC关闭（仅在PC端生效）',
+        'x-index': 30,
+        'x-category': '高级属性',
+        'x-helper-text': '点击键盘ESC键关闭弹窗仅在PC端生效',
+        'x-component': 'checkbox-group',
+        'x-component-props': {
+            defaultValue: ['mask'],
+            options: Tuple([
+                {
+                    label: '点击空白区域',
+                    value: 'mask',
+                },
+                {
+                    label: 'ESC',
+                    value: 'esc',
+                },
+            ]),
+        },
+    }),
+    defaultMaskShow: Type.Boolean({
+        title: '展示遮罩',
+        default: true,
+        'x-index': 40,
+        'x-category': '高级属性',
+    }),
+    headerSlot: Type.Slot({
+        title: '弹窗顶部',
+        description: '弹窗顶部插槽',
+    }),
+    contentSlot: Type.Slot({
+        title: '弹窗内容',
+        description: '弹窗内容插槽',
+    }),
+    footerSlot: Type.Slot({
+        title: '底部按钮',
+        description: '弹窗底部插槽',
+    }),
+});
+const properties = Type.Object({
+    modalState: Type.StringEnum({
+        enum: Tuple([
+            {
+                label: '打开',
+                value: 'open',
+            },
+            {
+                label: '关闭',
+                value: 'close',
+            },
+        ]),
+        title: '弹窗状态',
+        openInfo: Type.Unknown({
+            description: '透传信息，在触发弹窗打开时接收的信息，信息来自于调用组件open方法的info',
+        }),
+        closeInfo: Type.Unknown({
+            description: '透传信息，在触发弹窗关闭时接收的信息，信息来自于调用组件close方法的info',
+        }),
+    }),
+});
+// 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-modal',
+            description: '组件根元素',
+        },
+        {
+            name: 'PC 端根元素',
+            selector: '.wd-pc-modal',
+            description: '可以为 PC 端的编写样式',
+        },
+        {
+            name: 'H5 端根元素',
+            selector: '.wd-h5-modal',
+            description: '可以为 H5 端的编写样式',
+        },
+        {
+            name: '小程序 端根元素',
+            selector: '.wd-mp-modal',
+            description: '可以为 小程序 端的编写样式',
+        },
+        {
+            name: '弹窗遮罩层样式',
+            selector: '.wd-modal-mask',
+            description: '可以为遮罩层编写样式',
+        },
+        {
+            name: '弹窗主体容器样式',
+            selector: '.wd-modal-bd',
+            description: '可以为主体容器编写样式',
+        },
+        {
+            name: '弹窗标题区样式',
+            selector: '.wd-modal-bd__hd',
+            description: '可以为标题区编写样式',
+        },
+        {
+            name: '弹窗内容区样式',
+            selector: '.wd-modal-bd__main',
+            description: '可以为内容区编写样式',
+        },
+        {
+            name: '弹窗按钮区样式',
+            selector: '.wd-modal-bd__ft',
+            description: '可以为按钮区编写样式',
+        },
+    ],
+    // 组件方法
+    methods: [
+        {
+            name: 'open',
+            label: '打开弹窗',
+            params: Type.Object({
+                info: Type.Unknown({
+                    description: '透传信息，在监听到弹窗打开时会传递该信息',
+                }),
+            }),
+        },
+        {
+            name: 'close',
+            label: '关闭弹窗',
+            params: Type.Object({
+                info: Type.Unknown({
+                    description: '透传信息，在监听到弹窗关闭时会传递该信息',
+                }),
+            }),
+        },
+    ],
+    // 组件对外暴露事件
+    events: [
+        {
+            title: '弹窗打开时',
+            name: 'open',
+            detail: Type.Object({
+                info: Type.Unknown({
+                    description: '透传信息，在触发弹窗打开时接收该信息，信息来自于调用组件open方法的info',
+                }),
+            }),
+        },
+        {
+            title: '弹窗关闭时',
+            name: 'close',
+            detail: Type.Object({
+                info: Type.Unknown({
+                    description: '透传信息，在触发弹窗关闭时接收该信息，信息来自于调用组件close方法的info',
+                }),
+            }),
+        },
+    ],
+    // 组件元信息
+    meta: {
+        name: 'WdModal',
+        // 组件别名，用于生成组件 id，例如 Icon1
+        componentName: 'Modal',
+        title: '弹窗',
+        description: '用于实现基础的弹窗（对话框）展示效果。',
+        propertyPanelTips: '在小程序中使用时，不建议嵌套在其他容器/组件中，以免弹窗被遮盖',
+        icon: '../../icons/Modal.svg',
+        category: '布局',
+        categoryOrder: 200,
+        componentOrder: 140,
+        visible: ['APP', 'COMPONENT'],
+        docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/grid/WdModal',
+        // 快捷编辑时展示在编辑区的属性
+        // shortcut: {
+        //   props: ['line', 'checkable'],
+        // },
+        group: {
+            ['基础属性']: {
+                'x-index': 1,
+                expand: true,
+            },
+            ['高级属性']: {
+                'x-index': 2,
+                expand: false,
+            },
+        },
+        templates: [
+            {
+                when: '$attached',
+                to: 'headerSlot',
+                body: HEADER_TPL,
+            },
+            {
+                when: '$attached',
+                to: 'footerSlot',
+                body: FOOTER_TPL,
+            },
+        ],
+    },
+});
+export default config;

package/dist/configs/components/wd-official-account.d.ts

@@ -0,0 +1,54 @@
+declare const _default: {
+    $schema: "https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json";
+    data: {
+        properties: {};
+    };
+    events: {
+        title: string;
+        name: string;
+        'x-platforms': "MP"[];
+        description: string;
+        detail: import("@sinclair/typebox").TObject<{
+            status: import("@sinclair/typebox").TNumber;
+            errMsg: import("@sinclair/typebox").TString<"string" | "boolean" | "object" | "function" | "tel" | "x-long-text" | "phone" | "datetime" | "array" | "url" | "x-image" | "x-rtf" | "x-enum" | "x-location" | "x-file" | "x-autonumber" | "x-area-code" | "related" | "father-son" | "many-many">;
+        }>;
+    }[];
+    classes: {
+        name: string;
+        selector: string;
+        description: string;
+    }[];
+    meta: {
+        name: string;
+        componentName: string;
+        title: string;
+        description: string;
+        category: string;
+        icon: string;
+        platform: "MP"[];
+        visible: "APP"[];
+        docsUrl: "https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/wxOpen/WdOfficialAccount";
+        inlineStyleForm: {
+            $blockedAll: true;
+        };
+        categoryOrder: number;
+        componentOrder: number;
+        validate: {
+            rule: string;
+            options: {
+                allowFailure: boolean;
+                title: string;
+                description: string;
+                type: string;
+                version: string;
+                matchedPublishedPlatform: string[];
+                extra: {
+                    usePositionTemplate: boolean;
+                };
+            };
+        }[];
+        propertyPanelTips: string;
+        stylePanelTips: string;
+    };
+};
+export default _default;

package/dist/configs/components/wd-official-account.js

@@ -14,29 +14,29 @@ export default defineConfig({
             title: '公众号加载成功',
             name: 'load',
             'x-platforms': ['MP'],
-            remarks: '公众号加载成功时触发',
-            detail: {
+            description: '公众号加载成功时触发',
+            detail: Type.Object({
                 status: Type.Number({
                     description: '状态码',
                 }),
                 errMsg: Type.String({
                     description: '错误信息',
                 }),
-            },
+            }),
         },
         {
             title: '公众号加载失败',
             name: 'error',
             'x-platforms': ['MP'],
-            remarks: '公众号加载失败时触发',
-            detail: {
+            description: '公众号加载失败时触发',
+            detail: Type.Object({
                 status: Type.Number({
                     description: '状态码',
                 }),
                 errMsg: Type.String({
                     description: '错误信息',
                 }),
-            },
+            }),
         },
     ],
     classes: [