elcrm 1.1.17 → 1.1.19

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

@@ -1,10 +1,13 @@
 /**
  * Vite helper: короткие unique className для CSS Modules elCRM.
+ * Формат: 3 символа `{prefix}{буква}{класс}`.
  * @see createCssScoped
  */
 export type CssScopedOptions = {
   /** Первая буква пакета (c = components, b = button, …) */
   prefix: string;
+  /** Свой prefix у компонента, если слотов пакета не хватает */
+  prefixOverrides?: Record<string, string>;
   /** Папка компонента → одна буква */
   components: Record<string, string>;
   /** Каталог с папками компонентов (абсолютный путь) */

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

@@ -15,15 +15,22 @@ function listModuleCss(dir) {
 }
 function localClasses(css) {
   const set = new Set;
-  for (const m of css.matchAll(/(?:^|[,{\s>+~])\.([a-z][a-z0-9]*)\b/gi)) {
-    set.add(m[1]);
+  for (const m of css.matchAll(/(?:^|[,{\s>+~])\.([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;
-  if (!/^[a-z]$/.test(prefix)) {
-    throw new Error(`[css-scoped] prefix должен быть одной буквой a-z, получено: "${prefix}"`);
+  assertPrefix(prefix, "prefix");
+  const prefixOverrides = options.prefixOverrides ?? {};
+  for (const [name, pfx] of Object.entries(prefixOverrides)) {
+    assertPrefix(pfx, `prefixOverrides["${name}"]`);
   }
   const components = options.components;
   const libDir = options.libDir;
@@ -37,9 +44,12 @@ function createCssScoped(options) {
     }
     return m[1];
   }
+  function prefixFor(component) {
+    return prefixOverrides[component] ?? prefix;
+  }
   function generateScopedName(name, filename) {
-    if (!/^[a-z][a-z0-9]*$/.test(name)) {
-      throw new Error(`[css-scoped] локальный класс должен быть [a-z][a-z0-9]*: ".${name}" (${filename})`);
+    if (!/^[a-z0-9]$/.test(name)) {
+      throw new Error(`[css-scoped] локальный класс — 1 знак [a-z0-9] (scoped = 3 символа): ".${name}" (${filename})`);
     }
     const component = componentFromFilename(filename);
     const letter = components[component];
@@ -49,7 +59,10 @@ function createCssScoped(options) {
     if (!/^[a-z0-9A-Z]$/.test(letter)) {
       throw new Error(`[css-scoped] ключ компонента "${component}" должен быть a-z0-9A-Z: "${letter}"`);
     }
-    const scoped = `${prefix}${letter}${name}`;
+    const scoped = `${prefixFor(component)}${letter}${name}`;
+    if (scoped.length !== 3) {
+      throw new Error(`[css-scoped] "${scoped}" ≠ 3 символа (${component}.${name})`);
+    }
     const owner = `${component}.${name}`;
     const prev = registry.get(scoped);
     if (prev && prev !== owner) {
@@ -72,6 +85,10 @@ 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))
@@ -79,15 +96,30 @@ function createCssScoped(options) {
     if (dupLetter.length) {
       throw new Error(`[css-scoped] дубли букв компонентов: ${dupLetter.join(", ")}`);
     }
+    const namespaces = Object.entries(components).map(([name, letter]) => `${prefixFor(name)}${letter}`);
+    const dupNs = [
+      ...new Set(namespaces.filter((n, i) => namespaces.indexOf(n) !== i))
+    ];
+    if (dupNs.length) {
+      throw new Error(`[css-scoped] дубли пространства {prefix}{буква}: ${dupNs.join(", ")}`);
+    }
     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)) {
         generateScopedName(local, file);
       }
     }
     const snap = snapshot();
-    console.log(`[css-scoped] OK: ${files.length} module.css, ${snap.size} классов (prefix=${prefix})`);
+    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}` : ""})`);
     return snap;
   }
   function plugin() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "elcrm",
-  "version": "1.1.17",
+  "version": "1.1.19",
   "description": "CLI @elcrm/*: doctor --fix (порядок проекта), update, css, docs, cursor, migrate",
   "type": "module",
   "license": "MIT",

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

@@ -111,7 +111,7 @@ minifyCssVars({ var: 2 })
 
 Короткие имена **уникальны и подряд**: `--aa`, `--ab`, `--ac`… Занятые слоты пропускаются; `--field` не затирает `--field-border`. Чанки JSZip не минифицируются (декремент `--n`). Если слотов нет — сборка падает.
 
-Также: `elcrm/vite/plugin-css-scoped`, `discover-lib`, `concat-css`, `check-tokens`, `postbuild`.
+Также: `elcrm/vite/plugin-css-scoped` (`prefix` + `prefixOverrides`, scoped = 3 знака), `discover-lib`, `concat-css`, `check-tokens`, `postbuild`.
 
 ### Прочее
 

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

@@ -35,8 +35,8 @@ import type { PricingPlan, HealthmapData } from "@elcrm/components";
 - **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%` у детей сетки.
 - **Card** — курсор: `--card-pointer` (`auto` / `pointer`). Сетка Stack: `--stack-grid-min`.
 - **Stat** — метрика: `label` + `value`, `tone` как у Badge, `labelMuted`. Не собирать из `span` в приложении.
-- **Healthmap** — теплокарта дней (`data.days`). Данные грузит приложение; слоты `brandName` / `brandSub` / `unit` / `hint`. Токены `--healthmap-l0`…`l4`.
-- **PanelInfo** — выезд справа (шапка / body / footer). На узком экране — оверлей. Слоты: `children`, `footer`, `headerExtra`, `close`. Токены `--panel-info-*`.
+- **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`, не нативный `<button>`.
 - **TextGroup** — две строки: `title` + `description` (без аватара; с аватаром — AvatarName).
 - **Item** — строка списка. `as` button/a/li, `active`. `variant="card"` — рамка и muted-фон (идеи / тикеты / inbox). Не дублировать `.desk-row` в приложении.

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

@@ -153,6 +153,17 @@
   --chat-messages-header-padding: 14px 16px;
   --chat-messages-body-padding: 16px 16px 20px;
   --chat-messages-footer-padding: 10px 12px 12px;
+  --panel-info-width: min(22rem, 42vw);
+  --panel-info-width-min: 16rem;
+  --panel-info-overlay-max: 24rem;
+  --panel-info-backdrop: color-mix(in srgb, var(--shell-color) 35%, transparent);
+  --healthmap-cell: 12px;
+  --healthmap-gap: 3px;
+  --healthmap-l0: var(--shell-background-muted);
+  --healthmap-l1: color-mix(in srgb, var(--shell-color-success) 25%, var(--shell-background-muted));
+  --healthmap-l2: color-mix(in srgb, var(--shell-color-success) 45%, transparent);
+  --healthmap-l3: color-mix(in srgb, var(--shell-color-success) 70%, transparent);
+  --healthmap-l4: var(--shell-color-success);
 }
 
 /* —— база приложения (без захардкоженных цветов) —— */

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

@@ -164,6 +164,17 @@
   --chat-messages-header-padding: 14px 16px;
   --chat-messages-body-padding: 16px 16px 20px;
   --chat-messages-footer-padding: 10px 12px 12px;
+  --panel-info-width: min(22rem, 42vw);
+  --panel-info-width-min: 16rem;
+  --panel-info-overlay-max: 24rem;
+  --panel-info-backdrop: color-mix(in srgb, var(--shell-color) 35%, transparent);
+  --healthmap-cell: 12px;
+  --healthmap-gap: 3px;
+  --healthmap-l0: var(--shell-background-muted);
+  --healthmap-l1: color-mix(in srgb, var(--shell-color-success) 25%, var(--shell-background-muted));
+  --healthmap-l2: color-mix(in srgb, var(--shell-color-success) 45%, transparent);
+  --healthmap-l3: color-mix(in srgb, var(--shell-color-success) 70%, transparent);
+  --healthmap-l4: var(--shell-color-success);
 }
 
 /* —— база приложения (без захардкоженных цветов) —— */