@elcrm/components 0.2.13 → 0.5.1

package/dist/List-D13pqaUY.js

@@ -0,0 +1,12 @@
+import a from "react";
+import { c } from "./cx-CcykAxZN.js";
+import './List.css';const s = "llr", e = "llh", o = {
+  root: s,
+  horizontal: e
+};
+function h({ row: t, children: r, className: l, ...n }) {
+  return /* @__PURE__ */ a.createElement("ul", { className: c(o.root, t && o.horizontal, l), ...n }, r);
+}
+export {
+  h as L
+};

package/dist/List.css

@@ -1 +1 @@
-@layer elcrm-components{.csr{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:0;margin:0;list-style:none}.csh{flex-direction:row;flex-wrap:wrap}}
+@layer elcrm-components{.llr{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:0;margin:0;list-style:none}.llh{flex-direction:row;flex-wrap:wrap}}

package/dist/List.js

@@ -1,4 +1,4 @@
-import { L as s } from "./List-BgKkYaGO.js";
+import { L as s } from "./List-D13pqaUY.js";
 export {
   s as List
 };

package/dist/Loading-C_CKD-zt.js

@@ -0,0 +1,16 @@
+import o from "react";
+import { c as s } from "./cx-CcykAxZN.js";
+import './Loading.css';const c = "sor", i = "soi", t = {
+  root: c,
+  indicator: i
+};
+function d({
+  children: r = "Загрузка…",
+  className: a,
+  ...e
+}) {
+  return /* @__PURE__ */ o.createElement("div", { className: s(t.root, a), role: "status", ...e }, /* @__PURE__ */ o.createElement("span", { className: t.indicator, "aria-hidden": !0 }), r);
+}
+export {
+  d as L
+};

package/dist/Loading.css

@@ -1 +1 @@
-@layer elcrm-components{.cgr{display:flex;align-items:center;justify-content:center;gap:var(--shell-gap-sm);padding:var(--shell-gap-lg);color:var(--shell-color-muted)}.cgi{box-sizing:border-box;width:var(--shell-icon-size);height:var(--shell-icon-size);border:2px solid var(--shell-border);border-top-color:var(--shell-color-accent);border-radius:var(--avatar-radius);animation:cgk .7s linear infinite}}@keyframes cgk{to{transform:rotate(360deg)}}
+@layer elcrm-components{.sor{display:flex;align-items:center;justify-content:center;gap:var(--shell-gap-sm);padding:var(--shell-gap-lg);min-height:var(--loading-min-height);color:var(--shell-color-muted)}.soi{box-sizing:border-box;width:var(--shell-icon-size);height:var(--shell-icon-size);border:2px solid var(--shell-border);border-top-color:var(--shell-color-accent);border-radius:var(--avatar-radius);animation:sos .7s linear infinite}}@keyframes sos{to{transform:rotate(360deg)}}

package/dist/Loading.d.ts

@@ -10,7 +10,7 @@ import { default as React } from 'react';
  * {isLoading ? <Loading>Загружаем клиентов…</Loading> : <List>…</List>}
  * ```
  *
- * Токены: `--shell-*`.
+ * Токены: `--shell-*`, `--loading-min-height`.
  */
 export type LoadingProps = React.HTMLAttributes<HTMLDivElement> & {
     /** Текст или кастомный индикатор (по умолчанию «Загрузка…») */

package/dist/Loading.js

@@ -1,4 +1,4 @@
-import { L as r } from "./Loading-DkkG7RcE.js";
+import { L as r } from "./Loading-C_CKD-zt.js";
 export {
   r as Loading
 };

package/dist/Menu-D2kf7fN_.js

@@ -0,0 +1,72 @@
+import l from "react";
+import { B as E } from "./Badge-BjScAXGy.js";
+import { b as N } from "./badgeText-CRzlIzi3.js";
+import { c as p } from "./cx-CcykAxZN.js";
+import { h } from "./rovingKeys-Di9N1Nct.js";
+import { u as w } from "./useControllableValue-BaE0VR5d.js";
+import './Menu.css';const B = "lnr", C = "lnv", K = "lni", M = "lnd", z = "lna", D = "lnu", n = {
+  root: B,
+  vertical: C,
+  item: K,
+  dot: M,
+  active: z,
+  underline: D
+};
+function F({
+  items: o,
+  vertical: c,
+  variant: m = "plain",
+  value: r,
+  defaultValue: s,
+  onValueChange: u,
+  children: g,
+  className: R,
+  ...x
+}) {
+  const [t, v] = w(
+    r,
+    s,
+    u
+  ), y = (o ?? []).filter((e) => !e.disabled).map((e) => e.value), k = m === "line", d = l.useRef(null), i = u || r !== void 0 || s !== void 0;
+  return /* @__PURE__ */ l.createElement(
+    "nav",
+    {
+      ref: d,
+      className: p(n.root, c && n.vertical, k && n.underline, R),
+      onKeyDown: i ? (e) => h(e, {
+        values: y,
+        value: t,
+        onSelect: v,
+        vertical: c,
+        focusRoot: d.current
+      }) : void 0,
+      ...x
+    },
+    o == null ? void 0 : o.map((e) => {
+      const a = e.active ?? (t != null && e.value === t), b = N(e.badge);
+      return /* @__PURE__ */ l.createElement(
+        "button",
+        {
+          key: e.value,
+          type: "button",
+          className: p(n.item, a && n.active),
+          "data-value": e.value,
+          "data-active": a ? "true" : void 0,
+          "aria-current": a ? "page" : void 0,
+          tabIndex: i ? a ? 0 : -1 : void 0,
+          disabled: e.disabled,
+          onClick: () => {
+            var f;
+            (f = e.onClick) == null || f.call(e), v(e.value);
+          }
+        },
+        e.label,
+        b != null ? /* @__PURE__ */ l.createElement(E, { className: n.dot, tone: "accent", size: "s" }, b) : null
+      );
+    }),
+    g
+  );
+}
+export {
+  F as M
+};

package/dist/Menu.css

@@ -1 +1 @@
-@layer elcrm-components{.cmr{display:flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.cmv{flex-direction:column;align-items:stretch}.cmi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--button-color-muted);padding:var(--button-padding);border-radius:var(--button-radius);font:inherit;line-height:1;cursor:pointer;text-align:left;gap:var(--shell-gap-sm)}.cmd{flex-shrink:0;min-width:16px;height:16px;padding:0 4px;font-size:10px}.cmi>svg{display:block;flex-shrink:0}.cmi:hover{background:var(--button-background-hover);color:var(--button-color)}.cma,.cmi[aria-current=page],.cmi[data-active=true]{background:var(--button-background-selected);color:var(--button-color)}.cmu{width:100%;align-items:stretch;gap:1.25rem;padding:0;border-bottom:1px solid var(--shell-border)}.cmu .cmi{border-radius:0;background:transparent;padding:.45rem .1rem .55rem;border-bottom:2px solid transparent;margin-bottom:-1px}.cmu .cmi:hover{background:transparent;color:var(--shell-color)}.cmu .cma,.cmu .cmi[aria-current=page],.cmu .cmi[data-active=true]{background:transparent;color:var(--shell-color);border-bottom-color:var(--shell-color-accent)}}
+@layer elcrm-components{.lnr{display:flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.lnv{flex-direction:column;align-items:stretch}.lni{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--button-color-muted);padding:var(--button-padding);border-radius:var(--button-radius);font:inherit;line-height:1;cursor:pointer;text-align:left;gap:var(--shell-gap-sm)}.lnd{flex-shrink:0;min-width:1rem;height:1rem;padding:0 calc(var(--shell-gap-sm) / 2);font-size:var(--shell-status-size)}.lni>svg{display:block;flex-shrink:0}.lni:hover{background:var(--button-background-hover);color:var(--button-color)}.lna,.lni[aria-current=page],.lni[data-active=true]{background:var(--button-background-selected);color:var(--button-color)}.lnu{width:100%;align-items:stretch;gap:1.25rem;padding:0;border-bottom:1px solid var(--shell-border)}.lnu .lni{border-radius:0;background:transparent;padding:.45rem .1rem .55rem;border-bottom:2px solid transparent;margin-bottom:-1px}.lnu .lni:hover{background:transparent;color:var(--shell-color)}.lnu .lna,.lnu .lni[aria-current=page],.lnu .lni[data-active=true]{background:transparent;color:var(--shell-color);border-bottom-color:var(--shell-color-accent)}}

package/dist/Menu.d.ts

@@ -15,7 +15,7 @@ export type MenuItem = {
      * Если не задан — активность берётся из `MenuProps.value`.
      */
     active?: boolean;
-    /** Обработчик клика по пункту (дополнительно к `onSelect` меню). */
+    /** Обработчик клика по пункту (дополнительно к `onValueChange` меню). */
     onClick?: () => void;
     /** Недоступный пункт. */
     disabled?: boolean;
@@ -28,7 +28,7 @@ export type MenuItem = {
 /**
  * Props компонента {@link Menu}.
  *
- * Предпочтительный API — `items` + `value` / `onSelect`.
+ * API — `items` + `value` / `defaultValue` / `onValueChange`.
  * `children` — запасной слот для редких кастомных вставок.
  */
 export type MenuProps = Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> & {
@@ -49,42 +49,24 @@ export type MenuProps = Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> & {
      * Идентификатор — `value`, не `key`.
      */
     value?: string;
+    /** Начальный `value` (неконтролируемый режим). */
+    defaultValue?: string;
     /** Выбор пункта: получает `item.value`. */
-    onSelect?: (value: string) => void;
+    onValueChange?: (value: string) => void;
     /** Дополнительный контент внутри `<nav>` (редко). */
     children?: React.ReactNode;
 };
 /**
  * Навигационное меню в потоке документа (шапка, сайдбар-ряд) — не popover.
  *
- * Когда использовать:
- * - горизонтальная/вертикальная навигация в layout;
- * - нужно подсветить текущий раздел по `value`.
- *
- * Связанные компоненты:
- * - {@link Dropdown} — выпадающая панель рядом с триггером;
- * - {@link Popover} / {@link Dropdown} — панель в portal;
- * - {@link NavSections} / {@link TabSections} — разделы с lazy-контентом.
- *
- * API: декларативные `items` (идентификатор — `value`). Compound-слоты не используются.
- *
- * @param variant `plain` (пилюли) или `line` (черта снизу)
- *
- * CSS-токены: `--shell-*` (цвета/отступы shell-навигации).
- *
  * @example
  * ```tsx
- * const items = [
- *   { value: "home", label: "Главная" },
- *   { value: "team", label: "Команда", badge: 3 },
- * ];
- *
  * <Menu
  *   items={items}
  *   value={section}
- *   onSelect={setSection}
+ *   onValueChange={setSection}
  *   vertical
  * />
  * ```
  */
-export declare function Menu({ items, vertical, variant, value, onSelect, children, className, ...rest }: MenuProps): React.JSX.Element;
+export declare function Menu({ items, vertical, variant, value: valueProp, defaultValue, onValueChange, children, className, ...rest }: MenuProps): React.JSX.Element;

package/dist/Menu.js

@@ -1,4 +1,4 @@
-import { M as r } from "./Menu-DuXQv-zT.js";
+import { M as r } from "./Menu-D2kf7fN_.js";
 export {
   r as Menu
 };

package/dist/NavSections-CNxxBMPT.js

@@ -0,0 +1,154 @@
+import e, { useMemo as B, Suspense as D } from "react";
+import { c as F } from "./cx-CcykAxZN.js";
+import { f as M, c as O, a as P, b as j, i as A } from "./navTree-BRyaILN9.js";
+import { h as W } from "./rovingKeys-Di9N1Nct.js";
+import { u as C } from "./useControllableValue-BaE0VR5d.js";
+import { I as q } from "./Item-CGpkMJu0.js";
+import './NavSections.css';const z = "nnr", G = "nnn", H = "nng", J = "nnl", Q = "nni", T = "nna", U = "nnc", X = "nnt", Y = "nne", Z = "nns", _ = "nnf", $ = "nnm", s = {
+  root: z,
+  nav: G,
+  group: H,
+  label: J,
+  item: Q,
+  active: T,
+  cicon: U,
+  text: X,
+  expand: Y,
+  subtree: Z,
+  footer: _,
+  main: $
+};
+function ee({ className: l }) {
+  return /* @__PURE__ */ e.createElement("svg", { className: l, viewBox: "0 0 12 12", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement(
+    "path",
+    {
+      d: "M2.5 4.5 6 8l3.5-3.5",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+}
+function I({
+  items: l,
+  value: i,
+  focusValue: m,
+  open: E,
+  onSelect: v,
+  onToggle: b
+}) {
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, l.map((a) => {
+    const d = a.items, c = d != null && d.length > 0, f = c && E.includes(a.value), r = !c && a.value === i, p = a.value === (m ?? i);
+    return /* @__PURE__ */ e.createElement(e.Fragment, { key: a.value }, /* @__PURE__ */ e.createElement(
+      q,
+      {
+        as: "button",
+        active: r,
+        className: F(s.item, r && s.active),
+        "data-value": a.value,
+        "data-active": r ? "true" : void 0,
+        "data-open": f ? "true" : void 0,
+        "aria-current": r ? "page" : void 0,
+        "aria-expanded": c ? f : void 0,
+        tabIndex: p ? 0 : -1,
+        disabled: a.disabled,
+        onClick: () => {
+          c ? b(a.value) : v(a.value);
+        }
+      },
+      a.icon != null ? /* @__PURE__ */ e.createElement("span", { className: s.cicon, "aria-hidden": !0 }, a.icon) : null,
+      /* @__PURE__ */ e.createElement("span", { className: s.text }, a.label),
+      c ? /* @__PURE__ */ e.createElement(ee, { className: s.expand }) : null
+    ), c && f ? /* @__PURE__ */ e.createElement("div", { className: s.subtree }, /* @__PURE__ */ e.createElement(
+      I,
+      {
+        items: d,
+        value: i,
+        focusValue: m,
+        open: E,
+        onSelect: v,
+        onToggle: b
+      }
+    )) : null);
+  }));
+}
+function oe({
+  groups: l,
+  resolveSection: i,
+  children: m,
+  value: E,
+  defaultValue: v,
+  onValueChange: b,
+  open: a,
+  defaultOpen: d,
+  onOpenChange: c,
+  loading: f = null,
+  footer: r,
+  className: p,
+  navLabel: L = "Разделы"
+}) {
+  const S = B(
+    () => v || M(l),
+    [v, l]
+  ), [n, x] = C(
+    E,
+    S,
+    b
+  ), [u = [], N] = C(
+    a,
+    O(l, d, n),
+    c
+  ), V = P(l).map((t) => t.value), h = e.useRef(null), [R, y] = e.useState(n);
+  e.useEffect(() => {
+    n && y(n);
+  }, [n]);
+  const k = e.useRef(n);
+  e.useEffect(() => {
+    if (n == null || n === k.current) {
+      k.current = n;
+      return;
+    }
+    k.current = n;
+    const o = j(l, n).filter((w) => !u.includes(w));
+    o.length && N([...u, ...o]);
+  }, [n, l, u, N]);
+  const g = (t) => {
+    N(
+      u.includes(t) ? u.filter((o) => o !== t) : [...u, t]
+    );
+  }, K = m == null && n && i ? i(n) : null;
+  return /* @__PURE__ */ e.createElement("div", { className: F(s.root, p) }, /* @__PURE__ */ e.createElement(
+    "nav",
+    {
+      ref: h,
+      className: s.nav,
+      "aria-label": L,
+      onKeyDown: (t) => W(t, {
+        values: V,
+        value: R,
+        vertical: !0,
+        focusRoot: h.current,
+        onSelect: (o) => {
+          y(o), A(l, o) || x(o);
+        }
+      })
+    },
+    l.map((t) => /* @__PURE__ */ e.createElement("div", { key: t.value, className: s.group }, t.label != null ? /* @__PURE__ */ e.createElement("div", { className: s.label }, t.label) : null, /* @__PURE__ */ e.createElement(
+      I,
+      {
+        items: t.items,
+        value: n,
+        focusValue: R,
+        open: u,
+        onSelect: x,
+        onToggle: g
+      }
+    ))),
+    r != null ? /* @__PURE__ */ e.createElement("div", { className: s.footer }, r) : null
+  ), /* @__PURE__ */ e.createElement("div", { className: s.main }, m ?? (K ? /* @__PURE__ */ e.createElement(D, { fallback: f }, e.createElement(K)) : null)));
+}
+export {
+  oe as N
+};

package/dist/NavSections.css

@@ -1 +1 @@
-@layer elcrm-components{.cvr{display:flex;align-items:stretch;gap:var(--shell-gap-lg);width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:var(--nav-sections-padding)}.cvn{display:flex;flex-direction:column;gap:var(--shell-gap);flex:0 0 var(--nav-sections-nav-width);width:var(--nav-sections-nav-width);min-width:var(--nav-sections-nav-width);box-sizing:border-box}.cvg{display:flex;flex-direction:column;gap:2px;padding-bottom:var(--shell-gap);border-bottom:1px solid var(--shell-border)}.cvg:last-of-type{border-bottom:none;padding-bottom:0}.cvl{font-size:var(--sidebar-group-font-size);font-weight:var(--shell-font-weight);letter-spacing:.04em;text-transform:uppercase;color:var(--shell-color-muted);padding:0 var(--shell-padding-inline) var(--shell-gap-sm)}.cvi:is(button){position:relative;display:flex;width:100%;align-items:center;font-size:var(--shell-font-size-sm)}.cva:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 2px 2px 0;background:var(--shell-color-accent)}.cvi:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cvc{display:inline-flex;flex:0 0 auto;color:var(--shell-color-muted);line-height:0}.cva .cvc{color:var(--shell-color)}.cvt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cve{flex-shrink:0;width:12px;height:12px;margin-left:auto;color:var(--shell-color-muted);transition:transform .15s ease}.cvi:is(button)[data-open=true] .cve{transform:rotate(180deg);color:inherit}.cvs{display:flex;flex-direction:column;gap:2px;padding-inline-start:var(--sidebar-indent)}.cvf{margin-top:auto;padding-top:var(--shell-gap);border-top:1px solid var(--shell-border)}.cvm{flex:1 1 auto;min-width:0;max-width:var(--nav-sections-main-max-width);width:100%;min-height:0;overflow:auto}@media (max-width: 720px){.cvr{flex-direction:column}.cvn{flex:none;width:100%;min-width:0;max-width:none}}}
+@layer elcrm-components{.nnr{display:flex;align-items:stretch;gap:var(--shell-gap-lg);width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:var(--nav-sections-padding)}.nnn{display:flex;flex-direction:column;gap:var(--shell-gap);flex:0 0 var(--nav-sections-nav-width);width:var(--nav-sections-nav-width);min-width:var(--nav-sections-nav-width);box-sizing:border-box}.nng{display:flex;flex-direction:column;gap:2px;padding-bottom:var(--shell-gap);border-bottom:1px solid var(--shell-border)}.nng:last-of-type{border-bottom:none;padding-bottom:0}.nnl{font-size:var(--sidebar-group-font-size);font-weight:var(--shell-font-weight);letter-spacing:.04em;text-transform:uppercase;color:var(--shell-color-muted);padding:0 var(--shell-padding-inline) var(--shell-gap-sm)}.nni:is(button){position:relative;display:flex;width:100%;align-items:center;font-size:var(--shell-font-size-sm)}.nna:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 2px 2px 0;background:var(--shell-color-accent)}.nni:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.nnc{display:inline-flex;flex:0 0 auto;color:var(--shell-color-muted);line-height:0}.nna .nnc{color:var(--shell-color)}.nnt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nne{flex-shrink:0;width:var(--shell-status-size);height:var(--shell-status-size);margin-left:auto;color:var(--shell-color-muted);transition:transform .15s ease}.nni:is(button)[data-open=true] .nne{transform:rotate(180deg);color:inherit}.nns{display:flex;flex-direction:column;gap:2px;padding-inline-start:var(--sidebar-indent)}.nnf{margin-top:auto;padding-top:var(--shell-gap);border-top:1px solid var(--shell-border)}.nnm{flex:1 1 auto;min-width:0;max-width:var(--nav-sections-main-max-width);width:100%;min-height:0;overflow:auto}@media (max-width: 720px){.nnr{flex-direction:column}.nnn{flex:none;width:100%;min-width:0;max-width:none}}}

package/dist/NavSections.d.ts

@@ -1,31 +1,12 @@
 import { default as React } from 'react';
 import { LazyRouteChunk } from './lazyRoute';
+import { NavTreeItem } from './navTree';
 /**
  * Пункт боковой навигации {@link NavSections}.
- *
- * Идентификатор — `value` (обычно совпадает с именем файла секции).
- * Не используйте `key` как бизнес-идентификатор.
+ * База — {@link NavTreeItem} (`value` / `label` / `icon` / `items` / `defaultOpen`).
  */
-export type NavSectionsItem = {
-    /** Уникальный идентификатор раздела (не `key`). */
-    value: string;
-    /** Подпись в сайдбаре. */
-    label: React.ReactNode;
-    /** Иконка слева; нет поля — не рисуем. */
-    icon?: React.ReactNode;
-    /** Недоступный пункт. */
-    disabled?: boolean;
-    /**
-     * Вложенные пункты — есть → шеврон и раскрытие.
-     * Клик по родителю только открывает/закрывает, панель не меняем.
-     */
+export type NavSectionsItem = NavTreeItem & {
     items?: NavSectionsItem[];
-    /**
-     * Подменю открыто при первом рендере.
-     * Если выбран потомок — ветка откроется сама.
-     * @default false
-     */
-    defaultOpen?: boolean;
 };
 /**
  * Группа пунктов сайдбара (опциональный заголовок + `items`).
@@ -33,6 +14,8 @@ export type NavSectionsItem = {
  * Декларативный API: группа собирается из данных, без compound-слотов.
  */
 export type NavSectionsGroup = {
+    /** Идентификатор группы (ключ React; канон как у SidebarGroup). */
+    value: string;
     /** Подпись группы (например «Личное»). Нет — заголовок не рисуется. */
     label?: React.ReactNode;
     /** Пункты группы (`value` — идентификатор). */
@@ -42,6 +25,7 @@ export type NavSectionsGroup = {
  * Props компонента {@link NavSections}.
  *
  * Групповой UI: `groups` → внутри каждой группы декларативные `items`.
+ * Панель: `resolveSection` (lazy) **или** `children` (готовая панель).
  */
 export type NavSectionsProps = {
     /** Группы бокового меню. */
@@ -49,8 +33,14 @@ export type NavSectionsProps = {
     /**
      * Резолвер панели справа по `value`.
      * Обычно: `createLazyResolver((v) => import(\`./sections/${v}.tsx\`))`.
+     * Не нужен, если передали `children`.
+     */
+    resolveSection?: (value: string) => LazyRouteChunk | React.ComponentType;
+    /**
+     * Готовая панель без lazy (вместо `resolveSection`).
+     * Приложение само рендерит контент по `value`.
      */
-    resolveSection: (value: string) => LazyRouteChunk | React.ComponentType;
+    children?: React.ReactNode;
     /** Контролируемый активный `value`. */
     value?: string;
     /** Начальный `value` в неконтролируемом режиме. */
@@ -100,6 +90,7 @@ export type NavSectionsProps = {
  * ```tsx
  * const groups = [
  *   {
+ *     value: "docs",
  *     label: "Документация",
  *     items: [
  *       {
@@ -108,12 +99,9 @@ export type NavSectionsProps = {
  *         defaultOpen: true,
  *         items: [
  *           { value: "intro", label: "Введение" },
- *           { value: "events", label: "События", items: [
- *             { value: "evt-init", label: "VKWebAppInit" },
- *           ] },
+ *           { value: "events", label: "События" },
  *         ],
  *       },
- *       { value: "auth", label: "Авторизация VK" },
  *     ],
  *   },
  * ];
@@ -126,4 +114,4 @@ export type NavSectionsProps = {
  * />
  * ```
  */
-export declare function NavSections({ groups, resolveSection, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, loading, footer, className, navLabel, }: NavSectionsProps): React.JSX.Element;
+export declare function NavSections({ groups, resolveSection, children, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, loading, footer, className, navLabel, }: NavSectionsProps): React.JSX.Element;

package/dist/NavSections.js

@@ -1,4 +1,4 @@
-import { N as e } from "./NavSections-D6rDEtT1.js";
+import { N as e } from "./NavSections-CNxxBMPT.js";
 export {
   e as NavSections
 };

package/dist/PageHead-BfClTLrF.js

@@ -0,0 +1,31 @@
+import t from "react";
+import { c as m } from "./cx-CcykAxZN.js";
+import './PageHead.css';const d = "sdr", i = "sdk", u = "sdw", f = "sdt", p = "sdh", E = "sdn", N = "sdu", h = "sds", v = "sda", w = "sdc", e = {
+  root: d,
+  kept: i,
+  wrap: u,
+  textcol: f,
+  heading: p,
+  name: E,
+  usup: N,
+  subtitle: h,
+  actions: v,
+  children: w
+};
+function x(n) {
+  return !(n == null || n === !1 || n === "" || typeof n == "number" && n === 0 || n === "0");
+}
+function b({
+  title: n,
+  sup: s,
+  subtitle: a,
+  actions: l,
+  sticky: r,
+  className: o,
+  children: c
+}) {
+  return /* @__PURE__ */ t.createElement("div", { className: m(e.root, r && e.kept, o) }, /* @__PURE__ */ t.createElement("div", { className: e.wrap }, /* @__PURE__ */ t.createElement("div", { className: e.textcol }, /* @__PURE__ */ t.createElement("h1", { className: e.heading }, /* @__PURE__ */ t.createElement("span", { className: e.name }, n), x(s) ? /* @__PURE__ */ t.createElement("span", { className: e.usup }, s) : null), a != null ? /* @__PURE__ */ t.createElement("p", { className: e.subtitle }, a) : null), l != null ? /* @__PURE__ */ t.createElement("div", { className: e.actions }, l) : null), c != null ? /* @__PURE__ */ t.createElement("div", { className: e.children }, c) : null);
+}
+export {
+  b as P
+};

package/dist/PageHead.css

@@ -1 +1 @@
-@layer elcrm-components{.ccr{display:flex;flex-direction:column;gap:var(--shell-gap);margin:0 0 var(--shell-gap)}.cck{position:sticky;top:0;z-index:var(--shell-z);background:var(--shell-bg)}.ccw{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--shell-gap-sm)}.cct{min-width:0;max-width:36rem}.cch{margin:0;display:flex;align-items:flex-start;gap:.4em;font-size:var(--section-title-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.15}.ccn{min-width:0}.ccu{display:inline-flex;align-items:center;margin-top:.12em;font-size:.7rem;font-weight:600;line-height:1;color:var(--shell-color-muted)}.ccs{margin:var(--shell-gap-sm) 0 0;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.cca{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.ccc{display:flex;flex-direction:column;gap:var(--shell-gap);min-width:0}}
+@layer elcrm-components{.sdr{display:flex;flex-direction:column;gap:var(--shell-gap);margin:0 0 var(--shell-gap)}.sdk{position:sticky;top:0;z-index:var(--shell-z);background:var(--shell-bg)}.sdw{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--shell-gap-sm)}.sdt{min-width:0;max-width:36rem}.sdh{margin:0;display:flex;align-items:flex-start;gap:.4em;font-size:var(--section-title-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.15}.sdn{min-width:0}.sdu{display:inline-flex;align-items:center;margin-top:.12em;font-size:.7rem;font-weight:600;line-height:1;color:var(--shell-color-muted)}.sds{margin:var(--shell-gap-sm) 0 0;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.sda{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.sdc{display:flex;flex-direction:column;gap:var(--shell-gap);min-width:0}}

package/dist/PageHead.d.ts

@@ -10,7 +10,7 @@ import { default as React } from 'react';
  * ```tsx
  * <PageShell scroll>
  *   <PageHead title="Идеи" sup={<Badge size="s" tone="accent">4</Badge>} sticky>
- *     <Menu items={tabs} value={tab} onSelect={setTab} />
+ *     <Menu items={tabs} value={tab} onValueChange={setTab} />
  *   </PageHead>
  *   …
  * </PageShell>

package/dist/PageHead.js

@@ -1,4 +1,4 @@
-import { P as o } from "./PageHead-DgaJ1mXY.js";
+import { P as o } from "./PageHead-BfClTLrF.js";
 export {
   o as PageHead
 };

package/dist/PageShell-BAJges-G.js

@@ -0,0 +1,30 @@
+import e from "react";
+import { c as f } from "./cx-CcykAxZN.js";
+import './PageShell.css';const l = "spr", m = "spw", d = "spb", i = "spf", p = "spo", o = {
+  root: l,
+  wide: m,
+  body: d,
+  footer: i,
+  off: p
+};
+function w({
+  children: s,
+  className: r,
+  wide: c,
+  scroll: n = !0,
+  footer: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      ...a,
+      className: f(o.root, c && o.wide, !n && o.off, r)
+    },
+    /* @__PURE__ */ e.createElement("div", { className: o.body }, s),
+    t != null ? /* @__PURE__ */ e.createElement("div", { className: o.footer }, t) : null
+  );
+}
+export {
+  w as P
+};

package/dist/PageShell.css

@@ -1 +1 @@
-@layer elcrm-components{.ckr{flex:1 1 auto;min-height:0;height:100%;width:100%;display:flex;flex-direction:column;box-sizing:border-box;padding:var(--shell-padding);overflow:hidden}.ckw{max-width:none}.ckb{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--shell-gap)}.ckf{flex:0 0 auto;padding-top:var(--shell-gap-sm)}.cko{overflow:visible;height:auto}.cko .ckb{overflow:visible;flex:0 1 auto;min-height:auto}}
+@layer elcrm-components{.spr{flex:1 1 auto;min-height:0;height:100%;width:100%;display:flex;flex-direction:column;box-sizing:border-box;padding:var(--shell-padding);overflow:hidden}.spw{max-width:none}.spb{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--shell-gap)}.spf{flex:0 0 auto;padding-top:var(--shell-gap-sm)}.spo{overflow:visible;height:auto}.spo .spb{overflow:visible;flex:0 1 auto;min-height:auto}}

package/dist/PageShell.js

@@ -1,4 +1,4 @@
-import { P as l } from "./PageShell-D9EZiO8o.js";
+import { P as l } from "./PageShell-BAJges-G.js";
 export {
   l as PageShell
 };