@code0-tech/pictor 0.18.0 → 0.18.2

package/dist/components/gantt/GanttGroup.js

@@ -1,162 +1,209 @@
-import { jsxs as F, jsx as W, Fragment as it } from "react/jsx-runtime";
-import { c as rt } from "../../_virtual/compiler-runtime.js";
-import D from "react";
+import { jsxs as L, jsx as v, Fragment as et } from "react/jsx-runtime";
+import p from "react";
 import "../../utils/contextStore.js";
 import "merge-props";
-import { withAlpha as U, hashToColor as X } from "../../utils/color.js";
-import { GanttItem as at } from "./GanttItem.js";
-import { GanttHeader as ot } from "./GanttHeader.js";
-const H = (e, t, a, G, g, R) => {
-  const L = Math.max(0, e - a), I = Math.min(g, t - a), V = L / g * R, x = (I - L) / g * R;
-  return {
-    left: V,
-    width: x
-  };
-}, st = (e) => {
-  const t = rt.c(58), {
-    items: a,
-    stepWidth: G,
-    rowHeight: g,
-    step: R,
-    start: L,
-    end: I,
-    hideScaling: V,
-    children: x
-  } = e, c = G === void 0 ? "50px" : G, $ = g === void 0 ? "50px" : g, i = R === void 0 ? 1 : R, r = L === void 0 ? 1 : L, o = I === void 0 ? 999999999 : I, h = V === void 0 ? !1 : V, q = D.useRef(null), [Y, Z] = D.useState(0), [k, _] = D.useState(void 0), b = parseInt(c), p = o - r, K = Math.ceil(p / i), f = K * b;
-  let B;
-  t: {
-    if (!a || a.length === 0) {
-      let s;
-      t[0] !== o || t[1] !== r || t[2] !== i ? (s = {
+import { withAlpha as I, hashToColor as A } from "../../utils/color.js";
+import { GanttItem as rt } from "./GanttItem.js";
+import { GanttHeader as nt } from "./GanttHeader.js";
+const ot = 3, st = (h) => {
+  const l = Math.pow(10, Math.floor(Math.log10(h))), u = h / l;
+  return (u < 1.5 ? 1 : u < 3 ? 2 : u < 7 ? 5 : 10) * l;
+}, it = (h) => {
+  const {
+    items: l,
+    stepWidth: u = "50px",
+    rowHeight: W = "50px",
+    step: i = 1,
+    start: f = 1,
+    end: $ = 999999999,
+    hideScaling: T = !1,
+    children: y
+  } = h, E = p.useRef(null), [D, N] = p.useState(0), [V, F] = p.useState(void 0), [S, H] = p.useState({
+    scrollLeft: 0,
+    clientWidth: 0,
+    scrollWidth: 0
+  }), m = p.useMemo(() => parseInt(u), [u]), O = $ - f, P = Math.ceil(O / i), {
+    avgDuration: j,
+    itemMinStart: G,
+    itemMaxEnd: w
+  } = p.useMemo(() => {
+    if (!l || l.length === 0)
+      return {
         avgDuration: i,
-        itemMinStart: r,
-        itemMaxEnd: o
-      }, t[0] = o, t[1] = r, t[2] = i, t[3] = s) : s = t[3], B = s;
-      break t;
+        itemMinStart: f,
+        itemMaxEnd: $
+      };
+    let r = 0, e = 0, t = 1 / 0, n = -1 / 0;
+    for (let o = 0; o < l.length; o++) {
+      const c = l[o];
+      c.start < t && (t = c.start), c.end > n && (n = c.end), c.type !== "group" && (r += c.end - c.start, e++);
     }
-    let d = 0, u = 0, m = 1 / 0, E = -1 / 0;
-    for (let s = 0; s < a.length; s++) {
-      const l = a[s];
-      l.start < m && (m = l.start), l.end > E && (E = l.end), l.type !== "group" && (d = d + (l.end - l.start), u++);
+    return {
+      avgDuration: e === 0 ? i : r / e,
+      itemMinStart: t,
+      itemMaxEnd: n
+    };
+  }, [l, f, $, i]), {
+    effTime: M,
+    invEffTime: b,
+    inGap: z
+  } = p.useMemo(() => {
+    const r = ot * i, e = [], t = (l ?? []).map((s) => [s.start, s.end]).sort((s, a) => s[0] - a[0]);
+    for (const [s, a] of t) {
+      const d = e[e.length - 1];
+      d && s <= d[1] ? d[1] = Math.max(d[1], a) : e.push([s, a]);
     }
-    const M = u === 0 ? i : d / u;
-    let S;
-    t[4] !== E || t[5] !== m || t[6] !== M ? (S = {
-      avgDuration: M,
-      itemMinStart: m,
-      itemMaxEnd: E
-    }, t[4] = E, t[5] = m, t[6] = M, t[7] = S) : S = t[7], B = S;
-  }
-  const {
-    avgDuration: z,
-    itemMinStart: y,
-    itemMaxEnd: v
-  } = B, tt = a && a.length > 0 ? Math.ceil((v - r) / i) : K, et = Math.ceil(Y / b), w = Math.max(et, tt + 2);
-  let A, N;
-  t[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (A = () => {
-    const d = () => {
-      Z(q.current?.offsetWidth ?? 0);
+    const n = [];
+    let o = 0;
+    for (let s = 1; s < e.length; s++) {
+      const a = e[s - 1][1], d = e[s][0];
+      if (d - a <= r) continue;
+      const tt = Math.round((a - o + r - f) / i), R = f + tt * i, k = d - o - R;
+      n.push({
+        gapStart: a,
+        gapEnd: d,
+        effGapEnd: R,
+        remove: k
+      }), o += k;
+    }
+    return {
+      effTime: (s) => {
+        let a = s;
+        for (const d of n)
+          s >= d.gapEnd ? a -= d.remove : s > d.gapStart && (a = Math.min(a, d.effGapEnd));
+        return a;
+      },
+      invEffTime: (s) => {
+        let a = s;
+        for (const d of n)
+          s >= d.effGapEnd && (a += d.remove);
+        return a;
+      },
+      inGap: (s) => n.some((a) => s > a.gapStart && s < a.gapEnd)
+    };
+  }, [l, i, f]), x = (r, e) => {
+    const t = Math.max(f, M(r)), n = M(e), o = (t - f) / i * m, c = (n - t) / i * m;
+    return {
+      left: o,
+      width: c
+    };
+  }, U = l && l.length > 0 ? Math.ceil((M(w) - f) / i) : P, X = Math.ceil(D / m), g = Math.max(X, U + 2), {
+    headerTicks: q,
+    headerInterval: B
+  } = p.useMemo(() => {
+    const r = st(i * 3), e = [];
+    if (!(r > 0)) return {
+      headerTicks: e,
+      headerInterval: 1
+    };
+    const t = b(f + g * i), n = Math.ceil(f / r) * r;
+    for (let o = 0; n + o * r <= t; o++) {
+      const c = n + o * r;
+      z(c) || e.push({
+        time: c,
+        left: (M(c) - f) / i * m
+      });
+    }
+    return {
+      headerTicks: e,
+      headerInterval: r
+    };
+  }, [M, b, z, f, i, g, m]);
+  p.useEffect(() => {
+    const r = () => {
+      N(E.current?.offsetWidth ?? 0);
+    };
+    r();
+    const e = E.current;
+    return e?.addEventListener("resize", r), window.addEventListener("resize", r), () => {
+      window.removeEventListener("resize", r), e?.removeEventListener("resize", r);
     };
-    d();
-    const u = q.current;
-    return u?.addEventListener("resize", d), window.addEventListener("resize", d), () => {
-      window.removeEventListener("resize", d), u?.removeEventListener("resize", d);
+  }, []), p.useEffect(() => {
+    const r = E.current;
+    if (!r) return;
+    const e = r.closest("[data-radix-scroll-area-viewport]");
+    if (!e) return;
+    const t = () => H({
+      scrollLeft: e.scrollLeft,
+      clientWidth: e.clientWidth,
+      scrollWidth: e.scrollWidth
+    });
+    t(), e.addEventListener("scroll", t, {
+      passive: !0
+    }), window.addEventListener("resize", t);
+    const n = new ResizeObserver(t);
+    return n.observe(e), n.observe(r), () => {
+      e.removeEventListener("scroll", t), window.removeEventListener("resize", t), n.disconnect();
     };
-  }, N = [], t[8] = A, t[9] = N) : (A = t[8], N = t[9]), D.useEffect(A, N);
-  let P;
-  if (t[10] !== k || t[11] !== z || t[12] !== x || t[13] !== w || t[14] !== o || t[15] !== h || t[16] !== v || t[17] !== y || t[18] !== a || t[19] !== e.id || t[20] !== $ || t[21] !== r || t[22] !== i || t[23] !== c || t[24] !== b || t[25] !== p || t[26] !== f) {
-    const d = a?.length ? a.sort(dt).reduce(lt, []) : [], u = `repeat(${w}, ${c})`;
-    let m;
-    t[28] !== u ? (m = {
-      display: "grid",
-      gridTemplateColumns: u,
-      minWidth: "100%",
-      gridColumn: "1 / -1"
-    }, t[28] = u, t[29] = m) : m = t[29];
-    const E = m;
-    let M;
-    t[30] !== $ ? (M = {
-      gridColumn: "1 / -1",
-      minHeight: $,
-      position: "relative",
-      backgroundColor: "transparent"
-    }, t[30] = $, t[31] = M) : M = t[31];
-    const S = M;
-    let s;
-    t[32] !== w ? (s = Array.from({
-      length: Math.max(0, w - 1)
-    }), t[32] = w, t[33] = s) : s = t[33];
-    const l = s;
-    let T;
-    t[34] !== z || t[35] !== w || t[36] !== h || t[37] !== r || t[38] !== i || t[39] !== c ? (T = !h && /* @__PURE__ */ W(ot, { columnCount: w, start: r, step: i, avgDuration: z, stepWidth: c }), t[34] = z, t[35] = w, t[36] = h, t[37] = r, t[38] = i, t[39] = c, t[40] = T) : T = t[40];
-    let j;
-    t[41] !== k || t[42] !== x || t[43] !== o || t[44] !== l || t[45] !== h || t[46] !== v || t[47] !== y || t[48] !== e.id || t[49] !== $ || t[50] !== S || t[51] !== r || t[52] !== i || t[53] !== c || t[54] !== b || t[55] !== p || t[56] !== f ? (j = (O, Q) => /* @__PURE__ */ F(D.Fragment, { children: [
-      /* @__PURE__ */ F("div", { style: S, children: [
-        l.map((n, C) => /* @__PURE__ */ W("div", { style: {
+  }, []);
+  const J = S.scrollLeft > 1, K = S.scrollLeft + S.clientWidth < S.scrollWidth - 1, Q = l?.length ? l.sort((r, e) => r.start - e.start).reduce((r, e) => {
+    const t = r.find((n) => !n.some((o) => !(e.end <= o.start || e.start >= o.end)));
+    return t ? (t.push(e), r) : [...r, [e]];
+  }, []) : [], Y = p.useMemo(() => ({
+    display: "grid",
+    gridTemplateColumns: `repeat(${g}, ${u})`,
+    minWidth: "100%",
+    gridColumn: "1 / -1",
+    position: "relative"
+  }), [g, u]), Z = p.useMemo(() => ({
+    gridColumn: "1 / -1",
+    minHeight: W,
+    position: "relative",
+    backgroundColor: "transparent"
+  }), [W]), _ = p.useMemo(() => Array.from({
+    length: Math.max(0, g - 1)
+  }), [g]);
+  return /* @__PURE__ */ L("div", { "data-gantt-id": h.id, id: h.id, ref: E, style: Y, children: [
+    !T && /* @__PURE__ */ v(nt, { ticks: q, interval: B, avgDuration: j, stepWidth: u, canScrollLeft: J, canScrollRight: K }),
+    Q.map((r, e) => /* @__PURE__ */ L(p.Fragment, { children: [
+      /* @__PURE__ */ L("div", { style: Z, children: [
+        _.map((t, n) => /* @__PURE__ */ v("div", { style: {
           position: "absolute",
-          left: (C + 1) * b,
+          left: (n + 1) * m,
           top: 0,
           bottom: 0,
           width: "0px",
-          borderLeft: `1px dashed rgba(255, 255, 255, ${h ? 0.05 : 0.1})`
-        } }, `grid-${C}`)),
-        h && /* @__PURE__ */ F(it, { children: [
-          /* @__PURE__ */ W("div", { className: "gantt__group-wrapper", style: {
+          borderLeft: `1px dashed rgba(255, 255, 255, ${T ? 0.05 : 0.1})`
+        } }, `grid-${n}`)),
+        T && /* @__PURE__ */ L(et, { children: [
+          /* @__PURE__ */ v("div", { className: "gantt__group-wrapper", style: {
             backgroundImage: `
                                         linear-gradient(to right, transparent, #070514), 
                                         repeating-linear-gradient(
                                           45deg, 
                                           transparent, 
                                           transparent 2px, 
-                                          ${U(X(e.id.replace("target", "source")), 0.5)} 4px
+                                          ${I(A(h.id.replace("target", "source")), 0.5)} 4px
                                         )
                                     `,
-            left: `${H(y, y + i, r, o, p, f).left}px`,
-            width: `${H(y, y + i, r, o, p, f).width}px`
+            left: `${x(G, G + i).left}px`,
+            width: `${x(G, G + i).width}px`
           } }),
-          /* @__PURE__ */ W("div", { className: "gantt__group-wrapper", style: {
+          /* @__PURE__ */ v("div", { className: "gantt__group-wrapper", style: {
             backgroundImage: `
                                         linear-gradient(to left, transparent, #070514), 
                                         repeating-linear-gradient(
                                           45deg, 
                                           transparent, 
                                           transparent 2px, 
-                                          ${U(X(e.id.replace("target", "source")), 0.5)} 4px
+                                          ${I(A(h.id.replace("target", "source")), 0.5)} 4px
                                         )
                                     `,
-            left: `${H(v - i, v, r, o, p, f).left}px`,
-            width: `${H(v - i, v, r, o, p, f).width}px`
+            left: `${x(w - i, w).left}px`,
+            width: `${x(w - i, w).width}px`
           } })
         ] }),
-        O.map((n, C) => {
-          const J = H(n.start, n.end, r, o, p, f);
-          return J.width > 0 && /* @__PURE__ */ W(at, { id: n.id, w: `${J.width}px`, left: `${J.left}px`, onClick: () => {
-            n.type == "group" && _((nt) => n.id === nt ? void 0 : n.id);
-          }, children: x?.(n, C) }, n.id);
+        r.map((t, n) => {
+          const o = x(t.start, t.end);
+          return o.width > 0 && /* @__PURE__ */ v(rt, { id: t.id, w: `${o.width}px`, left: `${o.left}px`, onClick: () => {
+            t.type == "group" && F((C) => t.id === C ? void 0 : t.id);
+          }, children: y?.(t, n) }, t.id);
         })
-      ] }, `row-${Q}`),
-      O.map((n, C) => n.type === "group" && k === n.id && /* @__PURE__ */ W(st, { children: x, id: `group-target-${C}`, start: Math.min(...n.data.items.map(ct)) - Math.min(...n.data.items.map(pt)) / (n.data.firstGroupStep * n.data.step) * (n.data.groupStep * n.data.step), step: n.data.groupStep * n.data.step, stepWidth: c, rowHeight: $, items: n.data.items }, `group-target-${C}`))
-    ] }, `row-frag-${Q}`), t[41] = k, t[42] = x, t[43] = o, t[44] = l, t[45] = h, t[46] = v, t[47] = y, t[48] = e.id, t[49] = $, t[50] = S, t[51] = r, t[52] = i, t[53] = c, t[54] = b, t[55] = p, t[56] = f, t[57] = j) : j = t[57], P = /* @__PURE__ */ F("div", { "data-gantt-id": e.id, id: e.id, ref: q, style: E, children: [
-      T,
-      d.map(j)
-    ] }), t[10] = k, t[11] = z, t[12] = x, t[13] = w, t[14] = o, t[15] = h, t[16] = v, t[17] = y, t[18] = a, t[19] = e.id, t[20] = $, t[21] = r, t[22] = i, t[23] = c, t[24] = b, t[25] = p, t[26] = f, t[27] = P;
-  } else
-    P = t[27];
-  return P;
+      ] }, `row-${e}`),
+      r.map((t, n) => t.type === "group" && V === t.id && /* @__PURE__ */ v(it, { children: y, id: `group-target-${n}`, start: Math.min(...t.data.items.map((o) => o.start)) - Math.min(...t.data.items.map((o) => o.start)) / (t.data.firstGroupStep * t.data.step) * (t.data.groupStep * t.data.step), step: t.data.groupStep * t.data.step, stepWidth: u, rowHeight: W, items: t.data.items }, `group-target-${n}`))
+    ] }, `row-frag-${e}`))
+  ] });
 };
-function dt(e, t) {
-  return e.start - t.start;
-}
-function lt(e, t) {
-  const a = e.find((G) => !G.some((g) => !(t.end <= g.start || t.start >= g.end)));
-  return a ? (a.push(t), e) : [...e, [t]];
-}
-function ct(e) {
-  return e.start;
-}
-function pt(e) {
-  return e.start;
-}
 export {
-  st as GanttGroup
+  it as GanttGroup
 };

package/dist/components/gantt/GanttHeader.d.ts

@@ -1,10 +1,14 @@
 import { default as React, CSSProperties } from 'react';
 import { Component } from '../../utils';
 export interface GanttHeaderProps extends Component<HTMLDivElement> {
-    columnCount: number;
-    start: number;
-    step: number;
     avgDuration: number;
     stepWidth: CSSProperties["width"];
+    canScrollLeft?: boolean;
+    canScrollRight?: boolean;
+    ticks: {
+        time: number;
+        left: number;
+    }[];
+    interval: number;
 }
 export declare const GanttHeader: React.FC<GanttHeaderProps>;

package/dist/components/gantt/GanttHeader.js

@@ -1,55 +1,73 @@
-import { jsx as g, jsxs as N } from "react/jsx-runtime";
-import { c as W } from "../../_virtual/compiler-runtime.js";
+import { jsx as a, jsxs as L } from "react/jsx-runtime";
+import { c as z } from "../../_virtual/compiler-runtime.js";
 import "../../utils/contextStore.js";
 import "react";
-import { mergeComponentProps as j } from "../../utils/component.js";
+import { mergeComponentProps as I } from "../../utils/component.js";
 import "js-md5";
 import { Text as $ } from "../text/Text.js";
-const x = (t) => {
-  const e = W.c(22);
-  let i, s, a, n, r, o, m;
+import { IconChevronLeft as W, IconChevronRight as w } from "@tabler/icons-react";
+const J = (t) => {
+  const e = z.c(33);
+  let s, n, l, c, i, o, m;
   if (e[0] !== t) {
     const {
-      columnCount: f,
-      start: l,
-      step: _,
-      avgDuration: c,
-      stepWidth: v,
-      ...b
+      avgDuration: r,
+      stepWidth: N,
+      canScrollLeft: v,
+      canScrollRight: R,
+      ticks: C,
+      interval: b,
+      ...F
     } = t;
-    a = l, n = _, r = v, o = parseInt(r);
-    let u;
-    e[8] !== c ? (u = y(c), e[8] = c, e[9] = u) : u = e[9], s = u;
-    let d;
-    e[10] !== f ? (d = Array.from({
-      length: f
-    }), e[10] = f, e[11] = d) : d = e[11], i = d, m = j("gantt__header", b), e[0] = t, e[1] = i, e[2] = s, e[3] = a, e[4] = n, e[5] = r, e[6] = o, e[7] = m;
+    i = N, s = v, n = R, m = C;
+    let p;
+    e[8] !== r ? (p = k(r), e[8] = r, e[9] = p) : p = e[9], c = p;
+    let x;
+    e[10] !== b ? (x = (M) => {
+      const {
+        value: T,
+        unit: S
+      } = k(M), j = Math.max(0, Math.ceil(-Math.log10(b / y(S))));
+      return `${parseFloat(T.toFixed(j))}${S}`;
+    }, e[10] = b, e[11] = x) : x = e[11], l = x, o = I("gantt__header", F), e[0] = t, e[1] = s, e[2] = n, e[3] = l, e[4] = c, e[5] = i, e[6] = o, e[7] = m;
   } else
-    i = e[1], s = e[2], a = e[3], n = e[4], r = e[5], o = e[6], m = e[7];
+    s = e[1], n = e[2], l = e[3], c = e[4], i = e[5], o = e[6], m = e[7];
   let h;
-  e[12] !== i || e[13] !== s || e[14] !== a || e[15] !== n || e[16] !== r || e[17] !== o ? (h = i.map((f, l) => {
-    if (l === 0)
-      return /* @__PURE__ */ g("div", { className: "gantt__header-label-column", children: /* @__PURE__ */ N($, { className: "gantt__header-label", children: [
-        "Range in ",
-        s.unit
-      ] }) }, `header-${l}`);
-    const _ = l % 4 === 0;
-    let c = "";
-    if (_) {
-      const v = a + l * n, {
-        value: b,
-        unit: u
-      } = y(v);
-      c = `${Math.round(b * 10) / 10}${u}`;
-    }
-    return /* @__PURE__ */ g("div", { className: "gantt__header-column", style: {
-      left: l * o,
-      width: r
-    }, children: /* @__PURE__ */ g($, { children: c }) }, `header-${l}`);
-  }), e[12] = i, e[13] = s, e[14] = a, e[15] = n, e[16] = r, e[17] = o, e[18] = h) : h = e[18];
-  let p;
-  return e[19] !== m || e[20] !== h ? (p = /* @__PURE__ */ g("div", { ...m, children: h }), e[19] = m, e[20] = h, e[21] = p) : p = e[21], p;
-}, y = (t) => t > 5e5 ? {
+  e[12] !== s ? (h = s && /* @__PURE__ */ a("div", { className: "gantt__header-scroll gantt__header-scroll--left", children: /* @__PURE__ */ a(W, { size: 16 }) }), e[12] = s, e[13] = h) : h = e[13];
+  let d;
+  e[14] !== c.unit ? (d = /* @__PURE__ */ a("div", { className: "gantt__header-label-column", children: /* @__PURE__ */ L($, { className: "gantt__header-label", children: [
+    "Range in ",
+    c.unit
+  ] }) }), e[14] = c.unit, e[15] = d) : d = e[15];
+  let f;
+  e[16] !== h || e[17] !== d ? (f = /* @__PURE__ */ L("div", { className: "gantt__header-start", children: [
+    h,
+    d
+  ] }), e[16] = h, e[17] = d, e[18] = f) : f = e[18];
+  let _;
+  if (e[19] !== l || e[20] !== i || e[21] !== m) {
+    let r;
+    e[23] !== l || e[24] !== i ? (r = (N) => {
+      const {
+        time: v,
+        left: R
+      } = N;
+      return /* @__PURE__ */ a("div", { className: "gantt__header-column", style: {
+        left: R,
+        width: i
+      }, children: /* @__PURE__ */ a($, { children: l(v) }) }, `header-${v}`);
+    }, e[23] = l, e[24] = i, e[25] = r) : r = e[25], _ = m.map(r), e[19] = l, e[20] = i, e[21] = m, e[22] = _;
+  } else
+    _ = e[22];
+  let g;
+  e[26] !== n ? (g = n && /* @__PURE__ */ a("div", { className: "gantt__header-scroll gantt__header-scroll--right", children: /* @__PURE__ */ a(w, { size: 16 }) }), e[26] = n, e[27] = g) : g = e[27];
+  let u;
+  return e[28] !== o || e[29] !== f || e[30] !== _ || e[31] !== g ? (u = /* @__PURE__ */ L("div", { ...o, children: [
+    f,
+    _,
+    g
+  ] }), e[28] = o, e[29] = f, e[30] = _, e[31] = g, e[32] = u) : u = e[32], u;
+}, k = (t) => t > 5e5 ? {
   value: t / 1e6,
   unit: "s"
 } : t > 500 ? {
@@ -58,7 +76,7 @@ const x = (t) => {
 } : {
   value: t,
   unit: "μs"
-};
+}, y = (t) => t === "s" ? 1e6 : t === "ms" ? 1e3 : 1;
 export {
-  x as GanttHeader
+  J as GanttHeader
 };

package/dist/components/menu/Menu.js

@@ -1,57 +1,57 @@
 import { jsx as r } from "react/jsx-runtime";
 import { c as u } from "../../_virtual/compiler-runtime.js";
-import M from "react";
+import a from "react";
 import '../../assets/components/menu/Menu.style.css';/* empty css                */
 import "../../utils/contextStore.js";
 import { mergeComponentProps as i } from "../../utils/component.js";
 import "js-md5";
 import { DropdownMenuItem as w, DropdownMenuSubTrigger as b, DropdownMenu as g, DropdownMenuArrow as $, DropdownMenuCheckboxItem as D, DropdownMenuGroup as h, DropdownMenuItemIndicator as S, DropdownMenuLabel as I, DropdownMenuPortal as C, DropdownMenuSeparator as x, DropdownMenuSub as T, DropdownMenuTrigger as A, DropdownMenuContent as R, DropdownMenuSubContent as k } from "@radix-ui/react-dropdown-menu";
-import { AutoScrollArea as a } from "../scroll-area/ScrollArea.js";
-const B = (l) => {
+import { AutoScrollArea as d } from "../scroll-area/ScrollArea.js";
+const z = (l) => {
   const e = u.c(4);
   let t;
   e[0] !== l ? (t = i("menu", l), e[0] = l, e[1] = t) : t = e[1];
   const o = t;
   let n;
   return e[2] !== o ? (n = /* @__PURE__ */ r(g, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
-}, F = (l) => {
+}, B = (l) => {
   const e = u.c(4);
   let t;
   e[0] !== l ? (t = i("menu__trigger", l), e[0] = l, e[1] = t) : t = e[1];
   const o = t;
   let n;
   return e[2] !== o ? (n = /* @__PURE__ */ r(A, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
-}, H = (l) => {
+}, F = (l) => {
   const e = u.c(4);
   let t;
   e[0] !== l ? (t = i("menu__portal", l), e[0] = l, e[1] = t) : t = e[1];
   const o = t;
   let n;
   return e[2] !== o ? (n = /* @__PURE__ */ r(C, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
-}, J = (l) => {
+}, H = (l) => {
   const e = u.c(12);
   let t, o, n, c;
   if (e[0] !== l) {
     const {
       children: _,
-      ...d
+      ...M
     } = l;
-    o = _, t = R, c = l.align, n = i(`menu__content menu__content--${l.color ?? "primary"}`, d), e[0] = l, e[1] = t, e[2] = o, e[3] = n, e[4] = c;
+    o = _, t = R, c = l.align, n = i(`menu__content menu__content--${l.color ?? "primary"}`, M), e[0] = l, e[1] = t, e[2] = o, e[3] = n, e[4] = c;
   } else
     t = e[1], o = e[2], n = e[3], c = e[4];
   const m = n;
   let s;
-  e[5] !== o ? (s = /* @__PURE__ */ r(a, { children: o }), e[5] = o, e[6] = s) : s = e[6];
+  e[5] !== o ? (s = /* @__PURE__ */ r(d, { children: /* @__PURE__ */ r("div", { className: "menu__content-inner", children: o }) }), e[5] = o, e[6] = s) : s = e[6];
   let f;
   return e[7] !== t || e[8] !== c || e[9] !== m || e[10] !== s ? (f = /* @__PURE__ */ r(t, { align: c, ...m, children: s }), e[7] = t, e[8] = c, e[9] = m, e[10] = s, e[11] = f) : f = e[11], f;
-}, K = (l) => {
+}, J = (l) => {
   const e = u.c(4);
   let t;
   e[0] !== l ? (t = i("menu__label", l), e[0] = l, e[1] = t) : t = e[1];
   const o = t;
   let n;
   return e[2] !== o ? (n = /* @__PURE__ */ r(I, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
-}, N = M.forwardRef((l, e) => {
+}, K = a.forwardRef((l, e) => {
   const t = u.c(5);
   let o;
   t[0] !== l ? (o = i("menu__item", l), t[0] = l, t[1] = o) : o = t[1];
@@ -72,7 +72,7 @@ const B = (l) => {
   const o = t;
   let n;
   return e[2] !== o ? (n = /* @__PURE__ */ r(T, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
-}, U = M.forwardRef((l, e) => {
+}, U = a.forwardRef((l, e) => {
   const t = u.c(5);
   let o;
   t[0] !== l ? (o = i("menu__sub-trigger", l), t[0] = l, t[1] = o) : o = t[1];
@@ -92,7 +92,7 @@ const B = (l) => {
     t = e[1], o = e[2], n = e[3];
   const c = n;
   let m;
-  e[4] !== o ? (m = /* @__PURE__ */ r(a, { children: o }), e[4] = o, e[5] = m) : m = e[5];
+  e[4] !== o ? (m = /* @__PURE__ */ r(d, { children: /* @__PURE__ */ r("div", { className: "menu__content-inner", children: o }) }), e[4] = o, e[5] = m) : m = e[5];
   let s;
   return e[6] !== t || e[7] !== c || e[8] !== m ? (s = /* @__PURE__ */ r(t, { ...c, children: m }), e[6] = t, e[7] = c, e[8] = m, e[9] = s) : s = e[9], s;
 }, W = (l) => {
@@ -125,18 +125,18 @@ const B = (l) => {
   return e[2] !== o ? (n = /* @__PURE__ */ r($, { ...o }), e[2] = o, e[3] = n) : n = e[3], n;
 };
 export {
-  B as Menu,
+  z as Menu,
   Z as MenuArrow,
   X as MenuCheckboxItem,
-  J as MenuContent,
+  H as MenuContent,
   O as MenuGroup,
-  N as MenuItem,
+  K as MenuItem,
   Y as MenuItemIndicator,
-  K as MenuLabel,
-  H as MenuPortal,
+  J as MenuLabel,
+  F as MenuPortal,
   W as MenuSeparator,
   Q as MenuSub,
   V as MenuSubContent,
   U as MenuSubTrigger,
-  F as MenuTrigger
+  B as MenuTrigger
 };