ninemoon-ui 0.0.1

package/dist/js/switch/switch.js

@@ -0,0 +1,49 @@
+import { defineComponent, openBlock, createElementBlock, createElementVNode, normalizeStyle, normalizeClass, toDisplayString } from "vue";
+const _hoisted_1 = { class: "tdd-inline-block tdd-cursor-pointer tdd-select-none tdd-text-xs" };
+const _hoisted_2 = {
+  key: 0,
+  class: "tdd-z-10 tdd-absolute tdd-top-0 tdd-font-semibold tdd-text-white tdd-left-1 tdd-leading-5 tdd-rounded-tr-sm tdd-rounded-br-sm"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "tdd-z-10 tdd-absolute tdd-top-0 tdd-font-semibold tdd-text-white tdd-right-1 tdd-leading-5 tdd-rounded-tl-sm tdd-rounded-bl-sm"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "switch",
+  props: {
+    labelChecked: {},
+    labelUnchecked: {},
+    colorChecked: { default: "#25b9e9" },
+    colorUnchecked: { default: "#666666" },
+    modelValue: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue", "switchChange"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const togglehandle = () => {
+      emit("update:modelValue", !props.modelValue);
+      emit("switchChange", !props.modelValue);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", _hoisted_1, [
+        createElementVNode("input", {
+          type: "checkbox",
+          class: "tdd-hidden",
+          onChange: togglehandle
+        }, null, 32),
+        createElementVNode("div", {
+          class: "tdd-relative tdd-m-0 tdd-box-border tdd-block tdd-h-5 tdd-w-10 tdd-transform tdd-select-none tdd-overflow-hidden tdd-rounded-xl tdd-outline-0 tdd-ring-2 tdd-ring-gray-300 tdd-transition",
+          style: normalizeStyle({ backgroundColor: _ctx.modelValue ? _ctx.colorChecked : _ctx.colorUnchecked })
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(["tdd-absolute tdd-top-0 tdd-left-0 tdd-z-10 tdd-block tdd-h-full tdd-w-1/2 tdd-translate-x-0 tdd-transform tdd-rounded-full tdd-bg-slate-50 tdd-transition", { "tdd-translate-x-full ": _ctx.modelValue }])
+          }, null, 2)
+        ], 4),
+        _ctx.modelValue ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(_ctx.labelChecked), 1)) : (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(_ctx.labelUnchecked), 1))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/table/table.js

@@ -0,0 +1,203 @@
+import { defineComponent, computed, useSlots, ref, watch, openBlock, createElementBlock, Fragment, createElementVNode, normalizeClass, createVNode, withDirectives, vShow, h, vModelCheckbox, withModifiers } from "vue";
+const _hoisted_1 = { class: "tdd-text-center tdd-text-word6 tdd-text-base" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "table",
+  props: {
+    data: {},
+    whiteword: { default: "" },
+    showHead: { type: Boolean, default: true },
+    headclass: {},
+    cellclass: {},
+    tableclass: {}
+  },
+  emits: ["rowClick", "selectionChange"],
+  setup(__props, { expose: __expose, emit }) {
+    const props = __props;
+    const hasData = computed(() => {
+      return props.data.length > 0;
+    });
+    const slots = useSlots();
+    const renderColGroup = () => {
+      return h(
+        "colgroup",
+        null,
+        slots.default().map((it, _index) => {
+          var _a;
+          return h("col", {
+            width: ((_a = it.props) == null ? void 0 : _a.width) || null
+          });
+        })
+      );
+    };
+    const renderHead = () => {
+      return h(
+        "thead",
+        { class: props.headclass ? `tdd-text-word6 ${props.headclass}` : "tdd-text-word6" },
+        slots.default().map((it, index) => {
+          var _a;
+          return h(
+            "th",
+            {
+              class: "tdd-font-normal tdd-h-10 tdd-border-b ",
+              key: index
+            },
+            // @ts-ignore
+            it.children && it.children.head ? (
+              // @ts-ignore
+              it.children.head()
+            ) : ((_a = it.props) == null ? void 0 : _a.type) && it.props.type === "selection" ? h(
+              "label",
+              {
+                class: "tdd-px-1 tdd-flex"
+              },
+              withDirectives(
+                h("input", {
+                  type: "checkbox",
+                  "onUpdate:modelValue": (value) => allSelect.value = value,
+                  onChange: () => {
+                    allSelect.value ? allSelection() : toggleAllSelection();
+                  },
+                  class: "tdd-appearance-none form-tick tdd-h-4 tdd-w-4 tdd-border tdd-border-gray-300 tdd-rounded checked:tdd-border-transparent checked:tdd-bg-red-600 tdd-text-red-600 focus:tdd-outline-none"
+                }),
+                [[vModelCheckbox, allSelect.value]]
+              )
+            ) : it.props.label
+          );
+        })
+      );
+    };
+    const allSelect = computed({
+      set(flag) {
+        if (flag) {
+          choosed.value = props.data.map((_i, d) => d);
+        } else {
+          choosed.value = [];
+        }
+      },
+      get() {
+        return hasData.value && choosed.value.length == props.data.length;
+      }
+    });
+    const choosed = ref([]);
+    const clearSelection = () => {
+      choosed.value = [];
+    };
+    const a = () => {
+      let arr = [
+        { a: 1, b: 3 },
+        { a: 3, b: 6 },
+        { a: 0, b: 9 }
+      ];
+      return arr.map((i) => i.a);
+    };
+    a();
+    const allSelection = () => {
+      let temp = [];
+      for (let i = 0; i < props.data.length; i++) {
+        temp.push(i);
+      }
+      choosed.value = temp;
+    };
+    watch(
+      choosed,
+      (newd) => {
+        const res = props.data.filter((_i, d) => newd.includes(d));
+        emit("selectionChange", res);
+      },
+      {
+        deep: true
+      }
+    );
+    const toggleAllSelection = () => {
+      let temp = [];
+      for (let i = 0; i < props.data.length; i++) {
+        temp.push(i);
+      }
+      choosed.value = temp.filter((i) => !choosed.value.includes(i));
+    };
+    const toggleSelection = (arr) => {
+      choosed.value = arr;
+    };
+    const renderBody = () => {
+      return h(
+        "tbody",
+        {},
+        props.data.map((row, i) => {
+          return h(
+            "tr",
+            {
+              class: "tdd-border-b hover:tdd-bg-gray-100",
+              key: i,
+              onClick: withModifiers(() => {
+                emit("rowClick", { row, i });
+              }, ["stop"])
+            },
+            slots.default().map((it, _j) => {
+              var _a;
+              return h(
+                "td",
+                {
+                  class: props.cellclass ? `tdd-text-center tdd-py-2 ${props.cellclass}` : "tdd-text-center tdd-py-2"
+                },
+                ((_a = it.props) == null ? void 0 : _a.type) && it.props.type === "selection" ? h(
+                  "label",
+                  {
+                    class: "tdd-px-1 tdd-flex",
+                    for: "checkbox"
+                  },
+                  withDirectives(
+                    h("input", {
+                      type: "checkbox",
+                      value: i,
+                      "onUpdate:modelValue": (value) => {
+                        choosed.value = value;
+                      },
+                      class: "tdd-appearance-none form-tick tdd-h-4 tdd-w-4 tdd-border tdd-border-gray-300 tdd-rounded checked:tdd-border-transparent checked:tdd-bg-red-600 tdd-text-red-600 focus:tdd-outline-none "
+                    }),
+                    [[vModelCheckbox, choosed.value]]
+                  )
+                ) : h(
+                  "div",
+                  null,
+                  // @ts-ignore
+                  it.children && it.children.default ? (
+                    // @ts-ignore
+                    it.children.default({
+                      row,
+                      index: i
+                    })
+                  ) : row[it.props.prop] != null ? row[it.props.prop] : props.whiteword
+                )
+              );
+            })
+          );
+        })
+      );
+    };
+    __expose({
+      clearSelection,
+      allSelection,
+      toggleAllSelection,
+      toggleSelection
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createElementVNode("table", {
+          class: normalizeClass(["tdd-w-full tdd-text-sm", _ctx.tableclass])
+        }, [
+          createVNode(renderColGroup),
+          withDirectives(createVNode(renderHead, null, null, 512), [
+            [vShow, _ctx.showHead]
+          ]),
+          createVNode(renderBody)
+        ], 2),
+        withDirectives(createElementVNode("div", _hoisted_1, "暂无数据", 512), [
+          [vShow, !hasData.value]
+        ])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/table/tableItem.js

@@ -0,0 +1,25 @@
+import { defineComponent, renderSlot } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "tableItem",
+  props: {
+    prop: {},
+    width: {},
+    label: {},
+    fixed: {},
+    type: {},
+    sortable: { type: Boolean },
+    row: {},
+    index: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default", {
+        row: _ctx.row,
+        index: _ctx.index
+      });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/tabs/tabs.js

@@ -0,0 +1,164 @@
+import { defineComponent, computed, ref, useSlots, onMounted, openBlock, createElementBlock, createVNode, createElementVNode, normalizeStyle, createCommentVNode, h, withDirectives, vShow } from "vue";
+const _hoisted_1 = { class: "tdd-relative tdd-w-full tdd-overflow-hidden" };
+const _hoisted_2 = {
+  key: 0,
+  class: "tdd-relative tdd-my-2 tdd-w-full tdd-border-t-2 tdd-border-solid tdd-border-gray-200"
+};
+const _hoisted_3 = { class: "tdd-relative tdd-w-full" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "tabs",
+  props: {
+    active: {},
+    default: {},
+    type: { default: "line" }
+  },
+  emits: ["update:active"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const showBaseline = computed(() => props.type === "line");
+    const currentActive = ref(props.default || "");
+    const activeIndex = ref(0);
+    const arrowNum = ref(8);
+    const arrowWidth = ref(0);
+    const changeHandle = (name) => {
+      emit("update:active", name);
+    };
+    const slots = useSlots();
+    const renderBtn = (name, index) => {
+      let btc = [];
+      let divc = [];
+      switch (props.type) {
+        case "card":
+          btc.push("ETab_Card_Btn");
+          divc.push("ETabline");
+          if (index - 1 === activeIndex.value) {
+            btc.push("ETab_Line_Btn_Btw");
+            divc.push("ETablineActBtw ETablineActNe");
+          } else if (index + 1 === activeIndex.value) {
+            btc.push("ETab_Line_Btn_Btw");
+            divc.push("ETablineActBtw ETablineActPr");
+          } else if (index === activeIndex.value) {
+            btc.push("ETab_Card_Btn_Act");
+          }
+          break;
+        default:
+          btc.push("ETab_Line_Btn");
+          divc.push("ETabline");
+          if (index === activeIndex.value) {
+            divc.push("ETab_Line_Act");
+          }
+          break;
+      }
+      return h(
+        "button",
+        {
+          type: "button",
+          class: btc.join(" "),
+          onClick: (e) => {
+            activeIndex.value = index;
+            let aim = e.target;
+            arrowWidth.value = aim.offsetWidth;
+            arrowNum.value = aim.offsetLeft;
+            changeHandle(name);
+            currentActive.value = name;
+          }
+          // key: index,
+        },
+        h(
+          "span",
+          {
+            class: divc.join(" ")
+          },
+          name
+        )
+      );
+    };
+    const renderBar = () => {
+      return h(
+        "div",
+        {
+          class: `ETab${props.type === "line" ? " px-2 pt-2" : " ETab_Card"}`
+        },
+        slots.default().map((it, index) => {
+          var _a;
+          if (it.type.toString().includes("Symbol")) {
+            return it.children.map((simple, i) => {
+              return renderBtn(simple.props.name, i);
+            });
+          } else {
+            return renderBtn((_a = it.props) == null ? void 0 : _a.name, index);
+          }
+        })
+      );
+    };
+    const renderContent = () => {
+      return h(
+        "div",
+        {},
+        slots.default().map((it, index) => {
+          var _a, _b;
+          if (it.type.toString().includes("Symbol")) {
+            return it.children.map((simple, i) => {
+              if (currentActive.value === "") {
+                activeIndex.value = i;
+                currentActive.value = simple.props.name;
+              } else if (currentActive.value === simple.props.name) {
+                activeIndex.value = i;
+              }
+              return withDirectives(
+                h(simple, {
+                  key: simple.props.name
+                }),
+                [[vShow, currentActive.value === "" || currentActive.value === simple.props.name]]
+              );
+            });
+          } else {
+            if (currentActive.value === "") {
+              activeIndex.value = index;
+              currentActive.value = (_a = it.props) == null ? void 0 : _a.name;
+            } else if (currentActive.value === ((_b = it.props) == null ? void 0 : _b.name)) {
+              activeIndex.value = index;
+            }
+            return withDirectives(
+              h(it, {
+                key: it.props.name
+              }),
+              [[vShow, currentActive.value === "" || currentActive.value === it.props.name]]
+            );
+          }
+        })
+      );
+    };
+    const btnBar = ref();
+    onMounted(() => {
+      if (props.type === "line") {
+        const aim = btnBar.value.children[activeIndex.value];
+        arrowWidth.value = aim.children[0].innerHTML.length * 14 + 16;
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(renderBar, {
+          ref_key: "btnBar",
+          ref: btnBar
+        }, null, 512),
+        showBaseline.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createElementVNode("div", {
+            class: "tdd-absolute tdd-bottom-0 tdd-border-t-2 tdd-border-solid tdd-border-blue-brand tdd-transition",
+            style: normalizeStyle({
+              transform: `translateX(${arrowNum.value}px`,
+              width: `${arrowWidth.value}px`
+            })
+          }, null, 4)
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_3, [
+          createVNode(renderContent)
+        ])
+      ]);
+    };
+  }
+});
+const tabs_vue_vue_type_style_index_0_lang = "";
+export {
+  _sfc_main as default
+};

package/dist/js/tabs/tabsPane.js

@@ -0,0 +1,17 @@
+import { defineComponent, openBlock, createElementBlock, renderSlot } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "tabsPane",
+  props: {
+    name: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        renderSlot(_ctx.$slots, "default")
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/tree/tree.js

@@ -0,0 +1,72 @@
+import { defineComponent, defineAsyncComponent, provide, computed, watch, openBlock, createElementBlock, Fragment, renderList, createBlock, unref } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "tree",
+  props: {
+    data: {},
+    defaultExpandAll: { type: Boolean, default: false },
+    lazy: { type: Boolean, default: false },
+    defaultCheckedKeys: {},
+    nodeKey: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const Leaf = defineAsyncComponent(() => import("./treeleaf.js"));
+    provide("parentlazy", props.lazy);
+    const flattenArr = computed(() => {
+      let data = flatten(props.data);
+      return data;
+    });
+    const flatten = (list, pid) => {
+      let result = [];
+      for (let i = 0; i < list.length; i++) {
+        let temp = list[i];
+        temp.pid = pid;
+        temp.checked = false;
+        temp.somechecked = false;
+        result.push(temp);
+        if (Array.isArray(temp.children)) {
+          result = result.concat(flatten(temp.children, temp[props.nodeKey]));
+        }
+      }
+      return result;
+    };
+    watch(() => props.defaultCheckedKeys, (newd) => {
+      if (newd && newd.length > 0) {
+        flattenArr.value.map((i) => {
+          if (newd == null ? void 0 : newd.includes(i[props.nodeKey])) {
+            i.checked = true;
+          } else {
+            i.checked = false;
+          }
+        });
+      } else {
+        flattenArr.value.map((i) => {
+          i.checked = false;
+        });
+      }
+    }, { deep: true });
+    const getCheckedKeys = (leafOnly = false) => {
+      if (leafOnly) {
+        return flattenArr.value.filter((i) => i.somechecked === false || i.checked === true).map((i) => i[props.nodeKey]);
+      } else {
+        return flattenArr.value.filter((i) => i.checked === true).map((i) => i[props.nodeKey]);
+      }
+    };
+    __expose({
+      getCheckedKeys
+    });
+    return (_ctx, _cache) => {
+      return openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.data, (i) => {
+        return openBlock(), createBlock(unref(Leaf), {
+          item: i,
+          deepnum: 1,
+          key: i[_ctx.nodeKey],
+          nodeKey: _ctx.nodeKey
+        }, null, 8, ["item", "nodeKey"]);
+      }), 128);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/tree/treeleaf.js

@@ -0,0 +1,118 @@
+import { defineComponent, computed, ref, inject, watch, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeStyle, normalizeClass, withDirectives, vModelCheckbox, toDisplayString, Fragment, renderList, createBlock, vShow } from "vue";
+const _hoisted_1 = { class: "tdd-flow-root" };
+const _hoisted_2 = /* @__PURE__ */ createElementVNode("polygon", { points: "1,2.5 5,7.5 9,2.5" }, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+const _hoisted_4 = { class: "tdd-flex tdd-items-center" };
+const __default__ = {
+  name: "Leaf"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: {
+    item: {},
+    deepnum: {},
+    nodeKey: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const marginLeft = computed(() => {
+      return `${(props.deepnum - 1) * 16}px`;
+    });
+    const noshow = ref(inject("parentlazy", false));
+    const childList = computed(() => {
+      return props.item.children || [];
+    });
+    const checkedchildLen = computed(() => childList.value.filter((i) => i.checked === true).length);
+    const somecheckchildLen = computed(() => childList.value.filter((i) => i.somechecked === true).length);
+    const childlenChange = computed(() => childList.value.length);
+    watch([checkedchildLen, somecheckchildLen], ([checklen, somechecklen]) => {
+      if (checklen > 0) {
+        if (checklen === childList.value.length) {
+          props.item.checked = true;
+          props.item.somechecked = false;
+        } else {
+          props.item.checked = false;
+          props.item.somechecked = true;
+        }
+      } else if (somechecklen > 0) {
+        props.item.checked = false;
+        props.item.somechecked = true;
+      } else {
+        props.item.somechecked = false;
+        props.item.checked = false;
+      }
+    });
+    const ableExpend = computed(() => {
+      return childList.value.length > 0 || noshow.value === true;
+    });
+    const expendflag = ref(false);
+    const expendHandle = () => {
+      noshow.value = false;
+      if (ableExpend.value === false)
+        return;
+      expendflag.value = !expendflag.value;
+    };
+    watch(() => [props.item.checked, props.item.somechecked, childlenChange], ([checkflag, somecheckflag]) => {
+      if (checkflag === false && somecheckflag === false || checkflag === true) {
+        childList.value.map((i) => {
+          i.checked = checkflag;
+        });
+      }
+    }, {
+      // immediate: true,
+      deep: true
+    });
+    return (_ctx, _cache) => {
+      const _component_Leaf = resolveComponent("Leaf");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: "tdd-flex tdd-items-center",
+          style: normalizeStyle({ marginLeft: marginLeft.value })
+        }, [
+          createElementVNode("div", {
+            class: "tdd-ml-1 tdd-flex",
+            onClick: expendHandle
+          }, [
+            (openBlock(), createElementBlock("svg", {
+              class: normalizeClass([[expendflag.value ? "tdd-rotate-0" : "-tdd-rotate-90", ableExpend.value ? "tdd-visible" : " tdd-invisible"], "tdd-fill-gray-400 tdd-w-3 tdd-h-3 tdd-transition tdd-inline-block"]),
+              xmlns: "http://www.w3.org/2000/svg",
+              viewBox: "0 0 10 10"
+            }, _hoisted_3, 2))
+          ]),
+          createElementVNode("label", _hoisted_4, [
+            withDirectives(createElementVNode("input", {
+              type: "checkbox",
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.item.checked = $event),
+              class: "tdd-appearance-none"
+            }, null, 512), [
+              [vModelCheckbox, _ctx.item.checked]
+            ]),
+            createElementVNode("div", {
+              class: normalizeClass(["tdd-w-3 tdd-h-3 tdd-rounded-sm tdd-border tdd-border-solid tdd-mr-1", {
+                "tdd-bg-blue-500 tdd-border-blue-600": _ctx.item.checked == true,
+                "tdd-bg-blue-300 tdd-border-blue-400": _ctx.item.somechecked == true,
+                "tdd-bg-white": _ctx.item.checked == false && _ctx.item.somechecked == false
+              }])
+            }, null, 2),
+            createElementVNode("div", null, toDisplayString(_ctx.item.label), 1)
+          ])
+        ], 4),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(childList.value, (i) => {
+          return withDirectives((openBlock(), createBlock(_component_Leaf, {
+            item: i,
+            deepnum: _ctx.deepnum + 1,
+            nodeKey: _ctx.nodeKey,
+            key: i[props.nodeKey]
+          }, null, 8, ["item", "deepnum", "nodeKey"])), [
+            [vShow, expendflag.value]
+          ]);
+        }), 128))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};