vue-amazing-ui/es/space/Space.vue2.js

An Amazing Vue3 UI Components Library, Using TypeScript.

import { defineComponent as n, computed as p, createElementBlock as o, openBlock as i, normalizeStyle as s, normalizeClass as d, renderSlot as u } from "vue";
const m = /* @__PURE__ */ n({
  __name: "Space",
  props: {
    width: { default: "auto" },
    align: { default: "start" },
    vertical: { type: Boolean, default: !1 },
    gap: { default: "middle" },
    wrap: { type: Boolean, default: !0 }
  },
  setup(r) {
    const a = r, t = p(() => typeof a.width == "number" ? `${a.width}px` : a.width), l = p(() => {
      if (typeof a.gap == "number")
        return `${a.gap}px`;
      if (Array.isArray(a.gap))
        return `${a.gap[1]}px ${a.gap[0]}px`;
      if (["small", "middle", "large"].includes(a.gap))
        return {
          small: "8px",
          middle: "16px",
          large: "24px"
        }[a.gap];
    });
    return (e, c) => (i(), o("div", {
      class: d(["m-space", [`space-${e.align}`, { "space-vertical": e.vertical, "space-wrap": e.wrap }]]),
      style: s(`width: ${t.value}; gap: ${l.value}; margin-bottom: -${Array.isArray(a.gap) && e.wrap ? a.gap[1] : 0}px;`)
    }, [
      u(e.$slots, "default", {}, void 0, !0)
    ], 6));
  }
});
export {
  m as default
};