@nutui/nutui 4.0.0 → 4.0.1-2.beta-1

package/dist/packages/_es/Checkbox.js

@@ -1,147 +1,118 @@
-import { c as createComponent } from "./component-81a4c1d0.js";
-import { inject, reactive, computed, watch, onMounted, getCurrentInstance, h } from "vue";
-import { p as pxCheck } from "./pxCheck-c6b9f6b7.js";
-import { CheckNormal, Checked, CheckDisabled } from "@nutui/icons-vue";
+import { c as D } from "./component-234624bc.js";
+import { inject as I, reactive as z, computed as r, watch as S, onMounted as P, getCurrentInstance as p, onBeforeUnmount as M, h as b } from "vue";
+import { p as j } from "./pxCheck-38173291.js";
+import { CheckNormal as L, Checked as N, CheckDisabled as O } from "@nutui/icons-vue";
 import "../locale/lang";
-const component = (componentName2, components) => {
-  return {
-    components,
-    props: {
-      modelValue: {
-        type: Boolean,
-        default: false
-      },
-      disabled: {
-        type: Boolean,
-        default: false
-      },
-      textPosition: {
-        type: String,
-        default: "right"
-      },
-      iconSize: {
-        type: [String, Number],
-        default: ""
-      },
-      label: {
-        type: String,
-        default: ""
-      },
-      indeterminate: {
-        type: Boolean,
-        default: false
-      }
+const T = (c, h) => ({
+  components: h,
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: !1
     },
-    emits: ["change", "update:modelValue"],
-    setup(props, { emit, slots }) {
-      const parent = inject("parent", null);
-      const state = reactive({
-        partialSelect: props.indeterminate
-      });
-      const hasParent = computed(() => !!parent);
-      const pValue = computed(() => {
-        if (hasParent.value) {
-          return parent.value.value.includes(props.label);
-        } else {
-          return props.modelValue;
-        }
-      });
-      const pDisabled = computed(() => {
-        return hasParent.value ? parent.disabled.value ? parent.disabled.value : props.disabled : props.disabled;
-      });
-      const checked = computed(() => !!props.modelValue);
-      const color = computed(() => {
-        return !pDisabled.value ? !pValue.value ? "nut-checkbox__icon--unchecked" : state.partialSelect ? "nut-checkbox__icon--indeterminate" : "nut-checkbox__icon" : "nut-checkbox__icon--disable";
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    textPosition: {
+      type: String,
+      default: "right"
+    },
+    iconSize: {
+      type: [String, Number],
+      default: ""
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    indeterminate: {
+      type: Boolean,
+      default: !1
+    },
+    shape: {
+      type: String,
+      default: "round"
+      // button
+    }
+  },
+  emits: ["change", "update:modelValue"],
+  setup(t, { emit: v, slots: e }) {
+    const n = I("parent", null), u = z({
+      partialSelect: t.indeterminate
+    }), d = r(() => !!n), k = r(() => d.value ? n.value.value.includes(t.label) : t.modelValue), o = r(() => d.value && n.disabled.value ? n.disabled.value : t.disabled), _ = r(() => !!t.modelValue), y = r(() => o.value ? "nut-checkbox__icon--disable" : u.partialSelect ? "nut-checkbox__icon--indeterminate" : k.value ? "nut-checkbox__icon" : "nut-checkbox__icon--unchecked");
+    let m = "";
+    const x = (a, i) => {
+      m = "click", v("update:modelValue", a), v("change", a, i);
+    };
+    S(
+      () => t.modelValue,
+      (a) => {
+        m == "click" ? m = "" : v("change", a);
+      }
+    );
+    const V = () => {
+      const { iconSize: a } = t, i = {
+        CheckNormal: e.icon ? e.icon : h.CheckNormal,
+        Checked: e.checkedIcon ? e.checkedIcon : h.Checked,
+        CheckDisabled: e.indeterminate ? e.indeterminate : h.CheckDisabled
+      }, f = u.partialSelect ? i.CheckDisabled : k.value ? i.Checked : i.CheckNormal, l = j(a);
+      return b(f, {
+        width: l,
+        height: l,
+        size: l,
+        class: y.value
       });
-      let updateType = "";
-      const emitChange = (value, label) => {
-        updateType = "click";
-        emit("update:modelValue", value);
-        emit("change", value, label);
-      };
-      watch(
-        () => props.modelValue,
-        (v) => {
-          if (updateType == "click") {
-            updateType = "";
-          } else {
-            emit("change", v);
-          }
-        }
+    }, s = () => {
+      var a;
+      return b(
+        "view",
+        {
+          class: `${c}__label ${o.value ? `${c}__label--disabled` : ""}`
+        },
+        (a = e.default) == null ? void 0 : a.call(e)
       );
-      const renderIcon = () => {
-        const { iconSize } = props;
-        const iconNodeMap = {
-          CheckNormal: slots.icon ? slots.icon : components.CheckNormal,
-          Checked: slots.checkedIcon ? slots.checkedIcon : components.Checked,
-          CheckDisabled: slots.indeterminate ? slots.indeterminate : components.CheckDisabled
-        };
-        const iconNode = !pValue.value ? iconNodeMap.CheckNormal : state.partialSelect ? iconNodeMap.CheckDisabled : iconNodeMap.Checked;
-        const size = pxCheck(iconSize);
-        return h(iconNode, {
-          width: size,
-          height: size,
-          size,
-          class: color.value
-        });
-      };
-      const renderLabel = () => {
-        var _a;
-        return h(
-          "view",
-          {
-            class: `${componentName2}__label ${pDisabled.value ? `${componentName2}__label--disabled` : ""}`
-          },
-          (_a = slots.default) == null ? void 0 : _a.call(slots)
-        );
-      };
-      const handleClick = (e) => {
-        var _a, _b;
-        if (pDisabled.value)
-          return;
-        if (checked.value && state.partialSelect) {
-          state.partialSelect = false;
-          emitChange(checked.value, (_a = slots.default) == null ? void 0 : _a.call(slots)[0].children);
+    }, w = () => {
+      var a;
+      return b(
+        "view",
+        {
+          class: `${c}__button ${k.value && `${c}__button--active`} ${o.value ? `${c}__button--disabled` : ""}`
+        },
+        (a = e.default) == null ? void 0 : a.call(e)
+      );
+    }, B = (a) => {
+      var i, f;
+      if (!o.value) {
+        if (_.value && u.partialSelect) {
+          u.partialSelect = !1, x(_.value, (i = e.default) == null ? void 0 : i.call(e)[0].children);
           return;
         }
-        emitChange(!checked.value, (_b = slots.default) == null ? void 0 : _b.call(slots)[0].children);
-        if (hasParent.value) {
-          const value = parent.value.value;
-          const max = parent.max.value;
-          const { label } = props;
-          const index = value.indexOf(label);
-          if (index > -1) {
-            value.splice(index, 1);
-          } else if (index <= -1 && (value.length < max || !max)) {
-            value.push(label);
-          }
-          parent.updateValue(value);
-        }
-      };
-      onMounted(() => {
-        hasParent.value && parent["relation"](getCurrentInstance());
-      });
-      watch(
-        () => props.indeterminate,
-        (newVal) => {
-          state.partialSelect = newVal;
+        if (x(!_.value, (f = e.default) == null ? void 0 : f.call(e)[0].children), d.value) {
+          const l = n.value.value, $ = n.max.value, { label: g } = t, C = l.indexOf(g);
+          C > -1 ? l.splice(C, 1) : C <= -1 && (l.length < $ || !$) && l.push(g), n.updateValue(l);
         }
-      );
-      return () => {
-        return h(
-          "view",
-          {
-            class: `${componentName2} ${props.textPosition === "left" ? `${componentName2}--reverse` : ""}`,
-            onClick: handleClick
-          },
-          [renderIcon(), renderLabel()]
-        );
-      };
-    }
-  };
-};
-const { create, componentName } = createComponent("checkbox");
-const _sfc_main = create(component(componentName, { CheckNormal, Checked, CheckDisabled }));
+      }
+    };
+    return P(() => {
+      d.value && n.link(p());
+    }), M(() => {
+      d.value && n.unlink(p());
+    }), S(
+      () => t.indeterminate,
+      (a) => {
+        u.partialSelect = a;
+      }
+    ), () => b(
+      "view",
+      {
+        class: `${c} ${c}--${t.shape} ${t.textPosition === "left" ? `${c}--reverse` : ""}`,
+        onClick: B
+      },
+      [t.shape == "button" ? w() : [V(), s()]]
+    );
+  }
+}), { create: U, componentName: q } = D("checkbox"), J = U(T(q, { CheckNormal: L, Checked: N, CheckDisabled: O }));
 export {
-  _sfc_main as default
+  J as default
 };

package/dist/packages/_es/CheckboxGroup.js

@@ -1,9 +1,8 @@
-import { reactive, provide, computed, watch, h } from "vue";
-import { c as createComponent } from "./component-81a4c1d0.js";
-import { u as useExpose } from "./index-79c5dc33.js";
+import { reactive as h, provide as b, computed as n, watch as x, h as V } from "vue";
+import { c as g } from "./component-234624bc.js";
+import { u as i } from "./index-fadb0974.js";
 import "../locale/lang";
-const { create, componentName } = createComponent("checkbox-group");
-const _sfc_main = create({
+const { create: m, componentName: y } = g("checkbox-group"), E = m({
   props: {
     modelValue: {
       type: Array,
@@ -11,7 +10,7 @@ const _sfc_main = create({
     },
     disabled: {
       type: Boolean,
-      default: false
+      default: !1
     },
     max: {
       type: Number,
@@ -19,70 +18,48 @@ const _sfc_main = create({
     }
   },
   emits: ["change", "update:modelValue"],
-  setup(props, { slots, emit }) {
-    const state = reactive({
+  setup(o, { slots: u, emit: r }) {
+    const d = h({
       children: []
-    });
-    const relation = (child) => {
-      if (child.proxy) {
-        state.children.push(child.proxy);
-      }
-    };
-    const updateValue = (value) => {
-      emit("update:modelValue", value);
-      emit("change", value);
-    };
-    const toggleAll = (checked) => {
-      let values = [];
-      if (!!checked) {
-        state.children.forEach((item) => {
-          if (!(item == null ? void 0 : item.disabled)) {
-            values.push(item == null ? void 0 : item.label);
-          }
-        });
-      }
-      emit("update:modelValue", values);
-    };
-    const toggleReverse = () => {
-      let values = props.modelValue.slice();
-      state.children.forEach((item) => {
-        let findIndex = values.findIndex((value) => value === item.label);
-        if (findIndex > -1) {
-          values.splice(findIndex, 1);
-        } else {
-          if (!(item == null ? void 0 : item.disabled)) {
-            values.push(item == null ? void 0 : item.label);
-          }
-        }
-      });
-      emit("update:modelValue", values);
+    }), c = (e) => {
+      e.proxy && d.children.push(e.proxy);
+    }, t = (e) => {
+      e.proxy && (d.children = d.children.filter((a) => a !== e.proxy));
+    }, s = (e) => {
+      r("update:modelValue", e), r("change", e);
+    }, p = (e) => {
+      const a = [];
+      e && d.children.forEach((l) => {
+        l != null && l.disabled || a.push(l == null ? void 0 : l.label);
+      }), r("update:modelValue", a);
+    }, f = () => {
+      const e = d.children.filter((a) => a != null && a.disabled ? !1 : !o.modelValue.includes(a.label)).map((a) => a.label);
+      r("update:modelValue", e);
     };
-    provide("parent", {
-      value: computed(() => props.modelValue),
-      disabled: computed(() => props.disabled),
-      max: computed(() => props.max),
-      updateValue,
-      relation
-    });
-    watch(
-      () => props.modelValue,
-      (value) => {
-        emit("change", value);
+    return b("parent", {
+      value: n(() => o.modelValue),
+      disabled: n(() => o.disabled),
+      max: n(() => o.max),
+      updateValue: s,
+      link: c,
+      unlink: t
+    }), x(
+      () => o.modelValue,
+      (e) => {
+        r("change", e);
       }
-    );
-    useExpose({ toggleAll, toggleReverse });
-    return () => {
-      var _a;
-      return h(
+    ), i({ toggleAll: p, toggleReverse: f }), () => {
+      var e;
+      return V(
         "view",
         {
-          class: componentName
+          class: y
         },
-        (_a = slots.default) == null ? void 0 : _a.call(slots)
+        (e = u.default) == null ? void 0 : e.call(u)
       );
     };
   }
 });
 export {
-  _sfc_main as default
+  E as default
 };

package/dist/packages/_es/CircleProgress.js

@@ -1,13 +1,12 @@
-import { useSlots, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, Fragment, renderList, renderSlot, toDisplayString, createCommentVNode } from "vue";
-import { g as isObject, c as createComponent } from "./component-81a4c1d0.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+import { useSlots as v, computed as r, openBlock as s, createElementBlock as l, normalizeClass as _, normalizeStyle as p, createElementVNode as n, Fragment as $, renderList as b, renderSlot as C, toDisplayString as N, createCommentVNode as w } from "vue";
+import { g as h, c as j } from "./component-234624bc.js";
+import { _ as B } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { componentName, create } = createComponent("circle-progress");
-const _sfc_main = create({
+const { componentName: D, create: W } = j("circle-progress"), F = W({
   props: {
     progress: {
       type: [Number, String],
-      required: true
+      required: !0
     },
     strokeWidth: {
       type: [Number, String],
@@ -31,122 +30,94 @@ const _sfc_main = create({
     },
     clockwise: {
       type: Boolean,
-      default: true
+      default: !0
     }
   },
-  setup(props) {
-    const slotDefault = !!useSlots().default;
-    const refRandomId = Math.random().toString(36).slice(-8);
-    const classes = computed(() => {
-      const prefixCls = componentName;
+  setup(e) {
+    const f = !!v().default, a = Math.random().toString(36).slice(-8), m = r(() => ({
+      [D]: !0
+    })), k = r(() => {
+      const t = e.clockwise ? 1 : 0;
+      return `M 50 50 m 0 -45 a 45 45 0 1 ${t} 0 90 a 45 45 0 1, ${t} 0 -90`;
+    }), y = r(() => h(e.color) ? `url(#${a})` : e.color), i = r(() => {
+      let t = 283, d = t * Number(e.progress) / 100;
       return {
-        [prefixCls]: true
+        stroke: h(e.color) ? `url(#${a})` : e.color,
+        strokeDasharray: `${d}px ${t}px`
       };
-    });
-    const path = computed(() => {
-      const isWise = props.clockwise ? 1 : 0;
-      return `M 50 50 m 0 -45 a 45 45 0 1 ${isWise} 0 90 a 45 45 0 1, ${isWise} 0 -90`;
-    });
-    const hoverColor = computed(() => {
-      return isObject(props.color) ? `url(#${refRandomId})` : props.color;
-    });
-    const hoverStyle = computed(() => {
-      let perimeter = 283;
-      let offset = perimeter * Number(props.progress) / 100;
-      return {
-        stroke: isObject(props.color) ? `url(#${refRandomId})` : props.color,
-        strokeDasharray: `${offset}px ${perimeter}px`
-      };
-    });
-    const pathStyle = computed(() => {
-      return {
-        stroke: props.pathColor
-      };
-    });
-    const stop = computed(() => {
-      if (!isObject(props.color)) {
+    }), u = r(() => ({
+      stroke: e.pathColor
+    })), S = r(() => {
+      if (!h(e.color))
         return;
-      }
-      let color = props.color;
-      const colorArr = Object.keys(color).sort((a, b) => parseFloat(a) - parseFloat(b));
-      let stopArr = [];
-      colorArr.map((item) => {
-        let obj = {
+      let t = e.color;
+      const d = Object.keys(t).sort((c, o) => parseFloat(c) - parseFloat(o));
+      let g = [];
+      return d.map((c) => {
+        let o = {
           key: "",
           value: ""
         };
-        obj.key = item;
-        obj.value = color[item];
-        stopArr.push(obj);
-      });
-      return stopArr;
+        o.key = c, o.value = t[c], g.push(o);
+      }), g;
     });
     return {
-      classes,
-      hoverStyle,
-      pathStyle,
-      path,
-      hoverColor,
-      stop,
-      slotDefault,
-      refRandomId
+      classes: m,
+      hoverStyle: i,
+      pathStyle: u,
+      path: k,
+      hoverColor: y,
+      stop: S,
+      slotDefault: f,
+      refRandomId: a
     };
   }
-});
-const _hoisted_1 = { viewBox: "0 0 100 100" };
-const _hoisted_2 = ["id"];
-const _hoisted_3 = ["offset", "stop-color"];
-const _hoisted_4 = ["d", "stroke-width"];
-const _hoisted_5 = ["d", "stroke", "stroke-linecap", "stroke-width"];
-const _hoisted_6 = { class: "nut-circle-progress__text" };
-const _hoisted_7 = { key: 0 };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(_ctx.classes),
-    style: normalizeStyle({ height: Number(_ctx.radius) * 2 + "px", width: Number(_ctx.radius) * 2 + "px" })
+}), L = { viewBox: "0 0 100 100" }, O = ["id"], z = ["offset", "stop-color"], A = ["d", "stroke-width"], E = ["d", "stroke", "stroke-linecap", "stroke-width"], I = { class: "nut-circle-progress__text" }, M = { key: 0 };
+function R(e, f, a, m, k, y) {
+  return s(), l("div", {
+    class: _(e.classes),
+    style: p({ height: Number(e.radius) * 2 + "px", width: Number(e.radius) * 2 + "px" })
   }, [
-    (openBlock(), createElementBlock("svg", _hoisted_1, [
-      createElementVNode("defs", null, [
-        createElementVNode("linearGradient", {
-          id: _ctx.refRandomId,
+    (s(), l("svg", L, [
+      n("defs", null, [
+        n("linearGradient", {
+          id: e.refRandomId,
           x1: "100%",
           y1: "0%",
           x2: "0%",
           y2: "0%"
         }, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.stop, (item, index2) => {
-            return openBlock(), createElementBlock("stop", {
-              key: index2,
-              offset: item.key,
-              "stop-color": item.value
-            }, null, 8, _hoisted_3);
-          }), 128))
-        ], 8, _hoisted_2)
+          (s(!0), l($, null, b(e.stop, (i, u) => (s(), l("stop", {
+            key: u,
+            offset: i.key,
+            "stop-color": i.value
+          }, null, 8, z))), 128))
+        ], 8, O)
       ]),
-      createElementVNode("path", {
+      n("path", {
         class: "nut-circle-progress__path",
-        style: normalizeStyle(_ctx.pathStyle),
-        d: _ctx.path,
+        style: p(e.pathStyle),
+        d: e.path,
         fill: "none",
-        "stroke-width": _ctx.strokeWidth
-      }, " > ", 12, _hoisted_4),
-      createElementVNode("path", {
+        "stroke-width": e.strokeWidth
+      }, " > ", 12, A),
+      n("path", {
         class: "nut-circle-progress__hover",
-        style: normalizeStyle(_ctx.hoverStyle),
-        d: _ctx.path,
+        style: p(e.hoverStyle),
+        d: e.path,
         fill: "none",
-        stroke: _ctx.hoverColor,
-        "stroke-linecap": _ctx.strokeLinecap,
-        "stroke-width": _ctx.strokeWidth
-      }, null, 12, _hoisted_5)
+        stroke: e.hoverColor,
+        "stroke-linecap": e.strokeLinecap,
+        "stroke-width": e.strokeWidth
+      }, null, 12, E)
     ])),
-    createElementVNode("div", _hoisted_6, [
-      renderSlot(_ctx.$slots, "default"),
-      !_ctx.slotDefault ? (openBlock(), createElementBlock("div", _hoisted_7, toDisplayString(_ctx.progress) + "%", 1)) : createCommentVNode("", true)
+    n("div", I, [
+      C(e.$slots, "default"),
+      e.slotDefault ? w("", !0) : (s(), l("div", M, N(e.progress) + "%", 1))
     ])
   ], 6);
 }
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const J = /* @__PURE__ */ B(F, [["render", R]]);
 export {
-  index as default
+  J as default
 };

package/dist/packages/_es/Col.js

@@ -1,9 +1,8 @@
-import { inject, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from "vue";
-import { c as createComponent } from "./component-81a4c1d0.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+import { inject as c, computed as n, openBlock as a, createElementBlock as p, normalizeClass as l, normalizeStyle as u, renderSlot as f } from "vue";
+import { c as i } from "./component-234624bc.js";
+import { _ as m } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { componentName, create } = createComponent("col");
-const _sfc_main = create({
+const { componentName: d, create: g } = i("col"), y = g({
   props: {
     span: {
       type: [String, Number],
@@ -15,38 +14,31 @@ const _sfc_main = create({
     }
   },
   emits: [],
-  setup(props) {
-    const prefixCls = componentName;
-    const gutter = inject("gutter");
-    const classes = computed(() => {
-      return {
-        [prefixCls]: true,
-        [prefixCls + "-gutter"]: gutter,
-        ["nut-col-" + props.span]: true,
-        ["nut-col-offset-" + props.offset]: true
-      };
-    });
-    const style = computed(() => {
-      return {
-        paddingLeft: gutter / 2 + "px",
-        paddingRight: gutter / 2 + "px"
-      };
-    });
+  setup(e) {
+    const r = d, t = c("gutter"), s = n(() => ({
+      [r]: !0,
+      [r + "-gutter"]: t,
+      ["nut-col-" + e.span]: !0,
+      ["nut-col-offset-" + e.offset]: !0
+    })), o = n(() => ({
+      paddingLeft: t / 2 + "px",
+      paddingRight: t / 2 + "px"
+    }));
     return {
-      classes,
-      style
+      classes: s,
+      style: o
     };
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes),
-    style: normalizeStyle(_ctx.style)
+function _(e, r, t, s, o, $) {
+  return a(), p("view", {
+    class: l(e.classes),
+    style: u(e.style)
   }, [
-    renderSlot(_ctx.$slots, "default")
+    f(e.$slots, "default")
   ], 6);
 }
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const b = /* @__PURE__ */ m(y, [["render", _]]);
 export {
-  index as default
+  b as default
 };