elcrm 1.1.27 → 1.1.34

package/dist/index.js

@@ -2,8 +2,8 @@
 // @bun
 
 // src/index.ts
-import { readFileSync as readFileSync28 } from "fs";
-import { dirname as dirname4, join as join25 } from "path";
+import { readFileSync as readFileSync29 } from "fs";
+import { dirname as dirname4, join as join26 } from "path";
 import { fileURLToPath as fileURLToPath2 } from "url";
 
 // src/parseArgs.ts
@@ -37,7 +37,10 @@ function parseArgs(argv = process.argv.slice(2)) {
           "folder",
           "out",
           "api",
-          "web"
+          "web",
+          "access",
+          "tag",
+          "otp"
         ]);
         if (valueOpts.has(body)) {
           options[body] = next;
@@ -913,6 +916,70 @@ function rewriteImports(source) {
     hits++;
     return `import { Stack } from "@elcrm/components/Stack"`;
   });
+  next = next.replace(/\bPricingGroupItem\b/g, () => {
+    hits++;
+    return "PricingPlan";
+  });
+  next = next.replace(/import\s*\{([^}]+)\}\s*from\s*["']@elcrm\/components(?:\/Toolbar)?["']/g, (full, list) => {
+    if (!/\bapplyToolbarSize\b/.test(list))
+      return full;
+    hits++;
+    const parts = list.split(",").map((p) => p.trim()).filter((p) => p && !/\bapplyToolbarSize\b/.test(p));
+    if (parts.length === 0)
+      return "";
+    const from = /from\s*(["'][^"']+["'])/.exec(full)?.[1] ?? `"@elcrm/components"`;
+    return `import { ${parts.join(", ")} } from ${from}`;
+  });
+  next = next.replace(/\bapplyToolbarSize\s*\(\s*([^,]+)\s*,\s*[^)]+\)/g, (_m, node) => {
+    hits++;
+    return node.trim();
+  });
+  let needChatFrame = false;
+  let needChatFrameProps = false;
+  next = next.replace(/import\s*(type\s+)?\{([^}]+)\}\s*from\s*["']@elcrm\/components["']/g, (full, typeKw, list) => {
+    if (!/\bChatFrame(?:Props)?\b/.test(list))
+      return full;
+    hits++;
+    const parts = list.split(",").map((p) => p.trim()).filter(Boolean);
+    const kept = [];
+    for (const p of parts) {
+      const isType = Boolean(typeKw) || /^type\s+/.test(p);
+      const bare = p.replace(/^type\s+/, "").replace(/\s+as\s+\w+$/, "").trim();
+      if (bare === "ChatFrame") {
+        needChatFrame = true;
+        continue;
+      }
+      if (bare === "ChatFrameProps") {
+        needChatFrameProps = true;
+        continue;
+      }
+      kept.push(p);
+    }
+    if (kept.length === 0)
+      return "/* elcrm: ChatFrame \u2192 deep */";
+    const head = typeKw ? `import type { ` : `import { `;
+    return `${head}${kept.join(", ")} } from "@elcrm/components"`;
+  });
+  if (needChatFrame || needChatFrameProps) {
+    const inject = [];
+    if (needChatFrame) {
+      inject.push(`import { ChatFrame } from "@elcrm/components/ChatFrame";`);
+    }
+    if (needChatFrameProps) {
+      inject.push(`import type { ChatFrameProps } from "@elcrm/components/ChatFrame";`);
+    }
+    const block = inject.join(`
+`);
+    if (/from\s*["']@elcrm\/components/.test(next)) {
+      next = next.replace(/(from\s*["']@elcrm\/components(?:\/[^"']*)?["'];?)/, `$1
+${block}`);
+    } else {
+      next = `${block}
+${next}`;
+    }
+    next = next.replace(/\n?\/\* elcrm: ChatFrame \u2192 deep \*\/\n?/g, `
+`);
+  }
   return { next, hits };
 }
 function rewriteJsx(source) {
@@ -967,6 +1034,34 @@ function rewriteSectionOnChange(source) {
   });
   return { next, hits };
 }
+function rewriteGroupCallbacks(source) {
+  if (!/@elcrm\/components/.test(source) && !/\b(Menu|Sidebar|Dropdown|Breadcrumb|AvatarGroup|ActionGroup)\b/.test(source)) {
+    return { next: source, hits: 0 };
+  }
+  let hits = 0;
+  let next = source;
+  next = next.replace(/\bonFooterSelect=/g, () => {
+    hits++;
+    return "onFooterValueChange=";
+  });
+  next = next.replace(/\bonItemClick=/g, () => {
+    hits++;
+    return "onValueChange=";
+  });
+  next = next.replace(/\bonSelect=/g, () => {
+    hits++;
+    return "onValueChange=";
+  });
+  next = next.replace(/(<ActionGroup\b[^>]*?)\sitems=/g, (_m, pre) => {
+    hits++;
+    return `${pre} actions=`;
+  });
+  next = next.replace(/(<Sidebar\b[^>]*?)\sitems=/g, (_m, pre) => {
+    hits++;
+    return `${pre} groups=`;
+  });
+  return { next, hits };
+}
 function rewriteItemKeys(source) {
   if (!/\b(Menu|NavSections|TabSections|MenuItem|NavSectionsItem|TabSectionsItem)\b/.test(source)) {
     return { next: source, hits: 0 };
@@ -1001,6 +1096,9 @@ function rewriteComponentsTsx(source) {
   const oc = rewriteSectionOnChange(next);
   next = oc.next;
   hits += oc.hits;
+  const cb = rewriteGroupCallbacks(next);
+  next = cb.next;
+  hits += cb.hits;
   const keys = rewriteItemKeys(next);
   next = keys.next;
   hits += keys.hits;
@@ -1430,6 +1528,7 @@ function syncElcrmCss(options) {
       skippedPkgs.push(name);
     allDefs.push(...defs);
   }
+  const pkgsWithTokens = new Set(cssExports.filter((e) => e.tokens).map((e) => e.name));
   const added = {
     "theme.css": [],
     "theme-light.css": [],
@@ -1445,7 +1544,7 @@ function syncElcrmCss(options) {
       continue;
     let css = readFileSync7(file, "utf8");
     const have = existingTokenNames(css);
-    const missing = allDefs.filter((d) => d.bucket === bucket && !have.has(d.name) && !d.name.startsWith("--search-") && !TOKEN_DEPRECATED.has(d.name) && !isButtonShadowNoise(d.name, d.value));
+    const missing = allDefs.filter((d) => d.bucket === bucket && !have.has(d.name) && !d.name.startsWith("--search-") && !TOKEN_DEPRECATED.has(d.name) && !isButtonShadowNoise(d.name, d.value) && !(bucket === "geometry" && pkgsWithTokens.has(d.pkg)));
     const uniq = [];
     const seen = new Set;
     for (const d of missing) {
@@ -5071,15 +5170,158 @@ async function cmdKit(parsed) {
   process.exit(1);
 }
 
+// src/commands/publish.ts
+import { copyFileSync, existsSync as existsSync20, readFileSync as readFileSync28, unlinkSync, writeFileSync as writeFileSync12 } from "fs";
+import { join as join25, resolve as resolve13 } from "path";
+import { spawnSync as spawnSync3 } from "child_process";
+var PUBLIC_NAME = "package.public.json";
+var PKG_NAME = "package.json";
+var BACKUP_NAME = ".package.json.elcrm-publish.bak";
+async function cmdPublish(parsed) {
+  const cwd = resolve13(process.cwd(), parsed.options.dir || ".");
+  const dry = hasFlag(parsed, "dry");
+  const noCheck = hasFlag(parsed, "no-check", "noCheck");
+  const pkgPath = join25(cwd, PKG_NAME);
+  const publicPath = join25(cwd, PUBLIC_NAME);
+  const backupPath = join25(cwd, BACKUP_NAME);
+  if (!existsSync20(pkgPath)) {
+    throw new Error(`\u041D\u0435\u0442 ${PKG_NAME} \u0432 ${cwd}`);
+  }
+  if (!existsSync20(publicPath)) {
+    throw new Error(`\u041D\u0435\u0442 ${PUBLIC_NAME} \u0432 ${cwd}
+` + `\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u043C\u0430\u043D\u0438\u0444\u0435\u0441\u0442 \u0431\u0435\u0437 scripts/devDependencies \u0434\u043B\u044F npm.`);
+  }
+  const local = readPackageJson(cwd);
+  if (!local?.name || !local.version) {
+    throw new Error(`${PKG_NAME}: \u043D\u0443\u0436\u043D\u044B \u043F\u043E\u043B\u044F name \u0438 version`);
+  }
+  let pub;
+  try {
+    pub = JSON.parse(readFileSync28(publicPath, "utf8"));
+  } catch {
+    throw new Error(`${PUBLIC_NAME}: \u043D\u0435\u0432\u0430\u043B\u0438\u0434\u043D\u044B\u0439 JSON`);
+  }
+  pub.version = local.version;
+  if (typeof pub.name !== "string")
+    pub.name = local.name;
+  const access = parsed.options.access || (typeof pub.publishConfig?.access === "string" ? pub.publishConfig.access : "public");
+  console.log(`[publish] ${local.name}@${local.version}`);
+  console.log(`[publish] \u043C\u0430\u043D\u0438\u0444\u0435\u0441\u0442: ${PUBLIC_NAME} \u2192 ${PKG_NAME}`);
+  if (!noCheck && !dry) {
+    await runPreChecks(cwd, local.scripts);
+  } else if (noCheck) {
+    console.log("[publish] \u043F\u0440\u043E\u0432\u0435\u0440\u043A\u0438 \u043F\u0440\u043E\u043F\u0443\u0449\u0435\u043D\u044B (--no-check)");
+  }
+  const npmArgs = buildNpmArgs(parsed, access);
+  console.log(`[publish] npm ${npmArgs.join(" ")}`);
+  if (dry) {
+    console.log("[publish] --dry: \u043F\u043E\u0434\u043C\u0435\u043D\u0430 \u0438 publish \u043D\u0435 \u0432\u044B\u043F\u043E\u043B\u043D\u044F\u043B\u0438\u0441\u044C");
+    return;
+  }
+  const originalBytes = readFileSync28(pkgPath);
+  copyFileSync(pkgPath, backupPath);
+  const indent = detectIndent2(readFileSync28(publicPath, "utf8"));
+  writeFileSync12(pkgPath, JSON.stringify(pub, null, indent) + `
+`, "utf8");
+  let publishStatus = 1;
+  try {
+    const r = spawnSync3("npm", npmArgs, {
+      cwd,
+      stdio: "inherit",
+      env: process.env
+    });
+    publishStatus = r.status ?? 1;
+    if (r.error) {
+      console.error(r.error.message);
+    }
+  } finally {
+    writeFileSync12(pkgPath, originalBytes);
+    if (existsSync20(backupPath)) {
+      try {
+        unlinkSync(backupPath);
+      } catch {}
+    }
+    console.log(`[publish] \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D ${PKG_NAME}`);
+  }
+  if (publishStatus !== 0) {
+    process.exit(publishStatus);
+  }
+  console.log(`[publish] \u0433\u043E\u0442\u043E\u0432\u043E: ${local.name}@${local.version}`);
+}
+async function runPreChecks(cwd, scripts) {
+  const list = scripts ?? {};
+  const chain = [];
+  if (list.prepublishOnly)
+    chain.push("prepublishOnly");
+  else {
+    if (list["check:css"])
+      chain.push("check:css");
+    if (list.test)
+      chain.push("test");
+    if (list.build)
+      chain.push("build");
+  }
+  if (chain.length === 0) {
+    console.log("[publish] scripts \u0434\u043B\u044F \u043F\u0440\u043E\u0432\u0435\u0440\u043A\u0438 \u043D\u0435\u0442 \u2014 \u0441\u0440\u0430\u0437\u0443 publish");
+    return;
+  }
+  for (const script of chain) {
+    console.log(`[publish] bun run ${script}`);
+    const r = spawnSync3("bun", ["run", script], {
+      cwd,
+      stdio: "inherit",
+      env: process.env
+    });
+    if ((r.status ?? 1) !== 0) {
+      throw new Error(`\u0421\u043A\u0440\u0438\u043F\u0442 "${script}" \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u043B\u0441\u044F \u0441 \u043A\u043E\u0434\u043E\u043C ${r.status}`);
+    }
+  }
+}
+function buildNpmArgs(parsed, access) {
+  const args = ["publish", `--access=${access}`, "--ignore-scripts"];
+  if (parsed.options.tag)
+    args.push(`--tag=${parsed.options.tag}`);
+  if (parsed.options.otp)
+    args.push(`--otp=${parsed.options.otp}`);
+  const reserved = new Set([
+    "dir",
+    "access",
+    "tag",
+    "otp",
+    "dry",
+    "no-check",
+    "noCheck"
+  ]);
+  for (const [key, value] of Object.entries(parsed.options)) {
+    if (reserved.has(key))
+      continue;
+    args.push(`--${key}=${value}`);
+  }
+  for (const flag of parsed.flags) {
+    if (reserved.has(flag) || flag === "dry")
+      continue;
+    if (flag === "no-check" || flag === "noCheck")
+      continue;
+    args.push(`--${flag}`);
+  }
+  return args;
+}
+function detectIndent2(jsonText) {
+  const m = jsonText.match(/\n([ \t]+)"/);
+  if (!m?.[1])
+    return 4;
+  return m[1].includes("\t") ? 4 : m[1].length;
+}
+
 // src/index.ts
 function cliVersion() {
   const here = dirname4(fileURLToPath2(import.meta.url));
   for (const p of [
-    join25(here, "..", "package.json"),
-    join25(here, "package.json")
+    join26(here, "..", "package.json"),
+    join26(here, "package.json")
   ]) {
     try {
-      const v = JSON.parse(readFileSync28(p, "utf8")).version;
+      const v = JSON.parse(readFileSync29(p, "utf8")).version;
       if (typeof v === "string" && v)
         return v;
     } catch {}
@@ -5143,6 +5385,8 @@ function showHelp() {
   init [--template app|lib|panel|orbit] [--force] [--no-install]
   build [--client] [--url=\u2026] [--name=\u2026] [--dir=\u2026] [--folder=\u2026]
   postbuild [--dir=./dist]
+  publish [--dry] [--no-check] [--dir=\u2026] [--access=\u2026] [--tag=\u2026] [--otp=\u2026]
+      package.public.json \u2192 package.json \u2192 npm publish \u2192 \u043E\u0442\u043A\u0430\u0442
   uuid
 
 \u0424\u043B\u0430\u0433\u0438: -v/--version, -h/--help
@@ -5150,6 +5394,8 @@ function showHelp() {
 \u041F\u0440\u0438\u043C\u0435\u0440\u044B:
   elcrm doctor
   elcrm doctor --docs --test
+  elcrm publish
+  elcrm publish --dry
   elcrm update --fix --test && elcrm css && elcrm docs && elcrm cursor
   elcrm css                 # ENOENT @elcrm/\u2026/light.css \u2192 \u0441\u043D\u0438\u043C\u0435\u0442 \u0431\u0438\u0442\u044B\u0439 import
   elcrm audit
@@ -5209,6 +5455,9 @@ async function main() {
     case "kit":
       await cmdKit(parsed);
       break;
+    case "publish":
+      await cmdPublish(parsed);
+      break;
     case "uuid":
       await cmdUuid();
       break;

package/dist/vite/discover-lib.d.ts

@@ -1,6 +1,12 @@
+import type { PrefixGroups } from "./plugin-css-scoped";
+
 export type DiscoverLibOptions = {
   libDir: string;
   letterOverrides?: Record<string, string>;
+  /** Дефолтная семья; @default "c" */
+  prefix?: string;
+  prefixGroups?: PrefixGroups;
+  prefixOverrides?: Record<string, string>;
 };
 
 export type DiscoverLibResult = {

package/dist/vite/discover-lib.js

@@ -1,42 +1,90 @@
 // src/vite/discover-lib.ts
 import { existsSync, readdirSync, statSync } from "node:fs";
 import { join } from "node:path";
+
+// src/vite/css-prefix.ts
+function assertPrefixLetter(value, label) {
+  if (!/^[a-z]$/.test(value)) {
+    throw new Error(`[css-scoped] ${label} должен быть одной буквой a-z, получено: "${value}"`);
+  }
+}
+function buildPrefixMap(options) {
+  const map = {};
+  const groups = options.prefixGroups ?? {};
+  for (const [pfx, names] of Object.entries(groups)) {
+    assertPrefixLetter(pfx, `prefixGroups["${pfx}"]`);
+    if (!Array.isArray(names)) {
+      throw new Error(`[css-scoped] prefixGroups["${pfx}"] должен быть массивом имён`);
+    }
+    for (const name of names) {
+      if (map[name] != null && map[name] !== pfx) {
+        throw new Error(`[css-scoped] "${name}" в двух семьях: ${map[name]} и ${pfx}`);
+      }
+      map[name] = pfx;
+    }
+  }
+  for (const [name, pfx] of Object.entries(options.prefixOverrides ?? {})) {
+    assertPrefixLetter(pfx, `prefixOverrides["${name}"]`);
+    map[name] = pfx;
+  }
+  return map;
+}
+
+// src/vite/discover-lib.ts
+var LETTER_ALPHABET = "abcdefghijklmnopqrstuvwxyz";
 function listComponentDirs(libDir) {
   return readdirSync(libDir).filter((name) => {
     const dir = join(libDir, name);
     return statSync(dir).isDirectory() && existsSync(join(dir, "index.ts"));
   }).sort();
 }
-function assignLetters(names, overrides) {
-  const used = new Set;
+function slotFor(used, prefix) {
+  let set = used.get(prefix);
+  if (!set) {
+    set = new Set;
+    used.set(prefix, set);
+  }
+  return set;
+}
+function assignLetters(names, overrides, prefixOf) {
+  const used = new Map;
   const letters = {};
   for (const [name, letter] of Object.entries(overrides)) {
-    if (!/^[a-z0-9A-Z]$/.test(letter)) {
-      throw new Error(`[discover-lib] override "${name}" → "${letter}" (нужна a-z0-9A-Z)`);
+    if (!/^[a-z]$/.test(letter)) {
+      throw new Error(`[discover-lib] override "${name}" → "${letter}" (нужна одна буква a-z)`);
     }
-    if (used.has(letter)) {
-      throw new Error(`[discover-lib] дубль буквы "${letter}" в overrides`);
+    const pfx = prefixOf(name);
+    const slot = slotFor(used, pfx);
+    if (slot.has(letter)) {
+      throw new Error(`[discover-lib] дубль буквы "${letter}" в семье "${pfx}" (overrides)`);
     }
-    used.add(letter);
+    slot.add(letter);
     if (names.includes(name))
       letters[name] = letter;
   }
   for (const name of names) {
     if (letters[name])
       continue;
+    const slot = slotFor(used, prefixOf(name));
     const base = name.replace(/[^a-zA-Z]/g, "").toLowerCase();
-    let letter = [...base].find((c) => /[a-z]/.test(c) && !used.has(c)) ?? [..."abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ"].find((c) => !used.has(c));
+    const letter = [...base].find((c) => /[a-z]/.test(c) && !slot.has(c)) ?? [...LETTER_ALPHABET].find((c) => !slot.has(c));
     if (!letter) {
-      throw new Error(`[discover-lib] нет свободной буквы/цифры для "${name}"`);
+      throw new Error(`[discover-lib] нет свободной буквы a-z для "${name}" в семье "${prefixOf(name)}" — заведи новую семью в prefixGroups`);
     }
-    used.add(letter);
+    slot.add(letter);
     letters[name] = letter;
   }
   return letters;
 }
 function discoverLibComponents(options) {
   const names = listComponentDirs(options.libDir);
-  const letters = assignLetters(names, options.letterOverrides ?? {});
+  const defaultPrefix = options.prefix ?? "c";
+  const prefixMap = buildPrefixMap({
+    prefixGroups: options.prefixGroups,
+    prefixOverrides: options.prefixOverrides
+  });
+  const prefixOf = (name) => prefixMap[name] ?? defaultPrefix;
+  const letters = assignLetters(names, options.letterOverrides ?? {}, prefixOf);
   const entries = {
     index: join(options.libDir, "index.ts")
   };

package/dist/vite/minify-css-vars.js

@@ -269,13 +269,13 @@ function minifyCssVars(options) {
   };
 }
 export {
-  toIndex,
-  replaceCssVarToken,
-  namespaceSize,
-  minifyCssVars,
-  isVendorJsChunk,
-  encodeName,
-  collectCssVarNames,
+  allocateUnique,
   applyVarDictionary,
-  allocateUnique
+  collectCssVarNames,
+  encodeName,
+  isVendorJsChunk,
+  minifyCssVars,
+  namespaceSize,
+  replaceCssVarToken,
+  toIndex
 };

package/dist/vite/plugin-css-scoped.d.ts

@@ -1,14 +1,28 @@
 /**
  * Vite helper: короткие unique className для CSS Modules elCRM.
- * Формат: 3 символа `{prefix}{буква}{класс}`.
+ * Формат: 3 буквы `{prefix}{буква}{первая буква локального}`.
+ * В исходнике `.root` / `.icon`; в DOM `slr` / `llr`.
+ * Семьи: `prefixGroups` (буква уникальна внутри prefix).
  * @see createCssScoped
  */
+export type PrefixGroups = Record<string, string[]>;
+
+export declare function buildPrefixMap(options: {
+  prefixGroups?: PrefixGroups;
+  prefixOverrides?: Record<string, string>;
+}): Record<string, string>;
+
+/** 3-й знак scoped: первая буква локального имени (`.root` → `r`). */
+export declare function localChar(name: string): string;
+
 export type CssScopedOptions = {
-  /** Первая буква пакета (c = components, b = button, …) */
+  /** Дефолтная семья (c = chrome/components, b = button, …) */
   prefix: string;
-  /** Свой prefix у компонента, если слотов пакета не хватает */
+  /** Семьи: prefix → папки компонентов */
+  prefixGroups?: PrefixGroups;
+  /** Свой prefix у компонента (перебивает группу) */
   prefixOverrides?: Record<string, string>;
-  /** Папка компонента → одна буква */
+  /** Папка компонента → одна буква a–z */
   components: Record<string, string>;
   /** Каталог с папками компонентов (абсолютный путь) */
   libDir: string;

package/dist/vite/plugin-css-scoped.js

@@ -1,6 +1,44 @@
 // src/vite/plugin-css-scoped.ts
 import { readdirSync, readFileSync, statSync } from "node:fs";
 import { join } from "node:path";
+
+// src/vite/css-prefix.ts
+function assertPrefixLetter(value, label) {
+  if (!/^[a-z]$/.test(value)) {
+    throw new Error(`[css-scoped] ${label} должен быть одной буквой a-z, получено: "${value}"`);
+  }
+}
+function buildPrefixMap(options) {
+  const map = {};
+  const groups = options.prefixGroups ?? {};
+  for (const [pfx, names] of Object.entries(groups)) {
+    assertPrefixLetter(pfx, `prefixGroups["${pfx}"]`);
+    if (!Array.isArray(names)) {
+      throw new Error(`[css-scoped] prefixGroups["${pfx}"] должен быть массивом имён`);
+    }
+    for (const name of names) {
+      if (map[name] != null && map[name] !== pfx) {
+        throw new Error(`[css-scoped] "${name}" в двух семьях: ${map[name]} и ${pfx}`);
+      }
+      map[name] = pfx;
+    }
+  }
+  for (const [name, pfx] of Object.entries(options.prefixOverrides ?? {})) {
+    assertPrefixLetter(pfx, `prefixOverrides["${name}"]`);
+    map[name] = pfx;
+  }
+  return map;
+}
+
+// src/vite/css-local.ts
+function localChar(name) {
+  if (!/^[a-z][a-z0-9]*$/.test(name)) {
+    throw new Error(`[css-scoped] локальный класс — [a-z][a-z0-9]*: ".${name}"`);
+  }
+  return name[0];
+}
+
+// src/vite/plugin-css-scoped.ts
 var DEFAULT_MODULE_RE = /\/(?:src\/)?lib\/([^/]+)\/[^/]+\.module\.css$/;
 function listModuleCss(dir) {
   const out = [];
@@ -14,24 +52,20 @@ function listModuleCss(dir) {
   return out;
 }
 function localClasses(css) {
+  const stripped = css.replace(/\/\*[\s\S]*?\*\//g, " ");
   const set = new Set;
-  for (const m of css.matchAll(/(?:^|[,{\s>+~])\.([a-z0-9])\b/gi)) {
+  for (const m of stripped.matchAll(/(?:^|[,{\s>+~])\.([a-z][a-z0-9]*)\b/gi)) {
     set.add(m[1].toLowerCase());
   }
   return [...set];
 }
-function assertPrefix(value, label) {
-  if (!/^[a-z]$/.test(value)) {
-    throw new Error(`[css-scoped] ${label} должен быть одной буквой a-z, получено: "${value}"`);
-  }
-}
 function createCssScoped(options) {
   const prefix = options.prefix;
-  assertPrefix(prefix, "prefix");
-  const prefixOverrides = options.prefixOverrides ?? {};
-  for (const [name, pfx] of Object.entries(prefixOverrides)) {
-    assertPrefix(pfx, `prefixOverrides["${name}"]`);
-  }
+  assertPrefixLetter(prefix, "prefix");
+  const prefixMap = buildPrefixMap({
+    prefixGroups: options.prefixGroups,
+    prefixOverrides: options.prefixOverrides
+  });
   const components = options.components;
   const libDir = options.libDir;
   const modulePathRe = options.modulePathRe ?? DEFAULT_MODULE_RE;
@@ -45,23 +79,21 @@ function createCssScoped(options) {
     return m[1];
   }
   function prefixFor(component) {
-    return prefixOverrides[component] ?? prefix;
+    return prefixMap[component] ?? prefix;
   }
   function generateScopedName(name, filename) {
-    if (!/^[a-z0-9]$/.test(name)) {
-      throw new Error(`[css-scoped] локальный класс — 1 знак [a-z0-9] (scoped = 3 символа): ".${name}" (${filename})`);
-    }
+    const key = localChar(name);
     const component = componentFromFilename(filename);
     const letter = components[component];
     if (!letter) {
       throw new Error(`[css-scoped] нет буквы для компонента "${component}". Добавьте в components.`);
     }
-    if (!/^[a-z0-9A-Z]$/.test(letter)) {
-      throw new Error(`[css-scoped] ключ компонента "${component}" должен быть a-z0-9A-Z: "${letter}"`);
+    if (!/^[a-z]$/.test(letter)) {
+      throw new Error(`[css-scoped] ключ компонента "${component}" должен быть a-z: "${letter}"`);
     }
-    const scoped = `${prefixFor(component)}${letter}${name}`;
-    if (scoped.length !== 3) {
-      throw new Error(`[css-scoped] "${scoped}" ≠ 3 символа (${component}.${name})`);
+    const scoped = `${prefixFor(component)}${letter}${key}`;
+    if (!/^[a-z]{3}$/.test(scoped)) {
+      throw new Error(`[css-scoped] "${scoped}" ≠ 3 буквы a-z (${component}.${name})`);
     }
     const owner = `${component}.${name}`;
     const prev = registry.get(scoped);
@@ -77,6 +109,11 @@ function createCssScoped(options) {
   function snapshot() {
     return new Map(registry);
   }
+  function groupedNames() {
+    const fromGroups = Object.values(options.prefixGroups ?? {}).flat();
+    const fromOverrides = Object.keys(options.prefixOverrides ?? {});
+    return [...new Set([...fromGroups, ...fromOverrides])];
+  }
   function check() {
     reset();
     const folders = readdirSync(libDir).filter((n) => statSync(join(libDir, n)).isDirectory());
@@ -85,16 +122,9 @@ function createCssScoped(options) {
     if (missingMap.length) {
       throw new Error(`[css-scoped] нет буквы в components: ${missingMap.join(", ")}`);
     }
-    const unknownOverride = Object.keys(prefixOverrides).filter((n) => !mapped.has(n));
-    if (unknownOverride.length) {
-      throw new Error(`[css-scoped] prefixOverrides без компонента: ${unknownOverride.join(", ")}`);
-    }
-    const letters = Object.values(components);
-    const dupLetter = [
-      ...new Set(letters.filter((l, i) => letters.indexOf(l) !== i))
-    ];
-    if (dupLetter.length) {
-      throw new Error(`[css-scoped] дубли букв компонентов: ${dupLetter.join(", ")}`);
+    const unknownFamily = groupedNames().filter((n) => !mapped.has(n));
+    if (unknownFamily.length) {
+      throw new Error(`[css-scoped] prefixGroups/prefixOverrides без компонента: ${unknownFamily.join(", ")}`);
     }
     const namespaces = Object.entries(components).map(([name, letter]) => `${prefixFor(name)}${letter}`);
     const dupNs = [
@@ -106,20 +136,27 @@ function createCssScoped(options) {
     const files = listModuleCss(libDir);
     for (const file of files) {
       const css = readFileSync(file, "utf8");
-      const long = [
-        ...css.matchAll(/(?:^|[,{\s>+~])\.([a-z][a-z0-9]+)\b/gi)
-      ].map((m) => m[1]);
-      if (long.length) {
-        const component = componentFromFilename(file);
-        throw new Error(`[css-scoped] ${component}: класс длиннее 1 знака (${[...new Set(long)].join(", ")}). Сократи или вынеси в prefixOverrides + 1 знак.`);
-      }
-      for (const local of localClasses(css)) {
+      const locals = localClasses(css);
+      const seen = new Map;
+      for (const local of locals) {
+        const ch = localChar(local);
+        const prev = seen.get(ch);
+        if (prev && prev !== local) {
+          const component = componentFromFilename(file);
+          throw new Error(`[css-scoped] ${component}: ".${prev}" и ".${local}" дают один 3-й знак "${ch}"`);
+        }
+        seen.set(ch, local);
         generateScopedName(local, file);
       }
     }
     const snap = snapshot();
-    const extra = Object.entries(prefixOverrides).map(([n, p]) => `${n}=${p}`).join(", ");
-    console.log(`[css-scoped] OK: ${files.length} module.css, ${snap.size} классов (prefix=${prefix}${extra ? `; ${extra}` : ""})`);
+    const familyCounts = new Map;
+    for (const name of Object.keys(components)) {
+      const p = prefixFor(name);
+      familyCounts.set(p, (familyCounts.get(p) ?? 0) + 1);
+    }
+    const families = [...familyCounts.entries()].sort(([a], [b]) => a.localeCompare(b)).map(([p, n]) => `${p}:${n}`).join(", ");
+    console.log(`[css-scoped] OK: ${files.length} module.css, ${snap.size} классов (${families})`);
     return snap;
   }
   function plugin() {
@@ -148,5 +185,7 @@ function createCssScoped(options) {
   };
 }
 export {
-  createCssScoped
+  buildPrefixMap,
+  createCssScoped,
+  localChar
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "elcrm",
-  "version": "1.1.27",
-  "description": "CLI @elcrm/*: doctor --fix (порядок проекта), update, css, docs, cursor, kit, migrate",
+  "version": "1.1.34",
+  "description": "CLI @elcrm/*: doctor --fix (порядок проекта), update, css, docs, cursor, kit, migrate, publish",
   "type": "module",
   "license": "MIT",
   "author": "MaSkal <dev@elcrm.online>",

package/templates/elcrm-docs/CLI.elCRM.md

@@ -18,7 +18,7 @@ elcrm cursor
 | # | Команда | Что делает |
 | --- | --- | --- |
 | 1 | `elcrm update --fix --test` | Обновляет глобальный `elcrm` + все `@elcrm/*` в `package.json` → install → **migrate front** (API/токены/css-sanitize) → внутри `--fix` ещё раз **sync CSS** → `elcrm test` |
-| 2 | `elcrm css` | Недостающие CSS-токены → `theme.css` / `theme-light` / `theme-dark`. **Не дописывает** `--button-*-shadow: none` и снимает такие строки из `theme.css`. В `elcrm.css`: **добавляет** рабочие `@import`, **удаляет битые** (нет export/файла в установленном пакете). Затем css-sanitize |
+| 2 | `elcrm css` | Недостающие **цвета** → `theme-light` / `theme-dark`. Геометрию из пакетов с `tokens.css` **не** дублирует в `theme.css` (дефолты через `@import …/tokens.css`). **Не дописывает** `--button-*-shadow: none` и снимает такие строки. В `elcrm.css`: **добавляет** рабочие `@import`, **удаляет битые**. Затем css-sanitize |
 | 3 | `elcrm docs` | Перезаписывает `docs/*.elCRM.md` (шпаргалки пакетов) |
 | 4 | `elcrm cursor` | `.cursor/rules` + `.cursor/docs` + `AGENTS.md` для агента |
 
@@ -70,7 +70,7 @@ elcrm migrate front          # пакет (то же, что doctor --fix без
 elcrm migrate form-native    # снять prop native у @elcrm/form (не трогает pages/Auth.tsx)
 elcrm migrate native-html    # <input|textarea> → StringField/CheckField/…
 elcrm migrate css-sanitize   # осиротевшие in srgb / transparent);
-elcrm migrate components     # Block/Row → Stack, --page-* / --item-* → --shell-*
+elcrm migrate components     # Block/Row→Stack; onSelect→onValueChange; ActionGroup actions; --page-*/--item-*→--shell-*
 elcrm migrate form-tokens
 elcrm migrate form-aliases
 elcrm migrate size-sml       # size sm|md → s|m|l
@@ -111,7 +111,7 @@ minifyCssVars({ var: 2 })
 
 Короткие имена **уникальны и подряд**: `--aa`, `--ab`, `--ac`… Занятые слоты пропускаются; `--field` не затирает `--field-border`. Чанки JSZip не минифицируются (декремент `--n`). Если слотов нет — сборка падает.
 
-Также: `elcrm/vite/plugin-css-scoped` (`prefix` + `prefixOverrides`, scoped = 3 знака), `discover-lib`, `concat-css`, `check-tokens`, `postbuild`.
+Также: `elcrm/vite/plugin-css-scoped` (`prefix` + `prefixGroups`, scoped = 3 буквы a–z: `.root` → 3-й знак `r`; буква компонента уникальна внутри семьи), `discover-lib`, `concat-css`, `check-tokens`, `postbuild`.
 
 ### Прочее
 
@@ -127,6 +127,7 @@ elcrm init --template panel
 elcrm init --template orbit --force --no-install
 elcrm build --client [--url=…] [--name=…] [--dir=…] [--folder=…]
 elcrm postbuild [--dir=./dist]   # lib: склейка CSS после vite build
+elcrm publish [--dry] [--no-check]  # lib: package.public.json → npm publish → откат
 elcrm uuid
 elcrm -v / --help
 ```

package/templates/elcrm-docs/COMPONENTS.elCRM.md

@@ -3,12 +3,14 @@
 # `@elcrm/components`
 
 Shell UI: оболочка, шапка, секции, списки, Dropdown / RadioGroup / Pricing* / Avatar* / Breadcrumb / Stack.  
-**Цвета и размеры задаёт приложение** (`theme.css` + `theme-light` / `theme-dark`). Fallback в пакете нет.
+**Цвета и размеры задаёт приложение** (`theme.css` + `theme-light` / `theme-dark`). Fallback в пакете нет.  
+**Локаль:** дефолтные aria/подписи — русский; переопределяй `navLabel` / `label` / `copyLabel` / `aria-label` (без i18n-runtime в пакете).
 
 Токены как у form: сначала общие **`--shell-*`** (+ `--control-*`, `--popup-shadow`), потом узкие (`--header-height`, `--section-padding`, `--avatar-size-*`, …).  
 Дефолты подтягивает `elcrm css` из `@elcrm/components/tokens.css` + `light.css` / `dark.css`.
 
-Группы — через `items` / `groups`, идентификатор пункта — **`value`**.
+Группы — через `items` / `groups`, идентификатор пункта — **`value`**, выбор — **`onValueChange`** (+ `defaultValue` где нужно).  
+`ActionGroup` — слоты `actions` / `children`, не декларативные `items`. Sidebar — только `groups` (не alias `items`).
 
 ```ts
 import {
@@ -17,51 +19,85 @@ import {
   Card, Stat, ActionGroup, Toolbar, TextGroup, ItemColumn, List, Item, PageHead, PageShell, ChatList, ChatMessages, ChatSplit, Sidebar, Popover,
   Healthmap, PanelInfo,
   Loading, EmptyState, RadioGroup, PricingGroup, PricingTable,
-  Table, CodeBlock, SplitPane, Banner, IconButton,
+  Table, CodeBlock, SplitPane, Banner, IconButton, Text,
   createLazyResolver,
+  acquireOverlayZIndex,
 } from "@elcrm/components";
-import type { PricingPlan, HealthmapData } from "@elcrm/components";
+import type { PricingPlan, HealthmapData, NavTreeItem } from "@elcrm/components";
 ```
 
+Версия пакета: **≥ 0.5.x** (`onValueChange`, без Block/Row/Column).
+## Роли (кто когда)
+
+Не сливаем компоненты — выбирай по слою:
+
+| Слой | Компоненты | Не путать с |
+| --- | --- | --- |
+| Оболочка app | `Layout` (+ Header / Footer / Sidebar) | PageShell |
+| Каркас модуля | `PageShell` | Section |
+| Шапка страницы | `PageHead` | Section title |
+| Блок контента | `Section` (`direction` / `gap` / `columns` как у Stack) | PageHead |
+| Нав app | `Sidebar` | NavSections (страница + lazy-панель) |
+| Вкладки | `Menu variant="line"` = только табы; `TabSections` = табы + lazy-панель | |
+| Две колонки | `SplitPane` = resize; `ChatSplit` = чат без resize | |
+| Чат | `ChatList` / `ChatMessages` / `ChatSplit`; `ChatFrame` — каркас колонки | |
+| Планы | `PricingGroup` / `PricingTable`; `RadioGroup variant="split"` — radio-UI | |
+| Toolbar | `Toolbar` = фильтры; `ActionGroup` = иконки в карточке | |
+| Текст | `Text` / `TextGroup` / `AvatarName` (+аватар) | |
+| Статус | `Badge` метка; `Banner` полоса; `EmptyState` пустой экран | |
+| Таблица | `Table` = `<table>`; `PricingTable` = матрица тарифов | |
+| Раскладка | `Stack` (или `Section` с `direction`) | Block / Row / Column |
+
 ## Роли layout
 
 - **PageShell** — каркас модуля (`scroll` в body + footer). `scroll={false}` — без внутреннего скролла.
 - **ChatList** — колонка диалогов: слоты `header` / `footer`, `children` = `List` + `Item`. Токены `--chat-list-width`, `--chat-*` (алиасы `--shell-*`).
 - **ChatMessages** — колонка переписки. `bodyRef` / `onBodyScroll`. Паддинги `--chat-messages-*-padding`.
-- **ChatSplit** — ряд `list` + `messages` (`--chat-split-gap`).
+- **ChatSplit** — ряд `list` + `messages` (`--chat-split-gap`). Не `SplitPane` (нет resize).
 - **PageHead** — title + actions. `sup` — текст или Badge сразу после title (надстрочно; `0` скрыт). `sticky` — шапка прилипает к верху скролла (фон `--shell-bg`). `children` — фильтры/поиск под заголовком, отступ `--shell-gap`.
-- **Section** — блок контента / auth.
+- **Section** — блок контента / auth / подраздел. Корень по умолчанию `<section>` (не `<main>` — его даёт Layout). Тело: `direction` / `gap` / `columns` как у Stack. Ряд кнопок в `actions` — `<Stack direction="row">`.
 - **Layout / Header** — оболочка приложения. `Layout sidebar={<Sidebar />}` — ряд: меню слева + контент. `fixed={["header", "footer", "sidebar"]}` (по умолчанию) — эти слоты не скроллятся, крутится только `children`. `fixed={[]}` — поток страницы. Высота каркаса: `--layout-height` (`100dvh`).
-- **Sidebar** — левое меню. `variant="cards"` (карточки) или `"plain"` (плоский backoffice). `groups` + `value`. Подменю: у пункта `items` + `defaultOpen` (открыто/скрыто при старте). Контроль: `open` / `onOpenChange` (массив `value` родителей). Клик по родителю только раскрывает; `onSelect` — у листьев. Если выбран потомок — ветка открывается. Слоты: `brand`, `extra`, `footer`. Меню аккаунта: `footerItems` + `onFooterSelect`. Отступ вложенных: `--sidebar-indent`.
-- **NavSections** — сайдбар страницы + lazy-панель. Подменю как у Sidebar: `items` + `defaultOpen`, `open` / `onOpenChange`. Панель грузится по `value` листа (`resolveSection`). Клик по родителю только раскрывает.
-- **Stack** — ряд/колонка/сетка (`direction="row"|"column"|"grid"`). Не `Block` / `Row` / `Column`. Сетка: `auto-fit` + `--stack-grid-min`, либо `columns={4}` / `columns={["1fr", "100px", "auto"]}`. С `columns` ряды `stretch` (карточки не наезжают); в одну линию — `style={{ alignItems: "center" }}`. Не `height: 100%` у детей сетки.
+- **Sidebar** — левое меню приложения. `variant="cards"` (карточки) или `"plain"` (плоский backoffice). Только `groups` + `value` / `defaultValue` + `onValueChange`. Подменю: у пункта `items` + `defaultOpen`. Контроль раскрытия: `open` / `onOpenChange`. Клик по родителю только раскрывает; выбор — у листьев. Слоты: `brand`, `extra`, `footer`. Меню аккаунта: `footer` + `footerItems` + `onFooterValueChange` — chip + панель в цветах темы (`Dropdown tone="account"`, токены `--sidebar-account-*`). `version` под chip. Отступ вложенных: `--sidebar-indent`.
+- **NavSections** — сайдбар **страницы** + панель (не замена Sidebar в Layout). У группы обязателен `value`. Подменю как у Sidebar. Панель: `resolveSection` (lazy) **или** готовые `children`. Клик по родителю только раскрывает.
+- **TabSections** — горизонтальные вкладки + панель (`resolveSection` или `children`). Только табы без панели — `Menu variant="line"`.
+- **Stack** — ряд/колонка/сетка (`direction="row"|"column"|"grid"`). `Block` / `Row` / `Column` **удалены** из пакета → `elcrm migrate components`. Сетка: `auto-fit` + `--stack-grid-min`, либо `columns={4}` / `columns={["1fr", "100px", "auto"]}`. С `columns` ряды `stretch`; в одну линию — `style={{ alignItems: "center" }}`.
 - **Card** — курсор: `--card-pointer` (`auto` / `pointer`). Сетка Stack: `--stack-grid-min`.
 - **Stat** — метрика: `label` + `value`, `tone` как у Badge, `labelMuted`. Не собирать из `span` в приложении.
-- **Healthmap** — теплокарта дней (`data.days`). Данные грузит приложение; слоты `brandName` / `brandSub` / `unit` / `hint`. Токены `--healthmap-cell`, `--healthmap-gap`, `--healthmap-l0`…`l4`.
-- **PanelInfo** — выезд справа (шапка / body / footer). На узком экране — оверлей. Слоты: `children`, `footer`, `headerExtra`, `close`. Токены `--panel-info-width`, `--panel-info-width-min`, `--panel-info-overlay-max`, `--panel-info-backdrop`.
-- **ActionGroup** — ряд иконок в карточке / строке: `label` + `items` и/или `children`. Кнопки — `@elcrm/button`.
-- **Toolbar** — фильтры над списком. `size` (`s`/`m`/`l`, по умолчанию `s`) наследуют вложенные `*Field`, `Search`, `Button`, `Dropdown` (свой `size` важнее). `align`: `start` / `center` / `end` / `between`. `width`: `l` (100%, по умолчанию) или `s` (по контенту, не растягивать). Токены `--toolbar-gap`. Не `ActionGroup`.
+- **Healthmap** — теплокарта (`data.days`). Слоты `brandName` / `brandSub` / `unit` / `hint`; locale: `months` / `weekdays` / `locale` / `loadingLabel` / `lastYearLabel`. Токены `--healthmap-cell`, `--healthmap-gap`, `--healthmap-l0`…`l4`.
+- **PanelInfo** — выезд справа. Desktop — `aside`; узкий (`max-width: 56rem`) — `dialog` + `aria-modal`, focus trap, Escape не перебивает вложенный Popover. `open` / `defaultOpen` + `onOpenChange` (`onClose` — alias). Слоты: `children`, `footer`, `headerExtra`, `close`. Токены `--panel-info-*`.
+- **ActionGroup** — ряд иконок в карточке / строке: `label` + `actions` и/или `children` (не group-`items`). Кнопки — `@elcrm/button`.
+- **Toolbar** — фильтры над списком. `size` — токены `data-size` + `useToolbar()` (не cloneElement). Поля `@elcrm/form` ≥ 0.1.20 и `Dropdown` читают контекст. `align` / `width`. Токены `--toolbar-gap`, `--select-height` на `data-size`. Не `ActionGroup`.
+- **Popover** — portal у якоря. Канон: `trigger={(api) => <button {...api.anchorProps}>…</button>}` (без cloneElement). Узел-trigger — клик/ARIA на обёртке.
 - **TextGroup** — две строки: `title` + `description` (без аватара; с аватаром — AvatarName).
-- **Item** — строка списка. `as` button/a/li, `active`. `variant="card"` — рамка и muted-фон (идеи / тикеты / inbox). Не дублировать `.desk-row` в приложении.
+- **Text** — короткий текст. `tone="muted"` → `--shell-color-muted`. `as` — тег (`p`/`span`/…). Не `className="muted"` в приложении.
+- **Loading** — индикатор ожидания. Мин. высота: `--loading-min-height` (`min(50vh, 24rem)`).
+- **EmptyState** — заглушка / ошибка страницы. `--empty-max-width`, `--empty-padding`.
+- **Item** — строка списка. По умолчанию `<li>`; кликабельный — `as="button"` / `as="a"`. `active`. `variant="card"` — рамка и muted-фон. Не дублировать `.desk-row` в приложении.
+- **Brand** — логотип в шапке. По умолчанию `<strong>`; кликабельный — `as="button"` / `as="a"`.
 - **ItemColumn** — внутри Item: `icon` слева, столбик `title` / `description` / `footer` или `meta`, `extra` — бейджи справа сверху, `aside` — колонка справа. `unread` — жирный title. Title: `--item-column-title-size` / `--item-column-title-line` (в console = `--button-size-s` / `--button-line-height`).
-- **Table** — `<table>` в обёртке со скроллом. `layout="fixed"` для фиксированной сетки. Токены `--table-*`.
+- **Table** — `<table>` в обёртке со скроллом. `stickyHeader` — липкий thead. `layout="fixed"`. Подпись — `<caption>`. Токены `--table-*`.
+- **ChatFrame** — внутренний каркас ChatList/Messages; **не** в корневом экспорте → `@elcrm/components/ChatFrame` (`elcrm migrate components`).
 - **CodeBlock** — bar + `<pre>`, `onCopy`, `children` для подсветки. Токены `--code-block-*`.
-- **SplitPane** — две панели + drag handle. `direction`, `ratio`, `onRatioChange`, `minFirst` / `minSecond`. Не `ChatSplit` (только чат). Токены `--split-handle-*`.
+- **SplitPane** — две панели + drag handle. `direction`, `ratio` / `defaultRatio`, `onRatioChange`, `minFirst` / `minSecond`. Не `ChatSplit` (только чат). Токены `--split-handle-*`.
 - **Banner** — статусная полоса (`tone`: info / warning / danger / success). Не toast — не `Notice`.
 - **IconButton** — `name` (`Icons.Line`) + обязательный `label` + `Tooltip` по умолчанию. `tooltip={false}` без подсказки. Низкий уровень — `@elcrm/button/IconButton` (`icon` + `label`).
 
 ## Меню
 
-- **Menu** — inline-навигация в шапке. `items`: `value` + `label` + `badge` (`0` не показываем, иначе `Badge` size s). `variant="line"` — вкладки с чертой снизу (не ломать pill селекторами страницы).
-- **Dropdown** — выпадающее меню по `items`/`groups` (portal). `placement="auto"|"top"|"bottom"` — куда открывать панель (футер Sidebar — `top`). `size` — высота триггера; в `Toolbar` берётся сам.
-- **Popover** — свой попап в portal (якорь + `children`). z-index: `acquireOverlayZIndex` (тот же стек, что у form). Не `@elcrm/overlay` `Menu`. `placement` как у Dropdown: позиция по **реальной** высоте панели, не по `maxHeight` 420.
+- **Menu** — inline-навигация в шапке. `items` + `value` / `defaultValue` + `onValueChange`. `badge` (`0` скрыт). `variant="line"` — вкладки с чертой снизу.
+- **Dropdown** — выпадающее меню по `items`/`groups` (portal) + `onValueChange`. `placement="auto"|"top"|"bottom"`. `size` — высота триггера; в `Toolbar` берётся сам. `item.submenu` — только шеврон (намёк); вложенное меню — снаружи.
+- **Popover** — свой попап в portal (якорь + `children`). По умолчанию **без** `role="menu"`; меню пунктов — `Dropdown` (`role="menu"`). ARIA на триггере. z-index: `acquireOverlayZIndex`. Канон `trigger={(api) => …}`.
+- **Breadcrumb** — `items` + `separator` / `collapseAfter`. `item.dropdown` — только ↕-намёк; меню — обернуть в `Dropdown`.
+- Native `<button>` внутри chrome пакета — **внутренний primitive**; в приложении — `@elcrm/button`.
 
 ## Avatar
 
 - **Avatar** — фото / инициалы (`name` только для инициалов). Скругление: `radius={10}` или `--avatar-radius` (дефолт `999px` — круг).
 - **Badge** — метка: `tone`, `size` (`s`/`m`/`l`), `dot` (точка слева). Не Button.
 - **AvatarName** — `title` + `description` (+ `name` для инициалов). Тот же `radius`. Цвета: `--avatar-name-title-color`, `--avatar-name-description-color`.
-- **AvatarGroup** — `items` с `value` / `title` / `name` / `src`.
+- **AvatarGroup** — `items` с обязательным `value` + `title` / `name` / `src`; клик — `onValueChange(value)`.
+- **Breadcrumb** — `items` + `onValueChange(value)`; `separator`, `collapseAfter`.
+- **createLazyResolver** — кэш lazy-чанков; при ошибке загрузки слот сбрасывается; `.clear(segment?)` для retry.
 
 ## Pricing
 
@@ -79,12 +115,18 @@ import type { PricingPlan, HealthmapData } from "@elcrm/components";
 - `--popup-shadow` общий с `@elcrm/form`.
 - `elcrm css` — недостающие `--shell-*`.
 - Импорт `@elcrm/components/style.css` — опционально.
+- CSS Modules: в DOM всегда **3 буквы** `{семья}{компонент}{первая буква локального}` (короткий код, все a–z): List `.root` → `llr`, Layout `.root` → `slr`. В исходнике — слова. Семьи: `l` lists, `n` nav, `s` shell, `k` kit, `t` type, `a` avatar, `o` overlay, `g` pricing, `h` healthmap, `d` data. Не опирайся на эти className в приложении.
 
 ## Нельзя
 
 - `import "@elcrm/…/themes.css"`.
-- `Block` / `Row` / `Column` — `Stack` (`elcrm migrate components`).
+- `Block` / `Row` / `Column` — удалены; только `Stack` (или `Section` с `direction`). `elcrm migrate components`.
+- `applyToolbarSize` — удалён; размер — `useToolbar` / `data-size`.
+- `PricingGroupItem` — удалён; тип `PricingPlan`.
 - `key` / `activeKey` / `defaultActiveKey` в группах — `value` / `defaultValue` (`elcrm migrate components`).
+- `onSelect` / `onItemClick` / `onFooterSelect` у Menu / Sidebar / Dropdown / Breadcrumb / AvatarGroup — `onValueChange` / `onFooterValueChange` (`elcrm migrate components`).
+- `ActionGroup items=` — `actions=`; `Sidebar items=` (группы) — `groups=`.
+- `ChatFrame` из `@elcrm/components` — deep `@elcrm/components/ChatFrame` (`elcrm migrate components`).
 - Нативные `<button>` / инпуты вместо `@elcrm/button` / `@elcrm/form` в приложении.
 - `size="sm"|"md"` → `"s"|"m"`.
 - Хардкод цветов в модулях приложения, если есть токен.

package/templates/elcrm-docs/FORM.elCRM.md

@@ -32,7 +32,7 @@ const form = useForm({ login: "", password: "" });
 Канонические поля: `StringField`, `PasswordField`, `TextareaField`, `NumberField`, `PercentField`, `MoneyField`, `MaskField`, `PhoneField`, `EmailField`, `UrlField`, `DateField`, `TimeField`, `SelectField`, `OptionsField`, `ModalField`, `RangeField`, `CheckField`, `RadioField`, `TagsField`, `RatingField`, `CodeField`, `FileField`, `DragDropField`, `RichTextField`, `ColorField`, `HiddenField`, `DisplayField`, `SearchField`, `TabsField`.
 
 `disabled`, `size` (`"s"` | `"m"` | `"l"`) — у всех видимых `*Field` (кроме `HiddenField`).  
-В ряду фильтров — `<Toolbar size="s">` из `@elcrm/components`: вложенные поля/Search/Button берут этот `size`.
+В ряду фильтров — `<Toolbar size="s">` из `@elcrm/components` (дефолт тулбара уже `"s"`): без своего `size` поля берут размер через `useToolbar` (`@elcrm/form` ≥ 0.1.20). Явный `size` у поля важнее. `--select-height` = `var(--field-height)` — селект той же высоты, что капсула.
 
 `PasswordField`: `generate` — кнопка случайного пароля. `true` → `Az09#` (A–Z, a–z, 0–9, символы). `generate="A"` только заглавные, `"59"` цифры 5–9, `"#"` только символы. Длина — `maxLength` или 12.
 

package/templates/orbit/web/src/style/theme-dark.css

@@ -139,6 +139,17 @@ body[data-theme="dark"] {
   --sidebar-item-active: var(--shell-color);
   --sidebar-item-active-bg: var(--shell-background-selected);
   --sidebar-icon-active: var(--shell-color-accent);
+  --sidebar-account-menu-bg: var(--shell-background);
+  --sidebar-account-menu-color: var(--shell-color);
+  --sidebar-account-menu-border: var(--shell-border);
+  --sidebar-account-menu-shadow: var(--popup-shadow, var(--shell-shadow));
+  --sidebar-account-item-hover: var(--shell-background-hover);
+  --sidebar-account-item-icon: var(--shell-color-muted);
+  --sidebar-account-danger-hover: color-mix(
+    in srgb,
+    var(--shell-color-danger) 14%,
+    transparent
+  );
   --shell-background-hover: color-mix(in srgb, var(--text) 8%, transparent);
   --shell-background-selected: color-mix(in srgb, var(--accent) 14%, transparent);
   --shell-shadow: var(--shadow);

package/templates/orbit/web/src/style/theme-light.css

@@ -139,6 +139,17 @@ body[data-theme="light"] {
   --sidebar-item-active: var(--shell-color);
   --sidebar-item-active-bg: var(--shell-background-selected);
   --sidebar-icon-active: var(--shell-color-accent);
+  --sidebar-account-menu-bg: var(--shell-background);
+  --sidebar-account-menu-color: var(--shell-color);
+  --sidebar-account-menu-border: var(--shell-border);
+  --sidebar-account-menu-shadow: var(--popup-shadow, var(--shell-shadow));
+  --sidebar-account-item-hover: var(--shell-background-hover);
+  --sidebar-account-item-icon: var(--shell-color-muted);
+  --sidebar-account-danger-hover: color-mix(
+    in srgb,
+    var(--shell-color-danger) 12%,
+    transparent
+  );
   --shell-background-hover: color-mix(in srgb, var(--text) 6%, transparent);
   --shell-background-selected: color-mix(in srgb, var(--accent) 10%, transparent);
   --shell-shadow: var(--shadow);

package/templates/orbit/web/src/style/theme.css

@@ -64,6 +64,11 @@
   /* Layout: внутренний отступ и внешний margin каркаса */
   --layout-padding: 0;
   --layout-margin: 0;
+  --layout-gap: 0;
+  --layout-main-radius: 0;
+  --layout-main-background: transparent;
+  --layout-main-shadow: none;
+  --layout-main-border: none;
   /* none — на всю ширину; иначе например 1440px */
   --layout-max-width: none;
   --elcrm-z-popover: 1000;
@@ -114,6 +119,7 @@
   --item-column-icon-radius: var(--avatar-radius);
   --item-column-title-size: var(--shell-font-size);
   --item-column-title-line: 1.3;
+  --item-column-meta-size: var(--shell-font-size-sm);
   --stat-value-size: 1.75rem;
   --action-group-gap: var(--shell-gap-sm);
   --toolbar-gap: var(--shell-gap-sm);
@@ -126,6 +132,14 @@
   --sidebar-icon-size: 16px;
   --sidebar-group-font-size: 11px;
   --sidebar-indent: 14px;
+  --sidebar-account-chip-radius: 14px;
+  --sidebar-account-chip-padding: 8px;
+  --sidebar-account-chip-gap: 10px;
+  --sidebar-account-menu-radius: 18px;
+  --sidebar-account-menu-padding: 6px;
+  --sidebar-account-item-radius: 12px;
+  --sidebar-account-item-padding: 10px 12px;
+  --sidebar-account-item-gap: 12px;
   --pricing-card-min-width: 16rem;
   --pricing-table-label-width: 10rem;
   --chat-list-width: 340px;
@@ -152,6 +166,8 @@
   --table-cell-padding: 0.55rem 0.7rem;
   --table-head-font-size: 0.75rem;
   --table-code-font-size: 0.8rem;
+  --table-head-background: var(--shell-background);
+  --table-max-height: none;
   --code-block-bg: var(--shell-background);
   --code-block-bar-padding: 0.4rem 0.75rem;
   --code-block-padding: 0.85rem 1rem;
@@ -168,6 +184,9 @@
   --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));
+  --loading-min-height: min(50vh, 24rem);
+  --empty-max-width: 36rem;
+  --empty-padding: 2rem;
 }
 
 /* —— база приложения (без захардкоженных цветов) —— */

package/templates/panel/web/src/style/theme-dark.css

@@ -144,6 +144,17 @@ body[data-theme="dark"] {
   --sidebar-item-active: var(--shell-color);
   --sidebar-item-active-bg: var(--shell-background-selected);
   --sidebar-icon-active: var(--shell-color-accent);
+  --sidebar-account-menu-bg: var(--shell-background);
+  --sidebar-account-menu-color: var(--shell-color);
+  --sidebar-account-menu-border: var(--shell-border);
+  --sidebar-account-menu-shadow: var(--popup-shadow, var(--shell-shadow));
+  --sidebar-account-item-hover: var(--shell-background-hover);
+  --sidebar-account-item-icon: var(--shell-color-muted);
+  --sidebar-account-danger-hover: color-mix(
+    in srgb,
+    var(--shell-color-danger) 14%,
+    transparent
+  );
   --shell-background-hover: color-mix(in srgb, var(--text) 8%, transparent);
   --shell-background-selected: color-mix(in srgb, var(--accent) 14%, transparent);
   --shell-shadow: var(--shadow);

package/templates/panel/web/src/style/theme-light.css

@@ -144,6 +144,17 @@ body[data-theme="light"] {
   --sidebar-item-active: var(--shell-color);
   --sidebar-item-active-bg: var(--shell-background-selected);
   --sidebar-icon-active: var(--shell-color-accent);
+  --sidebar-account-menu-bg: var(--shell-background);
+  --sidebar-account-menu-color: var(--shell-color);
+  --sidebar-account-menu-border: var(--shell-border);
+  --sidebar-account-menu-shadow: var(--popup-shadow, var(--shell-shadow));
+  --sidebar-account-item-hover: var(--shell-background-hover);
+  --sidebar-account-item-icon: var(--shell-color-muted);
+  --sidebar-account-danger-hover: color-mix(
+    in srgb,
+    var(--shell-color-danger) 12%,
+    transparent
+  );
   --shell-background-hover: color-mix(in srgb, var(--text) 6%, transparent);
   --shell-background-selected: color-mix(in srgb, var(--accent) 10%, transparent);
   --shell-shadow: var(--shadow);

package/templates/panel/web/src/style/theme.css

@@ -64,6 +64,11 @@
   /* Layout: внутренний отступ и внешний margin каркаса */
   --layout-padding: 0;
   --layout-margin: 0;
+  --layout-gap: 0;
+  --layout-main-radius: 0;
+  --layout-main-background: transparent;
+  --layout-main-shadow: none;
+  --layout-main-border: none;
   /* none — на всю ширину; иначе например 1440px */
   --layout-max-width: none;
   --elcrm-z-popover: 1000;
@@ -125,6 +130,7 @@
   --item-column-icon-radius: var(--avatar-radius);
   --item-column-title-size: var(--shell-font-size);
   --item-column-title-line: 1.3;
+  --item-column-meta-size: var(--shell-font-size-sm);
   --stat-value-size: 1.75rem;
   --action-group-gap: var(--shell-gap-sm);
   --toolbar-gap: var(--shell-gap-sm);
@@ -137,6 +143,14 @@
   --sidebar-icon-size: 16px;
   --sidebar-group-font-size: 11px;
   --sidebar-indent: 14px;
+  --sidebar-account-chip-radius: 14px;
+  --sidebar-account-chip-padding: 8px;
+  --sidebar-account-chip-gap: 10px;
+  --sidebar-account-menu-radius: 18px;
+  --sidebar-account-menu-padding: 6px;
+  --sidebar-account-item-radius: 12px;
+  --sidebar-account-item-padding: 10px 12px;
+  --sidebar-account-item-gap: 12px;
   --pricing-card-min-width: 16rem;
   --pricing-table-label-width: 10rem;
   --chat-list-width: 340px;
@@ -163,6 +177,8 @@
   --table-cell-padding: 0.55rem 0.7rem;
   --table-head-font-size: 0.75rem;
   --table-code-font-size: 0.8rem;
+  --table-head-background: var(--shell-background);
+  --table-max-height: none;
   --code-block-bg: var(--shell-background);
   --code-block-bar-padding: 0.4rem 0.75rem;
   --code-block-padding: 0.85rem 1rem;
@@ -179,6 +195,9 @@
   --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));
+  --loading-min-height: min(50vh, 24rem);
+  --empty-max-width: 36rem;
+  --empty-padding: 2rem;
 }
 
 /* —— база приложения (без захардкоженных цветов) —— */