y-design-ssr 0.2.0 → 0.2.2

package/libs/col/index.mjs

@@ -1,11 +1,40 @@
-import { ref as h, reactive as m, getCurrentInstance as v, provide as _, isVNode as j, inject as A, onUnmounted as L, computed as l, defineComponent as y, createVNode as $ } from "vue";
-const p = (e, t) => t ? typeof t == "string" ? ` ${e}--${t}` : Array.isArray(t) ? t.reduce((n, r) => n + p(e, r), "") : Object.keys(t).reduce(
-  (n, r) => n + (t[r] ? p(e, r) : ""),
-  ""
-) : "", P = (e) => (t, n) => {
-  let r = t, i = n;
-  return r && typeof r != "string" && (i = r, r = ""), r = r ? `${e}__${r}` : e, `${r}${p(r, i)}`;
-}, T = () => (e, t) => t ? `${p(`y-${e}`, t)}` : `y-${e}`, B = {
+import { ref, reactive, getCurrentInstance, provide, isVNode, inject, onUnmounted, computed, defineComponent, createVNode } from "vue";
+const getMods = (el, mods) => {
+  if (!mods) {
+    return "";
+  }
+  if (typeof mods === "string") {
+    return ` ${el}--${mods}`;
+  }
+  if (Array.isArray(mods)) {
+    return mods.reduce((acc, cur) => acc + getMods(el, cur), "");
+  }
+  return Object.keys(mods).reduce(
+    (acc, cur) => acc + (mods[cur] ? getMods(el, cur) : ""),
+    ""
+  );
+};
+const createBEM = (block) => {
+  return (el, mods) => {
+    let _el = el;
+    let _mods = mods;
+    if (_el && typeof _el !== "string") {
+      _mods = _el;
+      _el = "";
+    }
+    _el = _el ? `${block}__${_el}` : block;
+    return `${_el}${getMods(_el, _mods)}`;
+  };
+};
+const createGlobalBem = () => {
+  return (el, mods) => {
+    if (!mods) {
+      return `y-${el}`;
+    }
+    return `${getMods(`y-${el}`, mods)}`;
+  };
+};
+const defaultLang = {
   "pull-refresh": {
     pulling: "下拉刷新...",
     loosing: "释放刷新...",
@@ -17,63 +46,190 @@ const p = (e, t) => t ? typeof t == "string" ? ` ${e}--${t}` : Array.isArray(t)
     validateMessage: "请输入正确内容"
   }
 };
-h("zh-CN");
-m({
-  "zh-CN": B
+ref("zh-CN");
+reactive({
+  "zh-CN": defaultLang
 });
-const C = (e) => {
-  const t = `y-${e}`;
-  return [t, P(t), T()];
+const createNamespace = (name2) => {
+  const prefixedName = `y-${name2}`;
+  return [prefixedName, createBEM(prefixedName), createGlobalBem()];
 };
-var b = /* @__PURE__ */ ((e) => (e.Top = "top", e.Middle = "middle", e.Bottom = "bottom", e))(b || {});
-const M = (e) => {
-  const t = [], n = (r) => {
-    Array.isArray(r) && r.forEach((i) => {
-      var c;
-      j(i) && (t.push(i), (c = i.component) != null && c.subTree && n(i.component.subTree.children), i.children && n(i.children));
+var Vertical = /* @__PURE__ */ ((Vertical2) => {
+  Vertical2["Top"] = "top";
+  Vertical2["Middle"] = "middle";
+  Vertical2["Bottom"] = "bottom";
+  return Vertical2;
+})(Vertical || {});
+const filterChildren = (children) => {
+  const vnodes = [];
+  const _filterChildren = (childrens) => {
+    if (Array.isArray(childrens)) {
+      childrens.forEach((child) => {
+        var _a;
+        if (isVNode(child)) {
+          vnodes.push(child);
+          if ((_a = child.component) == null ? void 0 : _a.subTree) {
+            _filterChildren(child.component.subTree.children);
+          }
+          if (child.children) {
+            _filterChildren(child.children);
+          }
+        }
+      });
+    }
+  };
+  _filterChildren(children);
+  return vnodes;
+};
+const sortChildren = (childrens, instance) => {
+  const vnodes = filterChildren(instance.subTree.children);
+  childrens.sort((a, b) => vnodes.indexOf(a.vnode) - vnodes.indexOf(b.vnode));
+};
+const setRelation = (key) => {
+  const instance = getCurrentInstance();
+  const childrens = reactive([]);
+  const initProvide = (value) => {
+    const addChild = (child) => {
+      if (child.proxy) {
+        childrens.push(child);
+        instance && sortChildren(childrens, instance);
+      }
+    };
+    const removeChild = (child) => {
+      const index = childrens.indexOf(child);
+      childrens.splice(index, 1);
+    };
+    provide(key, {
+      addChild,
+      removeChild,
+      childrens,
+      ...value
     });
   };
-  return n(e), t;
-}, I = (e, t) => {
-  const n = M(t.subTree.children);
-  e.sort((r, i) => n.indexOf(r.vnode) - n.indexOf(i.vnode));
-}, z = (e) => {
-  const t = v(), n = m([]);
   return {
-    childrens: n,
-    initProvide: (i) => {
-      _(e, {
-        addChild: (s) => {
-          s.proxy && (n.push(s), t && I(n, t));
-        },
-        removeChild: (s) => {
-          const a = n.indexOf(s);
-          n.splice(a, 1);
-        },
-        childrens: n,
-        ...i
-      });
-    }
+    childrens,
+    initProvide
   };
-}, D = (e) => {
-  const t = A(e, null), n = v();
-  if (t && n) {
-    const { childrens: r, addChild: i, removeChild: c } = t;
-    return i(n), L(() => c(n)), {
-      index: l(() => r.indexOf(n)),
-      parent: t
+};
+const useRelation = (key) => {
+  const parent = inject(key, null);
+  const currentInstance = getCurrentInstance();
+  if (parent && currentInstance) {
+    const { childrens, addChild, removeChild } = parent;
+    addChild(currentInstance);
+    onUnmounted(() => removeChild(currentInstance));
+    const index = computed(() => childrens.indexOf(currentInstance));
+    return {
+      index,
+      parent
     };
   }
   return {
     parent: null,
-    index: h(-1)
+    index: ref(-1)
   };
 };
-var x = /* @__PURE__ */ ((e) => (e.Start = "start", e.Center = "center", e.End = "end", e.SpaceBetween = "space-between", e.SpaceAround = "space-around", e))(x || {});
-const [N, G] = C("row"), S = N;
-b.Top, x.Start;
-const [R, U] = C("col"), f = /* @__PURE__ */ y({
-  name: R,
+var RowJustify = /* @__PURE__ */ ((RowJustify2) => {
+  RowJustify2["Start"] = "start";
+  RowJustify2["Center"] = "center";
+  RowJustify2["End"] = "end";
+  RowJustify2["SpaceBetween"] = "space-between";
+  RowJustify2["SpaceAround"] = "space-around";
+  return RowJustify2;
+})(RowJustify || {});
+const [name$1, bem$1] = createNamespace("row");
+const ROW_PROVIDE = name$1;
+/* @__PURE__ */ defineComponent({
+  name: name$1,
+  props: {
+    type: {
+      type: String,
+      default: ""
+    },
+    // 列元素之间的间距（单位为 px）
+    gutter: {
+      type: [Number, String],
+      default: 0
+    },
+    align: {
+      type: String,
+      default: Vertical.Top
+    },
+    justify: {
+      type: String,
+      default: RowJustify.Start
+    }
+  },
+  setup(props, {
+    slots
+  }) {
+    const {
+      childrens,
+      initProvide
+    } = setRelation(ROW_PROVIDE);
+    const groupList = computed(() => {
+      const groups = [[]];
+      let totalSpan = 0;
+      childrens.forEach((child, index) => {
+        var _a;
+        totalSpan += Number((_a = child.proxy) == null ? void 0 : _a.span);
+        if (totalSpan > 24) {
+          groups.push([index]);
+          totalSpan -= 24;
+        } else {
+          groups[groups.length - 1].push(index);
+        }
+      });
+      return groups;
+    });
+    const spaceList = computed(() => {
+      const gutter = Number(props.gutter);
+      const spaces = [];
+      if (!gutter)
+        return spaces;
+      groupList.value.forEach((group) => {
+        const averagePadding = gutter * (group.length - 1) / group.length;
+        group.forEach((item, index) => {
+          if (index === 0) {
+            spaces.push({
+              right: averagePadding,
+              left: 0
+            });
+          } else {
+            const left = gutter - spaces[item - 1].right;
+            const right = averagePadding - left;
+            spaces.push({
+              left,
+              right
+            });
+          }
+        });
+      });
+      return spaces;
+    });
+    initProvide({
+      spaceList
+    });
+    return () => {
+      var _a;
+      const {
+        type,
+        align,
+        justify
+      } = props;
+      return createVNode("div", {
+        "class": bem$1({
+          [type]: type,
+          [`align-${align}`]: type && align,
+          [`justify-${justify}`]: type && justify
+        })
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+const [name, bem] = createNamespace("col");
+const Col = /* @__PURE__ */ defineComponent({
+  name,
   props: {
     // 列数
     span: {
@@ -86,49 +242,58 @@ const [R, U] = C("col"), f = /* @__PURE__ */ y({
       default: 0
     }
   },
-  setup(e, {
-    slots: t
+  setup(props, {
+    slots
   }) {
     const {
-      parent: n,
-      index: r
-    } = D(S), i = l(() => {
-      if (!n)
+      parent,
+      index
+    } = useRelation(ROW_PROVIDE);
+    const style2 = computed(() => {
+      if (!parent) {
         return {};
+      }
       const {
-        spaceList: c
-      } = n, o = c.value;
-      if (o.length === 0)
+        spaceList
+      } = parent;
+      const spaces = spaceList.value;
+      if (spaces.length === 0)
         return {};
       const {
-        left: s,
-        right: a
-      } = o[r.value] || {};
+        left,
+        right
+      } = spaces[index.value] || {};
       return {
-        paddingLeft: s ? `${s}px` : 0,
-        paddingRight: a ? `${a}px` : 0
+        paddingLeft: left ? `${left}px` : 0,
+        paddingRight: right ? `${right}px` : 0
       };
     });
     return () => {
-      var s;
+      var _a;
       const {
-        span: c,
-        offset: o
-      } = e;
-      return $("div", {
-        style: i.value,
-        class: U({
-          [c]: c,
-          [`offset-${o}`]: o
+        span,
+        offset
+      } = props;
+      return createVNode("div", {
+        "style": style2.value,
+        "class": bem({
+          [span]: span,
+          [`offset-${offset}`]: offset
         })
-      }, [(s = t.default) == null ? void 0 : s.call(t)]);
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
     };
   }
 });
-f.install = (e) => {
-  const { name: t } = f;
-  e.component(t, f);
+const reset = "";
+const libs = "";
+const font = "";
+const animation = "";
+const theme = "";
+const style = "";
+Col.install = (app) => {
+  const { name: name2 } = Col;
+  app.component(name2, Col);
 };
 export {
-  f as default
+  Col as default
 };