@blueking/bkui-form 0.0.42-beta.11 → 0.0.42-beta.13

package/dist/bkui-form.css

@@ -81,7 +81,10 @@
   font-weight: 600;
   color: #63656E;
 }
-
+.bk-schema-form .bk-schema-form-group .has-desc{
+  border-bottom: 1px dashed #979ba5;
+  cursor: pointer;
+}
 .bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.default {
   display: inline-block;
   margin-bottom: 10px;

package/dist/controller/form-vue2.d.ts

@@ -1,15 +1,17 @@
 import { IFormOption } from '@/@types';
 import Vue from 'vue';
 import './form-vue2.css';
+import { WidgetTree } from '@/core/widgetTree';
 export default function createForm<T>(opts?: Partial<IFormOption<T>>): import("vue/types/vue").ExtendedVue<Vue<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue<Record<string, any>, Record<string, any>, never, never, any>>, {
     rootData: {};
     formKey: string;
+    widgetTree: WidgetTree;
 }, {
     initFormData(): void;
     emitFormValueChange(newValue: any, oldValue: any): void;
-    validateForm: () => boolean;
-    validateFormItem: (path: string) => import("@/@types").IValidateResult;
-    validate: () => Promise<import("@/@types").IValidateResult[]>;
+    validateForm(): boolean;
+    validateFormItem(path: string): import("@/@types").IValidateResult;
+    validate(): Promise<import("@/@types").IValidateResult[]>;
     validateSchema: (schema: import("ajv").AnySchema) => Promise<unknown>;
 }, unknown, {
     value: any;

package/dist/core/reaction.d.ts

@@ -1,4 +1,5 @@
 import { IReaction } from '../@types';
-export declare const reactionRegister: (path: string, reactions?: Array<IReaction>) => void;
+import { WidgetTree } from './widgetTree';
+export declare const reactionRegister: (path: string, reactions: IReaction[] | undefined, widgetTree: WidgetTree) => void;
 export declare const reactionUnRegister: (path: string) => void;
 export declare const reactionDispatch: (path: string, typeName: string) => void;

package/dist/core/validator.d.ts

@@ -1,5 +1,6 @@
 import Ajv, { AnySchema } from 'ajv';
 import { IRules, IValidateResult } from '@/@types';
+import { WidgetTree } from './widgetTree';
 export declare const ajv: Ajv;
 export declare const DEFAULT_RULES: {
     required: {
@@ -12,23 +13,23 @@ export declare const DEFAULT_RULES: {
  * @param rules
  */
 export declare const registryGlobalRules: (rules: IRules) => void;
-export declare const setWidgetErrorTips: (path: string, isError: Boolean, errorMsg: any) => void;
+export declare const setWidgetErrorTips: (path: string, isError: Boolean, errorMsg: any, widgetTree: WidgetTree) => void;
 /**
  * 校验单个表单项
  * @param path 字段路径
  */
-export declare const validateFormItem: (path: string) => IValidateResult;
+export declare const validateFormItem: (path: string, widgetTree: WidgetTree) => IValidateResult;
 /**
  * 校验整个表单
  */
-export declare const validateForm: () => boolean;
+export declare const validateForm: (widgetTree: WidgetTree) => boolean;
 /**
  * 校验表单（抛出具体错误信息）
  */
-export declare const validateFormWithResult: () => Promise<IValidateResult[]>;
+export declare const validateFormWithResult: (widgetTree: WidgetTree) => Promise<IValidateResult[]>;
 export declare const validateSchema: (schema: AnySchema) => Promise<unknown>;
 /**
  * 触发校验
  * @param path 字段路径
  */
-export declare const dispatchValidate: (path: string) => IValidateResult;
+export declare const dispatchValidate: (path: string, widgetTree: WidgetTree) => IValidateResult;

package/dist/core/widgetTree.d.ts

@@ -36,5 +36,4 @@ export declare class WidgetTree {
     addWidgetNode(path: string, instance: any, type: 'node' | 'group', index?: number): void;
     removeWidgetNode(path: string, instance: any): void;
 }
-declare const _default: WidgetTree;
-export default _default;
+export {};

package/dist/types/bkui-form.d.ts

@@ -32,18 +32,58 @@ interface IValidateResult {
   path: string
 }
 
-var css_248z = ".bk-schema-form .mr24 {\n  margin-right: 24px;\n}\n\n.bk-schema-form .bk-form-item {\n  margin-top: unset !important;\n}\n\n.bk-schema-form .bk-form-item .bk-form-content .group-text {\n  background-color: #f2f4f8;\n  height: 100%;\n}\n\n.bk-schema-form .bk-form-item .bk-select {\n  background-color: #fff;\n}\n\n.bk-schema-form .bk-form-item .bk-select.is-disabled {\n  background-color: #fafbfd;\n}\n\n.bk-schema-form .bk-schema-form-group.normal {\n  padding: 24px;\n  position: relative;\n}\n\n.bk-schema-form .bk-schema-form-group.card{\n  background: #fff;\n  padding: 0 24px 24px 24px;\n  border-radius: 2px;\n}\n\n.bk-schema-form .bk-schema-form-group.hide-empty-row .bk-schema-form-group-content {\n  row-gap: 0 !important;\n}\n\n.bk-schema-form .bk-schema-form-group.hide-empty-row .bk-schema-form-group-content .bk-form-item {\n  margin-bottom: 20px;\n}\n\n.bk-schema-form-group--error{\n  border-color: #f5222d !important;\n}\n\n.bk-schema-form-group__error-tips{\n  position: relative;\n  display: block;\n  width: 10px;\n  height: 10px;\n}\n\n.bk-schema-form-group__error-tips-popover {\n  position: absolute;\n  top: -5px;\n  left: 0;\n  z-index: 1;\n  background: #fff;\n  border: 1px solid #f5222d;\n  color: #f5222d;\n  font-size: 12px;\n  margin-left: 10px;\n  font-weight: normal;\n  padding: 5px 10px;\n  border-radius: 2px;\n  max-height: 50px;\n  overflow:hidden;\n}\n\n.bk-schema-form-group__error-tips-popover:hover {\n  max-height: unset;\n}\n\n.bk-schema-form-group__error-tips-popover > p {\n  padding: 0;\n  margin: 0;\n  white-space: nowrap;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: #63656E;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.default {\n  display: inline-block;\n  margin-bottom: 10px;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.normal {\n  position: absolute;\n  top: -1em;\n  left:  10px;\n  line-height: 2em;\n  padding: 0 0.5em;\n  background: #fff;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.card{\n  display: flex;\n  height: 50px;\n  align-items: center;\n  padding: 0 24px;\n  margin: 0 -24px 8px -24px;\n}\n\n.bk-schema-form .bk-collapse.normal .bk-collapse-item .bk-collapse-item-header {\n  height: 54px;\n  padding: 0;\n}\n\n.bk-schema-form .bk-collapse.normal .bk-collapse-item .bk-collapse-item-content {\n  background: #f5f7fa;\n  padding: 0 34px 16px 34px;\n}\n\n.bk-schema-form .bk-schema-form-group-add {\n  font-size: 14px;\n  color: #3a84ff;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n}\n\n.bk-schema-form .bk-schema-form-group-add.disabled {\n  color: #c4c6cc;\n  cursor: not-allowed;\n}\n\n.bk-schema-form .bk-schema-form-group-add.readonly {\n  color: #c4c6cc;\n}\n\n.bk-schema-form .bk-schema-form-group-delete {\n  position: absolute;\n  cursor: pointer;\n  color: #979bA5;\n}\n\n.bk-schema-form .bk-schema-form-group-delete.disabled {\n  color: #c4c6cc;\n  cursor: not-allowed;\n}\n\n.bk-schema-form .bk-schema-form-group-delete.readonly {\n  color: #c4c6cc;\n}\n\n.bk-schema-form .bk-schema-form-group-delete:hover {\n  color: #3a84ff;\n}\n\n.bk-schema-form-item__error-tips {\n  color: #f5222d;\n  font-size: 12px;\n  margin-top: 5px;\n  margin: 0;\n  line-height: 1.5em;\n}\n\n.bk-schema-form-item--error input,\n.bk-schema-form-item--error .bk-textarea-wrapper,\n.bk-schema-form-item--error .bk-select {\n  border: 1px solid #f5222d;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-form-unit-input .bk-textarea-wrapper {\n  min-height: 32px;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-form-unit-input textarea {\n  min-height: 30px;\n}\n\n.bk-schema-form .bk-schema-form-item-auto-height .bk-form-content {\n  min-height: auto;\n  line-height: 1;\n}\n\n.bk-schema-form .table-widget-actions .action-btn {\n  margin-right: 8px;\n  font-size: 14px;\n  cursor: pointer;\n}\n.bk-schema-form .table-widget-actions .action-btn:hover {\n  color: #3a84ff;\n}\n.bk-schema-form .is-disabled .action-btn {\n  color: #dcdee5 !important;\n  cursor: not-allowed;\n}\n.bk-schema-form .bk-table-fixed-right {\n  height: 100% !important;\n  border-bottom: 1px solid #dfe0e5;\n}";
+var css_248z = ".bk-schema-form .mr24 {\n  margin-right: 24px;\n}\n\n.bk-schema-form .bk-form-item {\n  margin-top: unset !important;\n}\n\n.bk-schema-form .bk-form-item .bk-form-content .group-text {\n  background-color: #f2f4f8;\n  height: 100%;\n}\n\n.bk-schema-form .bk-form-item .bk-select {\n  background-color: #fff;\n}\n\n.bk-schema-form .bk-form-item .bk-select.is-disabled {\n  background-color: #fafbfd;\n}\n\n.bk-schema-form .bk-schema-form-group.normal {\n  padding: 24px;\n  position: relative;\n}\n\n.bk-schema-form .bk-schema-form-group.card{\n  background: #fff;\n  padding: 0 24px 24px 24px;\n  border-radius: 2px;\n}\n\n.bk-schema-form .bk-schema-form-group.hide-empty-row .bk-schema-form-group-content {\n  row-gap: 0 !important;\n}\n\n.bk-schema-form .bk-schema-form-group.hide-empty-row .bk-schema-form-group-content .bk-form-item {\n  margin-bottom: 20px;\n}\n\n.bk-schema-form-group--error{\n  border-color: #f5222d !important;\n}\n\n.bk-schema-form-group__error-tips{\n  position: relative;\n  display: block;\n  width: 10px;\n  height: 10px;\n}\n\n.bk-schema-form-group__error-tips-popover {\n  position: absolute;\n  top: -5px;\n  left: 0;\n  z-index: 1;\n  background: #fff;\n  border: 1px solid #f5222d;\n  color: #f5222d;\n  font-size: 12px;\n  margin-left: 10px;\n  font-weight: normal;\n  padding: 5px 10px;\n  border-radius: 2px;\n  max-height: 50px;\n  overflow:hidden;\n}\n\n.bk-schema-form-group__error-tips-popover:hover {\n  max-height: unset;\n}\n\n.bk-schema-form-group__error-tips-popover > p {\n  padding: 0;\n  margin: 0;\n  white-space: nowrap;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: #63656E;\n}\n.bk-schema-form .bk-schema-form-group .has-desc{\n  border-bottom: 1px dashed #979ba5;\n  cursor: pointer;\n}\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.default {\n  display: inline-block;\n  margin-bottom: 10px;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.normal {\n  position: absolute;\n  top: -1em;\n  left:  10px;\n  line-height: 2em;\n  padding: 0 0.5em;\n  background: #fff;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-schema-form-group-title.card{\n  display: flex;\n  height: 50px;\n  align-items: center;\n  padding: 0 24px;\n  margin: 0 -24px 8px -24px;\n}\n\n.bk-schema-form .bk-collapse.normal .bk-collapse-item .bk-collapse-item-header {\n  height: 54px;\n  padding: 0;\n}\n\n.bk-schema-form .bk-collapse.normal .bk-collapse-item .bk-collapse-item-content {\n  background: #f5f7fa;\n  padding: 0 34px 16px 34px;\n}\n\n.bk-schema-form .bk-schema-form-group-add {\n  font-size: 14px;\n  color: #3a84ff;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n}\n\n.bk-schema-form .bk-schema-form-group-add.disabled {\n  color: #c4c6cc;\n  cursor: not-allowed;\n}\n\n.bk-schema-form .bk-schema-form-group-add.readonly {\n  color: #c4c6cc;\n}\n\n.bk-schema-form .bk-schema-form-group-delete {\n  position: absolute;\n  cursor: pointer;\n  color: #979bA5;\n}\n\n.bk-schema-form .bk-schema-form-group-delete.disabled {\n  color: #c4c6cc;\n  cursor: not-allowed;\n}\n\n.bk-schema-form .bk-schema-form-group-delete.readonly {\n  color: #c4c6cc;\n}\n\n.bk-schema-form .bk-schema-form-group-delete:hover {\n  color: #3a84ff;\n}\n\n.bk-schema-form-item__error-tips {\n  color: #f5222d;\n  font-size: 12px;\n  margin-top: 5px;\n  margin: 0;\n  line-height: 1.5em;\n}\n\n.bk-schema-form-item--error input,\n.bk-schema-form-item--error .bk-textarea-wrapper,\n.bk-schema-form-item--error .bk-select {\n  border: 1px solid #f5222d;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-form-unit-input .bk-textarea-wrapper {\n  min-height: 32px;\n}\n\n.bk-schema-form .bk-schema-form-group .bk-form-unit-input textarea {\n  min-height: 30px;\n}\n\n.bk-schema-form .bk-schema-form-item-auto-height .bk-form-content {\n  min-height: auto;\n  line-height: 1;\n}\n\n.bk-schema-form .table-widget-actions .action-btn {\n  margin-right: 8px;\n  font-size: 14px;\n  cursor: pointer;\n}\n.bk-schema-form .table-widget-actions .action-btn:hover {\n  color: #3a84ff;\n}\n.bk-schema-form .is-disabled .action-btn {\n  color: #dcdee5 !important;\n  cursor: not-allowed;\n}\n.bk-schema-form .bk-table-fixed-right {\n  height: 100% !important;\n  border-bottom: 1px solid #dfe0e5;\n}";
 styleInject(css_248z);
 
+interface INodeConfig {
+    id: string;
+    type: 'node' | 'group';
+    index?: number;
+    instance: any;
+    parent: WidgetNode | null;
+    children: WidgetNode[];
+}
+declare class WidgetNode {
+    id: string;
+    instance: any;
+    parent: WidgetNode | null;
+    type: 'node' | 'group';
+    index?: number;
+    children: WidgetNode[];
+    constructor(config: INodeConfig);
+    get value(): any;
+    get isChildrenVisible(): any;
+    /**
+     * 获取 parents
+     */
+    get parents(): any[];
+    get firstChild(): WidgetNode;
+    get lastChild(): WidgetNode;
+    getSibling(lastProp: string): WidgetNode | undefined;
+    getSiblings(): WidgetNode[];
+    /**
+     * 是否是叶子节点
+     */
+    get isLeaf(): boolean;
+    appendChild(node: WidgetNode): WidgetNode[] | (WidgetNode & any[]);
+    removeChild(node: WidgetNode): WidgetNode[] | (WidgetNode & any[]);
+}
+declare class WidgetTree {
+    widgetMap: Record<string, WidgetNode>;
+    addWidgetNode(path: string, instance: any, type: 'node' | 'group', index?: number): void;
+    removeWidgetNode(path: string, instance: any): void;
+}
+
 declare function createForm<T>(opts?: Partial<IFormOption<T>>): vue_types_vue.ExtendedVue<Vue__default<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue__default<Record<string, any>, Record<string, any>, never, never, any>>, {
     rootData: {};
     formKey: string;
+    widgetTree: WidgetTree;
 }, {
     initFormData(): void;
     emitFormValueChange(newValue: any, oldValue: any): void;
-    validateForm: () => boolean;
-    validateFormItem: (path: string) => IValidateResult;
-    validate: () => Promise<IValidateResult[]>;
+    validateForm(): boolean;
+    validateFormItem(path: string): IValidateResult;
+    validate(): Promise<IValidateResult[]>;
     validateSchema: (schema: ajv.AnySchema) => Promise<unknown>;
 }, unknown, {
     value: any;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.42-beta.11",
+  "version": "0.0.42-beta.13",
   "main": "dist/bkui-form-umd-min.js",
   "name": "@blueking/bkui-form",
   "scripts": {