bkui-vue 0.0.1-beta.388 → 0.0.1-beta.389

package/lib/resize-layout/index.js

@@ -1 +1,495 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("vue"),require("../icon"));else if("function"==typeof define&&define.amd)define(["../shared","vue","../icon"],t);else{var a="object"==typeof exports?t(require("../shared"),require("vue"),require("../icon")):t(e["../shared"],e.vue,e["../icon"]);for(var i in a)("object"==typeof exports?exports:e)[i]=a[i]}}(self,((e,t,a)=>(()=>{"use strict";var i={6870:e=>{e.exports=a},4212:t=>{t.exports=e},748:e=>{e.exports=t}},l={};function o(e){var t=l[e];if(void 0!==t)return t.exports;var a=l[e]={exports:{}};return i[e](a,a.exports,o),a.exports}o.d=(e,t)=>{for(var a in t)o.o(t,a)&&!o.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{o.r(n),o.d(n,{default:()=>r});var e=o(4212);function t(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}var a=o(748),i=o(6870);const l=(0,a.defineComponent)({name:"ResizeLayout",props:{placement:e.PropTypes.placement().def("left"),min:e.PropTypes.number.def(3),max:e.PropTypes.number.def(1/0),triggerWidth:e.PropTypes.number.def(5),triggerOffset:e.PropTypes.number.def(3),initialDivide:e.PropTypes.oneOfType([String,Number]).def("20%"),immediate:e.PropTypes.bool,disabled:e.PropTypes.bool,collapsible:e.PropTypes.bool,autoMinimize:e.PropTypes.oneOfType([Boolean,Number]).def(!1),border:e.PropTypes.bool.def(!0)},emits:["before-resize","resizing","after-resize","collapse-change"],setup:function(e,i){var l=i.emit,o=(0,a.toRefs)(e),n=o.placement,r=o.initialDivide,u=o.triggerOffset,s=o.triggerWidth,c=o.max,v=o.min,d=o.immediate,f=o.autoMinimize,p=(0,a.ref)(!1),m=(0,a.ref)(!0),b=(0,a.ref)(!1),y=(0,a.ref)(null),h=(0,a.ref)({}),g=(0,a.ref)(null),z=(0,a.ref)(null),x=(0,a.ref)(null),k=(0,a.ref)(null),w=(0,a.computed)((function(){return["left","right"].includes(n.value)})),P=(0,a.computed)((function(){return w.value?"width":"height"})),R=(0,a.computed)((function(){var e=r.value;return"number"==typeof e&&(e="".concat(e,"px")),t({},P.value,e)})),T=(0,a.computed)((function(){var e;return t(e={},"margin-".concat(n.value),"".concat(u.value-s.value,"px")),t(e,P.value,"".concat(s.value,"px")),e})),M=(0,a.computed)((function(){return f.value?"boolean"==typeof f.value?50:f.value:0})),S=new ResizeObserver((function(){var e=g.value.getBoundingClientRect();y.value=w.value?e.width:e.height})),C=function(){var e=k.value.getBoundingClientRect();O(!p.value),p.value?(k.value.setAttribute("data-".concat(P.value),"".concat(e[P.value],"px")),k.value.style[P.value]="5px"):(m.value=!0,k.value.style[P.value]=k.value.getAttribute("data-".concat(P.value)))},O=function(e){k.value.addEventListener("transitionend",(function t(){m.value=e,k.value.style.transition="",k.value.removeEventListener("transitionend",t)})),k.value.style.transition="".concat(P.value," cubic-bezier(0.4, 0, 0.2, 1) .3s")};return(0,a.onMounted)((function(){S.observe(g.value)})),(0,a.onBeforeUnmount)((function(){S.unobserve(g.value)})),{collapsed:p,asideContentVisible:m,minimized:b,limitMax:y,state:h,vertical:w,cssPropKey:P,bkResizeLayoutRef:g,resizeProxyRef:z,resizeMaskRef:x,asideRef:k,triggerStyle:T,asideStyle:R,handleMousedown:function(e){l("before-resize",e);var t=k.value.getBoundingClientRect();h.value=Object.freeze({mouse:{clientX:e.clientX,clientY:e.clientY},aside:{width:t.width,height:t.height}}),x.value.style.display="block",x.value.style.cursor=w.value?"col-resize":"row-resize",d.value||function(){switch(z.value.style.visibility="visible",n.value){case"left":z.value.style.inset="0 auto auto ".concat(h.value.aside.width,"px");break;case"right":z.value.style.inset="0  ".concat(h.value.aside.width,"px auto auto");break;case"top":z.value.style.inset="".concat(h.value.aside.height,"px auto auto 0");break;case"bottom":z.value.style.inset="auto auto ".concat(h.value.aside.height,"px 0")}}(),document.onselectstart=function(){return!1},document.ondragstart=function(){return!1};var i=function(e){var t;switch(n.value){case"top":t=e.clientY-h.value.mouse.clientY;break;case"right":t=h.value.mouse.clientX-e.clientX;break;case"bottom":t=h.value.mouse.clientY-e.clientY;break;case"left":t=e.clientX-h.value.mouse.clientX}var a,i=(a=h.value.aside[P.value]+t,Math.min(c.value,Math.max(v.value,a),y.value-s.value)+u.value),o="".concat(i,"px");d.value?k.value.style[P.value]=o:z.value.style[n.value]=o,l("resizing",i)};document.addEventListener("mousemove",i),document.addEventListener("mouseup",(function e(){if(z.value.style.visibility="hidden",x.value.style.display="none",document.removeEventListener("mousemove",i),document.removeEventListener("mouseup",e),document.onselectstart=null,document.ondragstart=null,(0,a.nextTick)((function(){(function(){if(!f.value)return!1;var e=k.value.getBoundingClientRect();if(b.value=p.value=e[P.value]<=M.value,!b.value)return m.value=!0,!1;C(),(0,a.nextTick)((function(){k.value.setAttribute("data-".concat(P.value),R.value[P.value])}))})(),l("after-resize",parseFloat(z.value.style[n.value]))})),d.value)return!1;k.value.style[P.value]=z.value.style[n.value]}))},setCollapse:function(e){p.value="boolean"==typeof e?e:!p.value,C(),l("collapse-change",p.value)}}},render:function(){var e,t,l,o,n,r,u=["bk-resize-layout","bk-resize-layout-".concat(this.placement),{"bk-resize-layout-collapsed":this.collapsed,"bk-resize-layout-border":this.border}];return(0,a.createVNode)("div",{ref:"bkResizeLayoutRef",class:u},[(0,a.createVNode)("aside",{class:"bk-resize-layout-aside",ref:"asideRef",style:this.asideStyle},[(0,a.withDirectives)((0,a.createVNode)("div",{class:"bk-resize-layout-aside-content"},[null===(t=(e=this.$slots).aside)||void 0===t?void 0:t.call(e)]),[[a.vShow,this.asideContentVisible]]),(0,a.withDirectives)((0,a.createVNode)("i",{class:"bk-resize-trigger",style:this.triggerStyle,onMousedown:(0,a.withModifiers)(this.handleMousedown,["left"])},null),[[a.vShow,!this.disabled&&(!this.collapsed||this.autoMinimize)]]),(0,a.withDirectives)((0,a.createVNode)("i",{class:["bk-resize-proxy",this.placement],ref:"resizeProxyRef"},null),[[a.vShow,!this.collapsed||this.autoMinimize]]),this.collapsible&&((null===(o=(l=this.$slots)["collapse-trigger"])||void 0===o?void 0:o.call(l))||(this.collapsed?(0,a.createVNode)(i.AngleRight,{class:"bk-resize-collapse",onClick:this.setCollapse},null):(0,a.createVNode)(i.AngleLeft,{class:"bk-resize-collapse",onClick:this.setCollapse},null)))]),(0,a.createVNode)("main",{class:"bk-resize-layout-main"},[null===(r=(n=this.$slots).main)||void 0===r?void 0:r.call(n)]),(0,a.createVNode)("div",{class:"bk-resize-mask",ref:"resizeMaskRef"},null)])}}),r=(0,e.withInstall)(l)})(),n})()));
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("../shared"), require("vue"), require("../icon"));
+	else if(typeof define === 'function' && define.amd)
+		define(["../shared", "vue", "../icon"], factory);
+	else {
+		var a = typeof exports === 'object' ? factory(require("../shared"), require("vue"), require("../icon")) : factory(root["../shared"], root["vue"], root["../icon"]);
+		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
+	}
+})(self, (__WEBPACK_EXTERNAL_MODULE__4212__, __WEBPACK_EXTERNAL_MODULE__748__, __WEBPACK_EXTERNAL_MODULE__6870__) => {
+return /******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	var __webpack_modules__ = ({
+
+/***/ 6870:
+/***/ ((module) => {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__6870__;
+
+/***/ }),
+
+/***/ 4212:
+/***/ ((module) => {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__4212__;
+
+/***/ }),
+
+/***/ 748:
+/***/ ((module) => {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__748__;
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 		if (cachedModule !== undefined) {
+/******/ 			return cachedModule.exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/define property getters */
+/******/ 	(() => {
+/******/ 		// define getter functions for harmony exports
+/******/ 		__webpack_require__.d = (exports, definition) => {
+/******/ 			for(var key in definition) {
+/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 				}
+/******/ 			}
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
+(() => {
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (/* binding */ src)
+});
+
+// EXTERNAL MODULE: external "../shared"
+var external_shared_ = __webpack_require__(4212);
+;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
+function _defineProperty(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;
+}
+// EXTERNAL MODULE: external "vue"
+var external_vue_ = __webpack_require__(748);
+// EXTERNAL MODULE: external "../icon"
+var external_icon_ = __webpack_require__(6870);
+;// CONCATENATED MODULE: ../../packages/resize-layout/src/resize-layout.tsx
+
+
+
+/*
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+*/
+
+
+
+/* harmony default export */ const resize_layout = ((0,external_vue_.defineComponent)({
+  name: 'ResizeLayout',
+  props: {
+    placement: external_shared_.PropTypes.placement().def('left'),
+    min: external_shared_.PropTypes.number.def(3),
+    max: external_shared_.PropTypes.number.def(Infinity),
+    triggerWidth: external_shared_.PropTypes.number.def(5),
+    triggerOffset: external_shared_.PropTypes.number.def(3),
+    initialDivide: external_shared_.PropTypes.oneOfType([String, Number]).def('20%'),
+    immediate: external_shared_.PropTypes.bool,
+    disabled: external_shared_.PropTypes.bool,
+    collapsible: external_shared_.PropTypes.bool,
+    autoMinimize: external_shared_.PropTypes.oneOfType([Boolean, Number]).def(false),
+    border: external_shared_.PropTypes.bool.def(true)
+  },
+  emits: ['before-resize', 'resizing', 'after-resize', 'collapse-change'],
+  setup: function setup(props, _ref) {
+    var emit = _ref.emit;
+
+    var _toRefs = (0,external_vue_.toRefs)(props),
+        placement = _toRefs.placement,
+        initialDivide = _toRefs.initialDivide,
+        triggerOffset = _toRefs.triggerOffset,
+        triggerWidth = _toRefs.triggerWidth,
+        max = _toRefs.max,
+        min = _toRefs.min,
+        immediate = _toRefs.immediate,
+        autoMinimize = _toRefs.autoMinimize;
+
+    var collapsed = (0,external_vue_.ref)(false);
+    var asideContentVisible = (0,external_vue_.ref)(true);
+    var minimized = (0,external_vue_.ref)(false);
+    var limitMax = (0,external_vue_.ref)(null);
+    var state = (0,external_vue_.ref)({});
+    var bkResizeLayoutRef = (0,external_vue_.ref)(null);
+    var resizeProxyRef = (0,external_vue_.ref)(null);
+    var resizeMaskRef = (0,external_vue_.ref)(null);
+    var asideRef = (0,external_vue_.ref)(null);
+    var vertical = (0,external_vue_.computed)(function () {
+      return ['left', 'right'].includes(placement.value);
+    });
+    var cssPropKey = (0,external_vue_.computed)(function () {
+      return vertical.value ? 'width' : 'height';
+    });
+    var asideStyle = (0,external_vue_.computed)(function () {
+      var divide = initialDivide.value;
+
+      if (typeof divide === 'number') {
+        divide = "".concat(divide, "px");
+      }
+
+      return _defineProperty({}, cssPropKey.value, divide);
+    });
+    var triggerStyle = (0,external_vue_.computed)(function () {
+      var _style;
+
+      var style = (_style = {}, _defineProperty(_style, "margin-".concat(placement.value), "".concat(triggerOffset.value - triggerWidth.value, "px")), _defineProperty(_style, cssPropKey.value, "".concat(triggerWidth.value, "px")), _style);
+      return style;
+    });
+    var parseAutoMinimize = (0,external_vue_.computed)(function () {
+      if (autoMinimize.value) {
+        return typeof autoMinimize.value === 'boolean' ? 50 : autoMinimize.value;
+      }
+
+      return 0;
+    });
+
+    var setMaxLimit = function setMaxLimit() {
+      var rect = bkResizeLayoutRef.value.getBoundingClientRect();
+      limitMax.value = vertical.value ? rect.width : rect.height;
+    };
+
+    var observer = new ResizeObserver(setMaxLimit);
+
+    var updateResizeProxyStyle = function updateResizeProxyStyle() {
+      resizeProxyRef.value.style.visibility = 'visible';
+
+      switch (placement.value) {
+        case 'left':
+          resizeProxyRef.value.style.inset = "0 auto auto ".concat(state.value.aside.width, "px");
+          break;
+
+        case 'right':
+          resizeProxyRef.value.style.inset = "0  ".concat(state.value.aside.width, "px auto auto");
+          break;
+
+        case 'top':
+          resizeProxyRef.value.style.inset = "".concat(state.value.aside.height, "px auto auto 0");
+          break;
+
+        case 'bottom':
+          resizeProxyRef.value.style.inset = "auto auto ".concat(state.value.aside.height, "px 0");
+          break;
+      }
+    };
+
+    var updateResizeMaskStyle = function updateResizeMaskStyle() {
+      resizeMaskRef.value.style.display = 'block';
+      resizeMaskRef.value.style.cursor = vertical.value ? 'col-resize' : 'row-resize';
+    };
+
+    var getRealValue = function getRealValue(current) {
+      return Math.min(max.value, Math.max(min.value, current), limitMax.value - triggerWidth.value);
+    };
+
+    var handleMousedown = function handleMousedown(event) {
+      emit('before-resize', event);
+      var asideRect = asideRef.value.getBoundingClientRect();
+      state.value = Object.freeze({
+        mouse: {
+          clientX: event.clientX,
+          clientY: event.clientY
+        },
+        aside: {
+          width: asideRect.width,
+          height: asideRect.height
+        }
+      });
+      updateResizeMaskStyle();
+
+      if (!immediate.value) {
+        updateResizeProxyStyle();
+      }
+
+      document.onselectstart = function () {
+        return false;
+      };
+
+      document.ondragstart = function () {
+        return false;
+      };
+
+      var resizingCallback = function resizingCallback(value) {
+        emit('resizing', value);
+      };
+
+      var handleMouseMove = function handleMouseMove(event) {
+        var delta;
+
+        switch (placement.value) {
+          case 'top':
+            delta = event.clientY - state.value.mouse.clientY;
+            break;
+
+          case 'right':
+            delta = state.value.mouse.clientX - event.clientX;
+            break;
+
+          case 'bottom':
+            delta = state.value.mouse.clientY - event.clientY;
+            break;
+
+          case 'left':
+            delta = event.clientX - state.value.mouse.clientX;
+        }
+
+        var current = state.value.aside[cssPropKey.value] + delta;
+        var realValue = getRealValue(current) + triggerOffset.value;
+        var pixel = "".concat(realValue, "px");
+
+        if (immediate.value) {
+          asideRef.value.style[cssPropKey.value] = pixel;
+        } else {
+          resizeProxyRef.value.style[placement.value] = pixel;
+        }
+
+        resizingCallback(realValue);
+      };
+
+      var handleMouseUp = function handleMouseUp() {
+        resizeProxyRef.value.style.visibility = 'hidden';
+        resizeMaskRef.value.style.display = 'none';
+        document.removeEventListener('mousemove', handleMouseMove);
+        document.removeEventListener('mouseup', handleMouseUp);
+        document.onselectstart = null;
+        document.ondragstart = null;
+        (0,external_vue_.nextTick)(function () {
+          setupAutoMinimize();
+          emit('after-resize', parseFloat(resizeProxyRef.value.style[placement.value]));
+        });
+
+        if (immediate.value) {
+          return false;
+        }
+
+        asideRef.value.style[cssPropKey.value] = resizeProxyRef.value.style[placement.value];
+      };
+
+      document.addEventListener('mousemove', handleMouseMove);
+      document.addEventListener('mouseup', handleMouseUp);
+    };
+
+    var setupAutoMinimize = function setupAutoMinimize() {
+      if (!autoMinimize.value) {
+        return false;
+      }
+
+      var asideRect = asideRef.value.getBoundingClientRect(); // 最小化同时设置为已折叠，此时展开以初始化initial-divide数据为参考
+      // eslint-disable-next-line no-multi-assign
+
+      minimized.value = collapsed.value = asideRect[cssPropKey.value] <= parseAutoMinimize.value;
+
+      if (!minimized.value) {
+        asideContentVisible.value = true;
+        return false;
+      }
+
+      setupAsideAnimation();
+      (0,external_vue_.nextTick)(function () {
+        asideRef.value.setAttribute("data-".concat(cssPropKey.value), asideStyle.value[cssPropKey.value]);
+      });
+    };
+
+    var setCollapse = function setCollapse(collapse) {
+      collapsed.value = typeof collapse === 'boolean' ? collapse : !collapsed.value;
+      setupAsideAnimation();
+      emit('collapse-change', collapsed.value);
+    };
+
+    var setupAsideAnimation = function setupAsideAnimation() {
+      var asideRect = asideRef.value.getBoundingClientRect();
+      setupAsideListener(!collapsed.value);
+
+      if (collapsed.value) {
+        asideRef.value.setAttribute("data-".concat(cssPropKey.value), "".concat(asideRect[cssPropKey.value], "px"));
+        asideRef.value.style[cssPropKey.value] = '5px';
+      } else {
+        asideContentVisible.value = true;
+        asideRef.value.style[cssPropKey.value] = asideRef.value.getAttribute("data-".concat(cssPropKey.value));
+      }
+    };
+
+    var setupAsideListener = function setupAsideListener(visible) {
+      var removeClass = function removeClass() {
+        asideContentVisible.value = visible;
+        asideRef.value.style.transition = '';
+        asideRef.value.removeEventListener('transitionend', removeClass);
+      };
+
+      asideRef.value.addEventListener('transitionend', removeClass);
+      asideRef.value.style.transition = "".concat(cssPropKey.value, " cubic-bezier(0.4, 0, 0.2, 1) .3s");
+    };
+
+    (0,external_vue_.onMounted)(function () {
+      observer.observe(bkResizeLayoutRef.value);
+    });
+    (0,external_vue_.onBeforeUnmount)(function () {
+      observer.unobserve(bkResizeLayoutRef.value);
+    });
+    return {
+      collapsed: collapsed,
+      asideContentVisible: asideContentVisible,
+      minimized: minimized,
+      limitMax: limitMax,
+      state: state,
+      vertical: vertical,
+      cssPropKey: cssPropKey,
+      bkResizeLayoutRef: bkResizeLayoutRef,
+      resizeProxyRef: resizeProxyRef,
+      resizeMaskRef: resizeMaskRef,
+      asideRef: asideRef,
+      triggerStyle: triggerStyle,
+      asideStyle: asideStyle,
+      handleMousedown: handleMousedown,
+      setCollapse: setCollapse
+    };
+  },
+  render: function render() {
+    var _a, _b, _c, _d, _e, _f;
+
+    var bkResizeLayoutClass = ['bk-resize-layout', "bk-resize-layout-".concat(this.placement), {
+      'bk-resize-layout-collapsed': this.collapsed,
+      'bk-resize-layout-border': this.border
+    }];
+    return (0,external_vue_.createVNode)("div", {
+      "ref": "bkResizeLayoutRef",
+      "class": bkResizeLayoutClass
+    }, [(0,external_vue_.createVNode)("aside", {
+      "class": "bk-resize-layout-aside",
+      "ref": "asideRef",
+      "style": this.asideStyle
+    }, [(0,external_vue_.withDirectives)((0,external_vue_.createVNode)("div", {
+      "class": "bk-resize-layout-aside-content"
+    }, [(_b = (_a = this.$slots).aside) === null || _b === void 0 ? void 0 : _b.call(_a)]), [[external_vue_.vShow, this.asideContentVisible]]), (0,external_vue_.withDirectives)((0,external_vue_.createVNode)("i", {
+      "class": "bk-resize-trigger",
+      "style": this.triggerStyle,
+      "onMousedown": (0,external_vue_.withModifiers)(this.handleMousedown, ['left'])
+    }, null), [[external_vue_.vShow, !this.disabled && (!this.collapsed || this.autoMinimize)]]), (0,external_vue_.withDirectives)((0,external_vue_.createVNode)("i", {
+      "class": ['bk-resize-proxy', this.placement],
+      "ref": "resizeProxyRef"
+    }, null), [[external_vue_.vShow, !this.collapsed || this.autoMinimize]]), this.collapsible && (((_d = (_c = this.$slots)['collapse-trigger']) === null || _d === void 0 ? void 0 : _d.call(_c)) || (this.collapsed ? (0,external_vue_.createVNode)(external_icon_.AngleRight, {
+      "class": "bk-resize-collapse",
+      "onClick": this.setCollapse
+    }, null) : (0,external_vue_.createVNode)(external_icon_.AngleLeft, {
+      "class": "bk-resize-collapse",
+      "onClick": this.setCollapse
+    }, null)))]), (0,external_vue_.createVNode)("main", {
+      "class": "bk-resize-layout-main"
+    }, [(_f = (_e = this.$slots).main) === null || _f === void 0 ? void 0 : _f.call(_e)]), (0,external_vue_.createVNode)("div", {
+      "class": "bk-resize-mask",
+      "ref": "resizeMaskRef"
+    }, null)]);
+  }
+}));
+;// CONCATENATED MODULE: ../../packages/resize-layout/src/index.ts
+/*
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+*/
+
+
+var BkResizeLayout = (0,external_shared_.withInstall)(resize_layout);
+/* harmony default export */ const src = (BkResizeLayout);
+})();
+
+/******/ 	return __webpack_exports__;
+/******/ })()
+;
+});