bkui-vue 0.0.1-beta.23 → 0.0.1-beta.24

package/lib/transfer/index.d.ts

@@ -23,5 +23,329 @@
  * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
  * IN THE SOFTWARE.
  */
-import Transfer from './transfer';
+declare const Transfer: {
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            title: string[];
+            extCls: string;
+            displayKey: string;
+            sortable: boolean;
+            settingKey: string;
+            searchPlaceholder: string;
+            showOverflowTips: boolean;
+            searchable: boolean;
+            sortKey: string;
+            sourceList: unknown[];
+            targetList: unknown[];
+            emptyContent: string[];
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            title: {
+                type: import("vue").PropType<string[]>;
+                default: () => any[];
+            };
+            extCls: {
+                type: StringConstructor;
+                default: string;
+            };
+            searchPlaceholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            settingKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            displayKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            sortKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            showOverflowTips: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            searchable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            sortable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            sourceList: {
+                type: ArrayConstructor;
+                default: () => any[];
+            };
+            targetList: {
+                type: ArrayConstructor;
+                default: () => any[];
+            };
+            emptyContent: {
+                type: import("vue").PropType<string[]>;
+                default: () => any[];
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "extCls" | "displayKey" | "sortable" | "settingKey" | "searchPlaceholder" | "showOverflowTips" | "searchable" | "sortKey" | "sourceList" | "targetList" | "emptyContent">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $emit: (event: "change", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            title: {
+                type: import("vue").PropType<string[]>;
+                default: () => any[];
+            };
+            extCls: {
+                type: StringConstructor;
+                default: string;
+            };
+            searchPlaceholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            settingKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            displayKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            sortKey: {
+                type: StringConstructor;
+                default: string;
+            };
+            showOverflowTips: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            searchable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            sortable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            sourceList: {
+                type: ArrayConstructor;
+                default: () => any[];
+            };
+            targetList: {
+                type: ArrayConstructor;
+                default: () => any[];
+            };
+            emptyContent: {
+                type: import("vue").PropType<string[]>;
+                default: () => any[];
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+        }, {
+            keyword: import("vue").Ref<string>;
+            transferRef: any;
+            dataList: import("vue").Ref<any[]>;
+            allToRight: () => void;
+            allToLeft: () => void;
+            displayDataList: import("vue").ComputedRef<any[]>;
+            displayCode: import("vue").ComputedRef<string>;
+            leftHoverIndex: import("vue").Ref<number>;
+            rightHoverIndex: import("vue").Ref<number>;
+            handleItemMouseEvent: (type: any, event: any, isLeft: any, index: any) => void;
+            handleItemClick: (event: any, index: any, isLeft: any) => void;
+            hasSelectedList: import("vue").Ref<any[]>;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], string, {
+            title: string[];
+            extCls: string;
+            displayKey: string;
+            sortable: boolean;
+            settingKey: string;
+            searchPlaceholder: string;
+            showOverflowTips: boolean;
+            searchable: boolean;
+            sortKey: string;
+            sourceList: unknown[];
+            targetList: unknown[];
+            emptyContent: string[];
+        }> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        title: {
+            type: import("vue").PropType<string[]>;
+            default: () => any[];
+        };
+        extCls: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        settingKey: {
+            type: StringConstructor;
+            default: string;
+        };
+        displayKey: {
+            type: StringConstructor;
+            default: string;
+        };
+        sortKey: {
+            type: StringConstructor;
+            default: string;
+        };
+        showOverflowTips: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        searchable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        sortable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        sourceList: {
+            type: ArrayConstructor;
+            default: () => any[];
+        };
+        targetList: {
+            type: ArrayConstructor;
+            default: () => any[];
+        };
+        emptyContent: {
+            type: import("vue").PropType<string[]>;
+            default: () => any[];
+        };
+    }>> & {
+        onChange?: (...args: any[]) => any;
+    } & import("vue").ShallowUnwrapRef<{
+        keyword: import("vue").Ref<string>;
+        transferRef: any;
+        dataList: import("vue").Ref<any[]>;
+        allToRight: () => void;
+        allToLeft: () => void;
+        displayDataList: import("vue").ComputedRef<any[]>;
+        displayCode: import("vue").ComputedRef<string>;
+        leftHoverIndex: import("vue").Ref<number>;
+        rightHoverIndex: import("vue").Ref<number>;
+        handleItemMouseEvent: (type: any, event: any, isLeft: any, index: any) => void;
+        handleItemClick: (event: any, index: any, isLeft: any) => void;
+        hasSelectedList: import("vue").Ref<any[]>;
+    }> & {} & {} & import("vue").ComponentCustomProperties;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: import("vue").PropType<string[]>;
+        default: () => any[];
+    };
+    extCls: {
+        type: StringConstructor;
+        default: string;
+    };
+    searchPlaceholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    settingKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    displayKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    sortKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    showOverflowTips: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    searchable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sortable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sourceList: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    targetList: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    emptyContent: {
+        type: import("vue").PropType<string[]>;
+        default: () => any[];
+    };
+}>> & {
+    onChange?: (...args: any[]) => any;
+}, {
+    keyword: import("vue").Ref<string>;
+    transferRef: any;
+    dataList: import("vue").Ref<any[]>;
+    allToRight: () => void;
+    allToLeft: () => void;
+    displayDataList: import("vue").ComputedRef<any[]>;
+    displayCode: import("vue").ComputedRef<string>;
+    leftHoverIndex: import("vue").Ref<number>;
+    rightHoverIndex: import("vue").Ref<number>;
+    handleItemMouseEvent: (type: any, event: any, isLeft: any, index: any) => void;
+    handleItemClick: (event: any, index: any, isLeft: any) => void;
+    hasSelectedList: import("vue").Ref<any[]>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", {
+    title: string[];
+    extCls: string;
+    displayKey: string;
+    sortable: boolean;
+    settingKey: string;
+    searchPlaceholder: string;
+    showOverflowTips: boolean;
+    searchable: boolean;
+    sortKey: string;
+    sourceList: unknown[];
+    targetList: unknown[];
+    emptyContent: string[];
+}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
 export default Transfer;

package/lib/transfer/index.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("../icon/"),require("../input"),require("../shared")):"function"==typeof define&&define.amd?define(["exports","vue","../icon/","../input","../shared"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Vue,e._,e.Input,e.Shared)}(this,(function(e,t,r,n,o){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=a(n);function l(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s={exports:{}},i={exports:{}};!function(e){e.exports=function(e){if(Array.isArray(e))return e},e.exports.__esModule=!0,e.exports.default=e.exports}(i);var c={exports:{}};!function(e){e.exports=function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a=[],u=!0,l=!1;try{for(r=r.call(e);!(u=(n=r.next()).done)&&(a.push(n.value),!t||a.length!==t);u=!0);}catch(e){l=!0,o=e}finally{try{u||null==r.return||r.return()}finally{if(l)throw o}}return a}},e.exports.__esModule=!0,e.exports.default=e.exports}(c);var f={exports:{}},p={exports:{}};!function(e){e.exports=function(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n},e.exports.__esModule=!0,e.exports.default=e.exports}(p),function(e){var t=p.exports;e.exports=function(e,r){if(e){if("string"==typeof e)return t(e,r);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?t(e,r):void 0}},e.exports.__esModule=!0,e.exports.default=e.exports}(f);var d={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(d),function(e){var t=i.exports,r=c.exports,n=f.exports,o=d.exports;e.exports=function(e,a){return t(e)||r(e,a)||n(e,a)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(s);var v=l(s.exports),h={exports:{}},y={exports:{}};!function(e){var t=p.exports;e.exports=function(e){if(Array.isArray(e))return t(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(y);var x={exports:{}};!function(e){e.exports=function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(x);var g={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(g),function(e){var t=y.exports,r=x.exports,n=f.exports,o=g.exports;e.exports=function(e){return t(e)||r(e)||n(e)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(h);var m=l(h.exports);o.PropTypes.string,o.PropTypes.string,o.PropTypes.string,o.PropTypes.string,o.PropTypes.bool,o.PropTypes.bool,o.PropTypes.string,o.PropTypes.bool;var L=t.defineComponent({name:"Transfer",props:{title:{type:Array,default:function(){return[]}},extCls:{type:String,default:""},searchPlaceholder:{type:String,default:""},settingKey:{type:String,default:"id"},displayKey:{type:String,default:"value"},sortKey:{type:String,default:""},showOverflowTips:{type:Boolean,default:!1},searchable:{type:Boolean,default:!1},sortable:{type:Boolean,default:!1},sourceList:{type:Array,default:function(){return[]}},targetList:{type:Array,default:function(){return[]}},emptyContent:{type:Array,default:function(){return[]}}},emits:["change"],slots:["left-header","right-header","source-option","target-option","left-empty-content","right-empty-content"],setup:function(e,r){var n=r.emit,a=[],u=e.sortKey,l=e.sortable,s=t.ref(""),i=t.ref(null),c=t.ref([]),f=t.ref([]),p=t.ref(-1),d=t.ref(-1),h=t.computed((function(){return e.sourceList&&Array.isArray(e.sourceList)?-1!==e.sourceList.toString().indexOf("[object Object]"):"empty"})),y=t.computed((function(){return h.value?e.settingKey:"index"})),x=t.computed((function(){return h.value?e.displayKey:"value"})),g=t.computed((function(){return s.value?c.value.filter((function(e){return!o.isEmpty(e[x.value])&&String(e[x.value]).indexOf(s.value)>-1})):c.value}));t.watch((function(){return e.sourceList}),(function(){"empty"!==h.value&&(L(),V())}),{deep:!0}),t.watch((function(){return e.targetList}),(function(){L(),V()}),{deep:!0}),t.watch((function(){return[x.value,y.value]}),(function(){L()})),t.watch((function(){return e.sortKey}),(function(e){u=e,V()})),t.watch((function(){return e.sortable}),(function(e){l=e,V()}));var L=function(){"empty"!==h.value&&(h.value?_():b())},b=function(){if(!e.targetList.length||e.targetList.length>e.sourceList.length){for(var t,r=[],o=0;o<e.sourceList.length;o++)r.push({index:o,value:e.sourceList[o]});c.value=[].concat(r),(t=f.value).splice.apply(t,[0,f.value.length].concat([])),n("change",c.value,[],[])}else{for(var a=[],u=[],l=0;l<e.sourceList.length;l++)a.push({index:l,value:e.sourceList[l]});e.targetList.forEach((function(e){var t=a.find((function(t){return t.value===e}));t&&u.push(t)})),f.value=[].concat(u);var s=a.filter((function(e){return u.every((function(t){return t.index!==e.index}))}));c.value=m(s),n("change",c.value,m(w(f.value,!1)),[])}},_=function(){if(!e.targetList.length||e.targetList.length>e.sourceList.length){var t;(t=c.value).splice.apply(t,[0,c.value.length].concat(m(e.sourceList))),f.value=[],n("change",c.value,[],[])}else{var r=e.sourceList.filter((function(t){return e.targetList.every((function(e){return e!==t[y.value]}))})),o=[];e.sourceList.forEach((function(t){e.targetList.forEach((function(e){t[y.value]===e&&o.push(t)}))})),f.value=[].concat(o),c.value=m(r);var a=m(w(f.value));n("change",c.value,f.value,a)}},V=function(){var t=[];if(h.value)l||(u=""),t=m(e.sourceList);else{u=l?"index":"";for(var r=0;r<e.sourceList.length;r++)t.push({index:r,value:e.sourceList[r]})}if(u){var n=[];if(t.forEach((function(e){n.push(e[u])})),(a=[].concat(n)).length===e.sourceList.length){var o=m(c.value);c.value=m(M(o,u,a))}}},S=function(){var e=c.value,t=h.value?f.value:m(w(f.value,!1)),r=h.value?m(w(f.value)):[];n("change",e,t,r)},w=function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],r=[];if(!e.length)return[];var n=m(e);return n.forEach((function(e){if(t)for(var n=0,o=Object.entries(e);n<o.length;n++){var a=v(o[n],2),u=a[0],l=a[1];u===y.value&&r.push(l)}else r.push(e.value)})),r},M=function(e,t,r){var n=r;return e.sort((function(e,r){return n.indexOf(e[t])-n.indexOf(r[t])>=0}))},N=function(e){c.value=c.value.filter((function(t){return t[y.value]!==e[y.value]}))};return"empty"!==h.value&&(h.value?_():b(),V()),{keyword:s,transferRef:i,dataList:c,allToRight:function(){p.value=-1;var t=g.value,r=f.value;t.forEach((function(e){r.push(e),N(e)})),a.length===e.sourceList.length?f.value=m(M(r,u,a)):f.value=m(r),S()},allToLeft:function(){d.value=-1;for(var t=f.value,r=c.value;t.length;){var n=t.shift();r.push(n),a.length===e.sourceList.length?c.value=m(M(r,u,a)):c.value=m(r)}S()},displayDataList:g,displayCode:x,leftHoverIndex:p,rightHoverIndex:d,handleItemMouseEvent:function(e,t,r,n){t.preventDefault(),t.stopPropagation();var o="over"===e?n:-1;r?p.value=o:d.value=o},handleItemClick:function(t,r,n){t.preventDefault(),t.stopPropagation(),n?p.value=-1:d.value=-1;var o=n?g.value[r]:f.value.splice(r,1)[0],l=n?f.value:c.value;l.push(o),n&&N(o);var s=a.length===e.sourceList.length?m(M(l,u,a)):m(l);n?f.value=m(s):c.value=m(s),S()},hasSelectedList:f}},render:function(){var e=this,n=this.$props,o=n.extCls,a=n.title,l=n.emptyContent,s=n.searchable,i=n.searchPlaceholder,c=function(r){var n,o,u="left-header"===r,l="".concat(u?null!==(n=a[0])&&void 0!==n?n:"左侧列表":null!==(o=a[1])&&void 0!==o?o:"右侧列表"),s=u?!e.dataList.length:!e.hasSelectedList.length;return e.$slots[r]?t.createVNode("div",{class:"slot-header"},[t.createVNode("div",{class:"slot-content"},[e.$slots[r]()])]):t.createVNode("div",{class:"header"},["".concat(l,"（共").concat(e.dataList.length,"条）"),t.createVNode("span",{class:{disabled:s},onClick:function(){return u&&e.dataList.length&&e.allToRight(),void(!u&&e.hasSelectedList.length&&e.allToLeft())}},[u?"全部添加":"清空"])])},f=function(n,o){var a=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],u=a?e.leftHoverIndex:e.rightHoverIndex;return t.createVNode("div",{class:"item-content"},[t.createVNode("span",{class:"content-text",title:n[e.displayCode]},[n[e.displayCode]]),t.createVNode("span",{class:["icon-wrapper",o===u?"hover":""]},[a?t.createVNode(r.ArrowsRight,{class:"bk-icon"},null):t.createVNode(r.Error,{class:"bk-icon"},null)])])},p=function(r){var n="left"===r,o=n?e.displayDataList:e.hasSelectedList,a=n?"source-option":"target-option",u=n?"left-empty-content":"right-empty-content";return o.length?t.createVNode("ul",{class:["content",s&&n?"is-search":""]},[o.map((function(r,o){var u,l,s;return t.createVNode("li",{key:o,class:[e.$slots[a]?"custom-item":""],onClick:function(t){return e.handleItemClick(t,o,n)},onMouseover:function(t){return e.handleItemMouseEvent("over",t,n,o)},onMouseleave:function(t){return e.handleItemMouseEvent("leave",t,n,o)}},[null!==(s=null===(l=(u=e.$slots)[a])||void 0===l?void 0:l.call(u,r))&&void 0!==s?s:f(r,o,n)])}))]):function(r){var n,o="left-empty-content"===r,a=null!==(n=o?l[0]:l[1])&&void 0!==n?n:o?"无数据":"未选择任何项";return e.$slots[r]?t.createVNode("div",null,[e.$slots[r]()]):t.createVNode("div",{class:"empty"},[a])}(u)};return t.createVNode("div",{class:["bk-transfer",o],ref:"transferRef"},[t.createVNode("div",{class:"source-list"},[c("left-header"),s&&t.createVNode(u.default,{modelValue:e.keyword,"onUpdate:modelValue":function(t){return e.keyword=t},class:"transfer-search-input",clearable:!0,placeholder:i||"请输入搜索关键字",type:"search","left-icon":"bk-icon icon-search"},null),p("left")]),t.createVNode("div",{class:"transfer"},null),t.createVNode("div",{class:"target-list"},[c("right-header"),p("right")])])}});L.install=function(e){e.component(L.name,L)},e.default=L,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("../shared"),require("vue"),require("../icon/"),require("../input")):"function"==typeof define&&define.amd?define(["exports","../shared","vue","../icon/","../input"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Shared,e.Vue,e._,e.Input)}(this,(function(e,t,r,n,o){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=a(o);function l(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s={exports:{}},i={exports:{}};!function(e){e.exports=function(e){if(Array.isArray(e))return e},e.exports.__esModule=!0,e.exports.default=e.exports}(i);var c={exports:{}};!function(e){e.exports=function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a=[],u=!0,l=!1;try{for(r=r.call(e);!(u=(n=r.next()).done)&&(a.push(n.value),!t||a.length!==t);u=!0);}catch(e){l=!0,o=e}finally{try{u||null==r.return||r.return()}finally{if(l)throw o}}return a}},e.exports.__esModule=!0,e.exports.default=e.exports}(c);var f={exports:{}},p={exports:{}};!function(e){e.exports=function(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n},e.exports.__esModule=!0,e.exports.default=e.exports}(p),function(e){var t=p.exports;e.exports=function(e,r){if(e){if("string"==typeof e)return t(e,r);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?t(e,r):void 0}},e.exports.__esModule=!0,e.exports.default=e.exports}(f);var d={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(d),function(e){var t=i.exports,r=c.exports,n=f.exports,o=d.exports;e.exports=function(e,a){return t(e)||r(e,a)||n(e,a)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(s);var v=l(s.exports),h={exports:{}},y={exports:{}};!function(e){var t=p.exports;e.exports=function(e){if(Array.isArray(e))return t(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(y);var x={exports:{}};!function(e){e.exports=function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(x);var g={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(g),function(e){var t=y.exports,r=x.exports,n=f.exports,o=g.exports;e.exports=function(e){return t(e)||r(e)||n(e)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(h);var m=l(h.exports);t.PropTypes.string,t.PropTypes.string,t.PropTypes.string,t.PropTypes.string,t.PropTypes.bool,t.PropTypes.bool,t.PropTypes.string,t.PropTypes.bool;var L=r.defineComponent({name:"Transfer",props:{title:{type:Array,default:function(){return[]}},extCls:{type:String,default:""},searchPlaceholder:{type:String,default:""},settingKey:{type:String,default:"id"},displayKey:{type:String,default:"value"},sortKey:{type:String,default:""},showOverflowTips:{type:Boolean,default:!1},searchable:{type:Boolean,default:!1},sortable:{type:Boolean,default:!1},sourceList:{type:Array,default:function(){return[]}},targetList:{type:Array,default:function(){return[]}},emptyContent:{type:Array,default:function(){return[]}}},emits:["change"],slots:["left-header","right-header","source-option","target-option","left-empty-content","right-empty-content"],setup:function(e,n){var o=n.emit,a=[],u=e.sortKey,l=e.sortable,s=r.ref(""),i=r.ref(null),c=r.ref([]),f=r.ref([]),p=r.ref(-1),d=r.ref(-1),h=r.computed((function(){return e.sourceList&&Array.isArray(e.sourceList)?-1!==e.sourceList.toString().indexOf("[object Object]"):"empty"})),y=r.computed((function(){return h.value?e.settingKey:"index"})),x=r.computed((function(){return h.value?e.displayKey:"value"})),g=r.computed((function(){return s.value?c.value.filter((function(e){return!t.isEmpty(e[x.value])&&String(e[x.value]).indexOf(s.value)>-1})):c.value}));r.watch((function(){return e.sourceList}),(function(){"empty"!==h.value&&(L(),V())}),{deep:!0}),r.watch((function(){return e.targetList}),(function(){L(),V()}),{deep:!0}),r.watch((function(){return[x.value,y.value]}),(function(){L()})),r.watch((function(){return e.sortKey}),(function(e){u=e,V()})),r.watch((function(){return e.sortable}),(function(e){l=e,V()}));var L=function(){"empty"!==h.value&&(h.value?_():b())},b=function(){if(!e.targetList.length||e.targetList.length>e.sourceList.length){for(var t,r=[],n=0;n<e.sourceList.length;n++)r.push({index:n,value:e.sourceList[n]});c.value=[].concat(r),(t=f.value).splice.apply(t,[0,f.value.length].concat([])),o("change",c.value,[],[])}else{for(var a=[],u=[],l=0;l<e.sourceList.length;l++)a.push({index:l,value:e.sourceList[l]});e.targetList.forEach((function(e){var t=a.find((function(t){return t.value===e}));t&&u.push(t)})),f.value=[].concat(u);var s=a.filter((function(e){return u.every((function(t){return t.index!==e.index}))}));c.value=m(s),o("change",c.value,m(S(f.value,!1)),[])}},_=function(){if(!e.targetList.length||e.targetList.length>e.sourceList.length){var t;(t=c.value).splice.apply(t,[0,c.value.length].concat(m(e.sourceList))),f.value=[],o("change",c.value,[],[])}else{var r=e.sourceList.filter((function(t){return e.targetList.every((function(e){return e!==t[y.value]}))})),n=[];e.sourceList.forEach((function(t){e.targetList.forEach((function(e){t[y.value]===e&&n.push(t)}))})),f.value=[].concat(n),c.value=m(r);var a=m(S(f.value));o("change",c.value,f.value,a)}},V=function(){var t=[];if(h.value)l||(u=""),t=m(e.sourceList);else{u=l?"index":"";for(var r=0;r<e.sourceList.length;r++)t.push({index:r,value:e.sourceList[r]})}if(u){var n=[];if(t.forEach((function(e){n.push(e[u])})),(a=[].concat(n)).length===e.sourceList.length){var o=m(c.value);c.value=m(M(o,u,a))}}},w=function(){var e=c.value,t=h.value?f.value:m(S(f.value,!1)),r=h.value?m(S(f.value)):[];o("change",e,t,r)},S=function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],r=[];if(!e.length)return[];var n=m(e);return n.forEach((function(e){if(t)for(var n=0,o=Object.entries(e);n<o.length;n++){var a=v(o[n],2),u=a[0],l=a[1];u===y.value&&r.push(l)}else r.push(e.value)})),r},M=function(e,t,r){var n=r;return e.sort((function(e,r){return n.indexOf(e[t])-n.indexOf(r[t])>=0}))},N=function(e){c.value=c.value.filter((function(t){return t[y.value]!==e[y.value]}))};return"empty"!==h.value&&(h.value?_():b(),V()),{keyword:s,transferRef:i,dataList:c,allToRight:function(){p.value=-1;var t=g.value,r=f.value;t.forEach((function(e){r.push(e),N(e)})),a.length===e.sourceList.length?f.value=m(M(r,u,a)):f.value=m(r),w()},allToLeft:function(){d.value=-1;for(var t=f.value,r=c.value;t.length;){var n=t.shift();r.push(n),a.length===e.sourceList.length?c.value=m(M(r,u,a)):c.value=m(r)}w()},displayDataList:g,displayCode:x,leftHoverIndex:p,rightHoverIndex:d,handleItemMouseEvent:function(e,t,r,n){t.preventDefault(),t.stopPropagation();var o="over"===e?n:-1;r?p.value=o:d.value=o},handleItemClick:function(t,r,n){t.preventDefault(),t.stopPropagation(),n?p.value=-1:d.value=-1;var o=n?g.value[r]:f.value.splice(r,1)[0],l=n?f.value:c.value;l.push(o),n&&N(o);var s=a.length===e.sourceList.length?m(M(l,u,a)):m(l);n?f.value=m(s):c.value=m(s),w()},hasSelectedList:f}},render:function(){var e=this,t=this.$props,o=t.extCls,a=t.title,l=t.emptyContent,s=t.searchable,i=t.searchPlaceholder,c=function(t){var n,o,u="left-header"===t,l="".concat(u?null!==(n=a[0])&&void 0!==n?n:"左侧列表":null!==(o=a[1])&&void 0!==o?o:"右侧列表"),s=u?!e.dataList.length:!e.hasSelectedList.length;return e.$slots[t]?r.createVNode("div",{class:"slot-header"},[r.createVNode("div",{class:"slot-content"},[e.$slots[t]()])]):r.createVNode("div",{class:"header"},["".concat(l,"（共").concat(e.dataList.length,"条）"),r.createVNode("span",{class:{disabled:s},onClick:function(){return u&&e.dataList.length&&e.allToRight(),void(!u&&e.hasSelectedList.length&&e.allToLeft())}},[u?"全部添加":"清空"])])},f=function(t,o){var a=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],u=a?e.leftHoverIndex:e.rightHoverIndex;return r.createVNode("div",{class:"item-content"},[r.createVNode("span",{class:"content-text",title:t[e.displayCode]},[t[e.displayCode]]),r.createVNode("span",{class:["icon-wrapper",o===u?"hover":""]},[a?r.createVNode(n.ArrowsRight,{class:"bk-icon"},null):r.createVNode(n.Error,{class:"bk-icon"},null)])])},p=function(t){var n="left"===t,o=n?e.displayDataList:e.hasSelectedList,a=n?"source-option":"target-option",u=n?"left-empty-content":"right-empty-content";return o.length?r.createVNode("ul",{class:["content",s&&n?"is-search":""]},[o.map((function(t,o){var u,l,s;return r.createVNode("li",{key:o,class:[e.$slots[a]?"custom-item":""],onClick:function(t){return e.handleItemClick(t,o,n)},onMouseover:function(t){return e.handleItemMouseEvent("over",t,n,o)},onMouseleave:function(t){return e.handleItemMouseEvent("leave",t,n,o)}},[null!==(s=null===(l=(u=e.$slots)[a])||void 0===l?void 0:l.call(u,t))&&void 0!==s?s:f(t,o,n)])}))]):function(t){var n,o="left-empty-content"===t,a=null!==(n=o?l[0]:l[1])&&void 0!==n?n:o?"无数据":"未选择任何项";return e.$slots[t]?r.createVNode("div",null,[e.$slots[t]()]):r.createVNode("div",{class:"empty"},[a])}(u)};return r.createVNode("div",{class:["bk-transfer",o],ref:"transferRef"},[r.createVNode("div",{class:"source-list"},[c("left-header"),s&&r.createVNode(u.default,{modelValue:e.keyword,"onUpdate:modelValue":function(t){return e.keyword=t},class:"transfer-search-input",clearable:!0,placeholder:i||"请输入搜索关键字",type:"search","left-icon":"bk-icon icon-search"},null),p("left")]),r.createVNode("div",{class:"transfer"},null),r.createVNode("div",{class:"target-list"},[c("right-header"),p("right")])])}}),b=t.withInstall(L);e.default=b,Object.defineProperty(e,"__esModule",{value:!0})}));

package/lib/tree/index.d.ts

@@ -112,6 +112,7 @@ declare const BkTree: {
                 schema: any[] | Map<string, any>;
                 levelLineSchema: {};
             };
+            root: import("vue").Ref<any>;
             hanldeTreeNodeClick: (item: any) => void;
             handleNodeContentClick: (item: any) => void;
             handleNodeActionClick: (node: any) => void;
@@ -196,6 +197,7 @@ declare const BkTree: {
             schema: any[] | Map<string, any>;
             levelLineSchema: {};
         };
+        root: import("vue").Ref<any>;
         hanldeTreeNodeClick: (item: any) => void;
         handleNodeContentClick: (item: any) => void;
         handleNodeActionClick: (node: any) => void;
@@ -255,6 +257,7 @@ declare const BkTree: {
         schema: any[] | Map<string, any>;
         levelLineSchema: {};
     };
+    root: import("vue").Ref<any>;
     hanldeTreeNodeClick: (item: any) => void;
     handleNodeContentClick: (item: any) => void;
     handleNodeActionClick: (node: any) => void;
@@ -263,7 +266,7 @@ declare const BkTree: {
     getVirtualLines: (node: any) => JSX.Element[];
     getNodePrefixIcon: (item: any) => any;
     getLoadingIcon: (item: any) => JSX.Element | "";
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, "check", {
     data: any[];
     lineHeight: number;
     prefixIcon: any;

package/lib/tree/index.js

@@ -1 +1 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("../shared"),require("vue"),require("../icon/"),require("../virtual-render"),require("crypto")):"function"==typeof define&&define.amd?define(["exports","../shared","vue","../icon/","../virtual-render","crypto"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Shared,e.Vue,e._,e["@bkui-vue/virtual-render"],e.require$$0)}(this,(function(e,n,t,r,o,i){"use strict";function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=u(o),a=u(i);function c(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s={exports:{}};!function(e){function n(t){return e.exports=n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e.exports.__esModule=!0,e.exports.default=e.exports,n(t)}e.exports=n,e.exports.__esModule=!0,e.exports.default=e.exports}(s);var f=c(s.exports),d={exports:{}};!function(e){e.exports=function(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e},e.exports.__esModule=!0,e.exports.default=e.exports}(d);var p=c(d.exports),v={data:n.PropTypes.arrayOf(n.PropTypes.any).def([]),label:n.PropTypes.oneOfType([n.PropTypes.func.def(void 0),n.PropTypes.string.def("label")]),children:n.PropTypes.string.def("children"),indent:n.PropTypes.number.def(18),lineHeight:n.PropTypes.number.def(32),levelLine:n.PropTypes.oneOfType([n.PropTypes.bool.def(!1),n.PropTypes.func.def(void 0),n.PropTypes.string.def("1px dashed #c3cdd7")]).def(!1),virtualRender:n.PropTypes.bool.def(!1),prefixIcon:n.PropTypes.oneOfType([n.PropTypes.func.def((function(){})),n.PropTypes.bool.def(!1)]).def(!0),async:n.PropTypes.shape({callback:n.PropTypes.func.def(null),cache:n.PropTypes.bool.def(!0)}),offsetLeft:n.PropTypes.number.def(15)},_={exports:{}},y={exports:{}},h={exports:{}};!function(e){e.exports=function(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r},e.exports.__esModule=!0,e.exports.default=e.exports}(h),function(e){var n=h.exports;e.exports=function(e){if(Array.isArray(e))return n(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(y);var x={exports:{}};!function(e){e.exports=function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(x);var b={exports:{}};!function(e){var n=h.exports;e.exports=function(e,t){if(e){if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(e,t):void 0}},e.exports.__esModule=!0,e.exports.default=e.exports}(b);var g={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(g),function(e){var n=y.exports,t=x.exports,r=b.exports,o=g.exports;e.exports=function(e){return n(e)||t(e)||r(e)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(_);for(var m=c(_.exports),O=a.default,T=function(){return O.randomBytes(16)},j=[],k=0;k<256;++k)j[k]=(k+256).toString(16).substr(1);var P,I,N=function(e,n){var t=n||0,r=j;return[r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]]].join("")},w=T,A=N,S=0,V=0;var C=function(e,n,t){var r=n&&t||0,o=n||[],i=(e=e||{}).node||P,u=void 0!==e.clockseq?e.clockseq:I;if(null==i||null==u){var l=w();null==i&&(i=P=[1|l[0],l[1],l[2],l[3],l[4],l[5]]),null==u&&(u=I=16383&(l[6]<<8|l[7]))}var a=void 0!==e.msecs?e.msecs:(new Date).getTime(),c=void 0!==e.nsecs?e.nsecs:V+1,s=a-S+(c-V)/1e4;if(s<0&&void 0===e.clockseq&&(u=u+1&16383),(s<0||a>S)&&void 0===e.nsecs&&(c=0),c>=1e4)throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");S=a,V=c,I=u;var f=(1e4*(268435455&(a+=122192928e5))+c)%4294967296;o[r++]=f>>>24&255,o[r++]=f>>>16&255,o[r++]=f>>>8&255,o[r++]=255&f;var d=a/4294967296*1e4&268435455;o[r++]=d>>>8&255,o[r++]=255&d,o[r++]=d>>>24&15|16,o[r++]=d>>>16&255,o[r++]=u>>>8|128,o[r++]=255&u;for(var p=0;p<6;++p)o[r+p]=i[p];return n||A(o)},L=T,M=N;var q=function(e,n,t){var r=n&&t||0;"string"==typeof e&&(n="binary"===e?new Array(16):null,e=null);var o=(e=e||{}).random||(e.rng||L)();if(o[6]=15&o[6]|64,o[8]=63&o[8]|128,n)for(var i=0;i<16;++i)n[r+i]=o[i];return n||M(o)},D=C,R=q,H=R;H.v1=D,H.v4=R;var E=H,$=void 0,F="1px dashed #c3cdd7",B=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],r=e.data,o=e.children,i=[],u=0,l=new Map;function a(e){return(t||[]).some((function(n){return n.__uuid===e&&n.__isOpen}))}function c(e){for(var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,s=0;s<e.length;s++){var d=e[s];if(Array.isArray(d))c(d,n,t,r);else if("object"===f(d)&&null!==d){var v=d.__uuid||E.v4(),_=a(v),y=null!==r?"".concat(r,"-").concat(s):"".concat(s),h=p({__depth:n,__index:s,__uuid:v,__parentId:t,__parentPath:r,__hasChild:!!(d[o]||[]).length,__path:y,__isRoot:null===t,__order:u,__isOpen:_,__checked:!1},o,null);Object.assign(d,{__uuid:v}),l.set(v,h),u+=1,i.push(Object.assign(Object.assign({},d),p({},o,null))),Object.prototype.hasOwnProperty.call(d,o)&&c(d[o]||[],n+1,v,y)}}}return c(n||r),[i,l]},U=function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:null,i=arguments.length>5&&void 0!==arguments[5]?arguments[5]:[],u=e[n];return"boolean"==typeof u?u?r:o:W(t,e,n,i)},W=function(e,n,t){var r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],o=n[t];if("string"==typeof o)return"object"===f(e)&&null!==e?(Object.prototype.hasOwnProperty.call(e,o)||console.error("cannot find node label with key ".concat(o)),e[o]):o;if("function"==typeof o){var i=o.apply($,[e].concat(m(r)));return"string"==typeof i?i:void console.error("props label with function return value is not string, please check and return string")}},z=function(e,n){return W(e,n,"label")},G=function(e,n){return e.get(n)||{}},J=function(e,n,t){var r;return null===(r=G(e,n))||void 0===r?void 0:r[t]},K=function(e,n){return{"--level-line":U(n,"levelLine",e,F,null,["tree"]),"--lineHeight":"".concat(n.lineHeight,"px"),"--indent":"".concat(n.indent,"px"),"--offset-left":"".concat(n.offsetLeft,"px")}},Q=function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},r=t.schema,o=J(r,e.__uuid,"__depth");return Object.assign({"--depth":o},"function"==typeof n.levelLine?{"--level-line":U(n,"levelLine",e,F,null,["node"])}:{})},X=function(e,n,t){var r=G(n,e.__uuid)||{};return{"is-root":r.__isRoot,"bk-tree-node":!0,"is-open":r.__isOpen,"is-virtual-render":t.virtualRender,"level-line":t.levelLine}},Y=function(e,n){return{"is-checked":(G(n,e.__uuid)||{}).__checked,"bk-node-row":!0}},Z=function(e,n,t,r){var o=e.split("-").reduce((function(e,n){var r=Number(n);return Array.isArray(e)?e[r]:e[t][r]}),n);Object.assign(o,r||{})},ee=t.defineComponent({name:"Tree",props:v,setup:function(e,n){var o=B(e),i=[],u=t.reactive({data:o[0],schema:o[1],levelLineSchema:{}});t.watch((function(){return[e.data]}),(function(n){var t=B(e,n,l.value);u.data=t[0],u.schema=t[1]}),{deep:!0});var l=t.computed((function(){return Array.from(u.schema.values())})),a=function(e){return u.schema.get(e)},c=function(e,n){var t;return null===(t=a(e.__uuid))||void 0===t?void 0:t[n]},s=function(e,n,t){return u.schema.set(e.__uuid,Object.assign(Object.assign({},a(e.__uuid)),p({},n,t)))},d=function(e){return c(e,"__path")},v=function(e){return c(e,"__isRoot")},_=function(e){return c(e,"__isOpen")},y=function(e){return c(e,"__hasChild")},h=t.computed((function(){return u.data.filter((function(e){return T(e)}))})),x=function(e){var n;return"object"===f(e)?_(e):"string"==typeof e&&(null===(n=a(e))||void 0===n?void 0:n.__isOpen)},b=function(e){return x(e)?t.createVNode(r.FolderShapeOpen,{class:"bk-tree-icon"},null):t.createVNode(r.Folder,{class:"bk-tree-icon"},null)},g=function(e){if("string"==typeof e)return e;if("object"===f(e)&&null!==e){if(e.__v_isVNode)return e;var n=e.node,r=e.className,o=e.text,i=e.style;return t.h(n,{class:r,style:i},o)}return null},m=function(n,t){if("object"===f(n)&&null!==n){s(t,"__isOpen",!0);var r=Array.isArray(n)?n:[n];!function(e,n,t,r,o){Z(e,n,t,p({},r,o))}(d(t),e.data,e.children,e.children,r)}},O=function(n){if(n.async){var t=e.async||{},r=t.callback,o=void 0===r?null:r,i=t.cache,u=void 0===i||i;"function"!=typeof o||n.cached?console.error("async need to set prop: asyncLoad with function wich will return promise object"):(Object.assign(n,{loading:!0}),o(n,(function(e){return m(e,n)})).then((function(e){return m(e,n)})).catch((function(e){return console.error("load remote data error:",e)})).finally((function(){Z(d(n),e.data,e.children,Object.assign({loading:!1},u?{cached:!0}:{}))})))}y(n)&&function(e){var n=!x(e);s(e,"__isOpen",n),n||h.value.filter((function(n){return String.prototype.startsWith.call(d(n),d(e))})).forEach((function(e){return s(e,"__isOpen",n)}))}(n)},T=function(e){return v(e)||x(e)||x(c(e,"__parentId"))};return{renderData:h,flatData:u,hanldeTreeNodeClick:O,handleNodeContentClick:function(e){i.includes(e.__uuid)||(i.forEach((function(e){return s({__uuid:e},"__checked",!1)})),i.length=0,s(e,"__checked",!0),i.push(e.__uuid),_(e)||O(e),n.emit("check",e,a(e.__uuid)))},handleNodeActionClick:function(e){O(e)},getActionIcon:function(n){var o=null;return"function"==typeof e.prefixIcon&&"default"!==(o=e.prefixIcon(v(n),y(n)||n.async,x(n),"action",n))?g(o):("default"===o||"boolean"==typeof e.prefixIcon&&e.prefixIcon)&&(y(n)||n.async)?x(n)?t.createVNode(r.DownShape,null,null):t.createVNode(r.RightShape,null,null):null},getRootIcon:b,getVirtualLines:function(n){if(!e.levelLine)return null;var r=c(n,"__depth")+1;return new Array(r).fill("").map((function(e,n){return n})).filter((function(e){return function(e,n){if(v(n))return!1;var t=d(n),r="".concat(t).split("-").slice(0,e+1);if(r.join("-")===t)return!0;var o=r.pop(),i=parseInt(o,10);r.push("".concat(i+1));var u=r.join("-");return l.value.some((function(e){return e.__path===u}))}(e,n)})).filter((function(e){return e>0})).map((function(e){return t.createVNode("span",{class:"node-virtual-line",style:(n=r-e,{"--depth":n})},null);var n}))},getNodePrefixIcon:function(n){var o=null;return"function"==typeof e.prefixIcon&&"default"!==(o=e.prefixIcon(v(n),y(n)||n.async,x(n),"node_type",n))?g(o):"default"===o||"boolean"==typeof e.prefixIcon&&e.prefixIcon?v(n)||y(n)?b(n):t.createVNode(r.TextFile,{class:"bk-tree-icon"},null):null},getLoadingIcon:function(e){return e.loading?t.createVNode(r.Spinner,null,null):""}}},render:function(){var e=this,n=this.$props,r=function(r){return t.createVNode("div",{class:Y(r,e.flatData.schema)},[t.createVNode("div",{class:X(r,e.flatData.schema,n),style:Q(r,n,e.flatData)},[t.createVNode("span",{class:"node-action",onClick:function(){return e.handleNodeActionClick(r)}},[e.getActionIcon(r)]),t.createVNode("span",{class:"node-content",onClick:function(){return e.handleNodeContentClick(r)}},[[e.getNodePrefixIcon(r),e.getLoadingIcon(r)],t.createVNode("span",null,[z(r,n)])]),e.getVirtualLines(r)])])};return t.createVNode(l.default,{class:"bk-tree",style:K(null,n),list:this.renderData,lineHeight:n.lineHeight,enabled:n.virtualRender,throttleDelay:0},{default:function(e){return(e.data||[]).map(r)}})}}),ne=n.withInstall(ee);e.default=ne,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("../shared"),require("vue"),require("../icon/"),require("../virtual-render"),require("crypto")):"function"==typeof define&&define.amd?define(["exports","../shared","vue","../icon/","../virtual-render","crypto"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Shared,e.Vue,e._,e["@bkui-vue/virtual-render"],e.require$$0)}(this,(function(e,n,t,r,o,i){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=a(o),u=a(i);function c(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s={exports:{}};!function(e){function n(t){return e.exports=n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e.exports.__esModule=!0,e.exports.default=e.exports,n(t)}e.exports=n,e.exports.__esModule=!0,e.exports.default=e.exports}(s);var f=c(s.exports),d={exports:{}};!function(e){e.exports=function(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e},e.exports.__esModule=!0,e.exports.default=e.exports}(d);var p=c(d.exports),v={data:n.PropTypes.arrayOf(n.PropTypes.any).def([]),label:n.PropTypes.oneOfType([n.PropTypes.func.def(void 0),n.PropTypes.string.def("label")]),children:n.PropTypes.string.def("children"),indent:n.PropTypes.number.def(18),lineHeight:n.PropTypes.number.def(32),levelLine:n.PropTypes.oneOfType([n.PropTypes.bool.def(!1),n.PropTypes.func.def(void 0),n.PropTypes.string.def("1px dashed #c3cdd7")]).def(!1),virtualRender:n.PropTypes.bool.def(!1),prefixIcon:n.PropTypes.oneOfType([n.PropTypes.func.def((function(){})),n.PropTypes.bool.def(!1)]).def(!0),async:n.PropTypes.shape({callback:n.PropTypes.func.def(null),cache:n.PropTypes.bool.def(!0)}),offsetLeft:n.PropTypes.number.def(5)},y={exports:{}},_={exports:{}},h={exports:{}};!function(e){e.exports=function(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r},e.exports.__esModule=!0,e.exports.default=e.exports}(h),function(e){var n=h.exports;e.exports=function(e){if(Array.isArray(e))return n(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(_);var x={exports:{}};!function(e){e.exports=function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)},e.exports.__esModule=!0,e.exports.default=e.exports}(x);var b={exports:{}};!function(e){var n=h.exports;e.exports=function(e,t){if(e){if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(e,t):void 0}},e.exports.__esModule=!0,e.exports.default=e.exports}(b);var g={exports:{}};!function(e){e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},e.exports.__esModule=!0,e.exports.default=e.exports}(g),function(e){var n=_.exports,t=x.exports,r=b.exports,o=g.exports;e.exports=function(e){return n(e)||t(e)||r(e)||o()},e.exports.__esModule=!0,e.exports.default=e.exports}(y);for(var m=c(y.exports),N=u.default,O=function(){return N.randomBytes(16)},T=[],P=0;P<256;++P)T[P]=(P+256).toString(16).substr(1);var j,C,k=function(e,n){var t=n||0,r=T;return[r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],"-",r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]],r[e[t++]]].join("")},A=O,w=k,I=0,S=0;var V=function(e,n,t){var r=n&&t||0,o=n||[],i=(e=e||{}).node||j,a=void 0!==e.clockseq?e.clockseq:C;if(null==i||null==a){var l=A();null==i&&(i=j=[1|l[0],l[1],l[2],l[3],l[4],l[5]]),null==a&&(a=C=16383&(l[6]<<8|l[7]))}var u=void 0!==e.msecs?e.msecs:(new Date).getTime(),c=void 0!==e.nsecs?e.nsecs:S+1,s=u-I+(c-S)/1e4;if(s<0&&void 0===e.clockseq&&(a=a+1&16383),(s<0||u>I)&&void 0===e.nsecs&&(c=0),c>=1e4)throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");I=u,S=c,C=a;var f=(1e4*(268435455&(u+=122192928e5))+c)%4294967296;o[r++]=f>>>24&255,o[r++]=f>>>16&255,o[r++]=f>>>8&255,o[r++]=255&f;var d=u/4294967296*1e4&268435455;o[r++]=d>>>8&255,o[r++]=255&d,o[r++]=d>>>24&15|16,o[r++]=d>>>16&255,o[r++]=a>>>8|128,o[r++]=255&a;for(var p=0;p<6;++p)o[r+p]=i[p];return n||w(o)},L=O,M=k;var q=function(e,n,t){var r=n&&t||0;"string"==typeof e&&(n="binary"===e?new Array(16):null,e=null);var o=(e=e||{}).random||(e.rng||L)();if(o[6]=15&o[6]|64,o[8]=63&o[8]|128,n)for(var i=0;i<16;++i)n[r+i]=o[i];return n||M(o)},D=V,R=q,$=R;$.v1=D,$.v4=R;var E=$,H=void 0,F="1px dashed #c3cdd7",U=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0,t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],r=e.data,o=e.children,i=[],a=0,l=new Map;function u(e,n){var r=(t||[]).find((function(n){return n.__uuid===e}));return r?r.__isOpen:n.isOpen}function c(e){for(var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,s=0;s<e.length;s++){var d=e[s];if(Array.isArray(d))c(d,n,t,r);else if("object"===f(d)&&null!==d){var v=d.__uuid||E.v4(),y=u(v,d),_=null!==r?"".concat(r,"-").concat(s):"".concat(s),h=p({__depth:n,__index:s,__uuid:v,__parentId:t,__parentPath:r,__hasChild:!!(d[o]||[]).length,__path:_,__isRoot:null===t,__order:a,__isOpen:y,__checked:!!d.checked},o,null);Object.assign(d,{__uuid:v}),l.set(v,h),a+=1,i.push(Object.assign(Object.assign({},d),p({},o,null))),Object.prototype.hasOwnProperty.call(d,o)&&c(d[o]||[],n+1,v,_)}}}return c(n||r),[i,l]},W=function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:null,i=arguments.length>5&&void 0!==arguments[5]?arguments[5]:[],a=e[n];return"boolean"==typeof a?a?r:o:B(t,e,n,i)},B=function(e,n,t){var r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[],o=n[t];if("string"==typeof o)return"object"===f(e)&&null!==e?(Object.prototype.hasOwnProperty.call(e,o)||console.error("cannot find node label with key ".concat(o)),e[o]):o;if("function"==typeof o){var i=o.apply(H,[e].concat(m(r)));return"string"==typeof i?i:void console.error("props label with function return value is not string, please check and return string")}},z=function(e,n){return B(e,n,"label")},G=function(e,n){return e.get(n)||{}},J=function(e,n,t){var r;return null===(r=G(e,n))||void 0===r?void 0:r[t]},K=function(e,n){return{"--level-line":W(n,"levelLine",e,F,null,["tree"]),"--lineHeight":"".concat(n.lineHeight,"px"),"--indent":"".concat(n.indent,"px"),"--offset-left":"".concat(n.offsetLeft,"px")}},Q=function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},r=t.schema,o=J(r,e.__uuid,"__depth");return Object.assign({"--depth":o},"function"==typeof n.levelLine?{"--level-line":W(n,"levelLine",e,F,null,["node"])}:{})},X=function(e,n,t){var r=G(n,e.__uuid)||{};return{"is-root":r.__isRoot,"bk-tree-node":!0,"is-open":r.__isOpen,"is-virtual-render":t.virtualRender,"level-line":t.levelLine}},Y=function(e,t){var r=(G(t,e.__uuid)||{}).__checked;return p({"is-checked":r},n.resolveClassName("node-row"),!0)},Z=function(e,n,t,r){var o=e.split("-").reduce((function(e,n){var r=Number(n);return Array.isArray(e)?e[r]:e[t][r]}),n);Object.assign(o,r||{})},ee=t.defineComponent({name:"Tree",props:v,emits:["check"],setup:function(e,o){var i=U(e),a=[],l=t.reactive({data:i[0],schema:i[1],levelLineSchema:{}});t.watch((function(){return[e.data]}),(function(n){var t=U(e,n,u.value);l.data=t[0],l.schema=t[1]}),{deep:!0});var u=t.computed((function(){return Array.from(l.schema.values())})),c=function(e){return l.schema.get(e)},s=function(e,n){var t;return null===(t=c(e.__uuid))||void 0===t?void 0:t[n]},d=function(e,n,t){return l.schema.set(e.__uuid,Object.assign(Object.assign({},c(e.__uuid)),p({},n,t)))},v=function(e){return s(e,"__path")},y=function(e){return s(e,"__isRoot")},_=function(e){return s(e,"__isOpen")},h=function(e){return s(e,"__hasChild")},x=t.computed((function(){return l.data.filter((function(e){return T(e)}))})),b=function(e){var n;return"object"===f(e)?_(e):"string"==typeof e&&(null===(n=c(e))||void 0===n?void 0:n.__isOpen)},g=function(e){return b(e)?t.createVNode(r.FolderShapeOpen,{class:n.resolveClassName("tree-icon")},null):t.createVNode(r.Folder,{class:n.resolveClassName("tree-icon")},null)},m=function(e){if("string"==typeof e)return e;if("object"===f(e)&&null!==e){if(e.__v_isVNode)return e;var n=e.node,r=e.className,o=e.text,i=e.style;return t.h(n,{class:r,style:i},o)}return null},N=function(n,t){if("object"===f(n)&&null!==n){d(t,"__isOpen",!0);var r=Array.isArray(n)?n:[n];!function(e,n,t,r,o){Z(e,n,t,p({},r,o))}(v(t),e.data,e.children,e.children,r)}},O=function(n){if(n.async){var t=e.async||{},r=t.callback,o=void 0===r?null:r,i=t.cache,a=void 0===i||i;"function"!=typeof o||n.cached?console.error("async need to set prop: asyncLoad with function wich will return promise object"):(Object.assign(n,{loading:!0}),o(n,(function(e){return N(e,n)})).then((function(e){return N(e,n)})).catch((function(e){return console.error("load remote data error:",e)})).finally((function(){Z(v(n),e.data,e.children,Object.assign({loading:!1},a?{cached:!0}:{}))})))}h(n)&&function(e){var n=!b(e);d(e,"__isOpen",n),n||x.value.filter((function(n){return String.prototype.startsWith.call(v(n),v(e))})).forEach((function(e){return d(e,"__isOpen",n)}))}(n)},T=function(e){return y(e)||b(e)||b(s(e,"__parentId"))},P=t.ref(),j=function(){var e;if(null===(e=P.value)||void 0===e?void 0:e.$el){var t=".".concat(n.resolveClassName("tree-node")),r=".".concat(n.resolveClassName("node-content"));Array.prototype.forEach.call(P.value.$el.querySelectorAll(t),(function(e){var n=e.querySelectorAll("".concat(r," span")),t=Array.prototype.slice.call(n,-1)[0];if(t){var o=e.offsetWidth-t.offsetLeft;t.style.setProperty("max-width","".concat(o,"px"))}}))}};return t.onMounted((function(){j()})),t.onUpdated((function(){j()})),{renderData:x,flatData:l,root:P,hanldeTreeNodeClick:O,handleNodeContentClick:function(e){a.includes(e.__uuid)||(a.forEach((function(e){return d({__uuid:e},"__checked",!1)})),a.length=0,d(e,"__checked",!0),a.push(e.__uuid),_(e)||O(e),o.emit("check",e,c(e.__uuid)))},handleNodeActionClick:function(e){O(e)},getActionIcon:function(n){var o=null;return"function"==typeof e.prefixIcon&&"default"!==(o=e.prefixIcon(y(n),h(n)||n.async,b(n),"action",n))?m(o):("default"===o||"boolean"==typeof e.prefixIcon&&e.prefixIcon)&&(h(n)||n.async)?b(n)?t.createVNode(r.DownShape,null,null):t.createVNode(r.RightShape,null,null):null},getRootIcon:g,getVirtualLines:function(n){if(!e.levelLine)return null;var r=s(n,"__depth")+1;return new Array(r).fill("").map((function(e,n){return n})).filter((function(e){return function(e,n){if(y(n))return!1;var t=v(n),r="".concat(t).split("-").slice(0,e+1);if(r.join("-")===t)return!0;var o=r.pop(),i=parseInt(o,10);r.push("".concat(i+1));var a=r.join("-");return u.value.some((function(e){return e.__path===a}))}(e,n)})).filter((function(e){return e>0})).map((function(e){return t.createVNode("span",{class:"node-virtual-line",style:(n=r-e,{"--depth":n})},null);var n}))},getNodePrefixIcon:function(o){var i=null;return"function"==typeof e.prefixIcon&&"default"!==(i=e.prefixIcon(y(o),h(o)||o.async,b(o),"node_type",o))?m(i):"default"===i||"boolean"==typeof e.prefixIcon&&e.prefixIcon?y(o)||h(o)?g(o):t.createVNode(r.TextFile,{class:n.resolveClassName("tree-icon")},null):null},getLoadingIcon:function(e){return e.loading?t.createVNode(r.Spinner,null,null):""}}},render:function(){var e=this,r=this.$props,o=function(o){return t.createVNode("div",{class:Y(o,e.flatData.schema)},[t.createVNode("div",{class:X(o,e.flatData.schema,r),style:Q(o,r,e.flatData)},[t.createVNode("span",{class:n.resolveClassName("node-action"),onClick:function(){return e.handleNodeActionClick(o)}},[e.getActionIcon(o)]),t.createVNode("span",{class:n.resolveClassName("node-content"),onClick:function(){return e.handleNodeContentClick(o)}},[[e.getNodePrefixIcon(o),e.getLoadingIcon(o)],t.createVNode("span",{class:n.resolveClassName("node-text")},[z(o,r)])]),e.getVirtualLines(o)])])};return t.createVNode(l.default,{class:n.resolveClassName("tree"),style:K(null,r),list:this.renderData,lineHeight:r.lineHeight,enabled:r.virtualRender,contentClassName:n.resolveClassName("container"),throttleDelay:0,ref:"root"},{default:function(e){return(e.data||[]).map(o)}})}}),ne=n.withInstall(ee);e.default=ne,Object.defineProperty(e,"__esModule",{value:!0})}));

package/lib/tree/tree.css

@@ -10,6 +10,8 @@
   padding-left: 0;
   line-height: var(--lineHeight);
   cursor: pointer;
+  display: flex;
+  align-items: center;
 }
 .bk-tree .bk-tree-node:not(.is-root) {
   margin-left: calc(var(--depth)*var(--indent));
@@ -37,6 +39,12 @@
 .bk-tree .bk-tree-node .bk-tree-icon {
   margin: 0 6px 0 4px;
 }
-.bk-tree .bk-tree-node .node-content {
-  display: inline-block;
+.bk-tree .bk-tree-node .bk-node-content {
+  display: inline-flex;
+  align-items: center;
+}
+.bk-tree .bk-tree-node .bk-node-content .bk-node-text {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
 }

package/lib/tree/tree.d.ts

@@ -19,9 +19,7 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     } & {
         default: number;
-    }; /**
-     * 监听组件配置Data改变
-     */
+    };
     levelLine: import("vue-types").VueTypeDef<any> & {
         default: any;
     };
@@ -41,7 +39,13 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     } & {
         default: number;
-    };
+    }; /**
+     * 设置节点属性
+     * @param node 指定节点
+     * @param attr 节点属性
+     * @param val 属性值
+     * @returns
+     */
 }, {
     renderData: import("vue").ComputedRef<any[]>;
     flatData: {
@@ -49,6 +53,7 @@ declare const _default: import("vue").DefineComponent<{
         schema: any[] | Map<string, any>;
         levelLineSchema: {};
     };
+    root: import("vue").Ref<any>;
     hanldeTreeNodeClick: (item: any) => void;
     handleNodeContentClick: (item: any) => void;
     handleNodeActionClick: (node: any) => void;
@@ -57,7 +62,7 @@ declare const _default: import("vue").DefineComponent<{
     getVirtualLines: (node: any) => JSX.Element[];
     getNodePrefixIcon: (item: any) => any;
     getLoadingIcon: (item: any) => JSX.Element | "";
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, "check", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     data: import("vue-types").VueTypeDef<any[]> & {
         default: () => any[];
     };
@@ -76,9 +81,7 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     } & {
         default: number;
-    }; /**
-     * 监听组件配置Data改变
-     */
+    };
     levelLine: import("vue-types").VueTypeDef<any> & {
         default: any;
     };
@@ -98,7 +101,13 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     } & {
         default: number;
-    };
+    }; /**
+     * 设置节点属性
+     * @param node 指定节点
+     * @param attr 节点属性
+     * @param val 属性值
+     * @returns
+     */
 }>>, {
     data: any[];
     lineHeight: number;

package/lib/tree/tree.less

@@ -1,17 +1,20 @@
-.bk-tree {
-  .bk-node-row {
+@import '../styles/themes/themes.less';
+.@{bk-prefix}-tree {
+  .@{bk-prefix}-node-row {
     padding-left: calc(var(--offset-left));
     &.is-checked {
       background-color: #EBF2FF;
     }
   }
 
-  .bk-tree-node {
+  .@{bk-prefix}-tree-node {
     position: relative;
     height: var(--lineHeight);
     padding-left: 0;
     line-height: var(--lineHeight);
     cursor: pointer;
+    display: flex;
+    align-items: center;
 
     &:not(.is-root) {
       margin-left: calc(var(--depth)*var(--indent));
@@ -41,12 +44,19 @@
       border-left: var(--level-line);
     }
 
-    .bk-tree-icon {
+    .@{bk-prefix}-tree-icon {
       margin: 0 6px 0 4px;
     }
 
-    .node-content {
-      display: inline-block;
+    .@{bk-prefix}-node-content {
+      display: inline-flex;
+      align-items: center;
+
+      .@{bk-prefix}-node-text {
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+      }
     }
   }
 }