vxe-pc-ui 4.18.3 → 4.18.4

package/dist/all.esm.js

@@ -101,7 +101,7 @@ function checkDynamic() {
 }
 
 const { log } = VxeUI;
-const uiVersion = `ui v${"4.18.3"}`;
+const uiVersion = `ui v${"4.18.4"}`;
 function createComponentLog(name) {
     const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -115,7 +115,7 @@ function createComponentLog(name) {
 const warnLog$i = log.create('warn', uiVersion);
 log.create('error', uiVersion);
 
-const version = "4.18.3";
+const version = "4.18.4";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -9228,6 +9228,7 @@ var VxeInputComponent = defineVxeComponent({
         align: String,
         form: String,
         className: String,
+        width: [String, Number],
         inputClassName: {
             type: String,
             default: () => getConfig$3().input.inputClassName
@@ -9456,6 +9457,14 @@ var VxeInputComponent = defineVxeComponent({
             }
             return maxLen;
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computeIsDateTimeType = computed(() => {
             const { type } = props;
             return type === 'time' || type === 'datetime';
@@ -11753,6 +11762,7 @@ var VxeInputComponent = defineVxeComponent({
                     class: ['vxe-input--readonly', `type--${type}`, className]
                 }, inputValue);
             }
+            const currStyle = computeCurrStyle.value;
             const isCountError = computeIsCountError.value;
             const inputCount = computeInputCount.value;
             const inputReadonly = computeInputReadonly.value;
@@ -11779,6 +11789,7 @@ var VxeInputComponent = defineVxeComponent({
                         'is--active': isActivated,
                         'show--clear': isClearable && !isDisabled && !(inputValue === '' || XEUtils.eqNull(inputValue))
                     }],
+                style: currStyle,
                 spellcheck: false
             }, [
                 prefix || createCommentVNode(),
@@ -15339,6 +15350,7 @@ var VxeNumberInputComponent = defineVxeComponent({
             type: String,
             default: () => getConfig$3().numberInput.inputClassName
         },
+        width: [String, Number],
         size: {
             type: String,
             default: () => getConfig$3().numberInput.size || getConfig$3().size
@@ -15606,6 +15618,14 @@ var VxeNumberInputComponent = defineVxeComponent({
             const { inputClassName } = props;
             return 'vxe-number-input--input' + (inputClassName ? (' ' + inputClassName) : '');
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const refMaps = {
             refElem,
             refInput: refInputTarget
@@ -16347,6 +16367,7 @@ var VxeNumberInputComponent = defineVxeComponent({
                     class: ['vxe-number-input--readonly', `type--${type}`, className]
                 }, numLabel);
             }
+            const currStyle = computeCurrStyle.value;
             const inputReadonly = computeInputReadonly.value;
             const isClearable = computeIsClearable.value;
             const isControls = isEnableConf(controlOpts) && (controls === false ? controls : showButton);
@@ -16362,6 +16383,7 @@ var VxeNumberInputComponent = defineVxeComponent({
                         'is--active': isActivated,
                         'show--clear': isClearable && !isDisabled && !(inputValue === '' || XEUtils.eqNull(inputValue))
                     }],
+                style: currStyle,
                 spellcheck: false,
                 onMouseenter: mouseenterEvent,
                 onMouseleave: mouseleaveEvent
@@ -16456,6 +16478,7 @@ var VxeColorPickerComponent = defineVxeComponent({
             type: String,
             default: () => getConfig$3().colorPicker.type
         },
+        width: [Number, String],
         size: {
             type: String,
             default: () => getConfig$3().colorPicker.size || getConfig$3().size
@@ -16607,6 +16630,14 @@ var VxeColorPickerComponent = defineVxeComponent({
             }
             return [];
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computePopupOpts = computed(() => {
             return Object.assign({}, getConfig$3().colorPicker.popupConfig, props.popupConfig);
         });
@@ -17364,8 +17395,6 @@ var VxeColorPickerComponent = defineVxeComponent({
             const isDisabled = computeIsDisabled.value;
             const btnTransfer = computeBtnTransfer.value;
             const formReadonly = computeFormReadonly.value;
-            const popupOpts = computePopupOpts.value;
-            const { appendTo } = popupOpts;
             if (formReadonly) {
                 return h('div', {
                     ref: refElem,
@@ -17385,6 +17414,9 @@ var VxeColorPickerComponent = defineVxeComponent({
                     })
                 ]);
             }
+            const currStyle = computeCurrStyle.value;
+            const popupOpts = computePopupOpts.value;
+            const { appendTo } = popupOpts;
             return h('div', {
                 ref: refElem,
                 class: ['vxe-color-picker', className ? (XEUtils.isFunction(className) ? className({ $colorPicker: $xeColorPicker }) : className) : '', {
@@ -17393,7 +17425,8 @@ var VxeColorPickerComponent = defineVxeComponent({
                         'is--visible': visiblePanel,
                         'is--disabled': isDisabled,
                         'is--active': isActivated
-                    }]
+                    }],
+                style: currStyle
             }, [
                 h('input', {
                     ref: refInputTarget,
@@ -20477,6 +20510,7 @@ var VxeDatePickerComponent = defineVxeComponent({
             type: String,
             default: 'date'
         },
+        width: [Number, String],
         clearable: {
             type: Boolean,
             default: () => getConfig$3().datePicker.clearable
@@ -20694,6 +20728,14 @@ var VxeDatePickerComponent = defineVxeComponent({
             }
             return [];
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computeDateStartDate = computed(() => {
             return props.startDate ? XEUtils.toStringDate(props.startDate) : null;
         });
@@ -21952,6 +21994,7 @@ var VxeDatePickerComponent = defineVxeComponent({
                     class: ['vxe-date-picker--readonly', `type--${type}`, className]
                 }, panelLabel);
             }
+            const currStyle = computeCurrStyle.value;
             const inputReadonly = computeInputReadonly.value;
             const inpPlaceholder = computeInpPlaceholder.value;
             const isClearable = computeIsClearable.value;
@@ -21968,6 +22011,7 @@ var VxeDatePickerComponent = defineVxeComponent({
                         'is--active': isActivated,
                         'show--clear': isClearable && !isDisabled && !(inputValue === '' || XEUtils.eqNull(inputValue))
                     }],
+                style: currStyle,
                 spellcheck: false
             }, [
                 prefix || renderEmptyElement($xeDatePicker),
@@ -22082,6 +22126,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             type: Boolean,
             default: true
         },
+        width: [Number, String],
         name: String,
         type: {
             type: String,
@@ -22297,6 +22342,14 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             }
             return [];
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computeMVal = computed(() => {
             const { startValue, endValue } = props;
             return `${startValue || ''}${endValue || ''}`;
@@ -23461,6 +23514,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                     class: ['vxe-date-range-picker--readonly', `type--${type}`, className]
                 }, inputLabel);
             }
+            const currStyle = computeCurrStyle.value;
             const inpPlaceholder = computeInpPlaceholder.value;
             const isClearable = computeIsClearable.value;
             const prefix = renderPrefixIcon();
@@ -23476,6 +23530,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                         'is--active': isActivated,
                         'show--clear': isClearable && !isDisabled && (selectStValue || selectEdValue)
                     }],
+                style: currStyle,
                 spellcheck: false
             }, [
                 prefix || renderEmptyElement($xeDateRangePicker),
@@ -26873,6 +26928,7 @@ var VxeIconPickerComponent = defineVxeComponent({
          * @deprecated
          */
         popupClassName: [String, Function],
+        width: [Number, String],
         showIconTitle: {
             type: Boolean,
             default: () => getConfig$3().iconPicker.showIconTitle
@@ -26978,6 +27034,14 @@ var VxeIconPickerComponent = defineVxeComponent({
             }
             return getI18n$2('vxe.base.pleaseSelect');
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computeWrapperStyle = computed(() => {
             const popupOpts = computePopupOpts.value;
             const { chunkSize, height, chunkWidth, maxHeight } = popupOpts;
@@ -27384,11 +27448,6 @@ var VxeIconPickerComponent = defineVxeComponent({
             const isDisabled = computeIsDisabled.value;
             const btnTransfer = computeBtnTransfer.value;
             const formReadonly = computeFormReadonly.value;
-            const inpPlaceholder = computeInpPlaceholder.value;
-            const wrapperStyle = computeWrapperStyle.value;
-            const popupOpts = computePopupOpts.value;
-            const { appendTo } = popupOpts;
-            const ppClassName = popupOpts.className || props.popupClassName;
             if (formReadonly) {
                 return h('div', {
                     ref: refElem,
@@ -27399,6 +27458,12 @@ var VxeIconPickerComponent = defineVxeComponent({
                     })
                 ]);
             }
+            const currStyle = computeCurrStyle.value;
+            const inpPlaceholder = computeInpPlaceholder.value;
+            const wrapperStyle = computeWrapperStyle.value;
+            const popupOpts = computePopupOpts.value;
+            const { appendTo } = popupOpts;
+            const ppClassName = popupOpts.className || props.popupClassName;
             return h('div', {
                 ref: refElem,
                 class: ['vxe-ico-picker', className ? (XEUtils.isFunction(className) ? className({ $iconPicker: $xeIconPicker }) : className) : '', {
@@ -27407,7 +27472,8 @@ var VxeIconPickerComponent = defineVxeComponent({
                         'is--visible': visiblePanel,
                         'is--disabled': isDisabled,
                         'is--active': isActivated
-                    }]
+                    }],
+                style: currStyle
             }, [
                 h('div', {
                     class: 'vxe-ico-picker--inner',
@@ -31933,6 +31999,7 @@ var VxeSelectComponent = defineVxeComponent({
          * @deprecated
          */
         popupClassName: [String, Function],
+        width: [String, Number],
         max: {
             type: [String, Number],
             default: null
@@ -32158,6 +32225,14 @@ var VxeSelectComponent = defineVxeComponent({
         const computeMultiMaxCharNum = computed(() => {
             return XEUtils.toNumber(props.multiCharOverflow);
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const computePopupWrapperStyle = computed(() => {
             const popupOpts = computePopupOpts.value;
             const { height, width } = popupOpts;
@@ -33339,14 +33414,7 @@ var VxeSelectComponent = defineVxeComponent({
             const btnTransfer = computeBtnTransfer.value;
             const formReadonly = computeFormReadonly.value;
             const inpPlaceholder = computeInpPlaceholder.value;
-            const popupWrapperStyle = computePopupWrapperStyle.value;
-            const popupOpts = computePopupOpts.value;
-            const { appendTo } = popupOpts;
             const defaultSlot = slots.default;
-            const headerSlot = slots.header;
-            const footerSlot = slots.footer;
-            const prefixSlot = slots.prefix;
-            const ppClassName = popupOpts.className || props.popupClassName;
             if (formReadonly) {
                 return h('div', {
                     ref: refElem,
@@ -33362,7 +33430,15 @@ var VxeSelectComponent = defineVxeComponent({
                     }, selectLabel)
                 ]);
             }
+            const currStyle = computeCurrStyle.value;
             const selectVals = computeSelectVals.value;
+            const popupWrapperStyle = computePopupWrapperStyle.value;
+            const popupOpts = computePopupOpts.value;
+            const headerSlot = slots.header;
+            const footerSlot = slots.footer;
+            const prefixSlot = slots.prefix;
+            const { appendTo } = popupOpts;
+            const ppClassName = popupOpts.className || props.popupClassName;
             return h('div', {
                 ref: refElem,
                 class: ['vxe-select', className ? (XEUtils.isFunction(className) ? className({ $select: $xeSelect }) : className) : '', {
@@ -33372,7 +33448,8 @@ var VxeSelectComponent = defineVxeComponent({
                         'is--filter': filterable,
                         'is--loading': loading,
                         'is--active': isActivated
-                    }]
+                    }],
+                style: currStyle
             }, [
                 h('div', {
                     class: 'vxe-select-slots',
@@ -34329,6 +34406,7 @@ var VxePasswordInputComponent = defineVxeComponent({
             type: String,
             default: () => getConfig$3().passwordInput.inputClassName
         },
+        width: [String, Number],
         size: {
             type: String,
             default: () => getConfig$3().passwordInput.size || getConfig$3().size
@@ -34443,6 +34521,14 @@ var VxePasswordInputComponent = defineVxeComponent({
             const { inputValue } = reactData;
             return inputValue;
         });
+        const computeCurrStyle = computed(() => {
+            const { width } = props;
+            const stys = {};
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
+            return stys;
+        });
         const dispatchEvent = (type, params, evnt) => {
             emit(type, createEvent(evnt, { $passwordInput: $xePasswordInput }, params));
         };
@@ -34640,6 +34726,7 @@ var VxePasswordInputComponent = defineVxeComponent({
                     class: ['vxe-password-input--readonly', className]
                 }, getText(inputValue));
             }
+            const currStyle = computeCurrStyle.value;
             const vSize = computeSize.value;
             const inputType = computeInputType.value;
             const inpPlaceholder = computeInpPlaceholder.value;
@@ -34659,6 +34746,7 @@ var VxePasswordInputComponent = defineVxeComponent({
                         'is--active': isActivated,
                         'show--clear': isClearable && !isDisabled && !(inputValue === '' || XEUtils.eqNull(inputValue))
                     }],
+                style: currStyle,
                 spellcheck: false
             }, [
                 prefix || renderEmptyElement($xePasswordInput),
@@ -38601,6 +38689,7 @@ var VxeSpaceComponent = defineVxeComponent({
             type: Boolean,
             default: () => getConfig$3().space.wrap
         },
+        width: [Number, String],
         gap: {
             type: [Number, String, Array, Object],
             default: () => getConfig$3().space.gap
@@ -38658,8 +38747,8 @@ var VxeSpaceComponent = defineVxeComponent({
         const refMaps = {
             refElem
         };
-        const computeWrapperStyle = computed(() => {
-            const { align, gap } = props;
+        const computeCurrStyle = computed(() => {
+            const { align, gap, width } = props;
             const stys = {};
             let rowGap = '';
             let columGap = '';
@@ -38677,6 +38766,9 @@ var VxeSpaceComponent = defineVxeComponent({
                     columGap = gap.columGap || '';
                 }
             }
+            if (width) {
+                stys.width = toCssUnit(width);
+            }
             if (align) {
                 stys['align-items'] = align;
             }
@@ -38744,7 +38836,7 @@ var VxeSpaceComponent = defineVxeComponent({
         };
         const renderVN = () => {
             const { vertical, wrap, className, fill, itemWidth, itemMinWidth, itemMaxWidth } = props;
-            const wrapperStyle = computeWrapperStyle.value;
+            const currStyle = computeCurrStyle.value;
             const vSize = computeSize.value;
             return h('div', {
                 ref: refElem,
@@ -38755,7 +38847,7 @@ var VxeSpaceComponent = defineVxeComponent({
                         'is--fill': fill,
                         'is--width': itemWidth || itemMinWidth || itemMaxWidth
                     }],
-                style: wrapperStyle
+                style: currStyle
             }, renderItems());
         };
         $xeSpace.renderVN = renderVN;