@itguy614/clean-ui 0.3.1 → 1.0.0

package/dist/components/CuiDateRangePicker.vue.js

@@ -0,0 +1,376 @@
+import { defineComponent as fe, ref as C, watch as j, onMounted as ye, computed as p, withDirectives as ge, openBlock as c, createElementBlock as d, toDisplayString as v, createCommentVNode as E, createVNode as o, withCtx as f, createElementVNode as u, normalizeStyle as M, Fragment as z, createTextVNode as Y, unref as W, renderList as T, vShow as pe } from "vue";
+import he from "./CuiPopover.vue.js";
+import x from "./CuiButton.vue.js";
+import S from "./CuiIcon.vue.js";
+import { formatToMask as be, formatToRaw as O, formatDate as B, isoToDate as I, daysInMonth as P, firstDayOfMonth as xe, MONTH_NAMES_SHORT as F, DAY_NAMES_SHORT as De, isDateDisabled as ke, isToday as Ce, isSameDay as H, dateToIso as ze } from "../utils/date.js";
+const Se = {
+  key: 0,
+  style: {
+    display: "block",
+    marginBottom: "calc(0.25rem * var(--cui-density-scale, 1))",
+    fontSize: "0.875rem",
+    fontWeight: "500",
+    color: "var(--cui-text-secondary)"
+  }
+}, we = ["value", "placeholder"], Me = { style: { color: "var(--cui-text-tertiary)", fontSize: "0.75rem", flexShrink: "0" } }, _e = ["value", "placeholder"], Re = { style: { padding: "calc(0.25rem * var(--cui-density-scale, 1))", minWidth: "260px" } }, Te = { style: {
+  fontSize: "0.75rem",
+  color: "var(--cui-text-secondary)",
+  textAlign: "center",
+  marginBottom: "calc(0.375rem * var(--cui-density-scale, 1))",
+  fontWeight: "500"
+} }, Be = { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "calc(0.5rem * var(--cui-density-scale, 1))" } }, $e = { style: { display: "flex", gap: "calc(0.25rem * var(--cui-density-scale, 1))" } }, Ve = { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: "0", marginBottom: "calc(0.25rem * var(--cui-density-scale, 1))" } }, Ye = { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: "calc(1px * var(--cui-density-scale, 1))" } }, We = ["onClick", "onMouseenter"], Ie = { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "calc(0.5rem * var(--cui-density-scale, 1))" } }, Ae = { style: { display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: "calc(4px * var(--cui-density-scale, 1))" } }, Ne = ["onClick"], je = { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "calc(0.5rem * var(--cui-density-scale, 1))" } }, Ee = { style: { fontSize: "0.8125rem", fontWeight: "600", color: "var(--cui-text-body)" } }, Oe = { style: { display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: "calc(4px * var(--cui-density-scale, 1))" } }, Pe = ["onClick"], Ge = /* @__PURE__ */ fe({
+  __name: "CuiDateRangePicker",
+  props: {
+    modelValue: {},
+    format: { default: "MM/DD/YYYY" },
+    valueType: { default: "iso" },
+    highlightToday: { type: Boolean, default: !0 },
+    minDate: {},
+    maxDate: {},
+    disabledDate: {},
+    disabledDates: {},
+    blockSpanningBlackout: { type: Boolean, default: !0 },
+    separator: { default: "→" },
+    startPlaceholder: {},
+    endPlaceholder: {},
+    size: { default: "md" },
+    label: {},
+    hidden: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(y, { emit: L }) {
+    const l = y, U = L, r = C((/* @__PURE__ */ new Date()).getFullYear()), i = C((/* @__PURE__ */ new Date()).getMonth()), _ = C(!1), D = C("start"), n = C(null), g = C(null), w = C(null);
+    function A(t) {
+      return t ? t instanceof Date ? t : I(t) : null;
+    }
+    function N() {
+      l.modelValue && (n.value = A(l.modelValue.start), g.value = A(l.modelValue.end), n.value && (r.value = n.value.getFullYear(), i.value = n.value.getMonth()));
+    }
+    j(() => l.modelValue, N, { deep: !0 }), ye(N), p(() => be(l.format)), p(() => n.value ? O(B(n.value, l.format)) : ""), p(() => g.value ? O(B(g.value, l.format)) : "");
+    const q = p(() => n.value ? B(n.value, l.format) : ""), G = p(() => g.value ? B(g.value, l.format) : ""), J = p(() => l.minDate ? I(l.minDate) : null), K = p(() => l.maxDate ? I(l.maxDate) : null);
+    function R(t) {
+      return ke(t, {
+        minDate: J.value,
+        maxDate: K.value,
+        disabledDate: l.disabledDate,
+        disabledDates: l.disabledDates
+      });
+    }
+    function Q(t, e) {
+      if (!l.blockSpanningBlackout) return !1;
+      const a = new Date(t);
+      for (; a <= e; ) {
+        if (R(a)) return !0;
+        a.setDate(a.getDate() + 1);
+      }
+      return !1;
+    }
+    function X() {
+      const t = (e) => e ? l.valueType === "date" ? e : ze(e) : null;
+      U("update:modelValue", { start: t(n.value), end: t(g.value) });
+    }
+    const Z = p(() => {
+      const t = [], e = P(r.value, i.value), a = xe(r.value, i.value), s = i.value === 0 ? 11 : i.value - 1, b = i.value === 0 ? r.value - 1 : r.value, V = P(b, s);
+      for (let m = a - 1; m >= 0; m--) {
+        const k = new Date(b, s, V - m);
+        t.push({ date: k, inMonth: !1, disabled: R(k) });
+      }
+      for (let m = 1; m <= e; m++) {
+        const k = new Date(r.value, i.value, m);
+        t.push({ date: k, inMonth: !0, disabled: R(k) });
+      }
+      const de = 42 - t.length, ve = i.value === 11 ? 0 : i.value + 1, me = i.value === 11 ? r.value + 1 : r.value;
+      for (let m = 1; m <= de; m++) {
+        const k = new Date(me, ve, m);
+        t.push({ date: k, inMonth: !1, disabled: R(k) });
+      }
+      return t;
+    });
+    function ee(t) {
+      if (!t.disabled)
+        if (D.value === "start")
+          n.value = t.date, g.value = null, D.value = "end";
+        else {
+          let e = n.value, a = t.date;
+          if (a < e && ([e, a] = [a, e]), Q(e, a)) return;
+          n.value = e, g.value = a, D.value = "start", X(), _.value = !1;
+        }
+    }
+    function te(t) {
+      D.value === "end" && (w.value = t);
+    }
+    function ae(t) {
+      if (!n.value) return !1;
+      const e = D.value === "end" && w.value ? w.value : g.value;
+      if (!e) return !1;
+      const a = n.value < e ? n.value : e, s = n.value < e ? e : n.value;
+      return t >= a && t <= s;
+    }
+    function le(t) {
+      return !!n.value && H(t, n.value);
+    }
+    function ne(t) {
+      const e = D.value === "end" && w.value ? w.value : g.value;
+      return !!e && H(t, e);
+    }
+    function re() {
+      i.value === 0 ? (i.value = 11, r.value--) : i.value--;
+    }
+    function ie() {
+      i.value === 11 ? (i.value = 0, r.value++) : i.value++;
+    }
+    const h = C("days"), $ = p(() => Math.floor(r.value / 12) * 12), oe = p(() => Array.from({ length: 12 }, (t, e) => $.value + e));
+    function se(t) {
+      i.value = t, h.value = "days";
+    }
+    function ue(t) {
+      r.value = t, h.value = "months";
+    }
+    j(_, (t) => {
+      t && (h.value = "days", D.value = "start", w.value = null, n.value && (r.value = n.value.getFullYear(), i.value = n.value.getMonth()));
+    });
+    function ce(t) {
+      const e = {
+        width: "2rem",
+        height: "2rem",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        fontSize: "0.8125rem",
+        cursor: t.disabled ? "default" : "pointer",
+        transition: "background 0.1s ease, color 0.1s ease",
+        position: "relative"
+      }, a = ae(t.date), s = le(t.date), b = ne(t.date), V = l.highlightToday && Ce(t.date);
+      return t.disabled ? (e.color = "var(--cui-text-tertiary)", e.opacity = "0.35") : s || b ? (e.background = "var(--cui-primary)", e.color = "var(--cui-primary-text, white)", e.fontWeight = "600", e.borderRadius = s && !b ? "0.375rem 0 0 0.375rem" : !s && b ? "0 0.375rem 0.375rem 0" : "0.375rem") : a ? (e.background = "var(--cui-primary-bg)", e.color = "var(--cui-primary)", e.borderRadius = "0") : V ? (e.background = "var(--cui-primary-bg)", e.color = "var(--cui-primary)", e.fontWeight = "600", e.borderRadius = "0.375rem") : t.inMonth ? (e.color = "var(--cui-text-body)", e.borderRadius = "0.375rem") : (e.color = "var(--cui-text-tertiary)", e.borderRadius = "0.375rem"), e;
+    }
+    return (t, e) => ge((c(), d("div", null, [
+      y.label ? (c(), d("label", Se, v(y.label), 1)) : E("", !0),
+      o(he, {
+        visible: _.value,
+        "onUpdate:visible": e[7] || (e[7] = (a) => _.value = a),
+        placement: "bottom",
+        closable: !1,
+        "no-arrow": "",
+        width: "auto",
+        disabled: y.disabled
+      }, {
+        content: f(() => [
+          u("div", Re, [
+            u("div", Te, v(D.value === "start" ? "Select start date" : "Select end date"), 1),
+            h.value === "days" ? (c(), d(z, { key: 0 }, [
+              u("div", Be, [
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: re
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-left",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                }),
+                u("div", $e, [
+                  o(x, {
+                    variant: "ghost",
+                    size: "xs",
+                    style: { fontWeight: "600" },
+                    onClick: e[0] || (e[0] = (a) => h.value = "months")
+                  }, {
+                    default: f(() => [
+                      Y(v(W(F)[i.value]), 1)
+                    ]),
+                    _: 1
+                  }),
+                  o(x, {
+                    variant: "ghost",
+                    size: "xs",
+                    style: { fontWeight: "600" },
+                    onClick: e[1] || (e[1] = (a) => h.value = "years")
+                  }, {
+                    default: f(() => [
+                      Y(v(r.value), 1)
+                    ]),
+                    _: 1
+                  })
+                ]),
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: ie
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-right",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              u("div", Ve, [
+                (c(!0), d(z, null, T(W(De), (a) => (c(), d("div", {
+                  key: a,
+                  style: { textAlign: "center", fontSize: "0.6875rem", fontWeight: "600", color: "var(--cui-text-tertiary)", padding: "calc(0.25rem * var(--cui-density-scale, 1)) 0", textTransform: "uppercase" }
+                }, v(a), 1))), 128))
+              ]),
+              u("div", Ye, [
+                (c(!0), d(z, null, T(Z.value, (a, s) => (c(), d("div", {
+                  key: s,
+                  style: M(ce(a)),
+                  onClick: (b) => ee(a),
+                  onMouseenter: (b) => te(a.date)
+                }, v(a.date.getDate()), 45, We))), 128))
+              ])
+            ], 64)) : h.value === "months" ? (c(), d(z, { key: 1 }, [
+              u("div", Ie, [
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: e[2] || (e[2] = (a) => r.value--)
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-left",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                }),
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  style: { fontWeight: "600" },
+                  onClick: e[3] || (e[3] = (a) => h.value = "years")
+                }, {
+                  default: f(() => [
+                    Y(v(r.value), 1)
+                  ]),
+                  _: 1
+                }),
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: e[4] || (e[4] = (a) => r.value++)
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-right",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              u("div", Ae, [
+                (c(!0), d(z, null, T(W(F), (a, s) => (c(), d("div", {
+                  key: s,
+                  style: M({ padding: "calc(0.5rem * var(--cui-density-scale, 1))", textAlign: "center", borderRadius: "0.375rem", cursor: "pointer", fontSize: "0.8125rem", color: i.value === s ? "var(--cui-primary)" : "var(--cui-text-body)" }),
+                  onClick: (b) => se(s)
+                }, v(a), 13, Ne))), 128))
+              ])
+            ], 64)) : h.value === "years" ? (c(), d(z, { key: 2 }, [
+              u("div", je, [
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: e[5] || (e[5] = (a) => r.value -= 12)
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-left",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                }),
+                u("span", Ee, v($.value) + " – " + v($.value + 11), 1),
+                o(x, {
+                  variant: "ghost",
+                  size: "xs",
+                  onClick: e[6] || (e[6] = (a) => r.value += 12)
+                }, {
+                  default: f(() => [
+                    o(S, {
+                      name: "caret-right",
+                      size: "0.875rem"
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              u("div", Oe, [
+                (c(!0), d(z, null, T(oe.value, (a) => (c(), d("div", {
+                  key: a,
+                  style: M({ padding: "calc(0.5rem * var(--cui-density-scale, 1))", textAlign: "center", borderRadius: "0.375rem", cursor: "pointer", fontSize: "0.8125rem", fontWeight: r.value === a ? "600" : "400", color: r.value === a ? "var(--cui-primary)" : "var(--cui-text-body)" }),
+                  onClick: (s) => ue(a)
+                }, v(a), 13, Pe))), 128))
+              ])
+            ], 64)) : E("", !0)
+          ])
+        ]),
+        default: f(() => [
+          u("div", {
+            style: M({
+              display: "flex",
+              alignItems: "center",
+              gap: "calc(0.375rem * var(--cui-density-scale, 1))",
+              border: "1px solid var(--cui-border-strong, var(--cui-border))",
+              borderRadius: "var(--cui-button-radius, 0.375rem)",
+              padding: "0 calc(0.5rem * var(--cui-density-scale, 1))",
+              background: "var(--cui-surface-base, white)",
+              opacity: y.disabled ? "0.5" : "1",
+              cursor: y.disabled ? "default" : "pointer"
+            })
+          }, [
+            o(S, {
+              name: "calendar-blank",
+              size: "0.875rem",
+              style: { color: "var(--cui-text-tertiary)", "flex-shrink": "0" }
+            }),
+            u("input", {
+              value: q.value,
+              placeholder: y.startPlaceholder || l.format.toLowerCase(),
+              readonly: "",
+              style: M({
+                border: "none",
+                background: "transparent",
+                outline: "none",
+                fontSize: "0.875rem",
+                color: "var(--cui-text-body)",
+                padding: "calc(0.5rem * var(--cui-density-scale, 1)) 0",
+                width: `${l.format.length + 1}ch`,
+                cursor: "pointer"
+              })
+            }, null, 12, we),
+            u("span", Me, v(y.separator), 1),
+            u("input", {
+              value: G.value,
+              placeholder: y.endPlaceholder || l.format.toLowerCase(),
+              readonly: "",
+              style: M({
+                border: "none",
+                background: "transparent",
+                outline: "none",
+                fontSize: "0.875rem",
+                color: "var(--cui-text-body)",
+                padding: "calc(0.5rem * var(--cui-density-scale, 1)) 0",
+                width: `${l.format.length + 1}ch`,
+                cursor: "pointer"
+              })
+            }, null, 12, _e)
+          ], 4)
+        ]),
+        _: 1
+      }, 8, ["visible", "disabled"])
+    ], 512)), [
+      [pe, !y.hidden]
+    ]);
+  }
+});
+export {
+  Ge as default
+};

package/dist/components/CuiDateRangePicker.vue2.js

@@ -0,0 +1,4 @@
+import f from "./CuiDateRangePicker.vue.js";
+export {
+  f as default
+};

package/dist/components/CuiDivider.vue.d.ts

@@ -1,7 +1,8 @@
+import type { CuiColorOrCss, HideableProps } from "../types/common";
 export type DividerOrientation = "horizontal" | "vertical";
 export type DividerLabelPosition = "start" | "center" | "end";
 export type DividerVariant = "solid" | "dashed" | "dotted";
-export interface CuiDividerProps {
+export interface CuiDividerProps extends HideableProps {
     /** Orientation */
     orientation?: DividerOrientation;
     /** Label position (when using default slot or label prop) */
@@ -12,10 +13,8 @@ export interface CuiDividerProps {
     variant?: DividerVariant;
     /** Spacing above and below (CSS value, e.g., "1rem") */
     spacing?: string;
-    /** Custom color (CSS value) */
-    color?: string;
-    /** Hide the component */
-    hidden?: boolean;
+    /** Line color — a color role (mapped to its token) or any CSS color */
+    color?: CuiColorOrCss;
 }
 declare var __VLS_1: {}, __VLS_3: {};
 type __VLS_Slots = {} & {

package/dist/components/CuiDivider.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CuiDivider.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiDivider.vue"],"names":[],"mappings":"AA4IA,MAAM,MAAM,kBAAkB,GAAG,YAAY,GAAG,UAAU,CAAC;AAC3D,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAC9D,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE3D,MAAM,WAAW,eAAe;IAC9B,kBAAkB;IAClB,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,6DAA6D;IAC7D,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AA2JD,QAAA,IAAI,OAAO,IAAU,EAAE,OAAO,IAAW,CAAE;AAC3C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAwB/C,QAAA,MAAM,eAAe;YAvLV,OAAO;aANN,cAAc;iBANV,kBAAkB;aAQtB,MAAM;mBANA,oBAAoB;6EAwMpC,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiDivider.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiDivider.vue"],"names":[],"mappings":"AA2IA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGpE,MAAM,MAAM,kBAAkB,GAAG,YAAY,GAAG,UAAU,CAAC;AAC3D,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAC9D,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE3D,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,kBAAkB;IAClB,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,6DAA6D;IAC7D,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uEAAuE;IACvE,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AA2JD,QAAA,IAAI,OAAO,IAAU,EAAE,OAAO,IAAW,CAAE;AAC3C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAwB/C,QAAA,MAAM,eAAe;;aA3LT,cAAc;iBANV,kBAAkB;aAQtB,MAAM;mBANA,oBAAoB;6EAsMpC,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/CuiDivider.vue.js

@@ -0,0 +1,124 @@
+import { defineComponent as p, useSlots as x, computed as n, withDirectives as s, openBlock as a, createElementBlock as i, normalizeStyle as l, createCommentVNode as d, createElementVNode as f, renderSlot as g, createTextVNode as h, toDisplayString as b, vShow as u } from "vue";
+import { resolveColor as S } from "../utils/color.js";
+const B = /* @__PURE__ */ p({
+  __name: "CuiDivider",
+  props: {
+    orientation: { default: "horizontal" },
+    labelPosition: { default: "center" },
+    label: {},
+    variant: { default: "solid" },
+    spacing: { default: "0" },
+    color: {},
+    hidden: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = e, k = x(), m = n(() => !!t.label || !!k.default), r = n(() => {
+      const c = t.color ? S(t.color) : "var(--cui-border)";
+      return `1px ${t.variant} ${c}`;
+    }), v = n(() => t.orientation === "vertical" ? {
+      display: "inline-flex",
+      flexDirection: "column",
+      alignItems: "center",
+      alignSelf: "stretch",
+      marginLeft: t.spacing,
+      marginRight: t.spacing
+    } : {
+      display: "flex",
+      alignItems: "center",
+      width: "100%",
+      marginTop: t.spacing,
+      marginBottom: t.spacing
+    }), o = n(() => t.orientation === "vertical" ? {
+      flex: "1",
+      width: "0",
+      borderLeft: r.value,
+      minHeight: "1rem"
+    } : {
+      flex: "1",
+      height: "0",
+      borderTop: r.value
+    }), y = n(() => ({
+      fontSize: "0.75rem",
+      fontWeight: "500",
+      color: t.color ? S(t.color) : "var(--cui-text-tertiary)",
+      padding: t.orientation === "horizontal" ? "0 calc(0.75rem * var(--cui-density-scale, 1))" : "calc(0.5rem * var(--cui-density-scale, 1)) 0",
+      whiteSpace: "nowrap",
+      textTransform: "uppercase",
+      letterSpacing: "0.04em"
+    }));
+    return (c, w) => e.orientation === "horizontal" && m.value ? s((a(), i("div", {
+      key: 0,
+      style: l(v.value),
+      role: "separator"
+    }, [
+      e.labelPosition !== "start" ? (a(), i("div", {
+        key: 0,
+        style: l(o.value)
+      }, null, 4)) : d("", !0),
+      f("span", {
+        style: l(y.value)
+      }, [
+        g(c.$slots, "default", {}, () => [
+          h(b(e.label), 1)
+        ])
+      ], 4),
+      e.labelPosition !== "end" ? (a(), i("div", {
+        key: 1,
+        style: l(o.value)
+      }, null, 4)) : d("", !0)
+    ], 4)), [
+      [u, !e.hidden]
+    ]) : e.orientation === "horizontal" ? s((a(), i("hr", {
+      key: 1,
+      style: l({
+        border: "none",
+        borderTop: r.value,
+        width: "100%",
+        marginTop: e.spacing,
+        marginBottom: e.spacing
+      }),
+      role: "separator"
+    }, null, 4)), [
+      [u, !e.hidden]
+    ]) : m.value ? s((a(), i("div", {
+      key: 2,
+      style: l(v.value),
+      role: "separator"
+    }, [
+      e.labelPosition !== "start" ? (a(), i("div", {
+        key: 0,
+        style: l(o.value)
+      }, null, 4)) : d("", !0),
+      f("span", {
+        style: l(y.value)
+      }, [
+        g(c.$slots, "default", {}, () => [
+          h(b(e.label), 1)
+        ])
+      ], 4),
+      e.labelPosition !== "end" ? (a(), i("div", {
+        key: 1,
+        style: l(o.value)
+      }, null, 4)) : d("", !0)
+    ], 4)), [
+      [u, !e.hidden]
+    ]) : s((a(), i("div", {
+      key: 3,
+      style: l({
+        display: "inline-block",
+        width: "0",
+        alignSelf: "stretch",
+        borderLeft: r.value,
+        marginLeft: e.spacing,
+        marginRight: e.spacing,
+        minHeight: "1rem"
+      }),
+      role: "separator"
+    }, null, 4)), [
+      [u, !e.hidden]
+    ]);
+  }
+});
+export {
+  B as default
+};

package/dist/components/CuiDivider.vue2.js

@@ -0,0 +1,4 @@
+import f from "./CuiDivider.vue.js";
+export {
+  f as default
+};

package/dist/components/CuiDropdown.vue.d.ts

@@ -1,15 +1,12 @@
 import { type DropdownTrigger, type DropdownPlacement } from "./dropdown-context";
-export interface CuiDropdownProps {
+import type { HideableProps, DisableableProps } from "../types/common";
+export interface CuiDropdownProps extends HideableProps, DisableableProps {
     /** How the dropdown is triggered */
     trigger?: DropdownTrigger;
     /** Preferred placement */
     placement?: DropdownPlacement;
     /** Keep dropdown anchored to trigger on scroll instead of closing */
     pinned?: boolean;
-    /** Disabled state */
-    disabled?: boolean;
-    /** Hide the component */
-    hidden?: boolean;
 }
 declare function open(): void;
 declare function close(): void;

package/dist/components/CuiDropdown.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CuiDropdown.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiDropdown.vue"],"names":[],"mappings":"AA2LA,OAAO,EAAsB,KAAK,eAAe,EAAE,KAAK,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEtG,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,0BAA0B;IAC1B,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,qEAAqE;IACrE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yBAAyB;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAkBD,iBAAS,IAAI,SAMZ;AAED,iBAAS,KAAK,SAQb;AAED,iBAAS,MAAM,SAEd;AAqJD,QAAA,IAAI,OAAO;;;;;CAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AA8B/C,QAAA,MAAM,eAAe;;;;;;YA5NV,OAAO;cAFL,OAAO;eAJN,iBAAiB;aAFnB,eAAe;YAIhB,OAAO;6EAwOhB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiDropdown.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiDropdown.vue"],"names":[],"mappings":"AAwLA,OAAO,EAAsB,KAAK,eAAe,EAAE,KAAK,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACtG,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAEvE,MAAM,WAAW,gBAAiB,SAAQ,aAAa,EAAE,gBAAgB;IACvE,oCAAoC;IACpC,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,0BAA0B;IAC1B,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,qEAAqE;IACrE,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAkBD,iBAAS,IAAI,SAMZ;AAED,iBAAS,KAAK,SAQb;AAED,iBAAS,MAAM,SAEd;AAqJD,QAAA,IAAI,OAAO;;;;;CAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AA8B/C,QAAA,MAAM,eAAe;;;;;;;;eA9NP,iBAAiB;aAFnB,eAAe;YAIhB,OAAO;6EAoOhB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/CuiDropdown.vue.js

@@ -0,0 +1,7 @@
+import o from "./CuiDropdown.vue2.js";
+/* empty css                 */
+import r from "../_virtual/_plugin-vue_export-helper.js";
+const _ = /* @__PURE__ */ r(o, [["__scopeId", "data-v-602bb0e3"]]);
+export {
+  _ as default
+};