@fangzhongya/fang-ui 0.1.56 → 0.1.58

package/dist/components/edit/index.css

@@ -23,19 +23,19 @@
 }
 
 .edit {
-  display: inline-flex;
+  display: inline-block;
   align-items: center;
+  height: 100%;
 }
 .edit-value {
   display: inline-block;
+  height: 100%;
   min-width: 3px;
 }
 .edit-icon {
-  display: inline-flex;
-  align-items: center;
+  box-sizing: border-box;
   height: 100%;
-  min-width: 3px;
   font-size: 16px;
-  margin: 0 4px;
+  margin: 2px;
   cursor: pointer;
 }

package/dist/components/edit/index.scss

@@ -2,19 +2,19 @@
 
 $edit: 'edit';
 @include b($edit) {
-	display: inline-flex;
+	display: inline-block;
 	align-items: center;
+	height: 100%;
 	&-value {
 		display: inline-block;
+		height: 100%;
 		min-width: 3px;
 	}
 	&-icon {
-		display: inline-flex;
-		align-items: center;
+		box-sizing: border-box;
 		height: 100%;
-		min-width: 3px;
 		font-size: 16px;
-		margin: 0 4px;
+		margin: 2px;
 		cursor: pointer;
 	}
 }

package/dist/components/edit/src/data.cjs

@@ -15,12 +15,13 @@ const dataProps = {
   },
   textarea: Boolean,
   /**
-   * @props { Boolean } noEmpty= ( )
+   * @props { Boolean } isEmpty= ( )
    * 不能为空
    */
   isEmpty: {
     type: Boolean
-  }
+  },
+  type: { type: String, default: "icon" }
 };
 const dataEmits = ["update:modelValue"];
 const dataSlot = {

package/dist/components/edit/src/data.d.ts

@@ -17,12 +17,16 @@ export declare const dataProps: {
     };
     textarea: BooleanConstructor;
     /**
-     * @props { Boolean } noEmpty= ( )
+     * @props { Boolean } isEmpty= ( )
      * 不能为空
      */
     isEmpty: {
         type: BooleanConstructor;
     };
+    type: {
+        type: () => "icon" | "input";
+        default: string;
+    };
 };
 export type DataProps = ExtractPropTypes<typeof dataProps>;
 /**

package/dist/components/edit/src/data.js

@@ -13,12 +13,13 @@ const dataProps = {
   },
   textarea: Boolean,
   /**
-   * @props { Boolean } noEmpty= ( )
+   * @props { Boolean } isEmpty= ( )
    * 不能为空
    */
   isEmpty: {
     type: Boolean
-  }
+  },
+  type: { type: String, default: "icon" }
 };
 const dataEmits = ["update:modelValue"];
 const dataSlot = {

package/dist/components/edit/src/index2.cjs

@@ -20,13 +20,19 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isInput = vue.ref(false);
     const isIcon = vue.ref(false);
     const refEditInput = vue.ref();
-    const refEdit = vue.ref();
+    const refDom = vue.ref();
     const width = vue.ref("");
-    const display = vue.ref("");
     const getWidth = () => {
-      const dom = refEdit.value;
+      const dom = refDom.value;
       if (dom) {
-        width.value = (dom.clientWidth || dom.offsetWidth) + 40 + "px";
+        const f = dom.parentElement;
+        const d = dom.clientWidth || dom.offsetWidth;
+        const fw = (f == null ? void 0 : f.clientWidth) || (f == null ? void 0 : f.offsetWidth);
+        if (fw && fw > d + 60) {
+          width.value = d + 60 + "px";
+        } else {
+          width.value = d + "px";
+        }
       }
     };
     const value = vue.computed({
@@ -49,13 +55,19 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     }
     function onBlur() {
       setIsIcon();
-      isInput.value = false;
     }
     function setIsIcon() {
-      if (!value.value && props.isEmpty) {
-        isIcon.value = true;
+      if (!value.value && !props.isEmpty) {
+        if (props.type == "input") {
+          isInput.value = true;
+          isIcon.value = false;
+        } else {
+          isInput.value = false;
+          isIcon.value = true;
+        }
       } else {
         isIcon.value = false;
+        isInput.value = false;
       }
     }
     function onClick() {
@@ -65,17 +77,18 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         refEditInput.value.focus();
       });
     }
-    vue.onMounted(() => {
-      let dom = refEdit.value;
-      dom.onmouseenter = (event) => {
+    const onmouseenter = (event) => {
+      if (props.type == "input") {
+        isInput.value = true;
+      } else {
         isIcon.value = true;
-        getWidth();
-      };
-      dom.onmouseleave = (event) => {
-        setIsIcon();
-        isInput.value = false;
-      };
-      display.value = dom.style.display || "inline";
+      }
+      getWidth();
+    };
+    const onmouseleave = (event) => {
+      setIsIcon();
+    };
+    vue.onMounted(() => {
       getWidth();
     });
     __expose({
@@ -83,13 +96,15 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("span", {
-        ref_key: "refEdit",
-        ref: refEdit,
+        onMouseenter: onmouseenter,
+        onMouseleave: onmouseleave,
+        ref_key: "refDom",
+        ref: refDom,
         class: vue.normalizeClass(vue.unref(cs).z())
       }, [
         isInput.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.Inputs), {
           key: 0,
-          style: vue.normalizeStyle({ width: width.value, display: display.value }),
+          style: vue.normalizeStyle({ width: width.value }),
           modelValue: value.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
           ref_key: "refEditInput",
@@ -103,7 +118,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           onDblclick: vue.withModifiers(onDblclick, ["stop"]),
           class: vue.normalizeClass(vue.unref(cs).z("value"))
         }, vue.toDisplayString(value.value), 35)),
-        isIcon.value && !isInput.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$3.Icon), {
+        vue.unref(props).type == "icon" && isIcon.value && !isInput.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$3.Icon), {
           key: 2,
           onClick,
           class: vue.normalizeClass(vue.unref(cs).z("icon"))
@@ -113,7 +128,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           ]),
           _: 1
         }, 8, ["class"])) : vue.createCommentVNode("", true)
-      ], 2);
+      ], 34);
     };
   }
 });

package/dist/components/edit/src/index2.js

@@ -18,13 +18,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const isInput = ref(false);
     const isIcon = ref(false);
     const refEditInput = ref();
-    const refEdit = ref();
+    const refDom = ref();
     const width = ref("");
-    const display = ref("");
     const getWidth = () => {
-      const dom = refEdit.value;
+      const dom = refDom.value;
       if (dom) {
-        width.value = (dom.clientWidth || dom.offsetWidth) + 40 + "px";
+        const f = dom.parentElement;
+        const d = dom.clientWidth || dom.offsetWidth;
+        const fw = (f == null ? void 0 : f.clientWidth) || (f == null ? void 0 : f.offsetWidth);
+        if (fw && fw > d + 60) {
+          width.value = d + 60 + "px";
+        } else {
+          width.value = d + "px";
+        }
       }
     };
     const value = computed({
@@ -47,13 +53,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
     function onBlur() {
       setIsIcon();
-      isInput.value = false;
     }
     function setIsIcon() {
-      if (!value.value && props.isEmpty) {
-        isIcon.value = true;
+      if (!value.value && !props.isEmpty) {
+        if (props.type == "input") {
+          isInput.value = true;
+          isIcon.value = false;
+        } else {
+          isInput.value = false;
+          isIcon.value = true;
+        }
       } else {
         isIcon.value = false;
+        isInput.value = false;
       }
     }
     function onClick() {
@@ -63,17 +75,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         refEditInput.value.focus();
       });
     }
-    onMounted(() => {
-      let dom = refEdit.value;
-      dom.onmouseenter = (event) => {
+    const onmouseenter = (event) => {
+      if (props.type == "input") {
+        isInput.value = true;
+      } else {
         isIcon.value = true;
-        getWidth();
-      };
-      dom.onmouseleave = (event) => {
-        setIsIcon();
-        isInput.value = false;
-      };
-      display.value = dom.style.display || "inline";
+      }
+      getWidth();
+    };
+    const onmouseleave = (event) => {
+      setIsIcon();
+    };
+    onMounted(() => {
       getWidth();
     });
     __expose({
@@ -81,13 +94,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("span", {
-        ref_key: "refEdit",
-        ref: refEdit,
+        onMouseenter: onmouseenter,
+        onMouseleave: onmouseleave,
+        ref_key: "refDom",
+        ref: refDom,
         class: normalizeClass(unref(cs).z())
       }, [
         isInput.value ? (openBlock(), createBlock(unref(Inputs), {
           key: 0,
-          style: normalizeStyle({ width: width.value, display: display.value }),
+          style: normalizeStyle({ width: width.value }),
           modelValue: value.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
           ref_key: "refEditInput",
@@ -101,7 +116,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           onDblclick: withModifiers(onDblclick, ["stop"]),
           class: normalizeClass(unref(cs).z("value"))
         }, toDisplayString(value.value), 35)),
-        isIcon.value && !isInput.value ? (openBlock(), createBlock(unref(Icon), {
+        unref(props).type == "icon" && isIcon.value && !isInput.value ? (openBlock(), createBlock(unref(Icon), {
           key: 2,
           onClick,
           class: normalizeClass(unref(cs).z("icon"))
@@ -111,7 +126,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           _: 1
         }, 8, ["class"])) : createCommentVNode("", true)
-      ], 2);
+      ], 34);
     };
   }
 });

package/dist/css/edit.css

@@ -23,19 +23,19 @@
 }
 
 .edit {
-  display: inline-flex;
+  display: inline-block;
   align-items: center;
+  height: 100%;
 }
 .edit-value {
   display: inline-block;
+  height: 100%;
   min-width: 3px;
 }
 .edit-icon {
-  display: inline-flex;
-  align-items: center;
+  box-sizing: border-box;
   height: 100%;
-  min-width: 3px;
   font-size: 16px;
-  margin: 0 4px;
+  margin: 2px;
   cursor: pointer;
 }

package/dist/css/index.css

@@ -1714,20 +1714,20 @@
 }
 
 .edit {
-  display: inline-flex;
+  display: inline-block;
   align-items: center;
+  height: 100%;
 }
 .edit-value {
   display: inline-block;
+  height: 100%;
   min-width: 3px;
 }
 .edit-icon {
-  display: inline-flex;
-  align-items: center;
+  box-sizing: border-box;
   height: 100%;
-  min-width: 3px;
   font-size: 16px;
-  margin: 0 4px;
+  margin: 2px;
   cursor: pointer;
 }
 

package/dist/hooks/model/index.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("vue");
-function useModel(props, emit) {
-  const internalValue = vue.ref();
+function useModel(props, emit, defaultValue) {
+  const internalValue = vue.ref(defaultValue);
   const instance = vue.getCurrentInstance();
   const hasExternalValue = vue.computed(() => {
     if (!instance) return false;
@@ -11,7 +11,7 @@ function useModel(props, emit) {
   });
   return vue.computed({
     get() {
-      return hasExternalValue.value ? props.modelValue : internalValue.value;
+      return hasExternalValue.value ? props.modelValue ?? defaultValue : internalValue.value;
     },
     set(v) {
       if (hasExternalValue.value) {

package/dist/hooks/model/index.d.ts

@@ -1,2 +1,2 @@
 import { WritableComputedRef } from 'vue';
-export declare function useModel(props: ObjAny, emit: Function): WritableComputedRef<any, any>;
+export declare function useModel(props: ObjAny, emit: Function, defaultValue?: any): WritableComputedRef<any, any>;

package/dist/hooks/model/index.js

@@ -1,6 +1,6 @@
 import { ref, getCurrentInstance, computed } from "vue";
-function useModel(props, emit) {
-  const internalValue = ref();
+function useModel(props, emit, defaultValue) {
+  const internalValue = ref(defaultValue);
   const instance = getCurrentInstance();
   const hasExternalValue = computed(() => {
     if (!instance) return false;
@@ -9,7 +9,7 @@ function useModel(props, emit) {
   });
   return computed({
     get() {
-      return hasExternalValue.value ? props.modelValue : internalValue.value;
+      return hasExternalValue.value ? props.modelValue ?? defaultValue : internalValue.value;
     },
     set(v) {
       if (hasExternalValue.value) {

package/dist/icons/index.json

@@ -1,7 +1,7 @@
 {
     "prefix": "fang-ui",
     "info": {},
-    "lastModified": 1767875434807,
+    "lastModified": 1768221514324,
     "icons": {
         "bar": {
             "body": " <path fill=\"currentColor\" d=\"M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z\" ></path> "

package/dist/index.css

@@ -1714,20 +1714,20 @@
 }
 
 .edit {
-  display: inline-flex;
+  display: inline-block;
   align-items: center;
+  height: 100%;
 }
 .edit-value {
   display: inline-block;
+  height: 100%;
   min-width: 3px;
 }
 .edit-icon {
-  display: inline-flex;
-  align-items: center;
+  box-sizing: border-box;
   height: 100%;
-  min-width: 3px;
   font-size: 16px;
-  margin: 0 4px;
+  margin: 2px;
   cursor: pointer;
 }
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fangzhongya/fang-ui",
   "private": false,
-  "version": "0.1.56",
+  "version": "0.1.58",
   "type": "module",
   "description ": "fang-ui",
   "keywords": [
@@ -50,11 +50,11 @@
     "vue": "^3.5.26",
     "vue-tsc": "^3.2.2",
     "vxe-table": "4.6.20",
-    "@fang-ui/hooks": "0.0.1-0",
-    "@fang-ui/directives": "0.0.1-0",
     "@fang-ui/components": "0.0.1-0",
-    "@fang-ui/locale": "0.0.1-0",
+    "@fang-ui/directives": "0.0.1-0",
     "@fang-ui/icons": "0.0.1-0",
+    "@fang-ui/hooks": "0.0.1-0",
+    "@fang-ui/locale": "0.0.1-0",
     "@fang-ui/theme": "0.0.1-0",
     "@fang-ui/types": "0.0.1-0",
     "@fang-ui/utils": "0.0.1-0"