@elcrm/components 0.5.3 → 0.5.4

package/README.md

@@ -795,7 +795,7 @@ const resolve = createLazyResolver(
 **Узкие (только если нужно иначе)**
 
 ```
---layout-height / --layout-padding / --layout-margin / --layout-max-width
+--layout-height / --layout-padding / --layout-main-padding / --layout-margin / --layout-max-width
 --header-height / --header-z / --header-margin / --header-shadow / --header-radius / --header-border / --header-nav-justify
 --section-padding / --section-title-size / --section-title-size-md / --section-auth-card-max-width
 --nav-sections-padding / --nav-sections-nav-width / --nav-sections-main-max-width

package/dist/Layout.css

@@ -1 +1 @@
-@layer elcrm-components{.slr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.slx{height:var(--layout-height);max-height:var(--layout-height);overflow:hidden}.slm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}.slr:not(.slx){height:auto;max-height:none;overflow:visible}.slr:not(.slx) .slm{overflow:visible;flex:0 1 auto;min-height:auto}.sls{flex-direction:row;align-items:stretch;gap:var(--layout-gap)}.slb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--layout-main-background);border-radius:var(--layout-main-radius);box-shadow:var(--layout-main-shadow);border:var(--layout-main-border)}.slr:not(.slx) .slb{overflow:visible}.sla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width);width:var(--sidebar-width);min-width:0;min-height:0;align-self:stretch}.slk{overflow:hidden}.sla:not(.slk){overflow:auto}.sla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.sla{flex-basis:72px;width:72px}}.slh,.slf{flex:0 0 auto;min-width:0}}
+@layer elcrm-components{.slr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.slx{height:var(--layout-height);max-height:var(--layout-height);overflow:hidden}.slm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;box-sizing:border-box;padding:var(--layout-main-padding)}.slr:not(.slx){height:auto;max-height:none;overflow:visible}.slr:not(.slx) .slm{overflow:visible;flex:0 1 auto;min-height:auto}.sls{flex-direction:row;align-items:stretch;gap:var(--layout-gap)}.slb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--layout-main-background);border-radius:var(--layout-main-radius);box-shadow:var(--layout-main-shadow);border:var(--layout-main-border)}.slr:not(.slx) .slb{overflow:visible}.sla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width);width:var(--sidebar-width);min-width:0;min-height:0;align-self:stretch}.slk{overflow:hidden}.sla:not(.slk){overflow:auto}.sla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.sla{flex-basis:72px;width:72px}}.slh,.slf{flex:0 0 auto;min-width:0}}

package/dist/Layout.d.ts

@@ -26,7 +26,9 @@ export type LayoutFixedSlot = "header" | "footer" | "sidebar";
  * </Layout>
  * ```
  *
- * Токены: `--layout-height`, `--layout-padding`, `--layout-margin`, `--layout-max-width`, `--shell-*`.
+ * Токены: `--layout-height`, `--layout-padding`, `--layout-main-padding`,
+ * `--layout-margin`, `--layout-max-width`, `--shell-*`.
+ * `--layout-main-padding` — отступ внутри `<main>` (между шапкой и контентом).
  */
 export type LayoutProps = React.HTMLAttributes<HTMLDivElement> & {
     /** Левая колонка (обычно `<Sidebar />`) — ряд: сайдбар + контент */

package/dist/{Menu-D2kf7fN_.js → Menu-u0WnWjT-.js}

@@ -4,7 +4,7 @@ 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 = {
+import './Menu.css';const B = "lnr", C = "lnv", K = "lni", M = "lnd", z = "lna", D = "lnu", a = {
   root: B,
   vertical: C,
   item: K,
@@ -12,14 +12,14 @@ import './Menu.css';const B = "lnr", C = "lnv", K = "lni", M = "lnd", z = "lna",
   active: z,
   underline: D
 };
-function F({
-  items: o,
+function A({
+  items: n,
   vertical: c,
-  variant: m = "plain",
+  variant: g = "plain",
   value: r,
   defaultValue: s,
   onValueChange: u,
-  children: g,
+  children: m,
   className: R,
   ...x
 }) {
@@ -27,12 +27,12 @@ function F({
     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;
+  ), y = (n ?? []).filter((e) => !e.disabled).map((e) => e.value), k = g === "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),
+      className: p(a.root, c && a.vertical, k && a.underline, R),
       onKeyDown: i ? (e) => h(e, {
         values: y,
         value: t,
@@ -42,18 +42,19 @@ function F({
       }) : void 0,
       ...x
     },
-    o == null ? void 0 : o.map((e) => {
-      const a = e.active ?? (t != null && e.value === t), b = N(e.badge);
+    n == null ? void 0 : n.map((e) => {
+      const o = 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),
+          className: p(a.item, o && a.active),
           "data-value": e.value,
-          "data-active": a ? "true" : void 0,
-          "aria-current": a ? "page" : void 0,
-          tabIndex: i ? a ? 0 : -1 : void 0,
+          "data-active": o ? "true" : void 0,
+          "aria-current": o ? "page" : void 0,
+          "aria-label": e.ariaLabel,
+          tabIndex: i ? o ? 0 : -1 : void 0,
           disabled: e.disabled,
           onClick: () => {
             var f;
@@ -61,12 +62,12 @@ function F({
           }
         },
         e.label,
-        b != null ? /* @__PURE__ */ l.createElement(E, { className: n.dot, tone: "accent", size: "s" }, b) : null
+        b != null ? /* @__PURE__ */ l.createElement(E, { className: a.dot, tone: "accent", size: "s" }, b) : null
       );
     }),
-    g
+    m
   );
 }
 export {
-  F as M
+  A as M
 };

package/dist/Menu.d.ts

@@ -24,6 +24,11 @@ export type MenuItem = {
      * `0`, `null`, `""` — не рендерим.
      */
     badge?: number | string | null;
+    /**
+     * Подпись для скринридера, если `label` — иконка без текста.
+     * Попадает в `aria-label` кнопки пункта.
+     */
+    ariaLabel?: string;
 };
 /**
  * Props компонента {@link Menu}.

package/dist/Menu.js

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

package/dist/index.css

@@ -34,7 +34,7 @@
 
 @layer elcrm-components{.lcr{display:flex;align-items:flex-start;gap:var(--item-column-gap);min-width:0;width:100%;text-align:left}.lci{flex-shrink:0;box-sizing:border-box;width:var(--item-column-icon-size);height:var(--item-column-icon-size);border-radius:var(--item-column-icon-radius);display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--shell-color-accent) 14%,transparent);color:var(--shell-color-accent)}.lcb{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.lch{display:flex;align-items:center;gap:var(--shell-gap-sm);min-width:0}.lct{flex:1;min-width:0;margin:0;font-size:var(--item-column-title-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:var(--item-column-title-line);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lcx{flex-shrink:0;display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--shell-gap-sm)}.lcd{margin:0;font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.lcf{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm);font-size:var(--item-column-meta-size);color:var(--shell-color-muted);line-height:1.35}.lcp{opacity:.5;-webkit-user-select:none;user-select:none}.lca{flex-shrink:0;display:inline-flex;align-items:flex-start}.lcs .lct{font-size:var(--shell-font-size-sm)}.lcs .lcd{font-size:var(--item-column-meta-size)}.lcl .lct{font-size:var(--shell-font-size-lg)}.lcl .lcd{font-size:var(--shell-font-size)}.lck .lct{font-weight:700}}
 
-@layer elcrm-components{.slr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.slx{height:var(--layout-height);max-height:var(--layout-height);overflow:hidden}.slm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}.slr:not(.slx){height:auto;max-height:none;overflow:visible}.slr:not(.slx) .slm{overflow:visible;flex:0 1 auto;min-height:auto}.sls{flex-direction:row;align-items:stretch;gap:var(--layout-gap)}.slb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--layout-main-background);border-radius:var(--layout-main-radius);box-shadow:var(--layout-main-shadow);border:var(--layout-main-border)}.slr:not(.slx) .slb{overflow:visible}.sla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width);width:var(--sidebar-width);min-width:0;min-height:0;align-self:stretch}.slk{overflow:hidden}.sla:not(.slk){overflow:auto}.sla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.sla{flex-basis:72px;width:72px}}.slh,.slf{flex:0 0 auto;min-width:0}}
+@layer elcrm-components{.slr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.slx{height:var(--layout-height);max-height:var(--layout-height);overflow:hidden}.slm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;box-sizing:border-box;padding:var(--layout-main-padding)}.slr:not(.slx){height:auto;max-height:none;overflow:visible}.slr:not(.slx) .slm{overflow:visible;flex:0 1 auto;min-height:auto}.sls{flex-direction:row;align-items:stretch;gap:var(--layout-gap)}.slb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--layout-main-background);border-radius:var(--layout-main-radius);box-shadow:var(--layout-main-shadow);border:var(--layout-main-border)}.slr:not(.slx) .slb{overflow:visible}.sla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width);width:var(--sidebar-width);min-width:0;min-height:0;align-self:stretch}.slk{overflow:hidden}.sla:not(.slk){overflow:auto}.sla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.sla{flex-basis:72px;width:72px}}.slh,.slf{flex:0 0 auto;min-width:0}}
 
 @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/index.es.js

@@ -11,7 +11,7 @@ import { T as G } from "./TextGroup-236jHxdT.js";
 import { T as R } from "./Text-Bo1u7gVC.js";
 import { S as O } from "./Stat-p8j4PjrC.js";
 import { S as M, s as Z } from "./Stack-BPTehVYc.js";
-import { M as w } from "./Menu-D2kf7fN_.js";
+import { M as w } from "./Menu-u0WnWjT-.js";
 import { D } from "./Dropdown-CR_XxNak.js";
 import { B as j } from "./Breadcrumb-DM_hWw5n.js";
 import { L as J } from "./Loading-C_CKD-zt.js";

package/dist/kit-manifest.json

@@ -1,9 +1,9 @@
 {
   "format": "elcrm-kit-manifest-v1",
   "package": "@elcrm/components",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "pkg": "components",
-  "generatedAt": "2026-08-30T04:27:03.375Z",
+  "generatedAt": "2026-09-11T00:17:51.201Z",
   "components": [
     {
       "slug": "ActionGroup",

package/dist/tokens.css

@@ -34,6 +34,8 @@
   --layout-main-background: transparent;
   --layout-main-shadow: none;
   --layout-main-border: none;
+  /* padding у <main> (.slm): сверху/снизу между шапкой, контентом и футером */
+  --layout-main-padding: 0;
   /* none — без ограничения; иначе например 1440px */
   --layout-max-width: none;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elcrm/components",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "description": "Shell UI elCRM: Layout, Header, Sidebar, Popover, Healthmap, PanelInfo, PageHead, PageShell, Section, Stack, Stat и др.",
   "type": "module",
   "author": "MaSkal <dev@elcrm.online>",