@cloudbase/weda-ui 3.5.2 → 3.6.0

package/dist/configs/index.js

@@ -3,9 +3,6 @@ import Text from './components/text';
 import Container from './components/container';
 import Image from './components/image';
 import Link from './components/link';
-// import Picker from './components/picker/picker.json';
-// import DatePicker from './components/picker/datePicker.json';
-// import TimePicker from './components/picker/timePicker.json';
 import Input from './components/form/input.json';
 import Location from './components/form/location.json';
 import Textarea from './components/form/textarea.json';
@@ -20,10 +17,8 @@ import UploaderFile from './components/form/uploaderFile.json';
 import ScrollView from './components/scrollVeiw.json';
 import Swiper from './components/swiper.json';
 import Carousel from './components/carousel.json';
-// import Label from './components/form/label.json';
 import Tips from './components/form/tips.json';
 import Modal from './components/modal';
-import Drawer from './components/drawer.json';
 import RichText from './components/form/richText.json';
 import RichTextView from './components/richtextview.json';
 import Tabs from './components/tabs';
@@ -33,13 +28,11 @@ import WedaVideo from './components/wedaVideo';
 import showToast from './actions/showToast.json';
 import showModal from './actions/showModal.json';
 import showMessage from './actions/showMessage.json';
-// import ListView from './components/listView.json';
 import ListView from './components/listView';
 import NavigationBar from './components/navigationBar.json';
 import Line from './components/chart/line';
 import Bar from './components/chart/bar.json';
 import Pie from './components/chart/pie.json';
-// import DataView from './components/dataView.json';
 import DataView from './components/dataView';
 import StatisticsCard from './components/chart/statisticsCard.json';
 import GraphicCard from './components/graphicCard.json';
@@ -70,23 +63,39 @@ import WdTextarea from './components/wd-textarea';
 import WdInputEmail from './components/wd-input-email';
 import WdInputUrl from './components/wd-input-url';
 import WdInputNumber from './components/wd-input-number';
-// import WdSelect from './components/wd-select';
-// import WdRegion from './components/wd-region';
+import WdSelect from './components/wd-select';
+import WdSelectMultiple from './components/wd-select-multiple';
+import WdRegion from './components/wd-region';
 import WdDate from './components/wd-date';
-// import WdDateRange from './components/wd-date-range';
-// import WdTime from './components/wd-time';
-// import WdUploadFile from './components/wd-upload-file';
-// import WdUploadImage from './components/wd-upload-image';
-// import WdLocation from './components/wd-location';
-// import WdMemberSelect from './components/wd-member-select';
-// import WdDepartmentSelect from './components/wd-department-select';
+import WdTagSelect from './components/wd-tag-select';
+import WdTag from './components/wd-tag';
+import WdDateRange from './components/wd-date-range';
+import WdTime from './components/wd-time';
+import WdUploadFile from './components/wd-upload-file';
+import WdUploadImage from './components/wd-upload-image';
+import WdLocation from './components/wd-location';
+import WdMember from './components/wd-member';
+import WdDepartment from './components/wd-department';
 import WdInputPhone from './components/wd-input-phone';
 import WdInput from './components/wd-input';
 import WdSwitch from './components/wd-switch';
 import WdRadioList from './components/wd-radio';
 import WdCheckboxList from './components/wd-checkbox';
+import WdMenuLayout from './components/wd-menu-layout';
+import WdMenuHorizontalLayout from './components/wd-menu-horizontal-layout';
+import WdMenPlantLayout from './components/wd-menu-plant-layout';
+import WdMenuVerticalLayout from './components/wd-menu-vertical-layout';
+import WdMenuBaseLayout from './components/wd-menu-base-layout';
+import WdMenuList from './components/wd-menu-list';
+import WdMenuTabLayout from './components/wd-menu-tab-layout';
+import WdMenuNavLayout from './components/wd-menu-nav-layout';
+import WdTabBar from './components/wd-tabbar';
 import WdCard from './components/wd-card';
 import WdLayout from './components/wd-layout';
+import WdSideTab from './components/wd-side-tab';
+import WdTopTab from './components/wd-top-tab';
+import WdRichText from './components/wd-rich-text';
+import WdCalendar from './components/wd-calendar';
 import WdIcon from './components/wd-icon';
 import WdText from './components/wd-text';
 import WdImage from './components/wd-image';
@@ -94,6 +103,7 @@ import WdTable from './components/wd-table';
 import Grid from './components/grid/grid';
 import Row from './components/grid/row';
 import Col from './components/grid/col';
+import JSX from './components/jsx';
 import Repeater from './components/repeater';
 import RepeaterItem from './components/repeater-item.json';
 import WebView from './components/web-view';
@@ -124,7 +134,19 @@ import WdTree from './components/wd-tree';
 import WdOfficialAccount from './components/wd-official-account';
 import WdModal from './components/wd-modal';
 import Chart from './components/echart';
+import WdCanvas from './components/wd-canvas';
+import WdAudio from './components/wd-audio';
+import WdAd from './components/wd-ad';
+import WdUnifiedLink from './components/wd-unified-link';
+import WdRating from './components/wd-rating';
+import WdProgress from './components/wd-progress';
 export const components = {
+    WdUnifiedLink,
+    WdRating,
+    WdProgress,
+    WdAudio,
+    WdAd,
+    WdCanvas,
     WdModal,
     Chart,
     WdOfficialAccount,
@@ -157,9 +179,6 @@ export const components = {
     Text,
     Container,
     Image,
-    // Picker,
-    // DatePicker,
-    // TimePicker,
     Input,
     Radio,
     Checkbox,
@@ -182,7 +201,6 @@ export const components = {
     RichText,
     RichTextView,
     Link,
-    Drawer,
     Tabs,
     Calendar,
     ListView,
@@ -223,6 +241,8 @@ export const components = {
     WdTable,
     WdTextarea,
     WdInput,
+    WdSideTab,
+    WdTopTab,
     QrCode,
     // grid
     Grid,
@@ -231,25 +251,40 @@ export const components = {
     Col,
     WdInputEmail,
     WdInputUrl,
-    // WdSelect,
-    // WdRegion,
+    WdSelect,
+    WdSelectMultiple,
+    WdRegion,
     WdDate,
-    // WdDateRange,
-    // WdTime,
-    // WdUploadFile,
-    // WdUploadImage,
-    // WdLocation,
-    // WdMemberSelect,
-    // WdDepartmentSelect,
+    WdDateRange,
+    WdTime,
+    WdUploadFile,
+    WdUploadImage,
+    WdLocation,
+    WdMember,
+    WdDepartment,
     WdInputNumber,
     WdSwitch,
     WdRadioList,
     WdCheckboxList,
     WdInputPhone,
+    WdTagSelect,
+    WdTag,
+    WdMenuLayout,
+    WdMenuHorizontalLayout,
+    WdMenPlantLayout,
+    WdMenuVerticalLayout,
+    WdMenuBaseLayout,
+    WdMenuTabLayout,
+    WdMenuNavLayout,
+    WdMenuList,
+    WdRichText,
+    WdCalendar,
+    WdTabBar,
     // Repeater
     Repeater,
     RepeaterItem,
     WebView,
+    JSX,
 };
 export const actions = {
     showToast,

package/dist/configs/svg-tag.d.ts

@@ -0,0 +1 @@
+export declare const svgDataUri: (strings: TemplateStringsArray, ...parts: unknown[]) => string;

package/dist/configs/svg-tag.js

@@ -0,0 +1,19 @@
+const createSvgDataUri = (svgStr) => {
+    return `data:image/svg+xml,${encodeURIComponent(svgStr)}`;
+};
+export const svgDataUri = (strings, ...parts) => {
+    if (!strings[0].startsWith('<svg')) {
+        return '<svg%20xmlns=%27http://www.w3.org/2000/svg%27%20version=%271.1%27%20/>';
+    }
+    let result = '' + strings[0];
+    const partsLen = parts.length;
+    for (let i = 1, len = strings.length; i < len; i++) {
+        const partIdx = i - 1;
+        if (partIdx >= 0 && partIdx < partsLen) {
+            result += String(parts[i - 1]);
+        }
+        result += strings[i];
+    }
+    const svgDataUri = createSvgDataUri(result);
+    return svgDataUri;
+};

package/dist/configs/type-utils/classes.d.ts

@@ -0,0 +1,91 @@
+export declare const getClasses: (classRoot: string, options?: any) => {
+    /** 根元素 */
+    root: {
+        name: string;
+        selector: string;
+        description: string;
+    };
+    root_h5: {
+        name: string;
+        selector: string;
+        description: string;
+    };
+    root_pc: {
+        name: string;
+        selector: string;
+        description: string;
+    };
+    root_mp: {
+        name: string;
+        selector: string;
+        description: string;
+    };
+    /** 通用类 */
+    item_label: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    item_control: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    item_help: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    item_error: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    item_readonly: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    /** 输入类 */
+    input_addon_left: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    input_addon_right: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    input_edit: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    input_focus: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    input_placeholder: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+    input_disabled: {
+        name: string;
+        selector: string;
+        description: string;
+        code: string;
+    };
+};

package/dist/configs/type-utils/classes.js

@@ -0,0 +1,192 @@
+// 组件通用样式 API
+export const getClasses = (classRoot, options = {}) => {
+    if (classRoot.startsWith('wd-')) {
+        classRoot = classRoot.slice(3);
+    }
+    const { kind = '输入框' } = options;
+    const ROOT_SELECTOR = `.wd-${classRoot}-root`;
+    const ROOT_H5_SELECTOR = `.wd-h5-${classRoot}-root`;
+    const ROOT_PC_SELECTOR = `.wd-pc-${classRoot}-root`;
+    const ROOT_MP_SELECTOR = `.wd-mp-${classRoot}-root`;
+    return {
+        /** 根元素 */
+        root: {
+            name: '根元素',
+            selector: ROOT_SELECTOR,
+            description: '组件最外层元素',
+        },
+        root_h5: {
+            name: 'H5 端根元素',
+            selector: ROOT_H5_SELECTOR,
+            description: '可设定 H5 端的根元素样式',
+        },
+        root_pc: {
+            name: 'PC 端根元素',
+            selector: ROOT_PC_SELECTOR,
+            description: '可设定 PC 端的根元素样式',
+        },
+        root_mp: {
+            name: '小程序端根元素',
+            selector: ROOT_MP_SELECTOR,
+            description: '可设定小程序端的根元素样式',
+        },
+        /** 通用类 */
+        item_label: {
+            name: '组件标题样式',
+            selector: `${ROOT_SELECTOR} .wd-form-item-wrap__label`,
+            description: '组件标题元素',
+            code: `
+            :scope .wd-form-item-wrap__label {
+              font-size: 20px;
+              color: gray;
+              padding: 0;
+              display: flex;
+              align-items: center;
+            }
+            `,
+        },
+        item_control: {
+            name: '表单控件根节点样式',
+            selector: `${ROOT_SELECTOR} .wd-form-item-wrap__control`,
+            description: '设置表单控件根元素样式',
+            code: `
+            :scope .wd-form-item-wrap__control {
+              font-size: 20px;
+              color: gray;
+              padding: 0;
+              display: flex;
+              align-items: center;
+            }
+            `,
+        },
+        item_help: {
+            name: '提示文字',
+            selector: `${ROOT_SELECTOR} .wd-form-item__help-text`,
+            description: '设置组件提示文字样式',
+            code: `
+            :scope .wd-form-item__help-text {
+                font-size: 20px;
+                color: gray;
+              }
+            `,
+        },
+        item_error: {
+            name: '编辑态-校验信息',
+            selector: `${ROOT_SELECTOR} .wd-g-text-error`,
+            description: '设置组件校验信息样式',
+            code: `
+            :scope .wd-g-text-error {
+                font-size: 20px;
+                color: gray;
+              }
+            `,
+        },
+        item_readonly: {
+            name: '只读态-表单值样式',
+            selector: `${ROOT_SELECTOR} .wd-form-item__readonly-value`,
+            description: '设置组件只读状态',
+            code: `
+            :scope .wd-form-item__readonly-value {
+                font-size: 20px;
+                color: gray;
+              }
+            `,
+        },
+        /** 输入类 */
+        input_addon_left: {
+            name: '前缀文字样式',
+            selector: `${ROOT_SELECTOR} .wd-form-input-group__addon-left`,
+            description: '设置组件前缀文字样式',
+            code: `
+            :scope .wd-form-input-group__addon-left {
+                font-size: 20px;
+                color: gray;
+                height: 40px;
+                background-color: lightgray;
+              }
+            /* 仅PC端生效 */
+            :scope${ROOT_PC_SELECTOR} .wd-form-input-group__addon-left {
+                border-width: 2px;
+                border-color: gray;
+                border-radius: 10px 0 0 10px;
+            }
+            `,
+        },
+        input_addon_right: {
+            name: '后缀文字样式',
+            selector: `${ROOT_SELECTOR} .wd-form-input-group__addon-right`,
+            description: '设置组件后缀文字样式',
+            code: `
+            :scope .wd-form-input-group__addon-right {
+                font-size: 20px;
+                color: gray;
+                height: 40px;
+                background-color: lightgray;
+              }
+            /* 仅PC端生效 */
+            :scope${ROOT_PC_SELECTOR} .wd-form-input-group__addon-right {
+                border-width: 2px;
+                border-color: gray;
+                border-radius: 10px 0 0 10px;
+            }
+            `,
+        },
+        input_edit: {
+            name: `编辑态-${kind}样式`,
+            selector: `${ROOT_SELECTOR} .wd-form-input-wrap`,
+            description: '组件边框、边距样式',
+            code: `
+            :scope .wd-form-input-wrap {
+              font-size: 20px;
+              color: gray;
+              text-align: right;
+              height: 40px;
+              width: 100%;
+              background-color: lightgray;
+              border-width: 2px;
+              border-color: gray;
+              border-radius: 0px;
+            }
+            `,
+        },
+        input_focus: {
+            name: `编辑态-${kind}样式（获取焦点）`,
+            selector: `${ROOT_SELECTOR} .wd-form-input-wrap.is-focused`,
+            description: `编辑态-${kind}样式（获取焦点）`,
+            code: `
+            :scope .wd-form-input-wrap.is-focused {
+              background-color: lightgray;
+              border-color: gray;
+            }
+            `,
+        },
+        input_placeholder: {
+            name: '编辑态-占位文字样式',
+            selector: `${ROOT_SELECTOR} input::placeholder, ${ROOT_SELECTOR} .weui-input__placeholder`,
+            description: '设置占位文字样式',
+            code: `
+            :scope input::placeholder, :scope .weui-input__placeholder {
+              color: lightgray;
+            }
+            `,
+        },
+        input_disabled: {
+            name: `禁用态-${kind}样式`,
+            selector: `${ROOT_SELECTOR} .wd-form-input-wrap.is-disabled`,
+            description: '组件禁用样式',
+            code: `
+            :scope .wd-form-input-wrap.is-disabled {
+                font-size: 20px;
+                color: gray;
+                text-align: right;
+                height: 40px;
+                width: 200px;
+                background-color: lightgray;
+                border-width: 2px;
+                border-color: gray;
+                border-radius: 10px;
+              }
+            `,
+        },
+    };
+};

package/dist/configs/type-utils/index.d.ts

@@ -1,7 +1,8 @@
-import { SchemaOptions, Static, StringOptions, TObject, TString, TUnknown, ExtendedTypeBuilder as TypeboxTypeBuilder } from '@sinclair/typebox';
+import { SchemaOptions, Static, StringOptions, TObject, TString, TUnknown, TSchema, TFunction, ExtendedTypeBuilder as TypeboxTypeBuilder } from '@sinclair/typebox';
 import type { Except, LiteralUnion, ReadonlyDeep, Simplify } from 'type-fest';
 import { LCDS } from '@cloudbase/cals';
 import React from 'react';
+type XPlatform = LCDS.XPlatform;
 export type { Static } from '@sinclair/typebox';
 export type { Simplify };
 declare const dataSourceFormat: readonly ["string", "tel", "x-long-text", "phone", "datetime", "date", "time", "boolean", "array", "object", "email", "url", "x-image", "x-rtf", "x-enum", "x-location", "x-file", "x-autonumber", "x-area-code", "function", "related", "father-son", "many-many"];
@@ -18,6 +19,7 @@ declare class TypeBuilder extends TypeboxTypeBuilder {
         breakpoint: BreakPointEnum;
         description: string;
     }>(options: T): TBreakPoint;
+    Function<T extends TSchema[], U extends TSchema>(parameters: [...T], returns: U, options?: SchemaOptions): TFunction<T, U>;
 }
 export declare const Type: TypeBuilder;
 type CommonLinkageItem = {
@@ -43,7 +45,6 @@ type TXLinkagesItem = TValueVisibleLinkageItem | TValueStateLinkageItem | TValue
 type XComponentProps<T extends string> = T extends 'flex-align-select' ? {
     direction: 'mainAxis' | 'crossAxis';
 } : Record<string, unknown>;
-type XPlatform = 'MP' | 'WEB' | 'PCWEB' | 'MOBILEWEB';
 type XComponentUnion = LiteralUnion<'radio' | 'textarea' | 'checkbox' | 'color' | 'image' | 'page-list' | 'select' | 'flex-align-select', string>;
 type BreakPointEnum = 'xs' | 'lg';
 type TBreakPoint = TString & {
@@ -60,6 +61,8 @@ declare module '@sinclair/typebox' {
         'x-component-props'?: XComponentProps<XComponent>;
         'x-platforms'?: XPlatform[] | [''];
         'x-component'?: XComponent;
+        'x-runtime-default'?: any;
+        'x-helper-text'?: string;
         'x-props'?: {
             'data-hidebind'?: boolean;
             'data-withBindMeta'?: boolean;
@@ -77,15 +80,10 @@ interface EnumSchemaOptions<T extends string | number, XComponent extends XCompo
     }[]>>;
 }
 export type Events = Readonly<(LCDS.IEvent & {
-    'x-platforms'?: XPlatform[];
     description?: string;
     detail?: TObject | TUnknown;
 })[]>;
-type VisibleItem = 'APP' | 'COMPONENT';
-type ValidateRuleItem = {
-    rule: string;
-    [k: string]: unknown;
-};
+type VisibleItem = LCDS.VisibleItem;
 type Method = {
     name: string;
     label: string;
@@ -93,23 +91,12 @@ type Method = {
     description?: string;
     params?: any;
 };
-type ClassApiItem = {
-    name: string;
-    selector: string;
-    description: string;
-};
+type ClassApiItem = LCDS.IClasses;
 type ConfigMeta<D extends TObject> = Simplify<Readonly<{
     docsUrl?: `http://${string}` | `https://${string}`;
     visible?: VisibleItem[] | string;
-    shortcut?: {
-        props?: (keyof Static<D>)[];
-        extra?: Record<'container', {
-            'x-component': string;
-            'x-component-props': string[];
-            'x-index': number;
-        }>;
-    };
     contextData?: any;
+    shortcut?: LCDS.IShortcut;
 }>>;
 export type StaticEventsType<T extends Events> = {
     events: {
@@ -130,17 +117,11 @@ type Schema<D extends TObject, P extends TObject> = Simplify<ReadonlyDeep<Except
         componentName?: string;
         categoryOrder?: number;
         platform?: XPlatform[];
+        icon: `../${string}`;
         inlineStyleForm?: Record<string, unknown> | {
             $blockedAll: true;
         };
         visible?: VisibleItem[] | string;
-        validate?: ValidateRuleItem[];
-        templates?: Array<{
-            to: string;
-            autoSelectPath?: `template${string}`;
-            body: string;
-            when?: LiteralUnion<'$attached', string>;
-        }>;
     };
     /** @deprecated no meant to be public */
     configMeta?: ConfigMeta<D>;

package/dist/configs/type-utils/index.js

@@ -1,4 +1,4 @@
-import { Type as T, ExtendedTypeBuilder as TypeboxTypeBuilder, } from '@sinclair/typebox';
+import { Type as T, Kind, ExtendedTypeBuilder as TypeboxTypeBuilder, } from '@sinclair/typebox';
 // https://git.woa.com/QBase/lcap/datasource/blob/main/packages/ds-helper/src/datasource-field-type.ts
 const dataSourceFormat = [
     'string',
@@ -81,6 +81,14 @@ class TypeBuilder extends TypeboxTypeBuilder {
     BreakPoint(options) {
         return Type.String(options);
     }
+    Function(parameters, returns, options) {
+        return {
+            ...super.Function(parameters, returns, options),
+            [Kind]: 'Function',
+            type: 'object',
+            instanceOf: 'Function',
+        };
+    }
 }
 export const Type = new TypeBuilder();
 export const Tuple = (xs) => xs;