@elcrm/components 0.2.9 → 0.2.13

package/dist/index.es.js

@@ -1,15 +1,15 @@
 import { L as x } from "./Layout-mi6Ghayv.js";
-import { H as i } from "./Header-DZQopVNy.js";
+import { H as l } from "./Header-DZQopVNy.js";
 import { F as n } from "./Footer-qxUlnPR9.js";
 import { L as u } from "./List-BgKkYaGO.js";
 import { I as d } from "./Item-D4okhsfW.js";
 import { I as P } from "./ItemColumn-M7a9L8CI.js";
 import { C as T } from "./Card-hn37Opo3.js";
-import { A } from "./ActionGroup-ChKFW0mt.js";
-import { T as I, a as L, u as b } from "./Toolbar-C1zAk9ak.js";
+import { A as I } from "./ActionGroup-ChKFW0mt.js";
+import { T as b, a as A, u as L } from "./Toolbar-C1zAk9ak.js";
 import { T as R } from "./TextGroup-DmhuyMR1.js";
-import { S as H } from "./Stat-sKXJwz5L.js";
-import { B as k } from "./Block-Bu7NEA0g.js";
+import { S as G } from "./Stat-sKXJwz5L.js";
+import { B as g } from "./Block-Bu7NEA0g.js";
 import { R as N } from "./Row-DsQOVn18.js";
 import { C as M } from "./Column-BiogBDf8.js";
 import { S as Z, s as w } from "./Stack-XkmPSswj.js";
@@ -18,53 +18,61 @@ import { D as j } from "./Dropdown-DosvDR13.js";
 import { B as K } from "./Breadcrumb-CAM_e9LN.js";
 import { L as U } from "./Loading-DkkG7RcE.js";
 import { S as W } from "./Section-Crxk2J-E.js";
-import { N as Y } from "./NavSections-BpyZPimZ.js";
+import { N as Y } from "./NavSections-D6rDEtT1.js";
 import { T as $ } from "./TabSections-DN7yVJoF.js";
-import { A as or, a as ar, i as er } from "./Avatar-loGgFt72.js";
-import { A as sr } from "./AvatarGroup-D1gnT3Od.js";
-import { A as mr } from "./AvatarName-0BzyfpMq.js";
-import { B as fr } from "./Badge-jp-9iNNL.js";
-import { B as lr } from "./Brand-Zq-Idks4.js";
-import { E as cr } from "./EmptyState-mBiWtMIM.js";
-import { R as Sr } from "./RadioGroup-fcXzhvMu.js";
-import { P as Cr } from "./PricingGroup-Czuhe81Z.js";
-import { P as vr } from "./PricingTable-BuLC0opK.js";
-import { P as yr } from "./PageHead-DgaJ1mXY.js";
-import { P as Br } from "./PageShell-D9EZiO8o.js";
-import { C as Lr, a as br } from "./ChatSplit-DNnu3TNq.js";
-import { C as Rr } from "./ChatFrame-BW2TmCkZ.js";
-import { C as Hr } from "./ChatMessages-B8rdXiK-.js";
-import { S as kr } from "./Sidebar-BgZiGEDH.js";
-import { P as Nr } from "./Popover-DWdvZTuA.js";
-import { H as Mr } from "./Healthmap-B6cdiLUl.js";
-import { P as Zr } from "./PanelInfo-A5y5ysH8.js";
-import { a as Dr, p as Er, r as qr } from "./overlayZ-BvHbYC1x.js";
+import { A as ro, a as ao, i as eo } from "./Avatar-loGgFt72.js";
+import { A as so } from "./AvatarGroup-D1gnT3Od.js";
+import { A as mo } from "./AvatarName-0BzyfpMq.js";
+import { B as fo } from "./Badge-jp-9iNNL.js";
+import { B as io } from "./Brand-Zq-Idks4.js";
+import { E as co } from "./EmptyState-mBiWtMIM.js";
+import { R as So } from "./RadioGroup-fcXzhvMu.js";
+import { P as Po } from "./PricingGroup-Czuhe81Z.js";
+import { P as To } from "./PricingTable-BuLC0opK.js";
+import { P as Io } from "./PageHead-DgaJ1mXY.js";
+import { P as bo } from "./PageShell-D9EZiO8o.js";
+import { C as Lo, a as ho } from "./ChatSplit-DNnu3TNq.js";
+import { C as ko } from "./ChatFrame-BW2TmCkZ.js";
+import { C as Ho } from "./ChatMessages-B8rdXiK-.js";
+import { S as Fo } from "./Sidebar-CYFaPqdC.js";
+import { P as zo } from "./Popover-DWdvZTuA.js";
+import { H as Oo } from "./Healthmap-B6cdiLUl.js";
+import { P as wo } from "./PanelInfo-A5y5ysH8.js";
+import { T as Eo } from "./Table-BoDr3X2d.js";
+import { C as jo } from "./CodeBlock-CRzVopIv.js";
+import { S as Ko, c as Qo } from "./SplitPane-DR7PCZ8f.js";
+import { B as Vo } from "./Banner-B72lcEMo.js";
+import { I as Xo } from "./IconButton-DPjpBKJn.js";
+import { a as _o, p as $o, r as or } from "./overlayZ-BvHbYC1x.js";
 import { lazy as e } from "react";
-import { c as Jr } from "./cx-CcykAxZN.js";
+import { c as ar } from "./cx-CcykAxZN.js";
 function s(a) {
-  const o = {};
-  return (r) => (o[r] || (o[r] = e(() => a(r))), o[r]);
+  const r = {};
+  return (o) => (r[o] || (r[o] = e(() => a(o))), r[o]);
 }
 export {
-  A as ActionGroup,
-  or as Avatar,
-  sr as AvatarGroup,
-  mr as AvatarName,
-  fr as Badge,
-  k as Block,
-  lr as Brand,
+  I as ActionGroup,
+  ro as Avatar,
+  so as AvatarGroup,
+  mo as AvatarName,
+  fo as Badge,
+  Vo as Banner,
+  g as Block,
+  io as Brand,
   K as Breadcrumb,
   T as Card,
-  Rr as ChatFrame,
-  Lr as ChatList,
-  Hr as ChatMessages,
-  br as ChatSplit,
+  ko as ChatFrame,
+  Lo as ChatList,
+  Ho as ChatMessages,
+  ho as ChatSplit,
+  jo as CodeBlock,
   M as Column,
   j as Dropdown,
-  cr as EmptyState,
+  co as EmptyState,
   n as Footer,
-  i as Header,
-  Mr as Healthmap,
+  l as Header,
+  Oo as Healthmap,
+  Xo as IconButton,
   d as Item,
   P as ItemColumn,
   x as Layout,
@@ -72,29 +80,32 @@ export {
   U as Loading,
   E as Menu,
   Y as NavSections,
-  yr as PageHead,
-  Br as PageShell,
-  Zr as PanelInfo,
-  Nr as Popover,
-  Cr as PricingGroup,
-  vr as PricingTable,
-  Sr as RadioGroup,
+  Io as PageHead,
+  bo as PageShell,
+  wo as PanelInfo,
+  zo as Popover,
+  Po as PricingGroup,
+  To as PricingTable,
+  So as RadioGroup,
   N as Row,
   W as Section,
-  kr as Sidebar,
+  Fo as Sidebar,
+  Ko as SplitPane,
   Z as Stack,
-  H as Stat,
+  G as Stat,
   $ as TabSections,
+  Eo as Table,
   R as TextGroup,
-  I as Toolbar,
-  Dr as acquireOverlayZIndex,
-  L as applyToolbarSize,
-  ar as avatarRadiusStyle,
+  b as Toolbar,
+  _o as acquireOverlayZIndex,
+  A as applyToolbarSize,
+  ao as avatarRadiusStyle,
+  Qo as clampSplitRatio,
   s as createLazyResolver,
-  Jr as cx,
-  er as initialsFromName,
-  Er as peekOverlayZIndex,
-  qr as releaseOverlayZIndex,
+  ar as cx,
+  eo as initialsFromName,
+  $o as peekOverlayZIndex,
+  or as releaseOverlayZIndex,
   w as stackColumnsTemplate,
-  b as useToolbar
+  L as useToolbar
 };

package/dist/navTree-BRyaILN9.js

@@ -0,0 +1,57 @@
+function o(e, n, t = []) {
+  var u;
+  for (const a of e ?? [])
+    n(a, t), (u = a.items) != null && u.length && o(a.items, n, [...t, a.value]);
+}
+function f(e, n) {
+  for (const t of e)
+    o(t.items, n);
+}
+function r(e, n) {
+  if (n == null) return [];
+  let t = null;
+  return f(e, (u, a) => {
+    u.value === n && (t = a);
+  }), t ?? [];
+}
+function i(e, n, t) {
+  const u = new Set(n ?? []);
+  f(e, (a) => {
+    var l;
+    a.defaultOpen && ((l = a.items) != null && l.length) && u.add(a.value);
+  });
+  for (const a of r(e, t)) u.add(a);
+  return [...u];
+}
+function c(e, n) {
+  if (n == null) return !1;
+  let t = !1;
+  return f(e, (u) => {
+    var a;
+    u.value === n && ((a = u.items) != null && a.length) && (t = !0);
+  }), t;
+}
+function s(e) {
+  const n = [];
+  return f(e, (t) => {
+    var u;
+    !((u = t.items) != null && u.length) && !t.disabled && n.push(t);
+  }), n;
+}
+function d(e) {
+  var n;
+  return ((n = s(e)[0]) == null ? void 0 : n.value) ?? "";
+}
+function v(e) {
+  const n = [];
+  return f(e, (t) => {
+    t.disabled || n.push(t);
+  }), n;
+}
+export {
+  v as a,
+  r as b,
+  i as c,
+  d as f,
+  c as i
+};

package/dist/navTree.d.ts

@@ -0,0 +1,33 @@
+/** Узел дерева меню (Sidebar / NavSections). */
+export type NavTreeNode = {
+    value: string;
+    items?: NavTreeNode[];
+    defaultOpen?: boolean;
+    disabled?: boolean;
+};
+export declare function walkNavTree<T extends NavTreeNode>(items: T[] | undefined, fn: (item: T, ancestors: string[]) => void, ancestors?: string[]): void;
+export declare function walkNavGroups<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[], fn: (item: T, ancestors: string[]) => void): void;
+/** Предки выбранного листа — ветку нужно раскрыть. */
+export declare function findNavAncestors<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[], selected: string | undefined): string[];
+/** Стартовый набор раскрытых: defaultOpen + extra + предки selected. */
+export declare function collectNavDefaultOpen<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[], extra: string[] | undefined, selected: string | undefined): string[];
+export declare function isNavParent<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[], value: string | undefined): boolean;
+/** Листья без `items` (для панели / firstValue). */
+export declare function flattenNavLeaves<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[]): T[];
+export declare function firstNavLeafValue<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[]): string;
+/** Все доступные пункты (родители + листья) — для клавиатуры. */
+export declare function flattenNavEnabled<T extends NavTreeNode>(groups: {
+    items?: T[];
+}[]): T[];

package/dist/tokens.css

@@ -113,6 +113,7 @@
   --sidebar-item-padding: 6px 10px;
   --sidebar-icon-size: 16px;
   --sidebar-group-font-size: 11px;
+  --sidebar-indent: 14px;
 
   /* —— chat —— */
   --chat-list-width: 340px;
@@ -124,4 +125,32 @@
   --chat-messages-header-padding: 14px 16px;
   --chat-messages-body-padding: 16px 16px 20px;
   --chat-messages-footer-padding: 10px 12px 12px;
+
+  /* —— table —— */
+  --table-font-size: 0.9rem;
+  --table-cell-padding: 0.55rem 0.7rem;
+  --table-head-font-size: 0.75rem;
+  --table-code-font-size: 0.8rem;
+
+  /* —— code-block —— */
+  --code-block-bg: var(--shell-background);
+  --code-block-bar-padding: 0.4rem 0.75rem;
+  --code-block-padding: 0.85rem 1rem;
+  --code-block-font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  --code-block-font-size: 0.8rem;
+  --code-block-line-height: 1.55;
+
+  /* —— split-pane —— */
+  --split-handle-size: 6px;
+  --split-handle-bg: var(--shell-border);
+  --split-handle-bg-hover: color-mix(
+    in srgb,
+    var(--shell-color-accent) 25%,
+    var(--shell-border)
+  );
+
+  /* —— banner —— */
+  --banner-padding: 0.55rem 0.85rem;
+  --banner-bg: color-mix(in srgb, var(--shell-color-accent) 8%, var(--shell-bg));
+  --banner-border: color-mix(in srgb, var(--shell-color-accent) 35%, var(--shell-border));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elcrm/components",
-  "version": "0.2.9",
+  "version": "0.2.13",
   "description": "Shell UI elCRM: Layout, Header, Sidebar, Popover, Healthmap, PanelInfo, PageHead, PageShell, Section, Stack, Stat и др.",
   "type": "module",
   "author": "MaSkal <dev@elcrm.online>",
@@ -85,6 +85,9 @@
     "./package.json": "./package.json"
   },
   "peerDependencies": {
+    "@elcrm/button": "1.2.0",
+    "@elcrm/icons": "0.1.5",
+    "@elcrm/tooltip": "0.1.2",
     "@types/react": ">=18.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"

package/dist/NavSections-BpyZPimZ.js

@@ -1,79 +0,0 @@
-import a, { useMemo as h, Suspense as S } from "react";
-import { c as d } from "./cx-CcykAxZN.js";
-import { I as g } from "./Item-D4okhsfW.js";
-import { h as x } from "./rovingKeys-CGlfTtNQ.js";
-import { u as C } from "./useControllableValue-CWqH1kpM.js";
-import './NavSections.css';const I = "cvr", K = "cvn", M = "cvg", R = "cvl", V = "cvi", w = "cva", D = "cvc", P = "cvt", j = "cvf", q = "cvm", l = {
-  r: I,
-  n: K,
-  g: M,
-  l: R,
-  i: V,
-  a: w,
-  c: D,
-  t: P,
-  f: j,
-  m: q
-};
-function z(n) {
-  for (const m of n) {
-    const c = m.items.find((s) => !s.disabled);
-    if (c) return c.value;
-  }
-  return "";
-}
-function J({
-  groups: n,
-  resolveSection: m,
-  value: c,
-  defaultValue: s,
-  onValueChange: f,
-  loading: b = null,
-  footer: i,
-  className: E,
-  navLabel: N = "Разделы"
-}) {
-  const p = h(
-    () => s || z(n),
-    [s, n]
-  ), [r, v] = C(
-    c,
-    p,
-    f
-  ), k = n.flatMap((e) => e.items).filter((e) => !e.disabled).map((e) => e.value), u = r ? m(r) : null;
-  return /* @__PURE__ */ a.createElement("div", { className: d(l.r, E) }, /* @__PURE__ */ a.createElement(
-    "nav",
-    {
-      className: l.n,
-      "aria-label": N,
-      onKeyDown: (e) => x(e, {
-        values: k,
-        value: r,
-        onSelect: v,
-        vertical: !0
-      })
-    },
-    n.map((e, y) => /* @__PURE__ */ a.createElement("div", { key: y, className: l.g }, e.label != null ? /* @__PURE__ */ a.createElement("div", { className: l.l }, e.label) : null, e.items.map((t) => {
-      const o = t.value === r;
-      return /* @__PURE__ */ a.createElement(
-        g,
-        {
-          key: t.value,
-          as: "button",
-          active: o,
-          className: d(l.i, o && l.a),
-          "data-active": o ? "true" : void 0,
-          "aria-current": o ? "page" : void 0,
-          disabled: t.disabled,
-          onClick: () => v(t.value)
-        },
-        t.icon != null ? /* @__PURE__ */ a.createElement("span", { className: l.c, "aria-hidden": !0 }, t.icon) : null,
-        /* @__PURE__ */ a.createElement("span", { className: l.t }, t.label)
-      );
-    }))),
-    i != null ? /* @__PURE__ */ a.createElement("div", { className: l.f }, i) : null
-  ), /* @__PURE__ */ a.createElement("div", { className: l.m }, u ? /* @__PURE__ */ a.createElement(S, { fallback: b }, a.createElement(u)) : null));
-}
-export {
-  J as N
-};

package/dist/Sidebar-BgZiGEDH.js

@@ -1,108 +0,0 @@
-import e from "react";
-import { B as h } from "./Badge-jp-9iNNL.js";
-import { D as w } from "./Dropdown-DosvDR13.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",
-        placement: "top",
-        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
-};