cosey 0.3.6 → 0.3.7

package/components/index.js

@@ -72,6 +72,7 @@ export { defaultMapSizeColNumber, formQueryContextSymbol, formQueryProps } from
 export { default as hljs } from 'highlight.js/lib/core';
 export { addIconifyIcon, iconifyIconsSets } from './iconify-icon/iconify-icon.js';
 export { imageProps } from './image-card/image-card.js';
+export { defaultInputNumberRangeProps } from './input-number-range/input-number-range.js';
 export { defaultLongTextProps } from './long-text/long-text.js';
 export { defaultMediaCardBaseProps, mediaCardBaseProps } from './media-card/media-card.js';
 export { defaultMediaViewerBaseProps, defaultMediaViewerProps } from './media-viewer/media-viewer.js';

package/components/input-number-range/index.d.ts

@@ -6,7 +6,9 @@ declare const _InputNumberRange: {
     }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
         change: (value: number[] | undefined) => any;
         "update:modelValue": (value: number[] | undefined) => any;
-    }, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+    }, import("vue").PublicProps, {
+        validateEvent: boolean;
+    }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -16,7 +18,9 @@ declare const _InputNumberRange: {
     }, Readonly<import("./input-number-range").InputNumberRangeProps> & Readonly<{
         onChange?: ((value: number[] | undefined) => any) | undefined;
         "onUpdate:modelValue"?: ((value: number[] | undefined) => any) | undefined;
-    }>, {}, {}, {}, {}, {}>;
+    }>, {}, {}, {}, {}, {
+        validateEvent: boolean;
+    }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
@@ -26,7 +30,9 @@ declare const _InputNumberRange: {
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     change: (value: number[] | undefined) => any;
     "update:modelValue": (value: number[] | undefined) => any;
-}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+}, string, {
+    validateEvent: boolean;
+}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: import("./input-number-range").InputNumberRangeSlots;
 }) & import("vue").Plugin;
 export { _InputNumberRange as InputNumberRange };

package/components/input-number-range/index.js

@@ -1,5 +1,6 @@
 import { withInstall } from '../utils.js';
 import stdin_default$1 from './input-number-range.vue.js';
+export { defaultInputNumberRangeProps } from './input-number-range.js';
 
 const _InputNumberRange = withInstall(stdin_default$1);
 var stdin_default = _InputNumberRange;

package/components/input-number-range/input-number-range.d.ts

@@ -1,8 +1,19 @@
 export interface InputNumberRangeProps {
     modelValue?: number[];
+    min?: number;
+    max?: number;
+    step?: number;
+    stepStrictly?: boolean;
+    precision?: number;
     startPlaceholder?: string;
     endPlaceholder?: string;
+    readonly?: boolean;
+    disabled?: boolean;
+    validateEvent?: boolean;
 }
+export declare const defaultInputNumberRangeProps: {
+    validateEvent: boolean;
+};
 export interface InputNumberRangeSlots {
     default?: (props: Record<string, never>) => any;
 }

package/components/input-number-range/input-number-range.js

@@ -1 +1,5 @@
+const defaultInputNumberRangeProps = {
+  validateEvent: true
+};
 
+export { defaultInputNumberRangeProps };

package/components/input-number-range/input-number-range.vue.d.ts

@@ -6,7 +6,9 @@ declare const __VLS_component: import("vue").DefineComponent<InputNumberRangePro
 }, string, import("vue").PublicProps, Readonly<InputNumberRangeProps> & Readonly<{
     onChange?: ((value: number[] | undefined) => any) | undefined;
     "onUpdate:modelValue"?: ((value: number[] | undefined) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    validateEvent: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/components/input-number-range/input-number-range.vue.js

@@ -1,6 +1,9 @@
-import { defineComponent, ref, watch, createElementBlock, openBlock, normalizeClass, unref, createVNode, createElementVNode } from 'vue';
+import { defineComponent, mergeDefaults, ref, watch, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createVNode } from 'vue';
+import { defaultInputNumberRangeProps } from './input-number-range.js';
 import stdin_default$1 from './style/index.js';
-import { ElInput } from 'element-plus';
+import { useFormItem, CHANGE_EVENT, ElInputNumber } from 'element-plus';
+import { debugWarn } from 'element-plus/es/utils/error.mjs';
+import { isNullish } from '../../utils/is.js';
 import { useComponentConfig } from '../config-provider/config-provider.js';
 
 var stdin_default = /* @__PURE__ */defineComponent({
@@ -8,11 +11,31 @@ var stdin_default = /* @__PURE__ */defineComponent({
     name: "InputNumberRange"
   },
   __name: "input-number-range",
-  props: {
+  props: /* @__PURE__ */mergeDefaults({
     modelValue: {
       type: Array,
       required: false
     },
+    min: {
+      type: Number,
+      required: false
+    },
+    max: {
+      type: Number,
+      required: false
+    },
+    step: {
+      type: Number,
+      required: false
+    },
+    stepStrictly: {
+      type: Boolean,
+      required: false
+    },
+    precision: {
+      type: Number,
+      required: false
+    },
     startPlaceholder: {
       type: String,
       required: false
@@ -20,8 +43,20 @@ var stdin_default = /* @__PURE__ */defineComponent({
     endPlaceholder: {
       type: String,
       required: false
+    },
+    readonly: {
+      type: Boolean,
+      required: false
+    },
+    disabled: {
+      type: Boolean,
+      required: false
+    },
+    validateEvent: {
+      type: Boolean,
+      required: false
     }
-  },
+  }, defaultInputNumberRangeProps),
   emits: ["update:modelValue", "change"],
   setup(__props, {
     expose: __expose,
@@ -35,30 +70,95 @@ var stdin_default = /* @__PURE__ */defineComponent({
     const {
       hashId
     } = stdin_default$1(prefixCls);
-    const start = ref();
-    const end = ref();
+    const {
+      formItem
+    } = useFormItem();
+    const start = ref(null);
+    const end = ref(null);
+    const innerValue = ref(props.modelValue);
     watch([start, end], () => {
-      const value = start.value && end.value ? [+start.value, +end.value] : void 0;
-      emit("update:modelValue", value);
-      emit("change", value);
+      const startNil = isNullish(start.value);
+      const endNil = isNullish(end.value);
+      if (startNil && endNil || !startNil && !endNil) {
+        const value = startNil && endNil ? void 0 : [start.value, end.value];
+        if (value !== innerValue.value) {
+          innerValue.value = value;
+          emit("update:modelValue", value);
+          emit("change", value);
+        }
+      }
+    });
+    watch(() => props.modelValue, () => {
+      if (props.validateEvent) {
+        formItem?.validate?.(CHANGE_EVENT).catch(err => debugWarn(err));
+      }
+    });
+    watch(() => props.modelValue, newValue => {
+      if (innerValue.value !== newValue) {
+        innerValue.value = newValue;
+        if (!newValue) {
+          start.value = null;
+          end.value = null;
+        } else {
+          let [startValue, endValue] = newValue.map(item => {
+            item = +item;
+            return Number.isNaN(item) ? null : item;
+          });
+          start.value = startValue;
+          end.value = endValue;
+        }
+      }
     });
+    const isFocused = ref(false);
+    const onFocusIn = () => {
+      isFocused.value = true;
+    };
+    const onFocusOut = () => {
+      isFocused.value = false;
+    };
     __expose();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass([unref(hashId), unref(prefixCls)])
-      }, [createVNode(unref(ElInput), {
+        class: normalizeClass([unref(hashId), unref(prefixCls), {
+          "is-focus": isFocused.value
+        }, "el-input__wrapper"]),
+        onFocusin: onFocusIn,
+        onFocusout: onFocusOut
+      }, [createElementVNode("div", {
+        class: normalizeClass(`${unref(prefixCls)}-start`)
+      }, [createVNode(unref(ElInputNumber), {
         modelValue: start.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => start.value = $event),
-        type: "number",
+        min: _ctx.min,
+        max: _ctx.max,
+        step: _ctx.step,
+        "step-strictly": _ctx.stepStrictly,
+        precision: _ctx.precision,
+        controls: false,
+        readonly: _ctx.readonly,
+        disabled: _ctx.disabled,
         placeholder: _ctx.startPlaceholder
-      }, null, 8, ["modelValue", "placeholder"]), _cache[2] || (_cache[2] = createElementVNode("span", null, "-", -1
-      /* HOISTED */)), createVNode(unref(ElInput), {
+      }, null, 8, ["modelValue", "min", "max", "step", "step-strictly", "precision", "readonly", "disabled", "placeholder"])], 2
+      /* CLASS */), createElementVNode("div", {
+        class: normalizeClass(`${unref(prefixCls)}-separator`)
+      }, "-", 2
+      /* CLASS */), createElementVNode("div", {
+        class: normalizeClass(`${unref(prefixCls)}-end`)
+      }, [createVNode(unref(ElInputNumber), {
         modelValue: end.value,
         "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => end.value = $event),
-        type: "number",
+        min: _ctx.min,
+        max: _ctx.max,
+        step: _ctx.step,
+        "step-strictly": _ctx.stepStrictly,
+        precision: _ctx.precision,
+        controls: false,
+        readonly: _ctx.readonly,
+        disabled: _ctx.disabled,
         placeholder: _ctx.endPlaceholder
-      }, null, 8, ["modelValue", "placeholder"])], 2
-      /* CLASS */);
+      }, null, 8, ["modelValue", "min", "max", "step", "step-strictly", "precision", "readonly", "disabled", "placeholder"])], 2
+      /* CLASS */)], 34
+      /* CLASS, NEED_HYDRATION */);
     };
   }
 });

package/components/input-number-range/style/index.js

@@ -5,9 +5,33 @@ var stdin_default = getSimpleStyleHook("InputNumberRange", (token) => {
   return {
     [`${componentCls}`]: {
       display: "flex",
-      gap: token.sizeXXS,
-      "::-webkit-inner-spin-button, ::-webkit-outer-spin-button": {
-        WebkitAppearance: "none"
+      width: "100%",
+      paddingInline: 10,
+      verticalAlign: "middle",
+      "&:hover": {
+        boxShadow: `0 0 0 1px var(--el-border-color-hover) inset`
+      },
+      "&.is-focus": {
+        boxShadow: `0 0 0 1px ${token.colorPrimary} inset`
+      },
+      [`${componentCls}-start,${componentCls}-end`]: {
+        display: "flex",
+        flex: 1,
+        ".el-input__wrapper": {
+          boxShadow: "none !important"
+        }
+      },
+      [`${componentCls}-separator`]: {
+        flex: "none",
+        height: "100%",
+        paddingInline: token.paddingXS
+      },
+      ".el-input-number": {
+        width: 0,
+        flex: 1,
+        "&.is-without-controls .el-input__wrapper": {
+          padding: 0
+        }
       }
     }
   };

package/components/table/table.vue.js

@@ -15,13 +15,13 @@ import stdin_default$7 from './table-footer/index.js';
 import { defaultSummaryMethod } from './table-footer/utils.js';
 import { uniqid } from '../../utils/string.js';
 import { useComponentConfig, useConfig } from '../config-provider/config-provider.js';
-import { isNullish, isObject, isFunction } from '../../utils/is.js';
 import { flatColumns } from '../../utils/excel/index.js';
 import { getVNodeText, createMergedExpose } from '../../utils/vue.js';
 import { useFetch } from '../../hooks/useFetch.js';
 import { useFullPage } from '../../hooks/useFullPage.js';
 import { useLocale } from '../../hooks/useLocale.js';
 import { addPxUnit } from '../../utils/css.js';
+import { isNullish, isObject, isFunction } from '../../utils/is.js';
 import { useResizeObserver } from '../../hooks/useResizeObserver.js';
 import { walkTree } from '../../utils/tree.js';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosey",
-  "version": "0.3.6",
+  "version": "0.3.7",
   "description": "基于 Vue3 + vite 的后台管理系统框架",
   "type": "module",
   "main": "index.js",