@indielayer/ui/lib/components/divider/Divider.vue.js

Indielayer UI Components with Tailwind CSS build for Vue 3

import { defineComponent as p, openBlock as o, createElementBlock as r, normalizeStyle as s, unref as t, normalizeClass as a, createElementVNode as n, toDisplayString as u, createCommentVNode as v } from "vue";
import { useTheme as y } from "../../composables/useTheme.js";
const h = ["textContent"], f = {
  label: String,
  vertical: Boolean
}, C = { name: "XDivider" }, x = /* @__PURE__ */ p({
  ...C,
  props: f,
  setup(i) {
    const c = i, { styles: d, classes: l, className: m } = y("Divider", {}, c);
    return (e, b) => (o(), r("div", {
      style: s(t(d)),
      class: a([
        t(m),
        t(l).wrapper
      ])
    }, [
      n("div", {
        class: a(t(l).line),
        style: s([
          {
            width: e.vertical ? "1px" : "auto",
            height: e.vertical ? "auto" : "1px"
          }
        ])
      }, null, 6),
      e.label ? (o(), r("div", {
        key: 0,
        class: a(["font-medium text-sm text-secondary-600 dark:text-secondary-300", [
          t(l).label,
          {
            "my-2": e.vertical,
            "mx-4": !e.vertical
          }
        ]]),
        textContent: u(e.label)
      }, null, 10, h)) : v("", !0),
      n("div", {
        class: a(t(l).line),
        style: s([
          {
            width: e.vertical ? "1px" : "auto",
            height: e.vertical ? "auto" : "1px"
          }
        ])
      }, null, 6)
    ], 6));
  }
});
export {
  x as default
};