@blueking/bkui-form 1.0.1-beta.3 → 1.0.1-beta.5

package/esm/adapter/widget/Widget.ts.js

@@ -1,497 +0,0 @@
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
-    try {
-        var info = gen[key](arg);
-        var value = info.value;
-    } catch (error) {
-        reject(error);
-        return;
-    }
-    if (info.done) {
-        resolve(value);
-    } else {
-        Promise.resolve(value).then(_next, _throw);
-    }
-}
-function _async_to_generator(fn) {
-    return function() {
-        var self = this, args = arguments;
-        return new Promise(function(resolve, reject) {
-            var gen = fn.apply(self, args);
-            function _next(value) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
-            }
-            function _throw(err) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
-            }
-            _next(undefined);
-        });
-    };
-}
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
-function _object_without_properties(source, excluded) {
-    if (source == null) return {};
-    var target = _object_without_properties_loose(source, excluded);
-    var key, i;
-    if (Object.getOwnPropertySymbols) {
-        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-        for(i = 0; i < sourceSymbolKeys.length; i++){
-            key = sourceSymbolKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-        }
-    }
-    return target;
-}
-function _object_without_properties_loose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-    for(i = 0; i < sourceKeys.length; i++){
-        key = sourceKeys[i];
-        if (excluded.indexOf(key) >= 0) continue;
-        target[key] = source[key];
-    }
-    return target;
-}
-import Schema from '../../core/schema.ts.js';
-import register from '../../core/register.ts.js';
-import { defineComponent, h, withDirectives } from 'vue';
-import { deepEquals, isObj, mergeDeep } from '../../util/index.ts.js';
-import props from '../field/FieldProps.ts.js';
-import Path from '../../core/path.ts.js';
-import { reactionRegister, reactionDispatch, reactionUnRegister } from '../../core/reaction.ts.js';
-import { executeExpression } from '../../core/expression.ts.js';
-import { dispatchValidate } from '../../core/validator.ts.js';
-import events from '../../core/events.ts.js';
-import request from '../../util/fetch.ts.js';
-import widgetTree from '../../core/widgetTree.ts.js';
-import { capitalizeFirstLetter } from '../../util/index.ts.js';
-import { bkTooltips } from 'bkui-vue';
-export default defineComponent({
-    name: 'Widget',
-    inheritAttrs: false,
-    props,
-    data () {
-        return {
-            loading: false,
-            datasource: Schema.resolveDefaultDatasource(this.schema),
-            formItemProps: {
-                tips: '',
-                label: ''
-            },
-            state: {
-                visible: this.visible,
-                disabled: this.disabled,
-                readonly: this.readonly,
-                error: this.error
-            },
-            errorTips: '',
-            privateSchema: {},
-            key: ''
-        };
-    },
-    computed: {
-        widgetMap () {
-            return widgetTree.widgetMap;
-        },
-        widgetNode () {
-            return widgetTree.widgetMap[this.path];
-        },
-        parent () {
-            var _this_widgetNode;
-            return (_this_widgetNode = this.widgetNode) === null || _this_widgetNode === void 0 ? void 0 : _this_widgetNode.parent;
-        },
-        // 当前widget schema数据
-        widgetSchema () {
-            return mergeDeep({}, this.schema, this.privateSchema);
-        },
-        // 兼容以前数据结构
-        value () {
-            return this.modelValue;
-        }
-    },
-    watch: {
-        modelValue: {
-            handler (newValue, oldValue) {
-                if (!deepEquals(newValue, oldValue)) {
-                    setTimeout(()=>{
-                        reactionDispatch(this.path, 'valChange');
-                        dispatchValidate(this.path);
-                    }, 0);
-                }
-            }
-        },
-        widgetSchema: {
-            deep: true,
-            handler (newValue, oldValue) {
-                if (deepEquals(newValue, oldValue)) return;
-                this.resetDatasource();
-                this.key = new Date().getTime().toString();
-            }
-        }
-    },
-    created () {
-        // 表单项配置
-        const uiOptions = Schema.getUiOptions(this.widgetSchema);
-        this.formItemProps = _object_spread_props(_object_spread({}, uiOptions), {
-            // schema配置不存在title时默认用属性名作为title
-            label: uiOptions.showTitle ? uiOptions.label || Path.getPathLastProp(this.path) : '',
-            required: this.required
-        });
-        // 设置widget初始化状态 ui:component优先级 > ui:props优先级
-        const vNodeData = Schema.getUiComponent(this.widgetSchema);
-        const defaultProps = Object.assign({}, this.formItemProps, vNodeData || {});
-        Object.keys(defaultProps).forEach((key)=>{
-            if (Reflect.has(this.state, key)) {
-                this.setState(key, defaultProps[key]);
-            }
-        });
-        // 注册widget TreeNode
-        widgetTree.addWidgetNode(this.path, this, 'node');
-    },
-    mounted () {
-        // 注册联动
-        reactionRegister(this.path, this.widgetSchema['ui:reactions']);
-        // 首次联动
-        reactionDispatch(this.path, 'valChange');
-        reactionDispatch(this.path, 'lifetime/init');
-    },
-    beforeUnmount () {
-        widgetTree.removeWidgetNode(this.path, this);
-        reactionUnRegister(this.path);
-    },
-    methods: {
-        setState (key, value) {
-            if (Reflect.has(this.state, key)) {
-                this.state[key] = value;
-            } else if (key === 'value') {
-                // 特殊处理value设置
-                this.$emit('update:modelValue', {
-                    path: this.path,
-                    value
-                });
-            } else {
-                console.warn(`Widget unsupported ${key} state, please check`);
-            }
-        },
-        loadDataSource () {
-            return _async_to_generator(function*() {
-                var _this_widgetSchema_uicomponent, _this_widgetSchema;
-                const xhrConfig = (_this_widgetSchema = this.widgetSchema) === null || _this_widgetSchema === void 0 ? void 0 : (_this_widgetSchema_uicomponent = _this_widgetSchema['ui:component']) === null || _this_widgetSchema_uicomponent === void 0 ? void 0 : _this_widgetSchema_uicomponent.remoteConfig;
-                if (xhrConfig) {
-                    const { url, params } = xhrConfig, reset = _object_without_properties(xhrConfig, [
-                        "url",
-                        "params"
-                    ]);
-                    const { request: http = request, responseParse } = this.httpAdapter;
-                    try {
-                        this.loading = true;
-                        const remoteURL = executeExpression(url, this);
-                        const requestParams = isObj(params) ? executeExpression(params, this) : params;
-                        this.datasource = yield http(remoteURL, _object_spread_props(_object_spread({}, reset), {
-                            params: requestParams,
-                            responseParse
-                        }));
-                        this.loading = false;
-                    } catch (e) {
-                        this.loading = false;
-                        console.error(e);
-                    }
-                }
-            }).apply(this);
-        },
-        setErrorTips (tips) {
-            this.errorTips = tips;
-        },
-        getValue (path) {
-            return Path.getPathVal(this.rootData, path);
-        },
-        getReadonlyValue () {
-            var _this_widgetSchema_uicomponent;
-            let val = this.modelValue;
-            if (((_this_widgetSchema_uicomponent = this.widgetSchema['ui:component']) === null || _this_widgetSchema_uicomponent === void 0 ? void 0 : _this_widgetSchema_uicomponent.type) === 'password') {
-                val = '******';
-            } else if (this.datasource) {
-                var _this_datasource;
-                const item = (_this_datasource = this.datasource) === null || _this_datasource === void 0 ? void 0 : _this_datasource.find((item)=>item.value === this.modelValue);
-                if (item) {
-                    val = item.label;
-                }
-            }
-            let value = val === '' ? '--' : val;
-            if (Object.prototype.toString.call(value) === '[Object Object]') {
-                value = JSON.stringify(value);
-            } else if (Array.isArray(value)) {
-                const isTrue = value.some((item)=>item && typeof item === 'object');
-                if (isTrue) {
-                    value = JSON.stringify(value);
-                } else {
-                    value = value.join(',');
-                }
-            } else {
-                value = String(value);
-            }
-            return value;
-        },
-        getSchema () {
-            return this.widgetSchema;
-        },
-        setSchema (data) {
-            try {
-                this.privateSchema = JSON.parse(JSON.stringify(data));
-            } catch (err) {
-                console.warn(err);
-            }
-            return this.widgetSchema;
-        },
-        resetDatasource () {
-            var _this_widgetSchema_uicomponent, _this_widgetSchema;
-            const xhrConfig = (_this_widgetSchema = this.widgetSchema) === null || _this_widgetSchema === void 0 ? void 0 : (_this_widgetSchema_uicomponent = _this_widgetSchema['ui:component']) === null || _this_widgetSchema_uicomponent === void 0 ? void 0 : _this_widgetSchema_uicomponent.remoteConfig;
-            if (xhrConfig) {
-                this.loadDataSource();
-            } else {
-                this.datasource = Schema.resolveDefaultDatasource(this.widgetSchema);
-            }
-        },
-        // 获取 schema 中定义的默认值
-        getDefaultValue () {
-            return Schema.getSchemaDefaultValue(this.widgetSchema);
-        },
-        // 恢复默认值
-        resetToDefault () {
-            const defaultValue = this.getDefaultValue();
-            this.$emit('update:modelValue', {
-                path: this.path,
-                value: defaultValue
-            });
-        },
-        // 判断当前值是否与默认值相同
-        isDefaultValue () {
-            const defaultValue = this.getDefaultValue();
-            return deepEquals(this.modelValue, defaultValue);
-        }
-    },
-    render () {
-        var _events_callbacks, _this_$slots_default, _this_$slots;
-        const _Schema_getUiComponent = Schema.getUiComponent(this.widgetSchema), { name } = _Schema_getUiComponent, uiVnodeData = _object_without_properties(_Schema_getUiComponent, [
-            "name"
-        ]);
-        // 注意顺序！！！
-        const widgetProps = _object_spread_props(_object_spread({}, this.$props), {
-            loading: this.loading,
-            modelValue: this.modelValue
-        });
-        const self = this;
-        const widgetName = register.getComponent(name) || name || Schema.getDefaultWidget(this.widgetSchema);
-        const widgetEvents = ((_events_callbacks = events.callbacks) === null || _events_callbacks === void 0 ? void 0 : _events_callbacks[this.path]) || {};
-        // 渲染表单项
-        const renderFormItem = ()=>{
-            var _this_widgetSchema_uicomponent;
-            return this.state.readonly && this.readonlyMode === 'value' && ((_this_widgetSchema_uicomponent = this.widgetSchema['ui:component']) === null || _this_widgetSchema_uicomponent === void 0 ? void 0 : _this_widgetSchema_uicomponent.name) !== 'table' ? renderReadonlyWidget : renderWidget;
-        };
-        var _this_$slots_default1;
-        // 渲染表单控件（当前state属性优先级最高）
-        const renderWidget = (_this_$slots_default1 = (_this_$slots_default = (_this_$slots = this.$slots).default) === null || _this_$slots_default === void 0 ? void 0 : _this_$slots_default.call(_this_$slots, {
-            path: this.path
-        })) !== null && _this_$slots_default1 !== void 0 ? _this_$slots_default1 : h(widgetName, mergeDeep(_object_spread_props(_object_spread({}, widgetProps, uiVnodeData || {}, Object.keys(widgetEvents).reduce((pre, key)=>{
-            pre[`on${capitalizeFirstLetter(key)}`] = widgetEvents[key];
-            return pre;
-        }, {})), {
-            schema: this.widgetSchema,
-            onClick () {
-                var _widgetEvents_click;
-                reactionDispatch(self.path, 'effect/click');
-                (_widgetEvents_click = widgetEvents.click) === null || _widgetEvents_click === void 0 ? void 0 : _widgetEvents_click.forEach((event)=>event());
-            },
-            'onUpdate:modelValue': (value)=>{
-                var _widgetEvents_updatemodelValue;
-                // 所有组件widget必须实现input事件，用于v-model时更新表单数据
-                self.$emit('update:modelValue', {
-                    path: self.path,
-                    value
-                });
-                (_widgetEvents_updatemodelValue = widgetEvents['update:modelValue']) === null || _widgetEvents_updatemodelValue === void 0 ? void 0 : _widgetEvents_updatemodelValue.forEach((event)=>event());
-            }
-        }), uiVnodeData, _object_spread_props(_object_spread({}, this.state), {
-            datasource: this.datasource,
-            readonly: this.readonly,
-            readonlyMode: this.readonlyMode
-        })));
-        const renderSuffix = ()=>{
-            var _this_$slots_suffix, _this_$slots;
-            return (_this_$slots_suffix = (_this_$slots = this.$slots).suffix) === null || _this_$slots_suffix === void 0 ? void 0 : _this_$slots_suffix.call(_this_$slots, {
-                path: this.path,
-                schema: this.widgetSchema
-            });
-        };
-        // 渲染默认readonly模式
-        const renderReadonlyWidget = h('div', {}, {
-            default: ()=>this.getReadonlyValue()
-        });
-        // 渲染删除按钮（用于数组类型widget删除）
-        const renderDelete = ()=>{
-            if (!this.removeable) return null;
-            return h('span', {
-                class: [
-                    'bk-schema-form-group-delete'
-                ],
-                onClick: ()=>{
-                    self.$emit('remove', self.path);
-                }
-            }, [
-                h('i', {
-                    class: [
-                        'bk-form-icon icon-close3-shape'
-                    ]
-                })
-            ]);
-        };
-        // 渲染恢复默认值按钮
-        const renderResetDefault = ()=>{
-            var _this_widgetSchema_uiprops;
-            // 优先使用 schema 中的配置，否则使用全局配置
-            const schemaShowResetDefault = (_this_widgetSchema_uiprops = this.widgetSchema['ui:props']) === null || _this_widgetSchema_uiprops === void 0 ? void 0 : _this_widgetSchema_uiprops.showResetDefault;
-            const showResetDefault = schemaShowResetDefault !== undefined ? schemaShowResetDefault : this.showResetDefault;
-            // 不显示恢复默认值按钮，或者当前值已经是默认值
-            if (!showResetDefault || this.isDefaultValue() || this.state.readonly || this.state.disabled) {
-                return null;
-            }
-            return withDirectives(h('span', {
-                class: [
-                    'bk-schema-form-reset-default',
-                    'bk-form-icon icon-reset'
-                ],
-                onClick: ()=>{
-                    self.resetToDefault();
-                }
-            }), [
-                [
-                    bkTooltips,
-                    {
-                        content: '恢复默认值'
-                    }
-                ]
-            ]);
-        };
-        // 渲染错误提示
-        const renderError = ()=>this.state.error ? h('p', {
-                class: 'bk-schema-form-item__error-tips'
-            }, {
-                default: ()=>this.errorTips
-            }) : null;
-        // 渲染表单提示
-        const renderFormTips = ()=>this.formItemProps.tips ? h('p', {
-                class: [
-                    'mt5',
-                    'mb0',
-                    'f12'
-                ],
-                style: {
-                    color: '#5e6d82',
-                    lineHeight: '1.5em'
-                }
-            }, {
-                default: ()=>this.formItemProps.tips
-            }) : null;
-        // 渲染 label 插槽内容（包含 label 文本和重置按钮）
-        const renderLabel = ()=>{
-            const labelText = this.formItemProps.label;
-            const { description } = this.widgetSchema;
-            if (description) {
-                return [
-                    withDirectives(h('span', {
-                        class: {
-                            'bk-schema-form-label-description': description
-                        }
-                    }, labelText), [
-                        [
-                            bkTooltips,
-                            {
-                                content: description,
-                                disabled: !description
-                            }
-                        ]
-                    ]),
-                    renderResetDefault()
-                ];
-            }
-            return [
-                labelText,
-                renderResetDefault()
-            ];
-        };
-        return h(register.getBaseWidget('form-item'), _object_spread_props(_object_spread({
-            key: this.key
-        }, this.formItemProps), {
-            style: _object_spread_props(_object_spread({}, this.layout.item || {}, this.layout.container || {}), {
-                // 表单项显示和隐藏状态
-                display: this.state.visible ? '' : 'none'
-            }),
-            class: {
-                'bk-schema-form-item--error': this.state.error
-            }
-        }), {
-            label: renderLabel,
-            default: ()=>[
-                    renderFormItem(),
-                    renderSuffix(),
-                    renderDelete(),
-                    renderError(),
-                    renderFormTips()
-                ]
-        });
-    }
-});

package/esm/assets/fonts/iconcool.svg

@@ -1,53 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-  <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
-  <svg>
-  <metadata>
-  Created by font-carrier
-  </metadata>
-  <defs>
-  <font id="iconfont" horiz-adv-x="1024" vert-adv-y="1024" >
-    <font-face
-      
-      font-family="iconfont"
-      
-      font-weight="400"
-      
-      font-stretch="normal"
-      
-      units-per-em="1024"
-      
-      ascent="812"
-      
-      descent="-212"
-      
-    />
-      <missing-glyph />
-
-      
-      <glyph glyph-name="x" unicode="&#x78;" horiz-adv-x="100"
-        d="M20 20 L50 20 L50 -20 Z" />
-      
-
-      
-      <glyph glyph-name="uniE102" unicode="&#xE102;" d="M128 364H896V236H128V364Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-      <glyph glyph-name="uniE104" unicode="&#xE104;" d="M896 364L576 364 576 684 448 684 448 364 128 364 128 236 448 236 448-84 576-84 576 236 896 236Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-      <glyph glyph-name="uniE105" unicode="&#xE105;" d="M512 748C264 748 64 548 64 300S264-148 512-148 960 52 960 300 760 748 512 748ZM736 268H544V76H480V268H288V332H480V524H544V332H736V268Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-      <glyph glyph-name="uniE106" unicode="&#xE106;" d="M672 588V652C672 687.2 643.2 716 608 716H416C380.8 716 352 687.2 352 652V588H96V524H208V-52C208-87.2 236.8-116 272-116H752C787.2-116 816-87.2 816-52V524H928V588H672ZM416 636C416 645.6 422.4 652 432 652H592C601.6 652 608 645.6 608 636V588H416V636ZM448 60H384V412H448V60ZM640 60H576V412H640V60Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-      <glyph glyph-name="uniE107" unicode="&#xE107;" d="M512 44C505.6 44 498.56 46.56 493.44 52.32L136.96 436.32C128.64 445.28 126.08 459.36 129.92 471.52S144 492 155.52 492H868.48C880 492 889.6 483.68 894.08 471.52S895.36 445.28 887.04 436.32L530.56 52.32C525.44 46.56 518.4 44 512 44Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-      <glyph glyph-name="uniE108" unicode="&#xE108;" d="M999.6664 615.2059C980.5775 622.5955 959.5207 611.8279 952.8297 591.3483L924.4915 506.0519C891.2335 586.4923 838.6898 657.2207 771.7802 710.2143 559.0471 879.118 255.9861 833.0917 96.5838 607.183 19.441 497.8179-13.2266 363.1171 4.8783 227.9942 22.9833 92.2378 90.0896-27.895 193.4059-110.0244 279.9948-178.6415 381.3431-212 481.9043-212 628.9086-212 773.945-141.2716 868.6024-7.2042 910.5192 52.1232 939.0542 118.4179 953.8137 190.202 958.1431 211.5261 945.5484 232.4279 925.8691 237.0727 906.1898 241.7176 886.5105 228.4164 882.1811 207.0923 869.7831 146.4981 845.5776 90.3376 810.1549 40.2999 674.9581-151.1947 417.7498-190.2536 237.0939-46.6855 149.5211 22.7762 92.8447 124.3295 77.4949 239.184 62.1451 353.4052 89.6961 467.2041 155.0313 559.6788 290.0312 751.1734 547.0428 790.4435 727.8954 646.8754 793.4275 594.9375 842.4289 522.9423 868.9959 441.6574L742.8517 494.4398C723.9596 502.2516 702.7059 492.3285 695.2278 472.06 687.7497 451.7916 697.1957 428.9896 716.0879 420.9667L901.8604 343.0598C906.1898 341.1597 910.716 340.3151 915.2423 340.3151 915.8327 340.3151 916.423 340.5263 917.0134 340.5263 918.391 340.3151 919.7685 339.6818 921.1461 339.6818 936.2991 339.6818 950.4682 349.816 955.7816 365.8618L1021.904 564.3237C1028.595 585.2255 1018.7553 607.8164 999.6664 615.2059Z"  horiz-adv-x="1024" vert-adv-y="1024"  />
-
-      
-
-  </font>
-  </defs>
-</svg>

package/esm/assets/style.css

@@ -1,43 +0,0 @@
-@font-face {
-	font-family: "bk-form";
-	src: url("fonts/iconcool.svg#iconcool") format("svg"),
-url("fonts/iconcool.ttf") format("truetype"),
-url("fonts/iconcool.woff") format("woff"),
-url("fonts/iconcool.eot?#iefix") format("embedded-opentype");
-    font-weight: normal;
-    font-style: normal;
-}
-
-.bk-form-icon {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  font-family: 'bk-form' !important;
-  speak: none;
-  font-style: normal;
-  font-weight: normal;
-  font-variant: normal;
-  text-transform: none;
-  line-height: 1;
-  text-align: center;
-  /* Better Font Rendering =========== */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-minus-line:before {
-	content: "\e102";
-}
-.icon-plus-line:before {
-	content: "\e104";
-}
-.icon-plus-circle-shape:before {
-	content: "\e105";
-}
-.icon-close3-shape:before {
-	content: "\e106";
-}
-.icon-down-shape:before {
-	content: "\e107";
-}
-.icon-reset:before {
-	content: "\e108";
-}