@cregis/ui 0.1.0 → 0.1.2

package/dist/es/cregis-ui.js

@@ -1,9 +1,9 @@
-import { defineComponent as k, computed as y, createElementBlock as r, openBlock as s, createElementVNode as c, createCommentVNode as h, mergeProps as x, createBlock as L, renderSlot as v, resolveDynamicComponent as Q, normalizeClass as g, toDisplayString as w, unref as j, ref as z, watch as E, normalizeStyle as $, withDirectives as q, vModelDynamic as X, withModifiers as _, vModelText as ee, createVNode as K, withCtx as O, createTextVNode as N, nextTick as Y, reactive as te, provide as ae, toRef as ie, Fragment as ne, renderList as le, inject as se, onMounted as oe, onUnmounted as re } from "vue";
-import { EdsLoad as de, EdsCloseCircleFill as ce } from "@cregis/icon";
-const ue = {
+import { defineComponent as k, computed as y, createElementBlock as r, openBlock as s, createElementVNode as u, createCommentVNode as h, mergeProps as p, createBlock as z, renderSlot as v, resolveDynamicComponent as Y, normalizeClass as g, toDisplayString as $, unref as W, ref as C, watch as S, normalizeStyle as x, withDirectives as F, vModelDynamic as j, withModifiers as Z, vModelText as G, createVNode as D, withCtx as P, createTextVNode as T, nextTick as M, reactive as H, provide as J, toRef as Q, Fragment as X, renderList as _, inject as ee, onMounted as te, onUnmounted as ae } from "vue";
+import { EdsLoad as ie, EdsCloseCircleFill as le } from "@cregis/icon";
+const ne = {
   key: 0,
   class: "cregis-button__icon-wrapper"
-}, me = ["disabled"], be = ["disabled"], fe = ["disabled"], p = /* @__PURE__ */ k({
+}, se = ["disabled"], oe = ["disabled"], re = ["disabled"], B = /* @__PURE__ */ k({
   name: "Button",
   inheritAttrs: !1,
   __name: "Button",
@@ -22,7 +22,7 @@ const ue = {
     affix: { type: Boolean }
   },
   setup(e) {
-    const t = e, i = y(() => t.size === "large" ? "20px" : t.size === "medium" ? "16px" : "12px"), d = y(() => t.size === "large" || t.size === "medium" ? "16px" : "12px"), n = y(() => {
+    const t = e, i = y(() => t.size === "large" ? "20px" : t.size === "medium" ? "16px" : "12px"), d = y(() => t.size === "large" || t.size === "medium" ? "16px" : "12px"), l = y(() => {
       if (t.plain || t.text)
         switch (t.type) {
           case "primary":
@@ -39,8 +39,8 @@ const ue = {
       else
         return t.type === "secondary" ? "var(--material-foreground-base-secondary)" : t.type === "foreground" ? "var(--text-face-primary)" : t.type === "sameWhite" ? "var(--text-same-black)" : "var(--material-same-white)";
     });
-    return (a, o) => e.icon || a.$slots.icon ? (s(), r("div", ue, [
-      c("button", x(a.$attrs, {
+    return (a, o) => e.icon || a.$slots.icon ? (s(), r("div", ne, [
+      u("button", p(a.$attrs, {
         class: ["cregis-button__icon", {
           [`cregis-button__icon--${e.iconType}`]: e.iconType,
           [`cregis-button__icon--${e.size}`]: e.size,
@@ -48,17 +48,17 @@ const ue = {
         }],
         disabled: e.disabled || e.loading
       }), [
-        e.icon ? (s(), L(Q(e.icon), {
+        e.icon ? (s(), z(Y(e.icon), {
           key: 0,
           size: i.value,
           "stroke-width": 3
         }, null, 8, ["size"])) : v(a.$slots, "icon", { key: 1 })
-      ], 16, me),
+      ], 16, se),
       e.iconText ? (s(), r("span", {
         key: 0,
         class: g(["cregis-button__icon-text", { "is-disabled": e.disabled }])
-      }, w(e.iconText), 3)) : h("", !0)
-    ])) : e.link ? (s(), r("button", x({ key: 1 }, a.$attrs, {
+      }, $(e.iconText), 3)) : h("", !0)
+    ])) : e.link ? (s(), r("button", p({ key: 1 }, a.$attrs, {
       class: ["cregis-button__link", {
         [`cregis-button__link--${e.type}`]: e.type,
         [`cregis-button__link--${e.size}`]: e.size,
@@ -67,7 +67,7 @@ const ue = {
       disabled: e.disabled || e.loading
     }), [
       v(a.$slots, "default")
-    ], 16, be)) : (s(), r("button", x({
+    ], 16, oe)) : (s(), r("button", p({
       key: 2,
       ref: "buttonRef"
     }, a.$attrs, {
@@ -83,25 +83,25 @@ const ue = {
       }],
       disabled: e.disabled || e.loading
     }), [
-      e.loading ? (s(), L(j(de), {
+      e.loading ? (s(), z(W(ie), {
         key: 0,
         class: "loading",
         size: d.value,
-        color: n.value,
+        color: l.value,
         "stroke-width": 3
       }, null, 8, ["size", "color"])) : v(a.$slots, "default", { key: 1 })
-    ], 16, fe));
+    ], 16, re));
   }
-}), ge = {
+}), de = {
   key: 0,
   class: "cregis-input__prefix"
-}, ye = ["type", "placeholder", "disabled"], he = {
+}, ue = ["type", "placeholder", "disabled"], ce = {
   key: 2,
   class: "cregis-input__suffix"
-}, ve = ["disabled", "placeholder", "rows"], ke = {
+}, me = ["disabled", "placeholder", "rows"], be = {
   key: 0,
   class: "cregis-textarea__buttons"
-}, T = /* @__PURE__ */ k({
+}, ze = /* @__PURE__ */ k({
   name: "Input",
   inheritAttrs: !1,
   __name: "Input",
@@ -119,92 +119,92 @@ const ue = {
   },
   emits: ["update:modelValue", "input", "change", "focus", "blur", "clear"],
   setup(e, { expose: t, emit: i }) {
-    const d = e, n = i, a = z(d.modelValue);
-    E(
+    const d = e, l = i, a = C(d.modelValue);
+    S(
       () => d.modelValue,
-      (l) => {
-        a.value = l;
+      (n) => {
+        a.value = n;
       }
     );
-    const o = z(), u = z(0), f = z(!1);
-    let C = null;
-    const G = async () => {
-      await Y(), o.value?.focus();
-    }, A = async () => {
-      n("update:modelValue", a.value), n("input", a.value), await Y(), U();
-    }, F = () => {
-      n("change", a.value);
-    }, D = (l) => {
-      f.value = !0, n("focus", l);
-    }, P = (l) => {
-      f.value = !1, n("blur", l);
-    }, M = y(() => d.clearable && !d.disabled && !!a.value && f.value), W = () => {
-      a.value = "", n("update:modelValue", ""), n("clear"), n("input", ""), n("change", "");
-    }, U = () => {
-      C && cancelAnimationFrame(C), C = requestAnimationFrame(() => {
+    const o = C(), c = C(0), f = C(!1);
+    let w = null;
+    const q = async () => {
+      await M(), o.value?.focus();
+    }, V = async () => {
+      l("update:modelValue", a.value), l("input", a.value), await M(), E();
+    }, R = () => {
+      l("change", a.value);
+    }, I = (n) => {
+      f.value = !0, l("focus", n);
+    }, L = (n) => {
+      f.value = !1, l("blur", n);
+    }, N = y(() => d.clearable && !d.disabled && !!a.value && f.value), A = () => {
+      a.value = "", l("update:modelValue", ""), l("clear"), l("input", ""), l("change", "");
+    }, E = () => {
+      w && cancelAnimationFrame(w), w = requestAnimationFrame(() => {
         if (!o.value || o.value.tagName !== "INPUT") return;
-        const l = o.value, b = l.value, m = document.createElement("span");
-        m.style.position = "absolute", m.style.visibility = "hidden", m.style.whiteSpace = "pre", m.style.font = window.getComputedStyle(l).font, m.style.letterSpacing = window.getComputedStyle(l).letterSpacing, m.textContent = b || " ", document.body.appendChild(m), u.value = m.getBoundingClientRect().width, document.body.removeChild(m);
+        const n = o.value, b = n.value, m = document.createElement("span");
+        m.style.position = "absolute", m.style.visibility = "hidden", m.style.whiteSpace = "pre", m.style.font = window.getComputedStyle(n).font, m.style.letterSpacing = window.getComputedStyle(n).letterSpacing, m.textContent = b || " ", document.body.appendChild(m), c.value = m.getBoundingClientRect().width, document.body.removeChild(m);
       });
-    }, H = y(() => {
-      const l = {};
-      return u.value > 0 && (l.position = "absolute", l.left = `${u.value + 16}px`), l;
-    }), J = async () => {
+    }, K = y(() => {
+      const n = {};
+      return c.value > 0 && (n.position = "absolute", n.left = `${c.value + 16}px`), n;
+    }), O = async () => {
       try {
         a.value = await navigator.clipboard.readText();
-      } catch (l) {
-        console.error("paste error：", l);
+      } catch (n) {
+        console.error("paste error：", n);
       }
     };
     return t({
-      focus: G,
-      updateTextWidth: U
-    }), (l, b) => e.type !== "textarea" ? (s(), r("div", {
+      focus: q,
+      updateTextWidth: E
+    }), (n, b) => e.type !== "textarea" ? (s(), r("div", {
       key: 0,
       class: g(["cregis-input", {
         [`cregis-input--${e.size}`]: e.size,
         "is-disabled": e.disabled,
-        "is-prefix": l.$slots.prefix,
-        "is-suffix": l.$slots.suffix
+        "is-prefix": n.$slots.prefix,
+        "is-suffix": n.$slots.suffix
       }]),
-      style: $([{ width: e.width }, e.inputStyle])
+      style: x([{ width: e.width }, e.inputStyle])
     }, [
-      c("div", {
+      u("div", {
         class: g(["cregis-input__wrapper", { "is-focus": f.value }])
       }, [
-        l.$slots.prefix ? (s(), r("span", ge, [
-          v(l.$slots, "prefix")
+        n.$slots.prefix ? (s(), r("span", de, [
+          v(n.$slots, "prefix")
         ])) : h("", !0),
-        q(c("input", x({
+        F(u("input", p({
           class: "cregis-input__inner",
           "onUpdate:modelValue": b[0] || (b[0] = (m) => a.value = m),
           ref_key: "inputRef",
           ref: o,
           type: e.type,
           placeholder: e.placeholder
-        }, l.$attrs, {
+        }, n.$attrs, {
           disabled: e.disabled,
-          onInput: A,
-          onChange: F,
-          onFocus: D,
-          onBlur: P
-        }), null, 16, ye), [
-          [X, a.value]
+          onInput: V,
+          onChange: R,
+          onFocus: I,
+          onBlur: L
+        }), null, 16, ue), [
+          [j, a.value]
         ]),
         e.unit && a.value ? (s(), r("span", {
           key: 1,
-          style: $(H.value),
+          style: x(K.value),
           class: "cregis-input__unit"
-        }, w(e.unit), 5)) : h("", !0),
-        l.$slots.suffix || M.value ? (s(), r("span", he, [
-          v(l.$slots, "suffix"),
-          M.value ? (s(), L(p, {
+        }, $(e.unit), 5)) : h("", !0),
+        n.$slots.suffix || N.value ? (s(), r("span", ce, [
+          v(n.$slots, "suffix"),
+          N.value ? (s(), z(B, {
             key: 0,
             class: "cregis-input__clear-button",
-            icon: j(ce),
+            icon: W(le),
             "icon-type": "square",
-            onClick: W,
-            onMousedown: b[1] || (b[1] = _(() => {
+            onClick: A,
+            onMousedown: b[1] || (b[1] = Z(() => {
             }, ["prevent"]))
           }, null, 8, ["icon"])) : h("", !0)
         ])) : h("", !0)
@@ -212,62 +212,55 @@ const ue = {
     ], 6)) : (s(), r("div", {
       key: 1,
       class: g(["cregis-textarea", { "is-disabled": e.disabled }]),
-      style: $([{ width: e.width }, e.inputStyle])
+      style: x([{ width: e.width }, e.inputStyle])
     }, [
-      q(c("textarea", x({ class: "cregis-textarea__wrapper" }, l.$attrs, {
+      F(u("textarea", p({ class: "cregis-textarea__wrapper" }, n.$attrs, {
         ref_key: "inputRef",
         ref: o,
         disabled: e.disabled,
         placeholder: e.placeholder,
         rows: e.rows,
         "onUpdate:modelValue": b[2] || (b[2] = (m) => a.value = m),
-        onInput: A,
-        onChange: F,
-        onFocus: D,
-        onBlur: P
-      }), null, 16, ve), [
-        [ee, a.value]
+        onInput: V,
+        onChange: R,
+        onFocus: I,
+        onBlur: L
+      }), null, 16, me), [
+        [G, a.value]
       ]),
-      e.disabled ? h("", !0) : (s(), r("div", ke, [
-        K(p, {
+      e.disabled ? h("", !0) : (s(), r("div", be, [
+        D(B, {
           class: "cregis-textarea__button",
           link: "",
           size: "small",
-          onClick: J
+          onClick: O
         }, {
-          default: O(() => [...b[3] || (b[3] = [
-            N(" Paste ", -1)
+          default: P(() => [...b[3] || (b[3] = [
+            T(" Paste ", -1)
           ])]),
           _: 1
         }),
-        K(p, {
+        D(B, {
           class: "cregis-textarea__button",
           link: "",
           size: "small",
           disabled: !a.value,
-          onClick: W
+          onClick: A
         }, {
-          default: O(() => [...b[4] || (b[4] = [
-            N(" Clear ", -1)
+          default: P(() => [...b[4] || (b[4] = [
+            T(" Clear ", -1)
           ])]),
           _: 1
         }, 8, ["disabled"])
       ]))
     ], 6));
   }
-});
-T.install = (e) => {
-  e.component(T.name, T);
-};
-p.install = (e) => {
-  e.component(p.name, p);
-};
-const pe = ["width", "height"], xe = {
+}), fe = ["width", "height"], ge = {
   stroke: "none",
   "stroke-width": "1",
   fill: "none",
   "fill-rule": "evenodd"
-}, $e = { transform: "translate(-394.000000, -457.000000)" }, we = { transform: "translate(394.000000, 457.000000)" }, Ce = ["width", "height"], ze = /* @__PURE__ */ k({
+}, ye = { transform: "translate(-394.000000, -457.000000)" }, he = { transform: "translate(394.000000, 457.000000)" }, ve = ["width", "height"], ke = /* @__PURE__ */ k({
   __name: "checked-basis",
   props: {
     size: { default: "16px" }
@@ -281,16 +274,16 @@ const pe = ["width", "height"], xe = {
       xmlns: "http://www.w3.org/2000/svg",
       "xmlns:xlink": "http://www.w3.org/1999/xlink"
     }, [
-      c("g", xe, [
-        c("g", $e, [
-          c("g", we, [
-            c("rect", {
+      u("g", ge, [
+        u("g", ye, [
+          u("g", he, [
+            u("rect", {
               x: "0",
               y: "0",
               width: e.size,
               height: e.size
-            }, null, 8, Ce),
-            i[0] || (i[0] = c("path", {
+            }, null, 8, ve),
+            i[0] || (i[0] = u("path", {
               d: "M6.67713976,13.5709642 C7.12567714,13.5709642 7.468039,13.3943662 7.70422535,13.0411701 L13.7562297,3.77789816 C13.8407367,3.65005417 13.9024919,3.52546046 13.9414951,3.40411701 C13.9804984,3.28277356 14,3.16468039 14,3.04983749 C14,2.74647887 13.8976165,2.49566631 13.6928494,2.29739978 C13.4880823,2.09913326 13.2307692,2 12.9209101,2 C12.7063922,2 12.5265439,2.04225352 12.3813651,2.12676056 C12.2361863,2.21126761 12.0975081,2.35536295 11.9653304,2.55904659 L6.65113759,10.9512459 L3.95016251,7.60346696 C3.71830986,7.32177681 3.43011918,7.18093174 3.08559047,7.18093174 C2.77139762,7.18093174 2.51191766,7.28169014 2.3071506,7.48320693 C2.10238353,7.68472373 2,7.93824485 2,8.24377031 C2,8.38028169 2.02329361,8.51083424 2.06988082,8.63542795 C2.11646804,8.76002167 2.19826652,8.88949079 2.31527627,9.02383532 L5.67280607,13.0899242 C5.94149512,13.4106176 6.27627302,13.5709642 6.67713976,13.5709642 Z",
               fill: "currentColor",
               "fill-rule": "nonzero"
@@ -298,12 +291,12 @@ const pe = ["width", "height"], xe = {
           ])
         ])
       ])
-    ], 8, pe));
+    ], 8, fe));
   }
-}), Te = {
+}), pe = {
   key: 0,
   class: "cregis-checkbox--indeterminate"
-}, B = /* @__PURE__ */ k({
+}, Te = /* @__PURE__ */ k({
   name: "Checkbox",
   __name: "Checkbox",
   props: {
@@ -315,27 +308,27 @@ const pe = ["width", "height"], xe = {
   },
   emits: ["update:modelValue", "change"],
   setup(e, { emit: t }) {
-    const i = e, d = t, n = y(() => i.modelValue), a = () => {
-      i.disabled || d("update:modelValue", !n.value);
+    const i = e, d = t, l = y(() => i.modelValue), a = () => {
+      i.disabled || d("update:modelValue", !l.value);
     };
-    return E(
-      () => n.value,
+    return S(
+      () => l.value,
       () => {
-        d("change", n.value);
+        d("change", l.value);
       }
-    ), (o, u) => (s(), r("div", {
+    ), (o, c) => (s(), r("div", {
       class: "cregis-checkbox__wrapper",
       onClick: a
     }, [
-      c("div", {
+      u("div", {
         class: g(["cregis-checkbox", {
           "is-disabled": e.disabled,
-          "is-checked": n.value,
+          "is-checked": l.value,
           "is-circle": e.circle,
           "is-indeterminate": e.indeterminate
         }])
       }, [
-        e.indeterminate ? (s(), r("div", Te)) : (s(), L(ze, {
+        e.indeterminate ? (s(), r("div", pe)) : (s(), z(ke, {
           key: 1,
           size: "10px"
         }))
@@ -345,16 +338,12 @@ const pe = ["width", "height"], xe = {
         class: g(["cregis-checkbox__label", { "is-disabled": e.disabled }])
       }, [
         v(o.$slots, "default", {}, () => [
-          N(w(e.label), 1)
+          T($(e.label), 1)
         ])
       ], 2)) : h("", !0)
     ]));
   }
-});
-B.install = (e) => {
-  e.component(B.name, B);
-};
-const S = /* @__PURE__ */ k({
+}), Be = /* @__PURE__ */ k({
   name: "Radio",
   __name: "Radio",
   props: {
@@ -365,36 +354,32 @@ const S = /* @__PURE__ */ k({
   },
   emits: ["update:modelValue", "change"],
   setup(e, { emit: t }) {
-    const i = e, d = t, n = y(() => i.modelValue === i.value), a = () => {
+    const i = e, d = t, l = y(() => i.modelValue === i.value), a = () => {
       i.disabled || (d("update:modelValue", i.value), d("change", i.value));
     };
-    return (o, u) => (s(), r("div", {
+    return (o, c) => (s(), r("div", {
       class: "cregis-radio__wrapper",
       onClick: a
     }, [
-      c("div", {
+      u("div", {
         class: g(["cregis-radio", {
           "is-disabled": e.disabled,
-          "is-checked": n.value
+          "is-checked": l.value
         }])
-      }, [...u[0] || (u[0] = [
-        c("div", { class: "cregis-radio__inner" }, null, -1)
+      }, [...c[0] || (c[0] = [
+        u("div", { class: "cregis-radio__inner" }, null, -1)
       ])], 2),
       o.$slots.default || e.label ? (s(), r("span", {
         key: 0,
         class: g(["cregis-radio__label", { "is-disabled": e.disabled }])
       }, [
         v(o.$slots, "default", {}, () => [
-          N(w(e.label), 1)
+          T($(e.label), 1)
         ])
       ], 2)) : h("", !0)
     ]));
   }
-});
-S.install = (e) => {
-  e.component(S.name, S);
-};
-const V = /* @__PURE__ */ k({
+}), Se = /* @__PURE__ */ k({
   name: "Divider",
   __name: "Divider",
   props: {
@@ -408,8 +393,8 @@ const V = /* @__PURE__ */ k({
   setup(e) {
     const t = e, i = y(() => {
       if (Array.isArray(t.margin)) {
-        const [n, a] = t.margin;
-        return t.direction === "horizontal" ? `${n} 0 ${a} 0` : `0 ${a} 0 ${n}`;
+        const [l, a] = t.margin;
+        return t.direction === "horizontal" ? `${l} 0 ${a} 0` : `0 ${a} 0 ${l}`;
       } else
         return t.direction === "horizontal" ? `${t.margin} 0` : `0 ${t.margin}`;
     }), d = y(() => t.direction === "horizontal" ? {
@@ -425,18 +410,14 @@ const V = /* @__PURE__ */ k({
       borderLeftColor: t.color,
       margin: i.value
     });
-    return (n, a) => (s(), r("div", {
+    return (l, a) => (s(), r("div", {
       class: g(["cregis-divider", {
         [`cregis-divider--${e.direction}`]: e.direction
       }]),
-      style: $(d.value)
+      style: x(d.value)
     }, null, 6));
   }
-});
-V.install = (e) => {
-  e.component(V.name, V);
-};
-const Z = Symbol("TABS_KEY"), Be = ["onClick"], Se = { style: { display: "none" } }, R = /* @__PURE__ */ k({
+}), U = Symbol("TABS_KEY"), xe = ["onClick"], $e = { style: { display: "none" } }, Ve = /* @__PURE__ */ k({
   name: "Tabs",
   __name: "Tabs",
   props: {
@@ -446,11 +427,11 @@ const Z = Symbol("TABS_KEY"), Be = ["onClick"], Se = { style: { display: "none"
   },
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, i = te([]), d = (o) => {
-      i.some((u) => u.name === o.name) || i.push(o);
-    }, n = (o) => {
-      const u = i.findIndex((f) => f.name === o);
-      u !== -1 && i.splice(u, 1);
+    const t = e, i = H([]), d = (o) => {
+      i.some((c) => c.name === o.name) || i.push(o);
+    }, l = (o) => {
+      const c = i.findIndex((f) => f.name === o);
+      c !== -1 && i.splice(c, 1);
     }, a = y(() => t.type === "card" ? t.size === "large" ? {
       borderRadius: "13px"
     } : t.size === "medium" ? {
@@ -460,30 +441,30 @@ const Z = Symbol("TABS_KEY"), Be = ["onClick"], Se = { style: { display: "none"
     } : {
       borderRadius: 0
     });
-    return ae(Z, {
-      activeName: ie(t, "modelValue"),
+    return J(U, {
+      activeName: Q(t, "modelValue"),
       registerTab: d,
-      unregisterTab: n
-    }), (o, u) => (s(), r("div", {
+      unregisterTab: l
+    }), (o, c) => (s(), r("div", {
       class: g(["cregis-tabs", {
         [`cregis-tabs--${e.type}`]: e.type,
         [`cregis-tabs--${e.size}`]: e.size
       }])
     }, [
-      (s(!0), r(ne, null, le(i, (f) => (s(), r("div", {
+      (s(!0), r(X, null, _(i, (f) => (s(), r("div", {
         key: f.name,
         class: g(["cregis-tabs__item", { "is-active": e.modelValue === f.name }]),
-        style: $(a.value),
-        onClick: (C) => o.$emit("update:modelValue", f.name)
+        style: x(a.value),
+        onClick: (w) => o.$emit("update:modelValue", f.name)
       }, [
-        c("span", null, w(f.label), 1)
-      ], 14, Be))), 128)),
-      c("div", Se, [
+        u("span", null, $(f.label), 1)
+      ], 14, xe))), 128)),
+      u("div", $e, [
         v(o.$slots, "default")
       ])
     ], 2));
   }
-}), I = /* @__PURE__ */ k({
+}), Re = /* @__PURE__ */ k({
   name: "TabPane",
   __name: "TabPane",
   props: {
@@ -491,42 +472,28 @@ const Z = Symbol("TABS_KEY"), Be = ["onClick"], Se = { style: { display: "none"
     name: {}
   },
   setup(e) {
-    const t = e, i = se(Z);
+    const t = e, i = ee(U);
     if (!i) throw new Error("TabPane must be used within Tabs");
-    return oe(() => {
+    return te(() => {
       i.registerTab({ label: t.label, name: t.name });
-    }), E(
+    }), S(
       () => t.label,
       (d) => {
         i.unregisterTab(t.name), i.registerTab({ label: d, name: t.name });
       }
-    ), re(() => {
+    ), ae(() => {
       i.unregisterTab(t.name);
     }), () => {
     };
   }
 });
-R.install = (e) => {
-  e.component(R.name, R);
-};
-I.install = (e) => {
-  e.component(I.name, I);
-};
-const Ve = [T, p, B, S, V, R, I], Re = (e) => {
-  Ve.forEach((t) => {
-    e.component(t.name, t);
-  });
-}, Ne = {
-  install: Re
-};
 export {
-  p as Button,
-  B as Checkbox,
-  V as Divider,
-  T as Input,
-  S as Radio,
-  I as TabPane,
-  R as Tabs,
-  Ne as default,
-  Re as install
+  B as Button,
+  Te as Checkbox,
+  Se as Divider,
+  ze as Input,
+  Be as Radio,
+  U as TABS_KEY,
+  Re as TabPane,
+  Ve as Tabs
 };

package/dist/types/index.d.ts

@@ -1,10 +1,11 @@
-import { App } from 'vue';
 import { Component } from 'vue';
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { CSSProperties } from 'vue';
 import { DefineComponent } from 'vue';
+import { InjectionKey } from 'vue';
 import { PublicProps } from 'vue';
+import { Ref } from 'vue';
 
 declare const __VLS_component: DefineComponent<InputProps, {
     focus: () => Promise<void>;
@@ -163,7 +164,7 @@ declare type __VLS_WithTemplateSlots_5<T, S> = T & {
 
 export declare const Button: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
 
-declare interface ButtonProps {
+export declare interface ButtonProps {
     type?: ButtonType;
     size?: ButtonSize;
     plain?: boolean;
@@ -178,13 +179,18 @@ declare interface ButtonProps {
     affix?: boolean;
 }
 
-declare type ButtonSize = 'extraSmall' | 'small' | 'medium' | 'large';
+export declare type ButtonSize = 'extraSmall' | 'small' | 'medium' | 'large';
 
-declare type ButtonType = 'primary' | 'secondary' | 'danger' | 'foreground' | 'sameWhite';
+export declare type ButtonType = 'primary' | 'secondary' | 'danger' | 'foreground' | 'sameWhite';
 
 export declare const Checkbox: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
 
-declare interface CheckboxProps {
+export declare interface CheckboxEmits {
+    (e: 'update:modelValue', value: boolean | number): void;
+    (e: 'change', value: boolean | number): void;
+}
+
+export declare interface CheckboxProps {
     modelValue: boolean | number;
     label?: string;
     disabled?: boolean;
@@ -192,11 +198,6 @@ declare interface CheckboxProps {
     indeterminate?: boolean;
 }
 
-declare const _default: {
-    install: (app: App) => void;
-};
-export default _default;
-
 export declare const Divider: DefineComponent<DividerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DividerProps> & Readonly<{}>, {
     color: string;
     direction: "horizontal" | "vertical";
@@ -205,7 +206,7 @@ export declare const Divider: DefineComponent<DividerProps, {}, {}, {}, {}, Comp
     margin: string | [string, string];
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
 
-declare interface DividerProps {
+export declare interface DividerProps {
     direction?: 'horizontal' | 'vertical';
     borderStyle?: 'solid' | 'dashed' | 'dotted';
     lineThickness?: string;
@@ -214,11 +215,20 @@ declare interface DividerProps {
     length?: string;
 }
 
-declare type IconButtonType = 'rectangle' | 'square' | 'circle' | 'professional';
+export declare type IconButtonType = 'rectangle' | 'square' | 'circle' | 'professional';
 
 export declare const Input: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 
-declare interface InputProps {
+export declare interface InputEmits {
+    (e: 'update:modelValue', value: StringOrNumber): void;
+    (e: 'input', value: StringOrNumber): void;
+    (e: 'change', value: StringOrNumber): void;
+    (e: 'focus', value: FocusEvent): void;
+    (e: 'blur', value: FocusEvent): void;
+    (e: 'clear'): void;
+}
+
+export declare interface InputProps {
     type?: 'text' | 'number' | 'textarea';
     modelValue: StringOrNumber;
     size?: 'small' | 'medium' | 'large';
@@ -231,33 +241,48 @@ declare interface InputProps {
     rows?: number;
 }
 
-export declare const install: (app: App) => void;
-
 export declare const Radio: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
 
-declare interface RadioProps {
+export declare interface RadioEmits {
+    (e: 'update:modelValue', value: RadioValue): void;
+    (e: 'change', value: RadioValue): void;
+}
+
+export declare interface RadioProps {
     modelValue: RadioValue;
     value: RadioValue;
     label?: string;
     disabled?: boolean;
 }
 
-declare type RadioValue = boolean | string | number;
+export declare type RadioValue = boolean | string | number;
 
 declare type StringOrNumber = string | number;
 
 export declare const TabPane: DefineComponent<TabPaneProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TabPaneProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare interface TabPaneProps {
+export declare interface TabPaneProps {
     label: string;
     name: string | number;
 }
 
 export declare const Tabs: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
 
-declare type TabSize = 'small' | 'medium' | 'large';
+export declare const TABS_KEY: InjectionKey<TabsContext>;
+
+export declare interface TabsContext {
+    activeName: Ref<string | number>;
+    registerTab: (pane: TabPaneProps) => void;
+    unregisterTab: (name: string | number) => void;
+}
+
+export declare interface TabsEmits {
+    (e: 'update:modelValue', name: string | number): void;
+}
+
+export declare type TabSize = 'small' | 'medium' | 'large';
 
-declare interface TabsProps {
+export declare interface TabsProps {
     modelValue: string | number;
     type?: 'default' | 'card';
     size?: TabSize;

package/dist/umd/cregis-ui.umd.cjs

@@ -1 +1 @@
-(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@cregis/icon")):typeof define=="function"&&define.amd?define(["exports","vue","@cregis/icon"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.CregisUI={},c.Vue,c.CregisIcon))})(this,(function(c,e,$){"use strict";const I={key:0,class:"cregis-button__icon-wrapper"},D=["disabled"],P=["disabled"],L=["disabled"],f=e.defineComponent({name:"Button",inheritAttrs:!1,__name:"Button",props:{type:{default:"primary"},size:{default:"medium"},plain:{type:Boolean},text:{type:Boolean},disabled:{type:Boolean},loading:{type:Boolean},block:{type:Boolean},link:{type:Boolean},icon:{},iconType:{default:"rectangle"},iconText:{},affix:{type:Boolean}},setup(t){const n=t,a=e.computed(()=>n.size==="large"?"20px":n.size==="medium"?"16px":"12px"),r=e.computed(()=>n.size==="large"||n.size==="medium"?"16px":"12px"),i=e.computed(()=>{if(n.plain||n.text)switch(n.type){case"primary":return"var(--material-vibrant-brand-primary)";case"secondary":return"var(--material-foreground-base-secondary)";case"danger":return"var(--material-vibrant-error-primary)";case"foreground":return"var(--material-foreground-base-primary)";case"sameWhite":return"var(--material-same-black)"}else return n.type==="secondary"?"var(--material-foreground-base-secondary)":n.type==="foreground"?"var(--text-face-primary)":n.type==="sameWhite"?"var(--text-same-black)":"var(--material-same-white)"});return(l,s)=>t.icon||l.$slots.icon?(e.openBlock(),e.createElementBlock("div",I,[e.createElementVNode("button",e.mergeProps(l.$attrs,{class:["cregis-button__icon",{[`cregis-button__icon--${t.iconType}`]:t.iconType,[`cregis-button__icon--${t.size}`]:t.size,"is-disabled":t.disabled}],disabled:t.disabled||t.loading}),[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.icon),{key:0,size:a.value,"stroke-width":3},null,8,["size"])):e.renderSlot(l.$slots,"icon",{key:1})],16,D),t.iconText?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-button__icon-text",{"is-disabled":t.disabled}])},e.toDisplayString(t.iconText),3)):e.createCommentVNode("",!0)])):t.link?(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:1},l.$attrs,{class:["cregis-button__link",{[`cregis-button__link--${t.type}`]:t.type,[`cregis-button__link--${t.size}`]:t.size,"is-disabled":t.disabled}],disabled:t.disabled||t.loading}),[e.renderSlot(l.$slots,"default")],16,P)):(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:2,ref:"buttonRef"},l.$attrs,{class:["cregis-button",{[`cregis-button--${t.type}`]:t.type,[`cregis-button--${t.size}`]:t.size,"is-plain":t.plain,"is-text":t.text,"is-disabled":t.disabled,"is-loading":t.loading,"is-block":t.block,"is-affix":t.affix}],disabled:t.disabled||t.loading}),[t.loading?(e.openBlock(),e.createBlock(e.unref($.EdsLoad),{key:0,class:"loading",size:r.value,color:i.value,"stroke-width":3},null,8,["size","color"])):e.renderSlot(l.$slots,"default",{key:1})],16,L))}}),A={key:0,class:"cregis-input__prefix"},F=["type","placeholder","disabled"],M={key:2,class:"cregis-input__suffix"},W=["disabled","placeholder","rows"],U={key:0,class:"cregis-textarea__buttons"},g=e.defineComponent({name:"Input",inheritAttrs:!1,__name:"Input",props:{type:{default:"text"},modelValue:{},size:{default:"medium"},width:{default:"300px"},placeholder:{default:"please input"},disabled:{type:Boolean},clearable:{type:Boolean},inputStyle:{},unit:{},rows:{default:3}},emits:["update:modelValue","input","change","focus","blur","clear"],setup(t,{expose:n,emit:a}){const r=t,i=a,l=e.ref(r.modelValue);e.watch(()=>r.modelValue,o=>{l.value=o});const s=e.ref(),d=e.ref(0),b=e.ref(!1);let B=null;const _=async()=>{await e.nextTick(),s.value?.focus()},z=async()=>{i("update:modelValue",l.value),i("input",l.value),await e.nextTick(),R()},V=()=>{i("change",l.value)},S=o=>{b.value=!0,i("focus",o)},T=o=>{b.value=!1,i("blur",o)},E=e.computed(()=>r.clearable&&!r.disabled&&!!l.value&&b.value),N=()=>{l.value="",i("update:modelValue",""),i("clear"),i("input",""),i("change","")},R=()=>{B&&cancelAnimationFrame(B),B=requestAnimationFrame(()=>{if(!s.value||s.value.tagName!=="INPUT")return;const o=s.value,u=o.value,m=document.createElement("span");m.style.position="absolute",m.style.visibility="hidden",m.style.whiteSpace="pre",m.style.font=window.getComputedStyle(o).font,m.style.letterSpacing=window.getComputedStyle(o).letterSpacing,m.textContent=u||" ",document.body.appendChild(m),d.value=m.getBoundingClientRect().width,document.body.removeChild(m)})},v=e.computed(()=>{const o={};return d.value>0&&(o.position="absolute",o.left=`${d.value+16}px`),o}),ee=async()=>{try{l.value=await navigator.clipboard.readText()}catch(o){console.error("paste error：",o)}};return n({focus:_,updateTextWidth:R}),(o,u)=>t.type!=="textarea"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["cregis-input",{[`cregis-input--${t.size}`]:t.size,"is-disabled":t.disabled,"is-prefix":o.$slots.prefix,"is-suffix":o.$slots.suffix}]),style:e.normalizeStyle([{width:t.width},t.inputStyle])},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-input__wrapper",{"is-focus":b.value}])},[o.$slots.prefix?(e.openBlock(),e.createElementBlock("span",A,[e.renderSlot(o.$slots,"prefix")])):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",e.mergeProps({class:"cregis-input__inner","onUpdate:modelValue":u[0]||(u[0]=m=>l.value=m),ref_key:"inputRef",ref:s,type:t.type,placeholder:t.placeholder},o.$attrs,{disabled:t.disabled,onInput:z,onChange:V,onFocus:S,onBlur:T}),null,16,F),[[e.vModelDynamic,l.value]]),t.unit&&l.value?(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle(v.value),class:"cregis-input__unit"},e.toDisplayString(t.unit),5)):e.createCommentVNode("",!0),o.$slots.suffix||E.value?(e.openBlock(),e.createElementBlock("span",M,[e.renderSlot(o.$slots,"suffix"),E.value?(e.openBlock(),e.createBlock(f,{key:0,class:"cregis-input__clear-button",icon:e.unref($.EdsCloseCircleFill),"icon-type":"square",onClick:N,onMousedown:u[1]||(u[1]=e.withModifiers(()=>{},["prevent"]))},null,8,["icon"])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],2)],6)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["cregis-textarea",{"is-disabled":t.disabled}]),style:e.normalizeStyle([{width:t.width},t.inputStyle])},[e.withDirectives(e.createElementVNode("textarea",e.mergeProps({class:"cregis-textarea__wrapper"},o.$attrs,{ref_key:"inputRef",ref:s,disabled:t.disabled,placeholder:t.placeholder,rows:t.rows,"onUpdate:modelValue":u[2]||(u[2]=m=>l.value=m),onInput:z,onChange:V,onFocus:S,onBlur:T}),null,16,W),[[e.vModelText,l.value]]),t.disabled?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",U,[e.createVNode(f,{class:"cregis-textarea__button",link:"",size:"small",onClick:ee},{default:e.withCtx(()=>[...u[3]||(u[3]=[e.createTextVNode(" Paste ",-1)])]),_:1}),e.createVNode(f,{class:"cregis-textarea__button",link:"",size:"small",disabled:!l.value,onClick:N},{default:e.withCtx(()=>[...u[4]||(u[4]=[e.createTextVNode(" Clear ",-1)])]),_:1},8,["disabled"])]))],6))}});g.install=t=>{t.component(g.name,g)},f.install=t=>{t.component(f.name,f)};const q=["width","height"],j={stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},O={transform:"translate(-394.000000, -457.000000)"},K={transform:"translate(394.000000, 457.000000)"},Y=["width","height"],Z=e.defineComponent({__name:"checked-basis",props:{size:{default:"16px"}},setup(t){return(n,a)=>(e.openBlock(),e.createElementBlock("svg",{width:t.size,height:t.size,viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createElementVNode("g",j,[e.createElementVNode("g",O,[e.createElementVNode("g",K,[e.createElementVNode("rect",{x:"0",y:"0",width:t.size,height:t.size},null,8,Y),a[0]||(a[0]=e.createElementVNode("path",{d:"M6.67713976,13.5709642 C7.12567714,13.5709642 7.468039,13.3943662 7.70422535,13.0411701 L13.7562297,3.77789816 C13.8407367,3.65005417 13.9024919,3.52546046 13.9414951,3.40411701 C13.9804984,3.28277356 14,3.16468039 14,3.04983749 C14,2.74647887 13.8976165,2.49566631 13.6928494,2.29739978 C13.4880823,2.09913326 13.2307692,2 12.9209101,2 C12.7063922,2 12.5265439,2.04225352 12.3813651,2.12676056 C12.2361863,2.21126761 12.0975081,2.35536295 11.9653304,2.55904659 L6.65113759,10.9512459 L3.95016251,7.60346696 C3.71830986,7.32177681 3.43011918,7.18093174 3.08559047,7.18093174 C2.77139762,7.18093174 2.51191766,7.28169014 2.3071506,7.48320693 C2.10238353,7.68472373 2,7.93824485 2,8.24377031 C2,8.38028169 2.02329361,8.51083424 2.06988082,8.63542795 C2.11646804,8.76002167 2.19826652,8.88949079 2.31527627,9.02383532 L5.67280607,13.0899242 C5.94149512,13.4106176 6.27627302,13.5709642 6.67713976,13.5709642 Z",fill:"currentColor","fill-rule":"nonzero"},null,-1))])])])],8,q))}}),G={key:0,class:"cregis-checkbox--indeterminate"},y=e.defineComponent({name:"Checkbox",__name:"Checkbox",props:{modelValue:{type:[Boolean,Number],default:!1},label:{},disabled:{type:Boolean,default:!1},circle:{type:Boolean},indeterminate:{type:Boolean}},emits:["update:modelValue","change"],setup(t,{emit:n}){const a=t,r=n,i=e.computed(()=>a.modelValue),l=()=>{a.disabled||r("update:modelValue",!i.value)};return e.watch(()=>i.value,()=>{r("change",i.value)}),(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:"cregis-checkbox__wrapper",onClick:l},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-checkbox",{"is-disabled":t.disabled,"is-checked":i.value,"is-circle":t.circle,"is-indeterminate":t.indeterminate}])},[t.indeterminate?(e.openBlock(),e.createElementBlock("div",G)):(e.openBlock(),e.createBlock(Z,{key:1,size:"10px"}))],2),s.$slots.default||t.label?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-checkbox__label",{"is-disabled":t.disabled}])},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],2)):e.createCommentVNode("",!0)]))}});y.install=t=>{t.component(y.name,y)};const h=e.defineComponent({name:"Radio",__name:"Radio",props:{modelValue:{type:[Boolean,String,Number]},value:{type:[Boolean,String,Number]},label:{},disabled:{type:Boolean}},emits:["update:modelValue","change"],setup(t,{emit:n}){const a=t,r=n,i=e.computed(()=>a.modelValue===a.value),l=()=>{a.disabled||(r("update:modelValue",a.value),r("change",a.value))};return(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:"cregis-radio__wrapper",onClick:l},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-radio",{"is-disabled":t.disabled,"is-checked":i.value}])},[...d[0]||(d[0]=[e.createElementVNode("div",{class:"cregis-radio__inner"},null,-1)])],2),s.$slots.default||t.label?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-radio__label",{"is-disabled":t.disabled}])},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],2)):e.createCommentVNode("",!0)]))}});h.install=t=>{t.component(h.name,h)};const k=e.defineComponent({name:"Divider",__name:"Divider",props:{direction:{default:"horizontal"},borderStyle:{default:"solid"},lineThickness:{default:"1px"},color:{default:"var(--line-module)"},margin:{default:"8px"},length:{}},setup(t){const n=t,a=e.computed(()=>{if(Array.isArray(n.margin)){const[i,l]=n.margin;return n.direction==="horizontal"?`${i} 0 ${l} 0`:`0 ${l} 0 ${i}`}else return n.direction==="horizontal"?`${n.margin} 0`:`0 ${n.margin}`}),r=e.computed(()=>n.direction==="horizontal"?{width:n.length||"100%",borderTopWidth:n.lineThickness,borderTopStyle:n.borderStyle,borderTopColor:n.color,margin:a.value}:{height:n.length||"1rem",borderLeftWidth:n.lineThickness,borderLeftStyle:n.borderStyle,borderLeftColor:n.color,margin:a.value});return(i,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["cregis-divider",{[`cregis-divider--${t.direction}`]:t.direction}]),style:e.normalizeStyle(r.value)},null,6))}});k.install=t=>{t.component(k.name,k)};const x=Symbol("TABS_KEY"),H=["onClick"],J={style:{display:"none"}},p=e.defineComponent({name:"Tabs",__name:"Tabs",props:{modelValue:{},type:{default:"default"},size:{default:"medium"}},emits:["update:modelValue"],setup(t){const n=t,a=e.reactive([]),r=s=>{a.some(d=>d.name===s.name)||a.push(s)},i=s=>{const d=a.findIndex(b=>b.name===s);d!==-1&&a.splice(d,1)},l=e.computed(()=>n.type==="card"?n.size==="large"?{borderRadius:"13px"}:n.size==="medium"?{borderRadius:"11px"}:{borderRadius:"9px"}:{borderRadius:0});return e.provide(x,{activeName:e.toRef(n,"modelValue"),registerTab:r,unregisterTab:i}),(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["cregis-tabs",{[`cregis-tabs--${t.type}`]:t.type,[`cregis-tabs--${t.size}`]:t.size}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a,b=>(e.openBlock(),e.createElementBlock("div",{key:b.name,class:e.normalizeClass(["cregis-tabs__item",{"is-active":t.modelValue===b.name}]),style:e.normalizeStyle(l.value),onClick:B=>s.$emit("update:modelValue",b.name)},[e.createElementVNode("span",null,e.toDisplayString(b.label),1)],14,H))),128)),e.createElementVNode("div",J,[e.renderSlot(s.$slots,"default")])],2))}}),C=e.defineComponent({name:"TabPane",__name:"TabPane",props:{label:{},name:{}},setup(t){const n=t,a=e.inject(x);if(!a)throw new Error("TabPane must be used within Tabs");return e.onMounted(()=>{a.registerTab({label:n.label,name:n.name})}),e.watch(()=>n.label,r=>{a.unregisterTab(n.name),a.registerTab({label:r,name:n.name})}),e.onUnmounted(()=>{a.unregisterTab(n.name)}),()=>{}}});p.install=t=>{t.component(p.name,p)},C.install=t=>{t.component(C.name,C)};const Q=[g,f,y,h,k,p,C],w=t=>{Q.forEach(n=>{t.component(n.name,n)})},X={install:w};c.Button=f,c.Checkbox=y,c.Divider=k,c.Input=g,c.Radio=h,c.TabPane=C,c.Tabs=p,c.default=X,c.install=w,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@cregis/icon")):typeof define=="function"&&define.amd?define(["exports","vue","@cregis/icon"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.CregisUI={},d.Vue,d.CregisIcon))})(this,(function(d,e,k){"use strict";const z={key:0,class:"cregis-button__icon-wrapper"},V=["disabled"],S=["disabled"],T=["disabled"],f=e.defineComponent({name:"Button",inheritAttrs:!1,__name:"Button",props:{type:{default:"primary"},size:{default:"medium"},plain:{type:Boolean},text:{type:Boolean},disabled:{type:Boolean},loading:{type:Boolean},block:{type:Boolean},link:{type:Boolean},icon:{},iconType:{default:"rectangle"},iconText:{},affix:{type:Boolean}},setup(t){const l=t,a=e.computed(()=>l.size==="large"?"20px":l.size==="medium"?"16px":"12px"),r=e.computed(()=>l.size==="large"||l.size==="medium"?"16px":"12px"),i=e.computed(()=>{if(l.plain||l.text)switch(l.type){case"primary":return"var(--material-vibrant-brand-primary)";case"secondary":return"var(--material-foreground-base-secondary)";case"danger":return"var(--material-vibrant-error-primary)";case"foreground":return"var(--material-foreground-base-primary)";case"sameWhite":return"var(--material-same-black)"}else return l.type==="secondary"?"var(--material-foreground-base-secondary)":l.type==="foreground"?"var(--text-face-primary)":l.type==="sameWhite"?"var(--text-same-black)":"var(--material-same-white)"});return(n,s)=>t.icon||n.$slots.icon?(e.openBlock(),e.createElementBlock("div",z,[e.createElementVNode("button",e.mergeProps(n.$attrs,{class:["cregis-button__icon",{[`cregis-button__icon--${t.iconType}`]:t.iconType,[`cregis-button__icon--${t.size}`]:t.size,"is-disabled":t.disabled}],disabled:t.disabled||t.loading}),[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.icon),{key:0,size:a.value,"stroke-width":3},null,8,["size"])):e.renderSlot(n.$slots,"icon",{key:1})],16,V),t.iconText?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-button__icon-text",{"is-disabled":t.disabled}])},e.toDisplayString(t.iconText),3)):e.createCommentVNode("",!0)])):t.link?(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:1},n.$attrs,{class:["cregis-button__link",{[`cregis-button__link--${t.type}`]:t.type,[`cregis-button__link--${t.size}`]:t.size,"is-disabled":t.disabled}],disabled:t.disabled||t.loading}),[e.renderSlot(n.$slots,"default")],16,S)):(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:2,ref:"buttonRef"},n.$attrs,{class:["cregis-button",{[`cregis-button--${t.type}`]:t.type,[`cregis-button--${t.size}`]:t.size,"is-plain":t.plain,"is-text":t.text,"is-disabled":t.disabled,"is-loading":t.loading,"is-block":t.block,"is-affix":t.affix}],disabled:t.disabled||t.loading}),[t.loading?(e.openBlock(),e.createBlock(e.unref(k.EdsLoad),{key:0,class:"loading",size:r.value,color:i.value,"stroke-width":3},null,8,["size","color"])):e.renderSlot(n.$slots,"default",{key:1})],16,T))}}),E={key:0,class:"cregis-input__prefix"},N=["type","placeholder","disabled"],R={key:2,class:"cregis-input__suffix"},I=["disabled","placeholder","rows"],D={key:0,class:"cregis-textarea__buttons"},P=e.defineComponent({name:"Input",inheritAttrs:!1,__name:"Input",props:{type:{default:"text"},modelValue:{},size:{default:"medium"},width:{default:"300px"},placeholder:{default:"please input"},disabled:{type:Boolean},clearable:{type:Boolean},inputStyle:{},unit:{},rows:{default:3}},emits:["update:modelValue","input","change","focus","blur","clear"],setup(t,{expose:l,emit:a}){const r=t,i=a,n=e.ref(r.modelValue);e.watch(()=>r.modelValue,o=>{n.value=o});const s=e.ref(),c=e.ref(0),b=e.ref(!1);let g=null;const J=async()=>{await e.nextTick(),s.value?.focus()},h=async()=>{i("update:modelValue",n.value),i("input",n.value),await e.nextTick(),w()},p=()=>{i("change",n.value)},B=o=>{b.value=!0,i("focus",o)},C=o=>{b.value=!1,i("blur",o)},$=e.computed(()=>r.clearable&&!r.disabled&&!!n.value&&b.value),x=()=>{n.value="",i("update:modelValue",""),i("clear"),i("input",""),i("change","")},w=()=>{g&&cancelAnimationFrame(g),g=requestAnimationFrame(()=>{if(!s.value||s.value.tagName!=="INPUT")return;const o=s.value,u=o.value,m=document.createElement("span");m.style.position="absolute",m.style.visibility="hidden",m.style.whiteSpace="pre",m.style.font=window.getComputedStyle(o).font,m.style.letterSpacing=window.getComputedStyle(o).letterSpacing,m.textContent=u||" ",document.body.appendChild(m),c.value=m.getBoundingClientRect().width,document.body.removeChild(m)})},Q=e.computed(()=>{const o={};return c.value>0&&(o.position="absolute",o.left=`${c.value+16}px`),o}),X=async()=>{try{n.value=await navigator.clipboard.readText()}catch(o){console.error("paste error：",o)}};return l({focus:J,updateTextWidth:w}),(o,u)=>t.type!=="textarea"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["cregis-input",{[`cregis-input--${t.size}`]:t.size,"is-disabled":t.disabled,"is-prefix":o.$slots.prefix,"is-suffix":o.$slots.suffix}]),style:e.normalizeStyle([{width:t.width},t.inputStyle])},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-input__wrapper",{"is-focus":b.value}])},[o.$slots.prefix?(e.openBlock(),e.createElementBlock("span",E,[e.renderSlot(o.$slots,"prefix")])):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",e.mergeProps({class:"cregis-input__inner","onUpdate:modelValue":u[0]||(u[0]=m=>n.value=m),ref_key:"inputRef",ref:s,type:t.type,placeholder:t.placeholder},o.$attrs,{disabled:t.disabled,onInput:h,onChange:p,onFocus:B,onBlur:C}),null,16,N),[[e.vModelDynamic,n.value]]),t.unit&&n.value?(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle(Q.value),class:"cregis-input__unit"},e.toDisplayString(t.unit),5)):e.createCommentVNode("",!0),o.$slots.suffix||$.value?(e.openBlock(),e.createElementBlock("span",R,[e.renderSlot(o.$slots,"suffix"),$.value?(e.openBlock(),e.createBlock(f,{key:0,class:"cregis-input__clear-button",icon:e.unref(k.EdsCloseCircleFill),"icon-type":"square",onClick:x,onMousedown:u[1]||(u[1]=e.withModifiers(()=>{},["prevent"]))},null,8,["icon"])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],2)],6)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["cregis-textarea",{"is-disabled":t.disabled}]),style:e.normalizeStyle([{width:t.width},t.inputStyle])},[e.withDirectives(e.createElementVNode("textarea",e.mergeProps({class:"cregis-textarea__wrapper"},o.$attrs,{ref_key:"inputRef",ref:s,disabled:t.disabled,placeholder:t.placeholder,rows:t.rows,"onUpdate:modelValue":u[2]||(u[2]=m=>n.value=m),onInput:h,onChange:p,onFocus:B,onBlur:C}),null,16,I),[[e.vModelText,n.value]]),t.disabled?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",D,[e.createVNode(f,{class:"cregis-textarea__button",link:"",size:"small",onClick:X},{default:e.withCtx(()=>[...u[3]||(u[3]=[e.createTextVNode(" Paste ",-1)])]),_:1}),e.createVNode(f,{class:"cregis-textarea__button",link:"",size:"small",disabled:!n.value,onClick:x},{default:e.withCtx(()=>[...u[4]||(u[4]=[e.createTextVNode(" Clear ",-1)])]),_:1},8,["disabled"])]))],6))}}),L=["width","height"],A={stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},F={transform:"translate(-394.000000, -457.000000)"},M={transform:"translate(394.000000, 457.000000)"},W=["width","height"],U=e.defineComponent({__name:"checked-basis",props:{size:{default:"16px"}},setup(t){return(l,a)=>(e.openBlock(),e.createElementBlock("svg",{width:t.size,height:t.size,viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createElementVNode("g",A,[e.createElementVNode("g",F,[e.createElementVNode("g",M,[e.createElementVNode("rect",{x:"0",y:"0",width:t.size,height:t.size},null,8,W),a[0]||(a[0]=e.createElementVNode("path",{d:"M6.67713976,13.5709642 C7.12567714,13.5709642 7.468039,13.3943662 7.70422535,13.0411701 L13.7562297,3.77789816 C13.8407367,3.65005417 13.9024919,3.52546046 13.9414951,3.40411701 C13.9804984,3.28277356 14,3.16468039 14,3.04983749 C14,2.74647887 13.8976165,2.49566631 13.6928494,2.29739978 C13.4880823,2.09913326 13.2307692,2 12.9209101,2 C12.7063922,2 12.5265439,2.04225352 12.3813651,2.12676056 C12.2361863,2.21126761 12.0975081,2.35536295 11.9653304,2.55904659 L6.65113759,10.9512459 L3.95016251,7.60346696 C3.71830986,7.32177681 3.43011918,7.18093174 3.08559047,7.18093174 C2.77139762,7.18093174 2.51191766,7.28169014 2.3071506,7.48320693 C2.10238353,7.68472373 2,7.93824485 2,8.24377031 C2,8.38028169 2.02329361,8.51083424 2.06988082,8.63542795 C2.11646804,8.76002167 2.19826652,8.88949079 2.31527627,9.02383532 L5.67280607,13.0899242 C5.94149512,13.4106176 6.27627302,13.5709642 6.67713976,13.5709642 Z",fill:"currentColor","fill-rule":"nonzero"},null,-1))])])])],8,L))}}),q={key:0,class:"cregis-checkbox--indeterminate"},j=e.defineComponent({name:"Checkbox",__name:"Checkbox",props:{modelValue:{type:[Boolean,Number],default:!1},label:{},disabled:{type:Boolean,default:!1},circle:{type:Boolean},indeterminate:{type:Boolean}},emits:["update:modelValue","change"],setup(t,{emit:l}){const a=t,r=l,i=e.computed(()=>a.modelValue),n=()=>{a.disabled||r("update:modelValue",!i.value)};return e.watch(()=>i.value,()=>{r("change",i.value)}),(s,c)=>(e.openBlock(),e.createElementBlock("div",{class:"cregis-checkbox__wrapper",onClick:n},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-checkbox",{"is-disabled":t.disabled,"is-checked":i.value,"is-circle":t.circle,"is-indeterminate":t.indeterminate}])},[t.indeterminate?(e.openBlock(),e.createElementBlock("div",q)):(e.openBlock(),e.createBlock(U,{key:1,size:"10px"}))],2),s.$slots.default||t.label?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-checkbox__label",{"is-disabled":t.disabled}])},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],2)):e.createCommentVNode("",!0)]))}}),K=e.defineComponent({name:"Radio",__name:"Radio",props:{modelValue:{type:[Boolean,String,Number]},value:{type:[Boolean,String,Number]},label:{},disabled:{type:Boolean}},emits:["update:modelValue","change"],setup(t,{emit:l}){const a=t,r=l,i=e.computed(()=>a.modelValue===a.value),n=()=>{a.disabled||(r("update:modelValue",a.value),r("change",a.value))};return(s,c)=>(e.openBlock(),e.createElementBlock("div",{class:"cregis-radio__wrapper",onClick:n},[e.createElementVNode("div",{class:e.normalizeClass(["cregis-radio",{"is-disabled":t.disabled,"is-checked":i.value}])},[...c[0]||(c[0]=[e.createElementVNode("div",{class:"cregis-radio__inner"},null,-1)])],2),s.$slots.default||t.label?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cregis-radio__label",{"is-disabled":t.disabled}])},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],2)):e.createCommentVNode("",!0)]))}}),O=e.defineComponent({name:"Divider",__name:"Divider",props:{direction:{default:"horizontal"},borderStyle:{default:"solid"},lineThickness:{default:"1px"},color:{default:"var(--line-module)"},margin:{default:"8px"},length:{}},setup(t){const l=t,a=e.computed(()=>{if(Array.isArray(l.margin)){const[i,n]=l.margin;return l.direction==="horizontal"?`${i} 0 ${n} 0`:`0 ${n} 0 ${i}`}else return l.direction==="horizontal"?`${l.margin} 0`:`0 ${l.margin}`}),r=e.computed(()=>l.direction==="horizontal"?{width:l.length||"100%",borderTopWidth:l.lineThickness,borderTopStyle:l.borderStyle,borderTopColor:l.color,margin:a.value}:{height:l.length||"1rem",borderLeftWidth:l.lineThickness,borderLeftStyle:l.borderStyle,borderLeftColor:l.color,margin:a.value});return(i,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["cregis-divider",{[`cregis-divider--${t.direction}`]:t.direction}]),style:e.normalizeStyle(r.value)},null,6))}}),y=Symbol("TABS_KEY"),Y=["onClick"],Z={style:{display:"none"}},G=e.defineComponent({name:"Tabs",__name:"Tabs",props:{modelValue:{},type:{default:"default"},size:{default:"medium"}},emits:["update:modelValue"],setup(t){const l=t,a=e.reactive([]),r=s=>{a.some(c=>c.name===s.name)||a.push(s)},i=s=>{const c=a.findIndex(b=>b.name===s);c!==-1&&a.splice(c,1)},n=e.computed(()=>l.type==="card"?l.size==="large"?{borderRadius:"13px"}:l.size==="medium"?{borderRadius:"11px"}:{borderRadius:"9px"}:{borderRadius:0});return e.provide(y,{activeName:e.toRef(l,"modelValue"),registerTab:r,unregisterTab:i}),(s,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["cregis-tabs",{[`cregis-tabs--${t.type}`]:t.type,[`cregis-tabs--${t.size}`]:t.size}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a,b=>(e.openBlock(),e.createElementBlock("div",{key:b.name,class:e.normalizeClass(["cregis-tabs__item",{"is-active":t.modelValue===b.name}]),style:e.normalizeStyle(n.value),onClick:g=>s.$emit("update:modelValue",b.name)},[e.createElementVNode("span",null,e.toDisplayString(b.label),1)],14,Y))),128)),e.createElementVNode("div",Z,[e.renderSlot(s.$slots,"default")])],2))}}),H=e.defineComponent({name:"TabPane",__name:"TabPane",props:{label:{},name:{}},setup(t){const l=t,a=e.inject(y);if(!a)throw new Error("TabPane must be used within Tabs");return e.onMounted(()=>{a.registerTab({label:l.label,name:l.name})}),e.watch(()=>l.label,r=>{a.unregisterTab(l.name),a.registerTab({label:r,name:l.name})}),e.onUnmounted(()=>{a.unregisterTab(l.name)}),()=>{}}});d.Button=f,d.Checkbox=j,d.Divider=O,d.Input=P,d.Radio=K,d.TABS_KEY=y,d.TabPane=H,d.Tabs=G,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cregis/ui",
   "private": false,
-  "version": "0.1.0",
+  "version": "0.1.2",
   "type": "module",
   "files": [
     "dist"