wyfe-ivue 0.1.0 → 0.2.0

package/README.md

@@ -3,7 +3,8 @@
 基于 Vite7 + Vue3 + Typescript5 + ElementPlus2 构建的高性能【万有前端·iVue】组件库
 
 ## 特别说明
-> 受作者个人时间与精力所限，及遵循“高内聚、低耦合”设计原则，【万有前端・iVue】组件库未提供独立文档地址，目前仅作为【[万有前端·iCode](https://wyfe.top/icode)】的一个菜单模块存在。
+> 受作者个人时间与精力所限，及遵循“高内聚、低耦合”设计原则，【万有前端・iVue】组件库未提供独立文档地址，目前仅作为【[万有前端·iCode](https://wyfe.top/icode)】的一个菜单模块存在。  
+> 文档地址：https://wyfe.top/icode/iVue
 
 
 ## npm下载(支持pnpm/yarn/cnpm/npm)
@@ -26,13 +27,24 @@ $ pnpm i D:/xxx/wyfe-ivue/wyfe-ivue-0.0.1.tgz
 
 ## 使用
 ```js
-// main.ts
-import 'wyfe-ivue/dist/ui.css'
+// 1、创建plugins/WyfeIVue.ts：
+import 'wyfe-ivue/dist/wyfe-ivue.css'
+import { type App } from 'vue'
+import * as WyfeIVue from 'wyfe-ivue'
 
-// xxx.vue
-import {UseXXX} from 'wyfe-ivue'
+export default (app: App) => {
+  for (const [key, component] of Object.entries(WyfeIVue)) {
+    app.component(key, component)
+  }
 
-<UseXXX/>
+
+// 2、在main.ts中引入使用：
+import  WyfeIVuePlugins from './plugins/WyfeIVue'
+
+createApp(App).use(WyfeIVuePlugins).mount('#app')
+
+// 3、在页面中使用(以使用UseElButton为例)：
+<UseElButton btnText="保存" @onClick="handleClick"/>
 ```
 
 ## 版本号规则

package/dist/RecTableColumn-CPlatVij.js

@@ -0,0 +1,75 @@
+import { E as m } from "./index-C1Tf_IVU.js";
+import { defineComponent as g, defineAsyncComponent as C, resolveComponent as s, createBlock as t, openBlock as n, withCtx as r, createElementBlock as u, Fragment as c, renderList as h, renderSlot as b, mergeProps as d, unref as y, normalizeProps as j, guardReactiveProps as k } from "vue";
+const R = /* @__PURE__ */ g({
+  __name: "RecTableColumn",
+  props: {
+    columnObj: {
+      type: Object,
+      default: () => ({})
+    },
+    tableColumnAlign: {
+      type: String,
+      default: "center"
+    },
+    extConfig: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(l) {
+    const i = C(() => import("./Span-Y-Lm4gq9.js"));
+    return (a, O) => {
+      const f = s("RecTableColumn", !0), p = m;
+      return n(), t(p, {
+        label: l.columnObj.label,
+        align: l.columnObj.align || l.tableColumnAlign
+      }, {
+        header: r(() => [
+          b(a.$slots, "header", j(k({ label: l.columnObj.label, prop: l.columnObj.prop })))
+        ]),
+        default: r(() => [
+          (n(!0), u(c, null, h(l.columnObj.children, (e) => (n(), u(c, {
+            key: e.prop
+          }, [
+            e.children && e.children.length ? (n(), t(f, {
+              key: 0,
+              columnObj: e
+            }, null, 8, ["columnObj"])) : (n(), t(p, {
+              key: 1,
+              label: e.label,
+              prop: e.prop,
+              "min-width": e.minWidth,
+              align: e.align || l.tableColumnAlign
+            }, {
+              default: r(({ row: o }) => [
+                e.prop && Object.keys(o).length ? (n(), u(c, { key: 0 }, [
+                  e?.extConfig?.slot ? b(a.$slots, e.prop, d({
+                    key: 0,
+                    ref_for: !0
+                  }, {
+                    row: o,
+                    data: o[e.prop],
+                    dict: e.extConfig?.dict
+                  })) : (n(), t(y(i), {
+                    key: 1,
+                    item: e,
+                    data: o[e.prop],
+                    extConfig: l.extConfig
+                  }, null, 8, ["item", "data", "extConfig"]))
+                ], 64)) : b(a.$slots, "default", d({
+                  key: 1,
+                  ref_for: !0
+                }, { row: o }))
+              ]),
+              _: 2
+            }, 1032, ["label", "prop", "min-width", "align"]))
+          ], 64))), 128))
+        ]),
+        _: 3
+      }, 8, ["label", "align"]);
+    };
+  }
+});
+export {
+  R as default
+};

package/dist/Selection-DP7rDg-L.js

@@ -0,0 +1,320 @@
+import { i as x, a as G, b as $, c as E, C as w, U as C, u as A, d as z, e as ee, f as ae, g as oe, _ as I, h as N, j as le, k as F, l as te, m as ne, n as ie, o as se, p as de, w as re, q as D, E as ue } from "./index-C1Tf_IVU.js";
+import { ref as B, inject as ce, computed as b, defineComponent as V, createElementBlock as S, openBlock as h, normalizeClass as v, unref as e, createElementVNode as _, withDirectives as U, withModifiers as k, isRef as T, vModelRadio as K, renderSlot as P, createTextVNode as L, toDisplayString as O, nextTick as j, normalizeStyle as fe, onMounted as me, provide as pe, reactive as be, toRefs as ve, watch as ge, Fragment as ye, renderList as he, createBlock as R, mergeProps as Ve, withCtx as _e, createVNode as Se } from "vue";
+const q = E({
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  size: A,
+  disabled: Boolean,
+  label: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  value: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  name: {
+    type: String,
+    default: void 0
+  }
+}), ke = E({
+  ...q,
+  border: Boolean
+}), M = {
+  [C]: (a) => x(a) || G(a) || $(a),
+  [w]: (a) => x(a) || G(a) || $(a)
+}, H = Symbol("radioGroupKey"), J = (a, f) => {
+  const t = B(), o = ce(H, void 0), d = b(() => !!o), u = b(() => z(a.value) ? a.label : a.value), i = b({
+    get() {
+      return d.value ? o.modelValue : a.modelValue;
+    },
+    set(p) {
+      d.value ? o.changeEvent(p) : f && f(C, p), t.value.checked = a.modelValue === u.value;
+    }
+  }), c = ee(b(() => o?.size)), l = ae(b(() => o?.disabled)), s = B(!1), m = b(() => l.value || d.value && i.value !== u.value ? -1 : 0);
+  return oe({
+    from: "label act as value",
+    replacement: "value",
+    version: "3.0.0",
+    scope: "el-radio",
+    ref: "https://element-plus.org/en-US/component/radio.html"
+  }, b(() => d.value && z(a.value))), {
+    radioRef: t,
+    isGroup: d,
+    radioGroup: o,
+    focus: s,
+    size: c,
+    disabled: l,
+    tabIndex: m,
+    modelValue: i,
+    actualValue: u
+  };
+}, Ee = V({
+  name: "ElRadio"
+}), Be = /* @__PURE__ */ V({
+  ...Ee,
+  props: ke,
+  emits: M,
+  setup(a, { emit: f }) {
+    const t = a, o = N("radio"), { radioRef: d, radioGroup: u, focus: i, size: c, disabled: l, modelValue: s, actualValue: m } = J(t, f);
+    function p() {
+      j(() => f(w, s.value));
+    }
+    return (y, n) => {
+      var r;
+      return h(), S("label", {
+        class: v([
+          e(o).b(),
+          e(o).is("disabled", e(l)),
+          e(o).is("focus", e(i)),
+          e(o).is("bordered", y.border),
+          e(o).is("checked", e(s) === e(m)),
+          e(o).m(e(c))
+        ])
+      }, [
+        _("span", {
+          class: v([
+            e(o).e("input"),
+            e(o).is("disabled", e(l)),
+            e(o).is("checked", e(s) === e(m))
+          ])
+        }, [
+          U(_("input", {
+            ref_key: "radioRef",
+            ref: d,
+            "onUpdate:modelValue": (g) => T(s) ? s.value = g : null,
+            class: v(e(o).e("original")),
+            value: e(m),
+            name: y.name || ((r = e(u)) == null ? void 0 : r.name),
+            disabled: e(l),
+            checked: e(s) === e(m),
+            type: "radio",
+            onFocus: (g) => i.value = !0,
+            onBlur: (g) => i.value = !1,
+            onChange: p,
+            onClick: k(() => {
+            }, ["stop"])
+          }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "checked", "onFocus", "onBlur", "onClick"]), [
+            [K, e(s)]
+          ]),
+          _("span", {
+            class: v(e(o).e("inner"))
+          }, null, 2)
+        ], 2),
+        _("span", {
+          class: v(e(o).e("label")),
+          onKeydown: k(() => {
+          }, ["stop"])
+        }, [
+          P(y.$slots, "default", {}, () => [
+            L(O(y.label), 1)
+          ])
+        ], 42, ["onKeydown"])
+      ], 2);
+    };
+  }
+});
+var W = /* @__PURE__ */ I(Be, [["__file", "radio.vue"]]);
+const Re = E({
+  ...q
+}), we = V({
+  name: "ElRadioButton"
+}), Ce = /* @__PURE__ */ V({
+  ...we,
+  props: Re,
+  setup(a) {
+    const f = a, t = N("radio"), { radioRef: o, focus: d, size: u, disabled: i, modelValue: c, radioGroup: l, actualValue: s } = J(f), m = b(() => ({
+      backgroundColor: l?.fill || "",
+      borderColor: l?.fill || "",
+      boxShadow: l?.fill ? `-1px 0 0 0 ${l.fill}` : "",
+      color: l?.textColor || ""
+    }));
+    return (p, y) => {
+      var n;
+      return h(), S("label", {
+        class: v([
+          e(t).b("button"),
+          e(t).is("active", e(c) === e(s)),
+          e(t).is("disabled", e(i)),
+          e(t).is("focus", e(d)),
+          e(t).bm("button", e(u))
+        ])
+      }, [
+        U(_("input", {
+          ref_key: "radioRef",
+          ref: o,
+          "onUpdate:modelValue": (r) => T(c) ? c.value = r : null,
+          class: v(e(t).be("button", "original-radio")),
+          value: e(s),
+          type: "radio",
+          name: p.name || ((n = e(l)) == null ? void 0 : n.name),
+          disabled: e(i),
+          onFocus: (r) => d.value = !0,
+          onBlur: (r) => d.value = !1,
+          onClick: k(() => {
+          }, ["stop"])
+        }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "onFocus", "onBlur", "onClick"]), [
+          [K, e(c)]
+        ]),
+        _("span", {
+          class: v(e(t).be("button", "inner")),
+          style: fe(e(c) === e(s) ? e(m) : {}),
+          onKeydown: k(() => {
+          }, ["stop"])
+        }, [
+          P(p.$slots, "default", {}, () => [
+            L(O(p.label), 1)
+          ])
+        ], 46, ["onKeydown"])
+      ], 2);
+    };
+  }
+});
+var Q = /* @__PURE__ */ I(Ce, [["__file", "radio-button.vue"]]);
+const Ie = E({
+  id: {
+    type: String,
+    default: void 0
+  },
+  size: A,
+  disabled: Boolean,
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  fill: {
+    type: String,
+    default: ""
+  },
+  textColor: {
+    type: String,
+    default: ""
+  },
+  name: {
+    type: String,
+    default: void 0
+  },
+  validateEvent: {
+    type: Boolean,
+    default: !0
+  },
+  options: {
+    type: F(Array)
+  },
+  props: {
+    type: F(Object),
+    default: () => X
+  },
+  ...le(["ariaLabel"])
+}), Ne = M, X = {
+  label: "label",
+  value: "value",
+  disabled: "disabled"
+}, Pe = V({
+  name: "ElRadioGroup"
+}), xe = /* @__PURE__ */ V({
+  ...Pe,
+  props: Ie,
+  emits: Ne,
+  setup(a, { emit: f }) {
+    const t = a, o = N("radio"), d = te(), u = B(), { formItem: i } = ne(), { inputId: c, isLabeledByFormItem: l } = ie(t, {
+      formItemContext: i
+    }), s = (n) => {
+      f(C, n), j(() => f(w, n));
+    };
+    me(() => {
+      const n = u.value.querySelectorAll("[type=radio]"), r = n[0];
+      !Array.from(n).some((g) => g.checked) && r && (r.tabIndex = 0);
+    });
+    const m = b(() => t.name || d.value), p = b(() => ({
+      ...X,
+      ...t.props
+    })), y = (n) => {
+      const r = {
+        label: n[p.value.label],
+        value: n[p.value.value],
+        disabled: n[p.value.disabled]
+      };
+      return { ...n, ...r };
+    };
+    return pe(H, be({
+      ...ve(t),
+      changeEvent: s,
+      name: m
+    })), ge(() => t.modelValue, (n, r) => {
+      t.validateEvent && !se(n, r) && i?.validate("change").catch((g) => de());
+    }), (n, r) => (h(), S("div", {
+      id: e(c),
+      ref_key: "radioGroupRef",
+      ref: u,
+      class: v(e(o).b("group")),
+      role: "radiogroup",
+      "aria-label": e(l) ? void 0 : n.ariaLabel || "radio-group",
+      "aria-labelledby": e(l) ? e(i).labelId : void 0
+    }, [
+      P(n.$slots, "default", {}, () => [
+        (h(!0), S(ye, null, he(t.options, (g, Z) => (h(), R(W, Ve({ key: Z }, y(g)), null, 16))), 128))
+      ])
+    ], 10, ["id", "aria-label", "aria-labelledby"]));
+  }
+});
+var Y = /* @__PURE__ */ I(xe, [["__file", "radio-group.vue"]]);
+const Ge = re(W, {
+  RadioButton: Q,
+  RadioGroup: Y
+});
+D(Y);
+D(Q);
+const Fe = /* @__PURE__ */ V({
+  __name: "Selection",
+  props: {
+    modelValue: {
+      type: String,
+      required: !0
+    },
+    config: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(a, { emit: f }) {
+    const t = a, o = f, d = b({
+      get: () => t.modelValue,
+      set: (u) => {
+        o("update:modelValue", u);
+      }
+    });
+    return (u, i) => {
+      const c = Ge, l = ue;
+      return a.config?.type === "RADIO" ? (h(), R(l, {
+        key: 0,
+        label: a.config?.label,
+        width: a.config?.width,
+        align: a.config?.align,
+        fixed: a.config?.fixed
+      }, {
+        default: _e(({ row: s }) => [
+          Se(c, {
+            modelValue: d.value,
+            "onUpdate:modelValue": i[0] || (i[0] = (m) => d.value = m),
+            value: JSON.stringify(s)
+          }, null, 8, ["modelValue", "value"])
+        ]),
+        _: 1
+      }, 8, ["label", "width", "align", "fixed"])) : (h(), R(l, {
+        key: 1,
+        type: "selection",
+        selectable: a.config?.selectable,
+        width: a.config?.width,
+        align: a.config?.align,
+        fixed: a.config?.fixed
+      }, null, 8, ["selectable", "width", "align", "fixed"]));
+    };
+  }
+});
+export {
+  Fe as default
+};

package/dist/Span-Y-Lm4gq9.js

@@ -0,0 +1,31 @@
+import { defineComponent as l, computed as o, createElementBlock as n, openBlock as r, normalizeStyle as s, normalizeClass as i, toDisplayString as c } from "vue";
+import { r as p } from "./index-C1Tf_IVU.js";
+const y = /* @__PURE__ */ l({
+  __name: "Span",
+  props: {
+    item: {
+      type: Object,
+      required: !0
+    },
+    data: {
+      type: [String, Number, Boolean, Object, Array, null],
+      default: ""
+    },
+    extConfig: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(a) {
+    const e = a, t = o(
+      () => p(e.item, e.data, e.extConfig)
+    );
+    return (m, u) => (r(), n("span", {
+      class: i(t.value.class || a.item?.extConfig?.class),
+      style: s(t.value.style)
+    }, c(t.value.data), 7));
+  }
+});
+export {
+  y as default
+};