vxe-pc-ui 4.16.9 → 4.16.11

package/lib/layout-aside/src/layout-aside.js

@@ -43,25 +43,23 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
     const computeCollapseOpts = (0, _vue.computed)(() => {
       return Object.assign({}, (0, _ui.getConfig)().layoutAside.collapseConfig, props.collapseConfig);
     });
-    const computeWrapperWidth = (0, _vue.computed)(() => {
+    const computeVarStyle = (0, _vue.computed)(() => {
       const {
         width,
-        collapsed,
         collapseWidth
       } = props;
-      if (collapsed) {
-        if (collapseWidth) {
-          return (0, _dom.toCssUnit)(collapseWidth);
-        }
-      } else {
-        if (width) {
-          return (0, _dom.toCssUnit)(width);
-        }
+      const stys = {};
+      if (collapseWidth) {
+        stys['--vxe-ui-layout-aside-collapse-width'] = (0, _dom.toCssUnit)(collapseWidth);
+      }
+      if (width) {
+        stys['--vxe-ui-layout-aside-default-width'] = (0, _dom.toCssUnit)(width);
       }
-      return '';
+      return stys;
     });
     const computeMaps = {
-      computeSize
+      computeSize,
+      computeVarStyle
     };
     const $xeLayoutAside = {
       xID,
@@ -83,12 +81,11 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
     Object.assign($xeLayoutAside, layoutAsideMethods, layoutAsidePrivateMethods);
     const renderVN = () => {
       const {
-        width,
         collapsed,
         loading,
         padding
       } = props;
-      const wrapperWidth = computeWrapperWidth.value;
+      const varStyle = computeVarStyle.value;
       const vSize = computeSize.value;
       const collapseOpts = computeCollapseOpts.value;
       const defaultSlot = slots.default;
@@ -98,13 +95,10 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
           [`size--${vSize}`]: vSize,
           'is--animat': collapseOpts.animation !== false,
           'is--padding': padding,
-          'is--default-width': !width,
           'is--collapse': collapsed,
           'is--loading': loading
         }],
-        style: wrapperWidth ? {
-          width: wrapperWidth
-        } : null
+        style: varStyle
       }, [(0, _vue.h)('div', {
         class: 'vxe-layout-aside--inner'
       }, defaultSlot ? defaultSlot({}) : []),

package/lib/layout-aside/src/layout-aside.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_dom=require("../../ui/src/dom"),_ui=require("../../ui"),_loading=_interopRequireDefault(require("../../loading")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeLayoutAside",props:{width:[String,Number],collapsed:Boolean,collapseWidth:[String,Number],loading:Boolean,padding:Boolean,collapseConfig:Object,size:{type:String,default:()=>(0,_ui.getConfig)().layoutAside.size||(0,_ui.getConfig)().size}},emits:[],setup(s,e){let{slots:d,emit:u}=e;var i=_xeUtils.default.uniqueId();let n=(0,_vue.ref)(),p=(0,_ui.useSize)(s).computeSize;var t=(0,_vue.reactive)({});let a={refElem:n},_=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().layoutAside.collapseConfig,s.collapseConfig)),c=(0,_vue.computed)(()=>{var{width:e,collapsed:i,collapseWidth:t}=s;if(i){if(t)return(0,_dom.toCssUnit)(t)}else if(e)return(0,_dom.toCssUnit)(e);return""}),l={computeSize:p},o={xID:i,props:s,context:e,reactData:t,getRefMaps:()=>a,getComputeMaps:()=>l};Object.assign(o,{dispatchEvent:(e,i,t)=>{u(e,(0,_ui.createEvent)(t,{$layoutAside:o},i))}},{});return(0,_vue.provide)("$xeLayoutAside",o),o.renderVN=()=>{var{width:e,collapsed:i,loading:t,padding:u}=s,a=c.value,l=p.value,o=_.value,r=d.default;return(0,_vue.h)("aside",{ref:n,class:["vxe-layout-aside",{["size--"+l]:l,"is--animat":!1!==o.animation,"is--padding":u,"is--default-width":!e,"is--collapse":i,"is--loading":t}],style:a?{width:a}:null},[(0,_vue.h)("div",{class:"vxe-layout-aside--inner"},r?r({}):[]),(0,_vue.h)(_loading.default,{class:"vxe-list-view--loading",modelValue:t})])},o},render(){return this.renderVN()}});
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_dom=require("../../ui/src/dom"),_ui=require("../../ui"),_loading=_interopRequireDefault(require("../../loading")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeLayoutAside",props:{width:[String,Number],collapsed:Boolean,collapseWidth:[String,Number],loading:Boolean,padding:Boolean,collapseConfig:Object,size:{type:String,default:()=>(0,_ui.getConfig)().layoutAside.size||(0,_ui.getConfig)().size}},emits:[],setup(s,e){let{slots:r,emit:a}=e;var i=_xeUtils.default.uniqueId();let d=(0,_vue.ref)(),n=(0,_ui.useSize)(s).computeSize;var t=(0,_vue.reactive)({});let u={refElem:d},p=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().layoutAside.collapseConfig,s.collapseConfig)),c=(0,_vue.computed)(()=>{var{width:e,collapseWidth:i}=s,t={};return i&&(t["--vxe-ui-layout-aside-collapse-width"]=(0,_dom.toCssUnit)(i)),e&&(t["--vxe-ui-layout-aside-default-width"]=(0,_dom.toCssUnit)(e)),t}),o={computeSize:n,computeVarStyle:c},l={xID:i,props:s,context:e,reactData:t,getRefMaps:()=>u,getComputeMaps:()=>o};Object.assign(l,{dispatchEvent:(e,i,t)=>{a(e,(0,_ui.createEvent)(t,{$layoutAside:l},i))}},{});return(0,_vue.provide)("$xeLayoutAside",l),l.renderVN=()=>{var{collapsed:e,loading:i,padding:t}=s,a=c.value,u=n.value,o=p.value,l=r.default;return(0,_vue.h)("aside",{ref:d,class:["vxe-layout-aside",{["size--"+u]:u,"is--animat":!1!==o.animation,"is--padding":t,"is--collapse":e,"is--loading":i}],style:a},[(0,_vue.h)("div",{class:"vxe-layout-aside--inner"},l?l({}):[]),(0,_vue.h)(_loading.default,{class:"vxe-list-view--loading",modelValue:i})])},l},render(){return this.renderVN()}});

package/lib/layout-aside/style/style.css

@@ -3,14 +3,12 @@
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
+  width: var(--vxe-ui-layout-aside-default-width);
   overflow: hidden;
 }
 .vxe-layout-aside.is--animat {
   transition: width 0.3s;
 }
-.vxe-layout-aside.is--default-width {
-  width: var(--vxe-ui-layout-aside-default-width);
-}
 .vxe-layout-aside.is--collapse {
   width: var(--vxe-ui-layout-aside-collapse-width);
 }

package/lib/layout-aside/style/style.min.css

@@ -1 +1 @@
-.vxe-layout-aside{position:relative;display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.vxe-layout-aside.is--animat{transition:width .3s}.vxe-layout-aside.is--default-width{width:var(--vxe-ui-layout-aside-default-width)}.vxe-layout-aside.is--collapse{width:var(--vxe-ui-layout-aside-collapse-width)}.vxe-layout-aside.is--padding{padding:var(--vxe-ui-layout-padding-default)}.vxe-layout-aside--inner{flex-grow:1;overflow-y:auto;overflow-x:hidden;outline:0}
+.vxe-layout-aside{position:relative;display:flex;flex-direction:column;flex-shrink:0;width:var(--vxe-ui-layout-aside-default-width);overflow:hidden}.vxe-layout-aside.is--animat{transition:width .3s}.vxe-layout-aside.is--collapse{width:var(--vxe-ui-layout-aside-collapse-width)}.vxe-layout-aside.is--padding{padding:var(--vxe-ui-layout-padding-default)}.vxe-layout-aside--inner{flex-grow:1;overflow-y:auto;overflow-x:hidden;outline:0}