vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
42 lines (41 loc) • 1.89 kB
JavaScript
import { defineComponent as s, computed as r, createElementBlock as o, openBlock as n, normalizeStyle as v, normalizeClass as h, createCommentVNode as f, renderSlot as g } from "vue";
import { useSlotsExist as m } from "../utils/index.js";
const p = {
key: 0,
class: "divider-text"
}, $ = /* @__PURE__ */ s({
__name: "Divider",
props: {
orientation: { default: "center" },
orientationMargin: { default: void 0 },
borderWidth: { default: 1 },
borderStyle: { default: "solid" },
borderColor: { default: "rgba(5, 5, 5, 0.06)" },
vertical: { type: Boolean, default: !1 },
height: { default: "0.9em" }
},
setup(a) {
const i = a, d = m(["default"]), l = r(() => typeof i.orientationMargin == "number" ? `${i.orientationMargin}px` : i.orientationMargin), u = r(() => typeof i.height == "number" ? `${i.height}px` : i.height), t = r(() => d.default);
return (e, c) => (n(), o("div", {
class: h(["divider-wrap", [
e.vertical ? "divider-vertical" : "divider-horizontal",
{
"divider-with-text": t.value,
"divider-with-text-center": t.value && e.orientation === "center",
"divider-with-text-left": t.value && e.orientation === "left",
"divider-with-text-right": t.value && e.orientation === "right",
"divider-orientation-margin-left": t.value && e.orientation === "left" && e.orientationMargin !== void 0,
"divider-orientation-margin-right": t.value && e.orientation === "right" && e.orientationMargin !== void 0
}
]]),
style: v(`--border-width: ${e.borderWidth}px; --border-style: ${e.borderStyle}; --border-color: ${e.borderColor}; --margin: ${l.value}; --line-height: ${u.value};`)
}, [
t.value ? (n(), o("span", p, [
g(e.$slots, "default", {}, void 0, !0)
])) : f("", !0)
], 6));
}
});
export {
$ as default
};