@elcrm/components 0.1.2 → 0.2.1

package/dist/{PricingTable-DALddSwM.js → PricingTable-BuLC0opK.js}

@@ -1,53 +1,45 @@
 import l from "react";
-import { c as z } from "./cx-CcykAxZN.js";
-import './PricingTable.css';const B = "cxr", C = "cxh", M = "cxm", O = "cxn", T = "cxt", I = "cxg", L = "cxp", S = "cxz", j = "cxo", H = "cxe", K = "cxd", R = "cxx", U = "cxb", W = "cxy", $ = "cxl", A = "cxw", G = "cxc", J = "cxk", Q = "cxv", X = "cxa", Y = "cxu", Z = "cxq", n = {
-  r: B,
-  h: C,
-  m: M,
-  n: O,
-  t: T,
-  g: I,
-  p: L,
-  z: S,
-  o: j,
-  e: H,
-  d: K,
-  x: R,
-  b: U,
-  y: W,
-  l: $,
-  w: A,
-  c: G,
-  k: J,
+import { C as w } from "./CheckIcon-FdB8fMEF.js";
+import { c as D } from "./cx-CcykAxZN.js";
+import { u as F } from "./useControllableValue-CWqH1kpM.js";
+import './PricingTable.css';const q = "cxr", z = "cxh", B = "cxm", I = "cxn", O = "cxt", T = "cxg", V = "cxp", M = "cxz", H = "cxo", K = "cxe", R = "cxd", S = "cxx", $ = "cxb", j = "cxy", A = "cxl", G = "cxw", J = "cxc", L = "cxk", Q = "cxv", U = "cxa", W = "cxu", X = "cxq", n = {
+  r: q,
+  h: z,
+  m: B,
+  n: I,
+  t: O,
+  g: T,
+  p: V,
+  z: M,
+  o: H,
+  e: K,
+  d: R,
+  x: S,
+  b: $,
+  y: j,
+  l: A,
+  w: G,
+  c: J,
+  k: L,
   v: Q,
-  a: X,
-  u: Y,
-  q: Z
+  a: U,
+  u: W,
+  q: X
 };
-function _() {
-  return /* @__PURE__ */ l.createElement("span", { className: n.k, "aria-hidden": !0 }, /* @__PURE__ */ l.createElement("svg", { className: n.v, viewBox: "0 0 12 12" }, /* @__PURE__ */ l.createElement(
-    "path",
-    {
-      d: "M2.5 6.2 4.8 8.5 9.5 3.5",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "1.8",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  )));
+function Y() {
+  return /* @__PURE__ */ l.createElement("span", { className: n.k, "aria-hidden": !0 }, /* @__PURE__ */ l.createElement(w, { className: n.v }));
 }
-function V({ value: e }) {
-  return e === !0 ? /* @__PURE__ */ l.createElement(_, null) : e === !1 || e == null || e === "" ? /* @__PURE__ */ l.createElement("span", { className: n.a }, "—") : /* @__PURE__ */ l.createElement(l.Fragment, null, e);
+function Z({ value: e }) {
+  return e === !0 ? /* @__PURE__ */ l.createElement(Y, null) : e === !1 || e == null || e === "" ? /* @__PURE__ */ l.createElement("span", { className: n.a }, "—") : /* @__PURE__ */ l.createElement(l.Fragment, null, e);
 }
-function ee({
+function _({
   item: e,
   highlighted: r,
   selectable: o,
   disabled: u,
   onSelect: d
 }) {
-  const i = e.badge != null && (e.badgePlacement ?? "pill") === "pill", m = e.badge != null && e.badgePlacement === "banner";
+  const m = e.badge != null && (e.badgePlacement ?? "pill") === "pill", p = e.badge != null && e.badgePlacement === "banner";
   return /* @__PURE__ */ l.createElement(
     "div",
     {
@@ -58,31 +50,31 @@ function ee({
       onClick: () => {
         o && !u && d();
       },
-      onKeyDown: (a) => {
-        !o || u || (a.key === "Enter" || a.key === " ") && (a.preventDefault(), d());
+      onKeyDown: (t) => {
+        !o || u || (t.key === "Enter" || t.key === " ") && (t.preventDefault(), d());
       }
     },
-    m ? /* @__PURE__ */ l.createElement("span", { className: n.g }, e.badge) : null,
+    p ? /* @__PURE__ */ l.createElement("span", { className: n.g }, e.badge) : null,
     e.icon != null ? /* @__PURE__ */ l.createElement("div", { className: n.m }, e.icon) : null,
-    e.priceFirst ? /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(N, { item: e }), /* @__PURE__ */ l.createElement(x, { item: e, pill: i }), e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null) : /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(x, { item: e, pill: i }), e.descriptionPlacement === "before-price" && e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null, /* @__PURE__ */ l.createElement(N, { item: e }), e.descriptionPlacement !== "before-price" && e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null),
+    e.priceFirst ? /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(x, { item: e }), /* @__PURE__ */ l.createElement(v, { item: e, pill: m }), e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null) : /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(v, { item: e, pill: m }), e.descriptionPlacement === "before-price" && e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null, /* @__PURE__ */ l.createElement(x, { item: e }), e.descriptionPlacement !== "before-price" && e.description != null ? /* @__PURE__ */ l.createElement("p", { className: n.d }, e.description) : null),
     e.actions != null ? /* @__PURE__ */ l.createElement(
       "div",
       {
         className: n.x,
-        onClick: (a) => a.stopPropagation(),
-        onMouseDown: (a) => a.preventDefault()
+        onClick: (t) => t.stopPropagation(),
+        onMouseDown: (t) => t.preventDefault()
       },
       e.actions
     ) : null
   );
 }
-function x({
+function v({
   item: e,
   pill: r
 }) {
   return e.title == null && !r ? null : /* @__PURE__ */ l.createElement("div", { className: n.n }, e.title != null ? /* @__PURE__ */ l.createElement("h3", { className: n.t }, e.title) : null, r ? /* @__PURE__ */ l.createElement("span", { className: n.g }, e.badge) : null);
 }
-function N({ item: e }) {
+function x({ item: e }) {
   return e.price == null && e.priceOld == null && e.meta == null ? null : /* @__PURE__ */ l.createElement("div", { className: n.p }, e.priceOld != null ? /* @__PURE__ */ l.createElement("span", { className: n.o }, e.priceOld) : null, e.price != null ? /* @__PURE__ */ l.createElement("span", { className: n.z }, e.price) : null, e.meta != null ? /* @__PURE__ */ l.createElement("span", { className: n.e }, e.meta) : null);
 }
 function te({
@@ -91,41 +83,43 @@ function te({
   footerActions: o = !0,
   value: u,
   defaultValue: d,
-  selectable: i = !1,
-  disabled: m = !1,
-  onValueChange: a,
-  className: f,
-  style: g,
-  ...h
+  selectable: m = !1,
+  disabled: p = !1,
+  onValueChange: t,
+  className: g,
+  style: h,
+  ...N
 }) {
-  const [b, k] = l.useState(d), p = u !== void 0, y = p ? u : b, w = (t) => {
-    p || k(t), a == null || a(t);
-  }, P = e.length, D = {
-    ...g,
-    gridTemplateColumns: `var(--pricing-table-label-width) repeat(${P}, minmax(12rem, 1fr))`
+  const [f, b] = F(
+    u,
+    d,
+    t
+  ), k = e.length, y = {
+    ...h,
+    gridTemplateColumns: `var(--pricing-table-label-width) repeat(${k}, minmax(12rem, 1fr))`
   };
-  let F = 0;
-  return /* @__PURE__ */ l.createElement("div", { className: z(n.r, f), style: D, role: "table", ...h }, /* @__PURE__ */ l.createElement("div", { className: n.q, role: "columnheader" }), e.map((t) => {
-    const s = y === t.value, c = !!t.highlighted || s;
+  let P = 0;
+  return /* @__PURE__ */ l.createElement("div", { className: D(n.r, g), style: y, role: "table", ...N }, /* @__PURE__ */ l.createElement("div", { className: n.q, role: "columnheader" }), e.map((a) => {
+    const s = f === a.value, c = !!a.highlighted || s;
     return /* @__PURE__ */ l.createElement(
-      ee,
+      _,
       {
-        key: t.value,
-        item: t,
+        key: a.value,
+        item: a,
         highlighted: c,
-        selectable: i && !m && !t.disabled,
-        disabled: m || !!t.disabled,
-        onSelect: () => w(t.value)
+        selectable: m && !p && !a.disabled,
+        disabled: p || !!a.disabled,
+        onSelect: () => b(a.value)
       }
     );
-  }), r == null ? void 0 : r.map((t, s) => /* @__PURE__ */ l.createElement(l.Fragment, { key: s }, t.title != null ? /* @__PURE__ */ l.createElement("div", { className: n.b, role: "rowheader" }, t.title) : null, t.rows.map((c) => {
-    const q = F++ % 2 === 1;
+  }), r == null ? void 0 : r.map((a, s) => /* @__PURE__ */ l.createElement(l.Fragment, { key: s }, a.title != null ? /* @__PURE__ */ l.createElement("div", { className: n.b, role: "rowheader" }, a.title) : null, a.rows.map((c) => {
+    const C = P++ % 2 === 1;
     return /* @__PURE__ */ l.createElement(
       "div",
       {
         key: c.key,
         className: n.y,
-        "data-alt": q ? "true" : void 0,
+        "data-alt": C ? "true" : void 0,
         role: "row"
       },
       /* @__PURE__ */ l.createElement("div", { className: n.l, role: "rowheader" }, /* @__PURE__ */ l.createElement("span", null, c.label), c.hint != null && c.hint !== "" ? /* @__PURE__ */ l.createElement(
@@ -138,19 +132,19 @@ function te({
         },
         "?"
       ) : null),
-      e.map((E) => {
-        var v;
-        return /* @__PURE__ */ l.createElement("div", { key: E.value, className: n.c, role: "cell" }, /* @__PURE__ */ l.createElement(V, { value: (v = c.values) == null ? void 0 : v[E.value] }));
+      e.map((i) => {
+        var E;
+        return /* @__PURE__ */ l.createElement("div", { key: i.value, className: n.c, role: "cell" }, /* @__PURE__ */ l.createElement(Z, { value: (E = c.values) == null ? void 0 : E[i.value] }));
       })
     );
-  }))), o ? /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement("div", { className: n.q }), e.map((t) => /* @__PURE__ */ l.createElement("div", { key: t.value, className: n.u }, t.actions != null ? /* @__PURE__ */ l.createElement(
+  }))), o ? /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement("div", { className: n.q }), e.map((a) => /* @__PURE__ */ l.createElement("div", { key: a.value, className: n.u }, a.actions != null ? /* @__PURE__ */ l.createElement(
     "div",
     {
       className: n.x,
       onClick: (s) => s.stopPropagation(),
       onMouseDown: (s) => s.preventDefault()
     },
-    t.actions
+    a.actions
   ) : null))) : null);
 }
 export {

package/dist/PricingTable.css

@@ -1 +1 @@
-@layer elcrm-components{.cxr{display:grid;width:100%;column-gap:var(--shell-gap);row-gap:0;align-items:stretch;overflow-x:auto}.cxh{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box;color:var(--shell-color);background:var(--shell-background);border:1px solid transparent;border-radius:var(--shell-radius)}.cxh[data-highlighted=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cxm{display:flex;align-items:center;justify-content:center;width:calc(var(--shell-icon-size) * 1.4);height:calc(var(--shell-icon-size) * 1.4);color:var(--shell-color-accent);background:var(--shell-background-hover);border-radius:var(--shell-radius);overflow:hidden}.cxn{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.cxt{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cxg{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:999px;background:var(--shell-background-hover);color:var(--shell-color-accent);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight)}.cxp{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm)}.cxz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.15}.cxo{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);text-decoration:line-through}.cxe{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.cxd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cxx{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cxb{grid-column:1 / -1;margin:var(--shell-gap) 0 var(--shell-gap-sm);padding:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-accent)}.cxf,.cxy{display:contents}.cxy>*{padding:var(--shell-padding);box-sizing:border-box;border-bottom:1px solid var(--shell-border);background:var(--shell-background)}.cxy[data-alt=true]>*{background:var(--shell-background-muted)}.cxl{display:flex;align-items:center;gap:var(--shell-gap-sm);font-size:var(--shell-font-size-sm);color:var(--shell-color);line-height:1.4}.cxw{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-status-size);height:var(--shell-status-size);padding:0;border:1px solid var(--shell-border);border-radius:50%;background:transparent;color:var(--shell-color-muted);font-size:9px;line-height:1;cursor:help}.cxc{display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--shell-font-size-sm);color:var(--shell-color);font-weight:500}.cxk{display:inline-flex;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);color:#fff;background:var(--shell-color-success);border-radius:50%}.cxv{width:60%;height:60%;display:block}.cxa{color:var(--shell-color-muted)}.cxu{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box}.cxq{min-width:var(--pricing-table-label-width)}}
+@layer elcrm-components{.cxr{display:grid;width:100%;column-gap:var(--shell-gap);row-gap:0;align-items:stretch;overflow-x:auto}.cxh{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box;color:var(--shell-color);background:var(--shell-background);border:1px solid transparent;border-radius:var(--shell-radius)}.cxh[data-highlighted=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cxm{display:flex;align-items:center;justify-content:center;width:calc(var(--shell-icon-size) * 1.4);height:calc(var(--shell-icon-size) * 1.4);color:var(--shell-color-accent);background:var(--shell-background-hover);border-radius:var(--shell-radius);overflow:hidden}.cxn{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.cxt{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cxg{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:999px;background:var(--shell-background-hover);color:var(--shell-color-accent);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight)}.cxp{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm)}.cxz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.15}.cxo{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);text-decoration:line-through}.cxe{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.cxd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cxx{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cxb{grid-column:1 / -1;margin:var(--shell-gap) 0 var(--shell-gap-sm);padding:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-accent)}.cxf,.cxy{display:contents}.cxy>*{padding:var(--shell-padding);box-sizing:border-box;border-bottom:1px solid var(--shell-border);background:var(--shell-background)}.cxy[data-alt=true]>*{background:var(--shell-background-muted)}.cxl{display:flex;align-items:center;gap:var(--shell-gap-sm);font-size:var(--shell-font-size-sm);color:var(--shell-color);line-height:1.4}.cxw{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-status-size);height:var(--shell-status-size);padding:0;border:1px solid var(--shell-border);border-radius:50%;background:transparent;color:var(--shell-color-muted);font-size:9px;line-height:1;cursor:help}.cxc{display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--shell-font-size-sm);color:var(--shell-color);font-weight:500}.cxk{display:inline-flex;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);color:var(--avatar-color);background:var(--shell-color-success);border-radius:50%}.cxv{width:60%;height:60%;display:block}.cxa{color:var(--shell-color-muted)}.cxu{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box}.cxq{min-width:var(--pricing-table-label-width)}}

package/dist/PricingTable.js

@@ -1,4 +1,4 @@
-import { P as e } from "./PricingTable-DALddSwM.js";
+import { P as e } from "./PricingTable-BuLC0opK.js";
 export {
   e as PricingTable
 };

package/dist/RadioGroup-fcXzhvMu.js

@@ -0,0 +1,129 @@
+import e from "react";
+import { C as w } from "./CheckIcon-FdB8fMEF.js";
+import { c as r } from "./cx-CcykAxZN.js";
+import { u as C } from "./useControllableValue-CWqH1kpM.js";
+import './RadioGroup.css';const z = "cqr", R = "cqi", D = "cqs", F = "cqp", I = "cqh", V = "cqn", A = "cqm", B = "cqf", G = "cqc", L = "cqt", M = "cqe", P = "cqd", T = "cqx", $ = "cqy", j = "cqz", H = "cqk", J = "cqo", K = "cqq", O = "cqw", l = {
+  r: z,
+  i: R,
+  s: D,
+  p: F,
+  h: I,
+  n: V,
+  m: A,
+  f: B,
+  c: G,
+  t: L,
+  e: M,
+  d: P,
+  x: T,
+  y: $,
+  z: j,
+  k: H,
+  o: J,
+  q: K,
+  w: O
+};
+function E({
+  kind: a,
+  selected: c
+}) {
+  const t = a === "radio";
+  return /* @__PURE__ */ e.createElement(
+    "span",
+    {
+      className: r(l.k, t ? l.o : l.q),
+      "data-on": c ? "true" : void 0,
+      "aria-hidden": !0
+    },
+    !t && c ? /* @__PURE__ */ e.createElement(w, { className: l.w }) : null
+  );
+}
+function d({
+  title: a,
+  meta: c,
+  price: t,
+  badge: s
+}) {
+  return a == null && c == null && t == null && s == null ? null : /* @__PURE__ */ e.createElement("div", { className: l.t }, t != null ? /* @__PURE__ */ e.createElement("span", { className: l.z }, t) : null, a ?? null, c != null ? /* @__PURE__ */ e.createElement("span", { className: l.e }, c) : null, s ?? null);
+}
+function q({ children: a }) {
+  return /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: l.x,
+      onClick: (c) => c.stopPropagation(),
+      onMouseDown: (c) => c.preventDefault()
+    },
+    a
+  );
+}
+function X({
+  items: a,
+  value: c,
+  defaultValue: t,
+  name: s,
+  disabled: i = !1,
+  indicator: m = "check",
+  indicatorSide: v = "end",
+  onValueChange: f,
+  className: N,
+  ...k
+}) {
+  const h = e.useId(), b = s ?? h, [g, x] = C(
+    c,
+    t,
+    f
+  );
+  return /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: r(l.r, N),
+      role: "radiogroup",
+      "aria-disabled": i || void 0,
+      ...k
+    },
+    a.map((n) => {
+      const o = g === n.value, y = i || !!n.disabled, u = n.variant === "split", p = n.iconFramed !== !1;
+      return /* @__PURE__ */ e.createElement(
+        "label",
+        {
+          key: n.value,
+          className: r(l.i, o && l.s, u && l.p),
+          "data-selected": o ? "true" : void 0,
+          "data-indicator": u ? void 0 : v
+        },
+        /* @__PURE__ */ e.createElement(
+          "input",
+          {
+            className: l.n,
+            type: "radio",
+            name: b,
+            value: n.value,
+            checked: o,
+            disabled: y,
+            onChange: () => x(n.value)
+          }
+        ),
+        u ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: l.h }, n.icon != null ? /* @__PURE__ */ e.createElement("div", { className: r(l.m, p && l.f) }, n.icon) : null, /* @__PURE__ */ e.createElement(d, { title: n.title }), /* @__PURE__ */ e.createElement(E, { kind: m, selected: o })), /* @__PURE__ */ e.createElement("div", { className: l.y }, /* @__PURE__ */ e.createElement(
+          d,
+          {
+            price: n.price,
+            meta: n.meta,
+            badge: n.badge
+          }
+        ), n.description != null ? /* @__PURE__ */ e.createElement("p", { className: l.d }, n.description) : null, n.actions != null ? /* @__PURE__ */ e.createElement(q, null, n.actions) : null)) : /* @__PURE__ */ e.createElement(e.Fragment, null, n.icon != null ? /* @__PURE__ */ e.createElement("div", { className: r(l.m, p && l.f) }, n.icon) : null, /* @__PURE__ */ e.createElement("div", { className: l.c }, /* @__PURE__ */ e.createElement(
+          d,
+          {
+            title: n.title,
+            meta: n.meta,
+            price: n.price,
+            badge: n.badge
+          }
+        ), n.description != null ? /* @__PURE__ */ e.createElement("p", { className: l.d }, n.description) : null, n.actions != null ? /* @__PURE__ */ e.createElement(q, null, n.actions) : null), /* @__PURE__ */ e.createElement(E, { kind: m, selected: o }))
+      );
+    })
+  );
+}
+export {
+  X as R
+};

package/dist/RadioGroup.css

@@ -1 +1 @@
-@layer elcrm-components{.cqr{display:flex;flex-direction:column;gap:var(--shell-gap)}.cqi{display:flex;align-items:flex-start;gap:var(--shell-gap);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.cqi:hover:not(:disabled){background:var(--shell-background-hover)}.cqi:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cqs,.cqi[data-selected=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cqp{flex-direction:column;align-items:stretch;padding:0;gap:0}.cqp.cqs .cqh,.cqp[data-selected=true] .cqh{border-bottom-color:var(--shell-color-accent)}.cqn{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cqm{display:flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden}.cqf{width:var(--shell-icon-size);height:var(--shell-icon-size);padding:var(--shell-gap-sm);box-sizing:content-box;color:var(--shell-color-muted);background:var(--shell-background-muted);border:1px solid var(--shell-border);border-radius:var(--shell-radius)}.cqc{display:flex;flex:1;flex-direction:column;gap:var(--shell-gap-sm);min-width:0}.cqt{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm);font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cqe{font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color-muted)}.cqd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cqx{display:flex;flex-wrap:wrap;gap:var(--shell-gap-sm);margin-top:var(--shell-gap-sm)}.cqh{display:flex;align-items:center;gap:var(--shell-gap);padding:var(--shell-padding);border-bottom:1px solid var(--shell-border)}.cqh .cqt{flex:1;min-width:0}.cqy{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding)}.cqz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.2}.cqk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);margin-left:auto;box-sizing:border-box;border:1px solid var(--shell-border);background:var(--shell-background);color:#fff}.cqi[data-indicator=start]>.cqk{margin-left:0;order:-1}.cqo{border-radius:50%}.cqo[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent);box-shadow:inset 0 0 0 3px var(--shell-background-selected)}.cqq{border-radius:calc(var(--shell-radius) * .4)}.cqq[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.cqw{width:60%;height:60%;display:block}}
+@layer elcrm-components{.cqr{display:flex;flex-direction:column;gap:var(--shell-gap)}.cqi{display:flex;align-items:flex-start;gap:var(--shell-gap);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.cqi:hover:not(:disabled){background:var(--shell-background-hover)}.cqi:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cqs,.cqi[data-selected=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cqp{flex-direction:column;align-items:stretch;padding:0;gap:0}.cqp.cqs .cqh,.cqp[data-selected=true] .cqh{border-bottom-color:var(--shell-color-accent)}.cqn{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cqm{display:flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden}.cqf{width:var(--shell-icon-size);height:var(--shell-icon-size);padding:var(--shell-gap-sm);box-sizing:content-box;color:var(--shell-color-muted);background:var(--shell-background-muted);border:1px solid var(--shell-border);border-radius:var(--shell-radius)}.cqc{display:flex;flex:1;flex-direction:column;gap:var(--shell-gap-sm);min-width:0}.cqt{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm);font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cqe{font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color-muted)}.cqd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cqx{display:flex;flex-wrap:wrap;gap:var(--shell-gap-sm);margin-top:var(--shell-gap-sm)}.cqh{display:flex;align-items:center;gap:var(--shell-gap);padding:var(--shell-padding);border-bottom:1px solid var(--shell-border)}.cqh .cqt{flex:1;min-width:0}.cqy{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding)}.cqz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.2}.cqk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);margin-left:auto;box-sizing:border-box;border:1px solid var(--shell-border);background:var(--shell-background);color:var(--avatar-color)}.cqi[data-indicator=start]>.cqk{margin-left:0;order:-1}.cqo{border-radius:50%}.cqo[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent);box-shadow:inset 0 0 0 3px var(--shell-background-selected)}.cqq{border-radius:calc(var(--shell-radius) * .4)}.cqq[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.cqw{width:60%;height:60%;display:block}}

package/dist/RadioGroup.js

@@ -1,4 +1,4 @@
-import { R as a } from "./RadioGroup-D2UUOTkY.js";
+import { R as a } from "./RadioGroup-fcXzhvMu.js";
 export {
   a as RadioGroup
 };

package/dist/Sidebar-CBYq1ad6.js

@@ -0,0 +1,107 @@
+import e from "react";
+import { B as h } from "./Badge-jp-9iNNL.js";
+import { D as w } from "./Dropdown-4yUB2tk1.js";
+import { I as y } from "./Item-D4okhsfW.js";
+import { b as C } from "./badgeText-CRzlIzi3.js";
+import { c as u } from "./cx-CcykAxZN.js";
+import './Sidebar.css';const q = "c2r", B = "c2b", D = "c2x", T = "c2g", z = "c2s", F = "c2p", I = "c2h", M = "c2n", R = "c2i", V = "c2a", $ = "c2o", j = "c2l", A = "c2d", G = "c2f", H = "c2q", J = "c2w", K = "c2u", L = "c2k", O = "c2v", l = {
+  r: q,
+  b: B,
+  x: D,
+  g: T,
+  s: z,
+  p: F,
+  h: I,
+  n: M,
+  i: R,
+  a: V,
+  o: $,
+  l: j,
+  d: A,
+  f: G,
+  q: H,
+  w: J,
+  u: K,
+  k: L,
+  v: O
+};
+function P({ className: c }) {
+  return /* @__PURE__ */ e.createElement("svg", { className: c, viewBox: "0 0 16 16", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement("circle", { cx: "8", cy: "3", r: "1.3", fill: "currentColor" }), /* @__PURE__ */ e.createElement("circle", { cx: "8", cy: "8", r: "1.3", fill: "currentColor" }), /* @__PURE__ */ e.createElement("circle", { cx: "8", cy: "13", r: "1.3", fill: "currentColor" }));
+}
+function Q({
+  footer: c,
+  className: E,
+  ...a
+}) {
+  const r = /* @__PURE__ */ e.createElement(P, { className: l.k });
+  if (e.isValidElement(c) && typeof c.type != "string") {
+    const n = c.props;
+    return e.cloneElement(c, {
+      as: "button",
+      extra: n.extra ?? r,
+      className: u(n.className, E),
+      ...a,
+      onClick: (i) => {
+        var m, t;
+        (m = n.onClick) == null || m.call(n, i), (t = a.onClick) == null || t.call(a, i);
+      }
+    });
+  }
+  return /* @__PURE__ */ e.createElement("button", { type: "button", className: u(l.u, E), ...a }, /* @__PURE__ */ e.createElement("span", { className: l.w }, c), r);
+}
+function S({
+  groups: c,
+  items: E,
+  value: a,
+  onSelect: r,
+  variant: n = "cards",
+  brand: i,
+  extra: m,
+  footer: t,
+  footerItems: d,
+  onFooterSelect: v,
+  footerMenuLabel: g = "Меню аккаунта",
+  version: p,
+  className: k,
+  "aria-label": x = "Основное меню"
+}) {
+  const f = c ?? E ?? [];
+  return /* @__PURE__ */ e.createElement(
+    "aside",
+    {
+      className: u(l.r, n === "plain" && l.p, k),
+      "aria-label": x
+    },
+    i != null || m != null ? /* @__PURE__ */ e.createElement("div", { className: l.b }, i, m != null ? /* @__PURE__ */ e.createElement("div", { className: l.x }, m) : null) : null,
+    /* @__PURE__ */ e.createElement("div", { className: l.g }, f.map((o) => /* @__PURE__ */ e.createElement("nav", { key: o.value, className: l.s, "aria-label": o.title ?? "Навигация" }, o.title ? /* @__PURE__ */ e.createElement("div", { className: l.h }, o.title) : null, /* @__PURE__ */ e.createElement("ul", { className: l.n }, (o.items ?? []).map((s) => {
+      const b = C(s.badge), N = a === s.value;
+      return /* @__PURE__ */ e.createElement("li", { key: s.value }, /* @__PURE__ */ e.createElement(
+        y,
+        {
+          as: "button",
+          active: N,
+          className: u(l.i, N && l.a),
+          "aria-current": N ? "page" : void 0,
+          onClick: () => r == null ? void 0 : r(s.value)
+        },
+        s.icon != null ? /* @__PURE__ */ e.createElement("span", { className: l.o, "aria-hidden": !0 }, s.icon) : null,
+        /* @__PURE__ */ e.createElement("span", { className: l.l }, s.label),
+        b != null ? /* @__PURE__ */ e.createElement(h, { className: l.d, tone: "accent", size: "s" }, b) : null
+      ));
+    }))))),
+    t != null || p != null ? /* @__PURE__ */ e.createElement("div", { className: u(l.s, l.f) }, t != null && d != null && d.length > 0 ? /* @__PURE__ */ e.createElement(
+      w,
+      {
+        className: l.q,
+        align: "start",
+        label: g,
+        trigger: /* @__PURE__ */ e.createElement(Q, { footer: t, className: l.w }),
+        items: d,
+        onSelect: v
+      }
+    ) : t, p != null ? /* @__PURE__ */ e.createElement("div", { className: l.v }, p) : null) : null
+  );
+}
+export {
+  S
+};

package/dist/Sidebar.css

@@ -1 +1 @@
-@layer elcrm-components{.c2r{box-sizing:border-box;display:flex;flex-direction:column;flex:0 0 var(--sidebar-width);width:var(--sidebar-width);min-height:100svh;max-height:100svh;padding:var(--sidebar-pad-y) var(--sidebar-pad-x);gap:var(--shell-gap-sm);color:var(--shell-color);position:sticky;top:0;align-self:flex-start}.c2b{display:flex;flex-direction:row;align-items:center;gap:var(--shell-gap);padding:4px 8px;min-width:0}.c2x{flex-shrink:0;margin-left:auto}.c2g{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--shell-gap-sm);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.c2s{box-sizing:border-box;flex-shrink:0;padding:8px}.c2p{--sidebar-plain: 1}.c2r:not(.c2p) .c2s{background:var(--sidebar-block-bg, var(--shell-background));border:1px solid var(--sidebar-block-border, var(--shell-border));border-radius:var(--sidebar-block-radius, var(--shell-radius));box-shadow:var(--sidebar-block-shadow, none)}.c2h{margin:2px 10px 6px;font-size:var(--sidebar-group-font-size, 11px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--shell-color-muted)}.c2n{margin:0;padding:0;list-style:none}.c2n>li{list-style:none}.c2n .c2i:is(button){position:relative;display:flex;width:100%;box-sizing:border-box;flex-direction:row;align-items:center;gap:8px;margin:0 0 1px;padding:var(--sidebar-item-padding, 6px 10px);border:0;border-radius:8px;background:transparent;color:var(--shell-color-muted);font-family:inherit;font-size:var(--sidebar-item-font-size, 13px);font-weight:500;line-height:1.25;letter-spacing:0;text-align:left;cursor:pointer}.c2n .c2i:is(button):hover{color:var(--shell-color);background:var(--shell-background-hover)}.c2n .c2i:is(button).c2a,.c2n .c2i:is(button)[aria-current=page],.c2n .c2i:is(button)[data-active=true],.c2n .c2i:is(button).c2a:hover{color:var(--sidebar-item-active, var(--shell-color));background:var(--sidebar-item-active-bg, var(--shell-background-selected))}.c2o{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--sidebar-icon-size, 16px);height:var(--sidebar-icon-size, 16px);color:inherit}.c2o :is(svg){display:block;width:var(--sidebar-icon-size, 16px);height:var(--sidebar-icon-size, 16px)}.c2a .c2o{color:var(--sidebar-icon-active, var(--shell-color-accent))}.c2l{flex:1;min-width:0}.c2d{flex-shrink:0;min-width:16px;height:16px;padding:0 4px;font-size:10px}.c2f{margin-top:auto}.c2v{margin-top:var(--shell-gap-sm);font-size:11px;color:var(--shell-color-muted);text-align:center}@media (max-width: 900px){.c2r{flex:0 0 72px;width:72px;padding:12px 8px}.c2l,.c2h,.c2v{display:none}.c2b{flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:4px 0}.c2x{margin-left:0}.c2s{padding:6px}.c2n .c2i{justify-content:center;align-items:center;gap:0;width:100%;min-height:40px;padding:10px 0}.c2n .c2d{position:absolute;top:4px;right:4px;min-width:14px;height:14px;padding:0 4px;font-size:.625rem;line-height:14px;pointer-events:none}}}
+@layer elcrm-components{.c2r{box-sizing:border-box;display:flex;flex-direction:column;flex:1 1 auto;width:var(--sidebar-width, 248px);min-width:0;min-height:0;height:100%;max-height:100%;padding:var(--sidebar-pad-y, 16px) var(--sidebar-pad-x, 12px);gap:var(--shell-gap-sm, 8px);color:var(--shell-color);align-self:stretch}.c2b{display:flex;flex-direction:row;align-items:center;gap:var(--shell-gap);padding:4px 8px;min-width:0}.c2x{flex-shrink:0;margin-left:auto}.c2g{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--shell-gap-sm);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.c2s{box-sizing:border-box;flex-shrink:0;padding:8px}.c2p{--sidebar-plain: 1}.c2r:not(.c2p) .c2s{background:var(--sidebar-block-bg);border:1px solid var(--sidebar-block-border);border-radius:var(--sidebar-block-radius);box-shadow:var(--sidebar-block-shadow)}.c2h{margin:2px 10px 6px;font-size:var(--sidebar-group-font-size);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--shell-color-muted)}.c2n{margin:0;padding:0;list-style:none}.c2n>li{list-style:none}.c2n .c2i:is(button){position:relative;display:flex;width:100%;box-sizing:border-box;flex-direction:row;align-items:center;gap:8px;margin:0 0 1px;padding:var(--sidebar-item-padding);border:0;border-radius:8px;background:transparent;color:var(--shell-color-muted);font-family:inherit;font-size:var(--sidebar-item-font-size);font-weight:500;line-height:1.25;letter-spacing:0;text-align:left;cursor:pointer}.c2n .c2i:is(button):hover{color:var(--shell-color);background:var(--shell-background-hover)}.c2n .c2i:is(button).c2a,.c2n .c2i:is(button)[aria-current=page],.c2n .c2i:is(button)[data-active=true],.c2n .c2i:is(button).c2a:hover{color:var(--sidebar-item-active);background:var(--sidebar-item-active-bg)}.c2o{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--sidebar-icon-size);height:var(--sidebar-icon-size);color:inherit}.c2o :is(svg){display:block;width:var(--sidebar-icon-size);height:var(--sidebar-icon-size)}.c2a .c2o{color:var(--sidebar-icon-active)}.c2l{flex:1;min-width:0}.c2d{flex-shrink:0;min-width:16px;height:16px;padding:0 4px;font-size:10px}.c2f{margin-top:auto}.c2q{display:flex;width:100%;min-width:0}.c2q>*{display:flex;width:100%;min-width:0}.c2w{display:flex;width:100%;min-width:0;align-items:center}.c2u{display:flex;align-items:center;width:100%;min-width:0;gap:var(--shell-gap-sm);margin:0;padding:0;border:none;background:transparent;font:inherit;color:inherit;cursor:pointer;text-align:left}.c2k{flex-shrink:0;width:var(--sidebar-icon-size);height:var(--sidebar-icon-size);color:var(--shell-color-muted)}.c2v{margin-top:var(--shell-gap-sm);font-size:11px;color:var(--shell-color-muted);text-align:center}@media (max-width: 900px){.c2r{width:72px;padding:12px 8px}.c2l,.c2h,.c2v{display:none}.c2b{flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:4px 0}.c2x{margin-left:0}.c2s{padding:6px}.c2n .c2i{justify-content:center;align-items:center;gap:0;width:100%;min-height:40px;padding:10px 0}.c2n .c2d{position:absolute;top:4px;right:4px;min-width:14px;height:14px;padding:0 4px;font-size:.625rem;line-height:14px;pointer-events:none}}}

package/dist/Sidebar.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { DropdownItem } from './Dropdown';
 /** Вид колонки: карточки (консоль) или плоский список (backoffice) */
 export type SidebarVariant = "cards" | "plain";
 /** Пункт бокового меню. Идентификатор — `value`. */
@@ -42,6 +43,12 @@ export type SidebarGroup = {
  *     { value: "admin", title: "Админ", items: [{ value: "users", label: "Люди" }] },
  *   ]}
  *   footer={<AvatarName title="Паша" description="mail@…" />}
+ *   footerItems={[
+ *     { value: "home", label: "Главная", icon: <Icon /> },
+ *     { value: "theme", label: "Тема", submenu: true },
+ *     { value: "logout", label: "Выйти", danger: true },
+ *   ]}
+ *   onFooterSelect={(value) => console.log(value)}
  *   version="v 0.2.26"
  * />
  * ```
@@ -69,6 +76,15 @@ export type SidebarProps = {
     extra?: React.ReactNode;
     /** Низ: тема, выход или карточка пользователя */
     footer?: React.ReactNode;
+    /**
+     * Меню по клику на `footer` (Dropdown).
+     * Есть пункты → футер становится триггером, справа ⋮.
+     */
+    footerItems?: DropdownItem[];
+    /** Выбор пункта меню аккаунта */
+    onFooterSelect?: (value: string, item: DropdownItem) => void;
+    /** `aria-label` панели меню аккаунта */
+    footerMenuLabel?: string;
     /** Версия под футером */
     version?: React.ReactNode;
     /** Подпись колонки */
@@ -80,4 +96,4 @@ export type SidebarProps = {
  *
  * @see Layout, Brand, Item, Badge, NavSections
  */
-export declare function Sidebar({ groups, items, value, onSelect, variant, brand, extra, footer, version, className, "aria-label": ariaLabel, }: SidebarProps): React.JSX.Element;
+export declare function Sidebar({ groups, items, value, onSelect, variant, brand, extra, footer, footerItems, onFooterSelect, footerMenuLabel, version, className, "aria-label": ariaLabel, }: SidebarProps): React.JSX.Element;

package/dist/Sidebar.js

@@ -1,4 +1,4 @@
-import { S as e } from "./Sidebar-DeqxYgxn.js";
+import { S as e } from "./Sidebar-CBYq1ad6.js";
 export {
   e as Sidebar
 };

package/dist/{Stat-C5iZyEoo.js → Stat-sKXJwz5L.js}

@@ -1,10 +1,10 @@
 import a from "react";
 import { C as u } from "./Card-hn37Opo3.js";
 import { c as t } from "./cx-CcykAxZN.js";
-import './Stat.css';const d = "c4r", p = "c4l", i = "c4le", w = "c4v", f = "c4a", v = "c4u", C = "c4w", E = "c4d", c = {
+import './Stat.css';const d = "c4r", p = "c4l", i = "c4e", w = "c4v", f = "c4a", v = "c4u", C = "c4w", E = "c4d", c = {
   r: d,
   l: p,
-  le: i,
+  e: i,
   v: w,
   a: f,
   u: v,
@@ -16,11 +16,11 @@ function S({
   value: n,
   tone: s = "neutral",
   labelMuted: r = !0,
-  className: l,
-  ...o
+  className: o,
+  ...l
 }) {
   const m = s === "accent" ? c.a : s === "success" ? c.u : s === "warning" ? c.w : s === "danger" ? c.d : c.n;
-  return /* @__PURE__ */ a.createElement(u, { className: t(c.r, m, l), ...o }, /* @__PURE__ */ a.createElement("span", { className: t(c.l, !r && c.le) }, e), /* @__PURE__ */ a.createElement("span", { className: c.v }, n));
+  return /* @__PURE__ */ a.createElement(u, { className: t(c.r, m, o), ...l }, /* @__PURE__ */ a.createElement("span", { className: t(c.l, !r && c.e) }, e), /* @__PURE__ */ a.createElement("span", { className: c.v }, n));
 }
 export {
   S

package/dist/Stat.css

@@ -1 +1 @@
-@layer elcrm-components{.c4r{display:flex;flex-direction:column;gap:6px}.c4l{font-size:var(--shell-font-size-sm);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--shell-color-muted);line-height:1.2}.c4le{color:var(--shell-color)}.c4v{font-size:var(--stat-value-size, 1.75rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--shell-color)}.c4a .c4v{color:var(--shell-color-accent)}.c4u .c4v{color:var(--shell-color-success)}.c4w .c4v{color:var(--shell-color-warning)}.c4d .c4v{color:var(--shell-color-danger)}}
+@layer elcrm-components{.c4r{display:flex;flex-direction:column;gap:6px}.c4l{font-size:var(--shell-font-size-sm);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--shell-color-muted);line-height:1.2}.c4e{color:var(--shell-color)}.c4v{font-size:var(--stat-value-size);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--shell-color)}.c4a .c4v{color:var(--shell-color-accent)}.c4u .c4v{color:var(--shell-color-success)}.c4w .c4v{color:var(--shell-color-warning)}.c4d .c4v{color:var(--shell-color-danger)}}

package/dist/Stat.js

@@ -1,4 +1,4 @@
-import { S as o } from "./Stat-C5iZyEoo.js";
+import { S as o } from "./Stat-sKXJwz5L.js";
 export {
   o as Stat
 };