@tuya-miniapp/smart-ui 0.0.1-beta-1

package/dist/common/utils.js

@@ -0,0 +1,86 @@
+import { isDef, isNumber, isPlainObject, isPromise } from './validator';
+import { canIUseGroupSetData, canIUseNextTick, getSystemInfoSync, } from './version';
+export { isDef } from './validator';
+export { getSystemInfoSync } from './version';
+export function range(num, min, max) {
+    return Math.min(Math.max(num, min), max);
+}
+export function nextTick(cb) {
+    if (canIUseNextTick()) {
+        wx.nextTick(cb);
+    }
+    else {
+        setTimeout(() => {
+            cb();
+        }, 1000 / 30);
+    }
+}
+export function addUnit(value) {
+    if (!isDef(value)) {
+        return undefined;
+    }
+    value = String(value);
+    return isNumber(value) ? `${value}px` : value;
+}
+export function requestAnimationFrame(cb) {
+    return setTimeout(() => {
+        cb();
+    }, 1000 / 30);
+}
+export function pickExclude(obj, keys) {
+    if (!isPlainObject(obj)) {
+        return {};
+    }
+    return Object.keys(obj).reduce((prev, key) => {
+        if (!keys.includes(key)) {
+            prev[key] = obj[key];
+        }
+        return prev;
+    }, {});
+}
+export function getRect(context, selector) {
+    return new Promise((resolve) => {
+        wx.createSelectorQuery()
+            .in(context)
+            .select(selector)
+            .boundingClientRect()
+            .exec((rect = []) => resolve(rect[0]));
+    });
+}
+export function getAllRect(context, selector) {
+    return new Promise((resolve) => {
+        wx.createSelectorQuery()
+            .in(context)
+            .selectAll(selector)
+            .boundingClientRect()
+            .exec((rect = []) => resolve(rect[0]));
+    });
+}
+export function groupSetData(context, cb) {
+    if (canIUseGroupSetData()) {
+        context.groupSetData(cb);
+    }
+    else {
+        cb();
+    }
+}
+export function toPromise(promiseLike) {
+    if (isPromise(promiseLike)) {
+        return promiseLike;
+    }
+    return Promise.resolve(promiseLike);
+}
+// 浮点数精度处理
+export function addNumber(num1, num2) {
+    const cardinal = Math.pow(10, 10);
+    return Math.round((num1 + num2) * cardinal) / cardinal;
+}
+// 限制value在[min, max]之间
+export const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
+export function getCurrentPage() {
+    const pages = getCurrentPages();
+    return pages[pages.length - 1];
+}
+export const isPC = ['mac', 'windows'].includes(getSystemInfoSync().platform);
+// 是否企业微信
+export const isWxWork = getSystemInfoSync().environment === 'wxwork';

package/dist/common/validator.d.ts

@@ -0,0 +1,9 @@
+export declare function isFunction(val: unknown): val is Function;
+export declare function isPlainObject(val: unknown): val is Record<string, unknown>;
+export declare function isPromise<T = unknown>(val: unknown): val is Promise<T>;
+export declare function isDef(value: unknown): boolean;
+export declare function isObj(x: unknown): x is Record<string, unknown>;
+export declare function isNumber(value: string): boolean;
+export declare function isBoolean(value: unknown): value is boolean;
+export declare function isImageUrl(url: string): boolean;
+export declare function isVideoUrl(url: string): boolean;

package/dist/common/validator.js

@@ -0,0 +1,31 @@
+// eslint-disable-next-line @typescript-eslint/ban-types
+export function isFunction(val) {
+    return typeof val === 'function';
+}
+export function isPlainObject(val) {
+    return val !== null && typeof val === 'object' && !Array.isArray(val);
+}
+export function isPromise(val) {
+    return isPlainObject(val) && isFunction(val.then) && isFunction(val.catch);
+}
+export function isDef(value) {
+    return value !== undefined && value !== null;
+}
+export function isObj(x) {
+    const type = typeof x;
+    return x !== null && (type === 'object' || type === 'function');
+}
+export function isNumber(value) {
+    return /^\d+(\.\d+)?$/.test(value);
+}
+export function isBoolean(value) {
+    return typeof value === 'boolean';
+}
+const IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
+const VIDEO_REGEXP = /\.(mp4|mpg|mpeg|dat|asf|avi|rm|rmvb|mov|wmv|flv|mkv)/i;
+export function isImageUrl(url) {
+    return IMAGE_REGEXP.test(url);
+}
+export function isVideoUrl(url) {
+    return VIDEO_REGEXP.test(url);
+}

package/dist/common/version.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="miniprogram-api-typings" />
+interface WxWorkSystemInfo extends WechatMiniprogram.SystemInfo {
+    environment?: 'wxwork';
+}
+interface SystemInfo extends WxWorkSystemInfo, WechatMiniprogram.SystemInfo {
+}
+export declare function getSystemInfoSync(): SystemInfo;
+export declare function canIUseModel(): boolean;
+export declare function canIUseFormFieldButton(): boolean;
+export declare function canIUseAnimate(): boolean;
+export declare function canIUseGroupSetData(): boolean;
+export declare function canIUseNextTick(): boolean;
+export declare function canIUseCanvas2d(): boolean;
+export declare function canIUseGetUserProfile(): boolean;
+export {};

package/dist/common/version.js

@@ -0,0 +1,59 @@
+let systemInfo;
+export function getSystemInfoSync() {
+    if (systemInfo == null) {
+        systemInfo = wx.getSystemInfoSync();
+    }
+    return systemInfo;
+}
+function compareVersion(v1, v2) {
+    v1 = v1.split('.');
+    v2 = v2.split('.');
+    const len = Math.max(v1.length, v2.length);
+    while (v1.length < len) {
+        v1.push('0');
+    }
+    while (v2.length < len) {
+        v2.push('0');
+    }
+    for (let i = 0; i < len; i++) {
+        const num1 = parseInt(v1[i], 10);
+        const num2 = parseInt(v2[i], 10);
+        if (num1 > num2) {
+            return 1;
+        }
+        if (num1 < num2) {
+            return -1;
+        }
+    }
+    return 0;
+}
+function gte(version) {
+    const system = getSystemInfoSync();
+    return compareVersion(system.SDKVersion, version) >= 0;
+}
+export function canIUseModel() {
+    return gte('2.9.3');
+}
+export function canIUseFormFieldButton() {
+    return gte('2.10.3');
+}
+export function canIUseAnimate() {
+    return gte('2.9.0');
+}
+export function canIUseGroupSetData() {
+    return gte('2.4.0');
+}
+export function canIUseNextTick() {
+    try {
+        return wx.canIUse('nextTick');
+    }
+    catch (e) {
+        return gte('2.7.1');
+    }
+}
+export function canIUseCanvas2d() {
+    return gte('2.9.0');
+}
+export function canIUseGetUserProfile() {
+    return !!wx.getUserProfile;
+}

package/dist/config-provider/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/config-provider/index.js

@@ -0,0 +1,9 @@
+import { VantComponent } from '../common/component';
+VantComponent({
+    props: {
+        themeVars: {
+            type: Object,
+            value: {},
+        },
+    },
+});

package/dist/config-provider/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/dist/config-provider/index.wxml

@@ -0,0 +1,5 @@
+<wxs src="./index.wxs" module="computed" />
+
+<view class="van-config-provider" style="{{ computed.mapThemeVarsToCSSVars(themeVars) }}">
+  <slot />
+</view>

package/dist/config-provider/index.wxs

@@ -0,0 +1,29 @@
+/* eslint-disable */
+var object = require('../wxs/object.wxs');
+var style = require('../wxs/style.wxs');
+
+function kebabCase(word) {
+  var newWord = word
+    .replace(getRegExp("[A-Z]", 'g'), function (i) {
+      return '-' + i;
+    })
+    .toLowerCase()
+    .replace(getRegExp("^-"), '');
+
+  return newWord;
+}
+
+function mapThemeVarsToCSSVars(themeVars) {
+  var cssVars = {};
+  object.keys(themeVars).forEach(function (key) {
+    var cssVarsKey = '--' + kebabCase(key);
+    cssVars[cssVarsKey] = themeVars[key];
+  });
+
+  return style(cssVars);
+}
+
+module.exports = {
+  kebabCase: kebabCase,
+  mapThemeVarsToCSSVars: mapThemeVarsToCSSVars,
+};

package/dist/count-down/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.van-count-down{color:var(--count-down-text-color,var(--app-B6-N2,rgba(0,0,0,.7)));font-size:var(--count-down-font-size,14px);line-height:var(--count-down-line-height,20px)}

package/dist/count-down/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/count-down/index.js

@@ -0,0 +1,100 @@
+import { VantComponent } from '../common/component';
+import { isSameSecond, parseFormat, parseTimeData } from './utils';
+function simpleTick(fn) {
+    return setTimeout(fn, 30);
+}
+VantComponent({
+    props: {
+        useSlot: Boolean,
+        millisecond: Boolean,
+        time: {
+            type: Number,
+            observer: 'reset',
+        },
+        format: {
+            type: String,
+            value: 'HH:mm:ss',
+        },
+        autoStart: {
+            type: Boolean,
+            value: true,
+        },
+    },
+    data: {
+        timeData: parseTimeData(0),
+        formattedTime: '0',
+    },
+    destroyed() {
+        clearTimeout(this.tid);
+        this.tid = null;
+    },
+    methods: {
+        // 开始
+        start() {
+            if (this.counting) {
+                return;
+            }
+            this.counting = true;
+            this.endTime = Date.now() + this.remain;
+            this.tick();
+        },
+        // 暂停
+        pause() {
+            this.counting = false;
+            clearTimeout(this.tid);
+        },
+        // 重置
+        reset() {
+            this.pause();
+            this.remain = this.data.time;
+            this.setRemain(this.remain);
+            if (this.data.autoStart) {
+                this.start();
+            }
+        },
+        tick() {
+            if (this.data.millisecond) {
+                this.microTick();
+            }
+            else {
+                this.macroTick();
+            }
+        },
+        microTick() {
+            this.tid = simpleTick(() => {
+                this.setRemain(this.getRemain());
+                if (this.remain !== 0) {
+                    this.microTick();
+                }
+            });
+        },
+        macroTick() {
+            this.tid = simpleTick(() => {
+                const remain = this.getRemain();
+                if (!isSameSecond(remain, this.remain) || remain === 0) {
+                    this.setRemain(remain);
+                }
+                if (this.remain !== 0) {
+                    this.macroTick();
+                }
+            });
+        },
+        getRemain() {
+            return Math.max(this.endTime - Date.now(), 0);
+        },
+        setRemain(remain) {
+            this.remain = remain;
+            const timeData = parseTimeData(remain);
+            if (this.data.useSlot) {
+                this.$emit('change', timeData);
+            }
+            this.setData({
+                formattedTime: parseFormat(this.data.format, timeData),
+            });
+            if (remain === 0) {
+                this.pause();
+                this.$emit('finish');
+            }
+        },
+    },
+});

package/dist/count-down/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/dist/count-down/index.wxml

@@ -0,0 +1,4 @@
+<view class="van-count-down">
+  <slot wx:if="{{ useSlot }}"/>
+  <block wx:else>{{ formattedTime }}</block>
+</view>

package/dist/count-down/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.van-count-down{color:var(--count-down-text-color,var(--app-B6-N2,rgba(0,0,0,.7)));font-size:var(--count-down-font-size,14px);line-height:var(--count-down-line-height,20px)}

package/dist/count-down/utils.d.ts

@@ -0,0 +1,10 @@
+export type TimeData = {
+    days: number;
+    hours: number;
+    minutes: number;
+    seconds: number;
+    milliseconds: number;
+};
+export declare function parseTimeData(time: number): TimeData;
+export declare function parseFormat(format: string, timeData: TimeData): string;
+export declare function isSameSecond(time1: number, time2: number): boolean;

package/dist/count-down/utils.js

@@ -0,0 +1,57 @@
+function padZero(num, targetLength = 2) {
+    let str = num + '';
+    while (str.length < targetLength) {
+        str = '0' + str;
+    }
+    return str;
+}
+const SECOND = 1000;
+const MINUTE = 60 * SECOND;
+const HOUR = 60 * MINUTE;
+const DAY = 24 * HOUR;
+export function parseTimeData(time) {
+    const days = Math.floor(time / DAY);
+    const hours = Math.floor((time % DAY) / HOUR);
+    const minutes = Math.floor((time % HOUR) / MINUTE);
+    const seconds = Math.floor((time % MINUTE) / SECOND);
+    const milliseconds = Math.floor(time % SECOND);
+    return {
+        days,
+        hours,
+        minutes,
+        seconds,
+        milliseconds,
+    };
+}
+export function parseFormat(format, timeData) {
+    const { days } = timeData;
+    let { hours, minutes, seconds, milliseconds } = timeData;
+    if (format.indexOf('DD') === -1) {
+        hours += days * 24;
+    }
+    else {
+        format = format.replace('DD', padZero(days));
+    }
+    if (format.indexOf('HH') === -1) {
+        minutes += hours * 60;
+    }
+    else {
+        format = format.replace('HH', padZero(hours));
+    }
+    if (format.indexOf('mm') === -1) {
+        seconds += minutes * 60;
+    }
+    else {
+        format = format.replace('mm', padZero(minutes));
+    }
+    if (format.indexOf('ss') === -1) {
+        milliseconds += seconds * 1000;
+    }
+    else {
+        format = format.replace('ss', padZero(seconds));
+    }
+    return format.replace('SSS', padZero(milliseconds, 3));
+}
+export function isSameSecond(time1, time2) {
+    return Math.floor(time1 / 1000) === Math.floor(time2 / 1000);
+}

package/dist/custom-keyboard/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:root .keyboard{--keyboard-bg-color:var(--app-B6,#fff);--keyboard-text-color:var(--app-B6-N2,rgba(0,0,0,.7));--keyboard-border-color:var(--app-B6-N7,rgba(0,0,0,.1));--keyboard-placeholder-text-color:var(--app-B6-N6,rgba(0,0,0,.2))}:root text{white-space:normal}.keyboard-container{align-items:center;background-color:var(--keyboard-bg-color);border:1rpx solid var(--keyboard-border-color);border-radius:16rpx;box-sizing:border-box;display:flex;flex-direction:row;height:80rpx;justify-content:space-between;overflow:hidden;padding:24rpx 0rpx 24rpx 24rpx;width:500rpx}.keyboard-button{align-items:center;background-color:initial;justify-content:center}.keyboard-textView{display:flex;flex:1}.keyboard-pwdText{color:var(--keyboard-placeholder-text-color);font-size:40rpx}.keyboard-password{color:var(--keyboard-text-color);letter-spacing:16rpx}.keyboard-randomText{font-size:24rpx;font-weight:500}.keyboard-popup-container{background-color:var(--app-B6-N6,rgba(0,0,0,.2));display:flex;flex-direction:row;height:464rpx;padding:8rpx;width:100%}.keyboard-number-wrap{background-color:initial;display:flex;flex:1;flex-direction:row;flex-wrap:wrap;width:570rpx}.keyboard-operate-wrap{background-color:initial;padding-right:4rpx;padding-top:8rpx;width:180rpx}.keyboard-number-item{align-items:center;background-color:var(--app-B6,#fff);border-radius:8rpx;display:flex;height:96rpx;justify-content:center;margin:8rpx;width:166rpx}.keyboard-number-text{color:var(--app-B6-N2,rgba(0,0,0,.7));font-size:48rpx;font-weight:700}.keyboard-hidden-image{background:var(--app-B6-N2,rgba(0,0,0,.7));height:80rpx;width:80rpx}.keyboard-confirm-btn{align-items:center;background-color:var(--app-B6,#fff);border-radius:8rpx;display:flex;height:210rpx;justify-content:center;padding:0;width:168rpx}.keyboard-confirm-color{background-color:var(--app-M3,#2dda86)}.keyboard-confirm-text{color:#fff;font-size:40rpx;font-weight:700}.keyboard-hover-class{background-color:var(--app-B6-N7,rgba(0,0,0,.1))}

package/dist/custom-keyboard/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/custom-keyboard/index.js

@@ -0,0 +1,164 @@
+import { VantComponent } from '../common/component';
+VantComponent({
+    props: {
+        /**
+         * @description.zh 当前值
+         * @description.en The current value
+         */
+        value: {
+            type: String,
+            value: '',
+            observer() {
+                this.setData({ currValue: this.data.value });
+            },
+        },
+        /**
+         * @description.zh 占位符文案
+         * @description.en The placeholder text
+         */
+        placeholder: {
+            type: String,
+            value: 'please input',
+        },
+        /**
+         * @description.zh 用于适配进制功能（取值范围1-10）
+         * @description.en Used to adapt the hexadecimal function (value range 1-9)
+         */
+        digitalBase: {
+            type: Number,
+            value: 10,
+            observer: 'init',
+        },
+        /**
+         * @description.zh 是否隐藏零
+         * @description.en Whether to hide zero
+         */
+        isHideZero: {
+            type: Boolean,
+            value: false,
+        },
+        /**
+         * @description.zh 数字键盘的确认按钮背景色
+         * @description.en The background color of the confirmation button of the numeric keypad
+         */
+        confirmColor: String,
+        /**
+         * @description.zh 确认按钮文案
+         * @description.en The text of the confirm button
+         */
+        confirmText: {
+            type: String,
+            value: 'Confirm',
+        },
+        /**
+         * @description.zh 输入框容器样式
+         * @description.en The style of confirm button
+         */
+        inputContainerStyle: String,
+        /**
+         * @description.zh 当前值的样式（适用于placeholder样式）
+         * @description.en The style of input box container
+         */
+        valueTextStyle: String,
+        /**
+         * @description.zh 确认按钮的样式
+         * @description.en The style of confirm button
+         */
+        confirmTextStyle: String,
+    },
+    data: {
+        currValue: '',
+        visible: false,
+        maxNum: 0,
+        numberArray: [1],
+        prefix: 'keyboard',
+        row: 1,
+        img_hidden_light: '',
+        img_delete_light: '',
+    },
+    created() {
+        this.init();
+        this.setData({
+            img_hidden_light: this.toSvgCssBackground(this.getHiddenLightSvgNode('#333')),
+            img_delete_light: this.toSvgCssBackground(this.getDeleteLightSvgNode('#333')),
+        });
+    },
+    methods: {
+        init() {
+            const { isHideZero, digitalBase } = this.data;
+            const maxNum = isHideZero ? +digitalBase : +digitalBase - 1; // 支持的最大数字
+            const numberArray = Array.from(Array(maxNum), (_, index) => index + 1);
+            !isHideZero && numberArray.push(0);
+            numberArray.push(-2);
+            this.setData({
+                maxNum,
+                numberArray,
+                row: Math.ceil(numberArray.length / 3),
+            });
+        },
+        confirm() {
+            this.setData({
+                visible: false,
+            });
+            this.$emit('confirm', this.data.currValue);
+        },
+        changeValue(item) {
+            const i = Number(item.currentTarget.dataset.item);
+            if (i === -2) {
+                this.setData({
+                    visible: false,
+                });
+                return;
+            }
+            const { currValue } = this.data;
+            const newValue = i === -1
+                ? currValue.length
+                    ? currValue.slice(0, currValue.length - 1)
+                    : ''
+                : `${currValue}${i}`;
+            this.setData({
+                currValue: newValue,
+            });
+            this.$emit('change', newValue);
+        },
+        handlePassword() {
+            this.setData({ visible: true });
+        },
+        onMaskPress() {
+            this.setData({ visible: false });
+        },
+        getHiddenLightSvgNode(color) {
+            return `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="40" height="40" viewBox="0 0 40 40"><g><g><path d="M17.701,29.701C18.2554,30.2554,18.84116,30.84116,19.28266,31.28266C19.673189999999998,31.673189999999998,20.326810000000002,31.673189999999998,20.71734,31.28266C21.158839999999998,30.84116,21.7446,30.2554,22.299,29.701C22.92896,29.07103,22.44369,28,21.55278,28C20.56722,28,19.43278,28,18.44722,28C17.55631,28,17.07103,29.07103,17.701,29.701" fill="#333333" fill-opacity="1"/></g><g><rect x="15" y="20" width="10" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><path d="M7,10L7,24Q7,24.0983,7.00963055,24.196Q7.0192611,24.2938,7.0384294,24.3902Q7.0575978,24.4865,7.0861193,24.5806Q7.114641,24.6746,7.152241,24.7654Q7.189841,24.8561,7.236157,24.9428Q7.282474,25.0294,7.337061,25.1111Q7.391648,25.1928,7.453979,25.2688Q7.516311,25.3447,7.585786,25.4142Q7.6552620000000005,25.4837,7.731213,25.546Q7.807164,25.6084,7.888859,25.6629Q7.970554,25.7175,8.05721,25.7638Q8.14386,25.8102,8.23463,25.8478Q8.32541,25.8854,8.41943,25.9139Q8.51345,25.9424,8.60982,25.9616Q8.70619,25.9807,8.80397,25.9904Q8.90175,26,9,26L31,26Q31.0983,26,31.196,25.9904Q31.2938,25.9807,31.3902,25.9616Q31.4865,25.9424,31.5806,25.9139Q31.6746,25.8854,31.7654,25.8478Q31.8561,25.8102,31.9428,25.7638Q32.029399999999995,25.7175,32.1111,25.6629Q32.1928,25.6084,32.2688,25.546Q32.3447,25.4837,32.4142,25.4142Q32.4837,25.3447,32.546,25.2688Q32.6083,25.1928,32.6629,25.1111Q32.7175,25.0294,32.7638,24.9428Q32.810199999999995,24.8561,32.8478,24.7654Q32.885400000000004,24.6746,32.9139,24.5806Q32.9424,24.4865,32.961600000000004,24.3902Q32.9807,24.2938,32.9904,24.196Q33,24.0983,33,24L33,10Q33,9.90175,32.9904,9.80397Q32.9807,9.70619,32.961600000000004,9.60982Q32.9424,9.51345,32.9139,9.41943Q32.885400000000004,9.32541,32.8478,9.23463Q32.810199999999995,9.14386,32.7638,9.05721Q32.7175,8.970554,32.6629,8.888859Q32.6083,8.807164,32.546,8.731213Q32.4837,8.655262,32.4142,8.585786Q32.3447,8.516311,32.2688,8.453979Q32.1928,8.391648,32.1111,8.337061Q32.029399999999995,8.282474,31.9428,8.236157Q31.8561,8.189841,31.7654,8.152241Q31.6746,8.114641,31.5806,8.0861193Q31.4865,8.0575978,31.3902,8.0384294Q31.2938,8.0192611,31.196,8.00963055Q31.0983,8,31,8L9,8Q8.90175,8,8.80397,8.00963055Q8.70619,8.0192611,8.60982,8.0384294Q8.51345,8.0575978,8.41943,8.0861193Q8.32541,8.114641,8.23463,8.152241Q8.14386,8.189841,8.05721,8.236157Q7.970554,8.282474,7.888859,8.337061Q7.807164,8.391648,7.731213,8.453979Q7.6552620000000005,8.516311,7.585786,8.585786Q7.516311,8.655262,7.453979,8.731213Q7.391648,8.807164,7.337061,8.888859Q7.282474,8.970554,7.236157,9.05721Q7.189841,9.14386,7.152241,9.23463Q7.114641,9.32541,7.0861193,9.41943Q7.0575978,9.51345,7.0384294,9.60982Q7.0192611,9.70619,7.00963055,9.80397Q7,9.90175,7,10ZM31,24L9,24L9,10L31,10L31,24Z" fill-rule="evenodd" fill="#333333" fill-opacity="1"/></g><g><rect x="12" y="16" width="4" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><rect x="12" y="12" width="4" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><rect x="18" y="16" width="4" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><rect x="18" y="12" width="4" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><rect x="24" y="16" width="4" height="2" rx="1" fill="#333333" fill-opacity="1"/></g><g><rect x="24" y="12" width="4" height="2" rx="1" fill="${color}" fill-opacity="1"/></g></g></svg>`;
+        },
+        getDeleteLightSvgNode(color) {
+            return `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="40" height="40" viewBox="0 0 40 40"><g><g><g><path d="M31.139,10.88219Q32,11.753546,32,12.99L32,27.009999999999998Q32,28.2465,31.139,29.1178Q30.2674,30,29.0185,30L14.57953,30Q12.75566,30,11.53603,28.4241L11.45074,28.3139L7.55054,21.49416Q7.15474,20.80208,7.15474,20Q7.15474,19.19792,7.55054,18.50585L9.322711,15.4071L11.40802,11.760825L11.43692,11.716023Q12.54363,10,14.57953,10L29.0185,10Q30.1823,10,31.0185,10.76608Q31.0797,10.82209,31.139,10.88219ZM14.57953,12C13.97759,12,13.461649999999999,12.266667,13.11769,12.8L9.28667,19.498739999999998C9.110759,19.80633,9.110759,20.193669999999997,9.28667,20.501260000000002L13.11769,27.2C13.461649999999999,27.644399999999997,13.97759,28,14.57953,28L29.0185,28C29.5708,28,30,27.5623,30,27.009999999999998L30,12.99C30,12.437715,29.5708,12,29.0185,12L14.57953,12Z" fill-rule="evenodd" fill="#333333" fill-opacity="1"/></g><g><path d="M19.5859164704895,20.21865544288635L17.0745744704895,17.70731544288635L17.074336470489502,17.707085442886353Q16.933684470489503,17.566425442886352,16.857563770489502,17.382655442886353Q16.7814433668895,17.198885442886354,16.781443595889503,16.999975442886353Q16.7814433668895,16.801063442886353,16.8575636704895,16.617292442886352Q16.933683470489502,16.433521442886352,17.074336470489502,16.292868442886352Q17.2149884704895,16.152216442886353,17.3987594704895,16.07609594288635Q17.582530470489502,15.999975442886353,17.781443470489503,15.999975442886353Q17.980356470489504,15.999975442886353,18.164126470489503,16.076095842886353Q18.347896470489502,16.152216442886353,18.488546470489503,16.292868442886352L18.4887864704895,16.293105442886354L21.0001264704895,18.80444544288635L23.5116764704895,16.292891442886354Q23.652326470489502,16.15223944288635,23.8360964704895,16.076118842886352Q24.0198764704895,15.999998331086353,24.2187864704895,15.999998331086353Q24.417696470489503,15.999998331086353,24.601466470489502,16.07611874288635Q24.7852364704895,16.15223944288635,24.925886470489502,16.292891442886354Q25.066546470489502,16.433543442886354,25.1426664704895,16.617314442886354Q25.2187864704895,16.801085442886354,25.2187864704895,16.999995442886352Q25.2187864704895,17.198915442886353,25.1426664704895,17.382685442886352Q25.066546470489502,17.56645544288635,24.9258964704895,17.707105442886352L22.414336470489502,20.21865544288635L24.707186470489503,22.511505442886353Q24.8478464704895,22.652155442886354,24.923966470489503,22.835935442886353Q25.0000864704895,23.01970544288635,25.0000864704895,23.218615442886353Q25.0000864704895,23.41752544288635,24.923966470489503,23.601295442886354Q24.8478464704895,23.785065442886353,24.707186470489503,23.925725442886353Q24.566536470489503,24.066375442886354,24.3827664704895,24.14249544288635Q24.1989964704895,24.218615442886353,24.000086470489503,24.218615442886353Q23.801166470489502,24.218615442886353,23.617396470489503,24.14249544288635Q23.4336264704895,24.066375442886354,23.292976470489503,23.925725442886353L21.0001264704895,21.632875442886352L18.707486470489503,23.925505442886355L18.7072564704895,23.925745442886353Q18.5665964704895,24.066395442886353,18.3828264704895,24.142515442886353Q18.199056470489502,24.218635442886352,18.0001464704895,24.218635442886352Q17.801236470489503,24.218635442886352,17.617461470489502,24.142515442886353Q17.433690470489502,24.066395442886353,17.293038470489503,23.925745442886353Q17.152386470489503,23.78509544288635,17.0762664704895,23.601325442886353Q17.000145470489503,23.417555442886353,17.000145470489503,23.218635442886352Q17.000145470489503,23.019725442886354,17.076265470489503,22.835955442886352Q17.152386470489503,22.652185442886353,17.293038470489503,22.511535442886352L17.2932754704895,22.511295442886354L19.5859164704895,20.21865544288635Z" fill-rule="evenodd" fill="${color}" fill-opacity="1"/></g></g></g></svg>`;
+        },
+        toSvgCssBackground(svgString) {
+            let res = svgString;
+            res = svgString
+                .replace('<svg', ~svgString.indexOf('xmlns')
+                ? '<svg'
+                : '<svg xmlns="http://www.w3.org/2000/svg"')
+                .replace(/"/g, "'")
+                .replace(/%/g, '%25')
+                .replace(/#/g, '%23')
+                .replace(/{/g, '%7B')
+                .replace(/}/g, '%7D')
+                .replace(/</g, '%3C')
+                .replace(/>/g, '%3E')
+                .replace(/\s+/g, ' ');
+            const imageBase64Src = `url("data:image/svg+xml,${res}")`;
+            const ret = `
+          -webkit-mask-image: ${imageBase64Src};
+          -webkit-mask-size: contain;
+          mask-image: ${imageBase64Src};
+          mask-size: contain;
+          width: 40px;
+          height: 40px;
+          background-repeat: no-repeat
+      `;
+            return ret;
+            // return `background-image: url("data:image/svg+xml,${res}"); width: 40px; height: 40px; background-repeat: no-repeat;`;
+        },
+    },
+});

package/dist/custom-keyboard/index.json

@@ -0,0 +1,9 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-popup": "../popup/index",
+    "van-image": "../image/index",
+    "van-button": "../button/index",
+    "van-icon": "../icon/index"
+  }
+}