@feugene/granularity 0.48.0 → 0.50.0

package/dist/chunks/{grBadgeStyles-DV0DrAew.js → grBadgeStyles-D51AXbj5.js}

@@ -78,5 +78,61 @@ function grBadgeClass(options) {
 		toneClass(options.tone, options.dark)
 	].join(" ");
 }
+/**
+* Точка-маркер перед подписью.
+*
+* Кружок мельче иконки и растёт медленнее: маркер обязан оставаться маркером,
+* а не превращаться в третий элемент строки. Повтор значений на концах шкалы —
+* тот же приём, что у `badgeIconSizeClassBySize`.
+*/
+var badgeDotSizeClassBySize = {
+	xs: "h-1.5 w-1.5",
+	sm: "h-1.5 w-1.5",
+	md: "h-2 w-2",
+	lg: "h-2 w-2"
+};
+/** Маркер не жмётся: подпись бейджа не переносится, сжиматься нечему. */
+var badgeDotClass = "shrink-0 rounded-[var(--gr-radius-full)]";
+/**
+* Маркер на мягкой подложке красится **тем же покомпонентным слоем**, что и
+* заливка filled-бейджа, и это не экономия на токенах.
+*
+* Роль тона напрямую здесь не работает ни в одном виде, и обе ветки измерены:
+* `--gr-{tone}` в светлой теме — яркая заливка под тёмный текст, как маркер она
+* не берёт 3:1 **ни на одной** подложке (`success` 2.06–2.32, `warning`
+* 2.27–2.56); `--gr-{tone}-solid` берёт светлую тему и заваливает тёмную
+* (до 1.37). Слой `--gr-badge-{tone}-bg` как раз и означает «насыщенный вес,
+* который читается в этой теме»: `-solid` в светлой, роль тона в тёмной.
+*
+* На нём проходят все 128 пар «тон маркера × тон бейджа × тема», включая
+* одноимённую, — поэтому булев `dot` берёт тон самого бейджа, а не отдельный
+* цвет. Гейт — `__tests__/grBadgeContrast.test.ts`.
+*/
+var badgeDotToneClass = {
+	neutral: "bg-[var(--gr-badge-neutral-bg)]",
+	primary: "bg-[var(--gr-badge-primary-bg)]",
+	success: "bg-[var(--gr-badge-success-bg)]",
+	warning: "bg-[var(--gr-badge-warning-bg)]",
+	danger: "bg-[var(--gr-badge-danger-bg)]",
+	info: "bg-[var(--gr-badge-info-bg)]",
+	slate: "bg-[var(--gr-badge-slate-bg)]",
+	azure: "bg-[var(--gr-badge-azure-bg)]"
+};
+/**
+* Маркер на **заливке** — цветом текста бейджа.
+*
+* Тон здесь не годится по построению: подложка filled-бейджа сама берётся из
+* `--gr-badge-{tone}-bg`, и маркер того же тона слился бы с ней в один цвет.
+* `currentColor` равен тексту бейджа, а он поверен на AA 4.5:1 — то есть
+* заведомо проходит порог для графики.
+*/
+var badgeDotCurrentColorClass = "bg-[currentColor]";
+function badgeDotClassFor(options) {
+	return [
+		badgeDotClass,
+		badgeDotSizeClassBySize[options.size],
+		options.dark ? badgeDotCurrentColorClass : badgeDotToneClass[options.tone]
+	].join(" ");
+}
 //#endregion
-export { lightToneClassByTone as a, sizeClassBySize as c, grBadgeClass as i, toneClass as l, badgeIconSizeClassBySize as n, radiusClass as o, darkToneClassByTone as r, semiRadiusClassBySize as s, badgeIconClass as t };
+export { badgeDotToneClass as a, darkToneClassByTone as c, radiusClass as d, semiRadiusClassBySize as f, badgeDotSizeClassBySize as i, grBadgeClass as l, toneClass as m, badgeDotClassFor as n, badgeIconClass as o, sizeClassBySize as p, badgeDotCurrentColorClass as r, badgeIconSizeClassBySize as s, badgeDotClass as t, lightToneClassByTone as u };

package/dist/chunks/grBadgeStyles-D51AXbj5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grBadgeStyles-D51AXbj5.js","names":[],"sources":["../../src/components/GrBadge/grBadgeStyles.ts"],"sourcesContent":["import type { GrComponentSize } from '../shared/sizes'\n\nimport type { GrTone } from '../shared/tones'\n\nexport type GrBadgeTone = GrTone\n\n/**\n * Тон маркера — отдельным литеральным перечислением, а не `GrTone`.\n *\n * Компилятор SFC выводит рантайм-типы пропов из TypeScript, но `GrTone` это\n * `typeof GR_TONES[number]`, и развернуть его в конструкторы он не умеет. У\n * `dot?: GrTone | boolean` из объединения выживал один `Boolean`, и строковый\n * тон отбраковывался предупреждением Vue у каждого потребителя — при том, что\n * компонент работал. Литеральное объединение разрешается и даёт\n * `type: [Boolean, String]`; так же написан `showTooltip` у `GrSlider`.\n *\n * От расхождения с `GR_TONES` держит `assertDotToneCoversTones` ниже: списки\n * обязаны совпадать в обе стороны, иначе `vue-tsc` роняет сборку.\n */\nexport type GrBadgeDotTone = 'primary' | 'neutral' | 'success' | 'warning' | 'danger' | 'info' | 'slate' | 'azure'\n\ntype AssertMutual<A, B> = [A] extends [B] ? ([B] extends [A] ? true : never) : never\n\nexport const assertDotToneCoversTones: AssertMutual<GrBadgeDotTone, GrTone> = true\nexport type GrBadgeSize = GrComponentSize\nexport type GrBadgeRadius = 'square' | 'semi' | 'round'\nexport const sizeClassBySize: Record<GrBadgeSize, string> = {\n  xs: 'px-2 py-0.4 text-[length:var(--gr-control-text-2xs)] leading-[var(--gr-control-leading-2xs)]',\n  sm: 'px-2.5 py-0.5 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  md: 'px-3 py-1 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  lg: 'px-3.5 py-1.5 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n}\n/**\n * Иконка перед подписью растёт медленнее кегля: на нижних ступенях плашка\n * узкая, и иконка «один в один с текстом» разгоняла бы её по высоте.\n *\n * Своя карта, а не заимствованная у `GrChip`: у чипа фиксированная высота\n * плитки и своя шкала кегля, и совпадение значений на средних ступенях —\n * совпадение, а не общий контракт.\n */\nexport const badgeIconSizeClassBySize: Record<GrBadgeSize, string> = {\n  xs: 'h-3 w-3',\n  sm: 'h-3.5 w-3.5',\n  md: 'h-4 w-4',\n  lg: 'h-4 w-4',\n}\n\n/** Иконка не жмётся: подпись бейджа не переносится, сжиматься должно нечему. */\nexport const badgeIconClass = 'shrink-0'\n\nexport const semiRadiusClassBySize: Record<GrBadgeSize, string> = {\n  xs: 'rounded-[var(--gr-badge-semi-radius-xs,3px)]',\n  sm: 'rounded-[var(--gr-badge-semi-radius-sm,3px)]',\n  md: 'rounded-[var(--gr-badge-semi-radius-md,5px)]',\n  lg: 'rounded-[var(--gr-badge-semi-radius-lg,7px)]',\n}\nexport const lightToneClassByTone: Record<GrBadgeTone, string> = {\n  neutral: 'bg-[var(--gr-muted)] text-[var(--gr-fg)] border-[var(--gr-brd)]',\n  primary:\n    'bg-[var(--gr-accent)] text-[var(--gr-accent-fg)] border-[color-mix(in_srgb,var(--gr-primary)_30%,var(--gr-accent))]',\n  // Текст на тонированной подложке — только `-text`, никогда не насыщенный тон:\n  // `--gr-success` на `--gr-success-light` даёт 2.24:1, `-text` — 6.78:1.\n  // slate/azure ниже уже были сделаны правильно.\n  success: 'bg-[var(--gr-success-light)] text-[var(--gr-success-text)] border-[color-mix(in_srgb,var(--gr-success)_30%,var(--gr-success-light))]',\n  warning: 'bg-[var(--gr-warning-light)] text-[var(--gr-warning-text)] border-[color-mix(in_srgb,var(--gr-warning)_30%,var(--gr-warning-light))]',\n  danger: 'bg-[var(--gr-danger-light)] text-[var(--gr-danger-text)] border-[color-mix(in_srgb,var(--gr-danger)_30%,var(--gr-danger-light))]',\n  info: 'bg-[var(--gr-info-light)] text-[var(--gr-info-text)] border-[color-mix(in_srgb,var(--gr-info)_30%,var(--gr-info-light))]',\n  slate: 'bg-[var(--gr-slate-light)] text-[var(--gr-slate-text)] border-[color-mix(in_srgb,var(--gr-slate)_30%,var(--gr-slate-light))]',\n  azure: 'bg-[var(--gr-azure-light)] text-[var(--gr-azure-text)] border-[color-mix(in_srgb,var(--gr-azure)_30%,var(--gr-azure-light))]',\n}\n/**\n * Заливка filled-бейджа идёт через покомпонентный слой `--gr-badge-{tone}-*`, а\n * не напрямую из роли тона, потому что нужный вес у тем разный.\n *\n * В светлой теме `--gr-{tone}` — это яркая заливка под **тёмный** текст (`-fg`\n * там обязан быть тёмным: белый на `--gr-success` даёт 2.54:1), и filled-бейдж\n * читался как тяжёлая почти чёрная плашка. Слой уводит его на `-solid`/`-solid-fg`\n * — заливку кнопочного веса под светлый текст, ту же, что у solid-кнопок.\n * В тёмной теме пастельная заливка с тёмным текстом — штатная конвенция, и слой\n * оставляет прежние роли. Значения — `themes/{light,dark}.css`.\n */\nexport const darkToneClassByTone: Record<GrBadgeTone, string> = {\n  // Нейтральный вес — инверсия страницы, а не тон: `-solid`-роли у него нет.\n  neutral: 'bg-[var(--gr-badge-neutral-bg,var(--gr-fg))] text-[var(--gr-badge-neutral-fg,var(--gr-bg))] border-[color-mix(in_srgb,var(--gr-fg)_35%,var(--gr-brd))]',\n  primary: 'bg-[var(--gr-badge-primary-bg,var(--gr-primary-solid))] text-[var(--gr-badge-primary-fg,var(--gr-primary-solid-fg))] border-[var(--gr-badge-primary-bg,var(--gr-primary-solid))]',\n  success: 'bg-[var(--gr-badge-success-bg,var(--gr-success-solid))] text-[var(--gr-badge-success-fg,var(--gr-success-solid-fg))] border-[var(--gr-badge-success-bg,var(--gr-success-solid))]',\n  warning: 'bg-[var(--gr-badge-warning-bg,var(--gr-warning-solid))] text-[var(--gr-badge-warning-fg,var(--gr-warning-solid-fg))] border-[var(--gr-badge-warning-bg,var(--gr-warning-solid))]',\n  danger: 'bg-[var(--gr-badge-danger-bg,var(--gr-danger-solid))] text-[var(--gr-badge-danger-fg,var(--gr-danger-solid-fg))] border-[var(--gr-badge-danger-bg,var(--gr-danger-solid))]',\n  info: 'bg-[var(--gr-badge-info-bg,var(--gr-info-solid))] text-[var(--gr-badge-info-fg,var(--gr-info-solid-fg))] border-[var(--gr-badge-info-bg,var(--gr-info-solid))]',\n  slate: 'bg-[var(--gr-badge-slate-bg,var(--gr-slate-solid))] text-[var(--gr-badge-slate-fg,var(--gr-slate-solid-fg))] border-[var(--gr-badge-slate-bg,var(--gr-slate-solid))]',\n  azure: 'bg-[var(--gr-badge-azure-bg,var(--gr-azure-solid))] text-[var(--gr-badge-azure-fg,var(--gr-azure-solid-fg))] border-[var(--gr-badge-azure-bg,var(--gr-azure-solid))]',\n}\n/**\n * Экспортируются ради `GrChip`: у чипа те же три радиуса и та же палитра тонов,\n * и копия этих двух ветвлений разошлась бы с оригиналом молча. Свои у чипа\n * только размеры — он интерактивен, и цель нажатия у него не метки, а контрола.\n */\nexport function radiusClass(radius: GrBadgeRadius, size: GrBadgeSize): string {\n  if (radius === 'square')\n    return 'rounded-[var(--gr-radius-none)]'\n  if (radius === 'semi')\n    return semiRadiusClassBySize[size]\n  return 'rounded-[var(--gr-radius-full)]'\n}\nexport function toneClass(tone: GrBadgeTone, dark: boolean): string {\n  return dark ? darkToneClassByTone[tone] : lightToneClassByTone[tone]\n}\nexport function grBadgeClass(options: { tone: GrBadgeTone, dark: boolean, size: GrBadgeSize, radius: GrBadgeRadius }): string {\n  return [\n    radiusClass(options.radius, options.size),\n    sizeClassBySize[options.size],\n    toneClass(options.tone, options.dark),\n  ].join(' ')\n}\n\n/**\n * Точка-маркер перед подписью.\n *\n * Кружок мельче иконки и растёт медленнее: маркер обязан оставаться маркером,\n * а не превращаться в третий элемент строки. Повтор значений на концах шкалы —\n * тот же приём, что у `badgeIconSizeClassBySize`.\n */\nexport const badgeDotSizeClassBySize: Record<GrBadgeSize, string> = {\n  xs: 'h-1.5 w-1.5',\n  sm: 'h-1.5 w-1.5',\n  md: 'h-2 w-2',\n  lg: 'h-2 w-2',\n}\n\n/** Маркер не жмётся: подпись бейджа не переносится, сжиматься нечему. */\nexport const badgeDotClass = 'shrink-0 rounded-[var(--gr-radius-full)]'\n\n/**\n * Маркер на мягкой подложке красится **тем же покомпонентным слоем**, что и\n * заливка filled-бейджа, и это не экономия на токенах.\n *\n * Роль тона напрямую здесь не работает ни в одном виде, и обе ветки измерены:\n * `--gr-{tone}` в светлой теме — яркая заливка под тёмный текст, как маркер она\n * не берёт 3:1 **ни на одной** подложке (`success` 2.06–2.32, `warning`\n * 2.27–2.56); `--gr-{tone}-solid` берёт светлую тему и заваливает тёмную\n * (до 1.37). Слой `--gr-badge-{tone}-bg` как раз и означает «насыщенный вес,\n * который читается в этой теме»: `-solid` в светлой, роль тона в тёмной.\n *\n * На нём проходят все 128 пар «тон маркера × тон бейджа × тема», включая\n * одноимённую, — поэтому булев `dot` берёт тон самого бейджа, а не отдельный\n * цвет. Гейт — `__tests__/grBadgeContrast.test.ts`.\n */\nexport const badgeDotToneClass: Record<GrBadgeTone, string> = {\n  neutral: 'bg-[var(--gr-badge-neutral-bg)]',\n  primary: 'bg-[var(--gr-badge-primary-bg)]',\n  success: 'bg-[var(--gr-badge-success-bg)]',\n  warning: 'bg-[var(--gr-badge-warning-bg)]',\n  danger: 'bg-[var(--gr-badge-danger-bg)]',\n  info: 'bg-[var(--gr-badge-info-bg)]',\n  slate: 'bg-[var(--gr-badge-slate-bg)]',\n  azure: 'bg-[var(--gr-badge-azure-bg)]',\n}\n\n/**\n * Маркер на **заливке** — цветом текста бейджа.\n *\n * Тон здесь не годится по построению: подложка filled-бейджа сама берётся из\n * `--gr-badge-{tone}-bg`, и маркер того же тона слился бы с ней в один цвет.\n * `currentColor` равен тексту бейджа, а он поверен на AA 4.5:1 — то есть\n * заведомо проходит порог для графики.\n */\nexport const badgeDotCurrentColorClass = 'bg-[currentColor]'\n\nexport function badgeDotClassFor(options: {\n  tone: GrBadgeTone\n  dark: boolean\n  size: GrBadgeSize\n}): string {\n  return [\n    badgeDotClass,\n    badgeDotSizeClassBySize[options.size],\n    options.dark ? badgeDotCurrentColorClass : badgeDotToneClass[options.tone],\n  ].join(' ')\n}\n"],"mappings":";AA0BA,IAAa,kBAA+C;CAC1D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;AASA,IAAa,2BAAwD;CACnE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,iBAAiB;AAE9B,IAAa,wBAAqD;CAChE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AACA,IAAa,uBAAoD;CAC/D,SAAS;CACT,SACE;CAIF,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,OAAO;CACP,OAAO;AACT;;;;;;;;;;;;AAYA,IAAa,sBAAmD;CAE9D,SAAS;CACT,SAAS;CACT,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,OAAO;CACP,OAAO;AACT;;;;;;AAMA,SAAgB,YAAY,QAAuB,MAA2B;CAC5E,IAAI,WAAW,UACb,OAAO;CACT,IAAI,WAAW,QACb,OAAO,sBAAsB;CAC/B,OAAO;AACT;AACA,SAAgB,UAAU,MAAmB,MAAuB;CAClE,OAAO,OAAO,oBAAoB,QAAQ,qBAAqB;AACjE;AACA,SAAgB,aAAa,SAAiG;CAC5H,OAAO;EACL,YAAY,QAAQ,QAAQ,QAAQ,IAAI;EACxC,gBAAgB,QAAQ;EACxB,UAAU,QAAQ,MAAM,QAAQ,IAAI;CACtC,CAAC,CAAC,KAAK,GAAG;AACZ;;;;;;;;AASA,IAAa,0BAAuD;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,gBAAgB;;;;;;;;;;;;;;;;AAiB7B,IAAa,oBAAiD;CAC5D,SAAS;CACT,SAAS;CACT,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,OAAO;CACP,OAAO;AACT;;;;;;;;;AAUA,IAAa,4BAA4B;AAEzC,SAAgB,iBAAiB,SAItB;CACT,OAAO;EACL;EACA,wBAAwB,QAAQ;EAChC,QAAQ,OAAO,4BAA4B,kBAAkB,QAAQ;CACvE,CAAC,CAAC,KAAK,GAAG;AACZ"}

package/dist/chunks/{grChipStyles-DcDyxAL0.js → grChipStyles-CA9Wj1_E.js}

@@ -1,4 +1,4 @@
-import { l as toneClass, o as radiusClass } from "./grBadgeStyles-DV0DrAew.js";
+import { d as radiusClass, m as toneClass } from "./grBadgeStyles-D51AXbj5.js";
 //#region src/components/GrChip/grChipStyles.ts
 /**
 * Размеры у чипа свои, а не бейджевые.

package/dist/chunks/{grChipStyles-DcDyxAL0.js.map → grChipStyles-CA9Wj1_E.js.map}

@@ -1 +1 @@
-{"version":3,"file":"grChipStyles-DcDyxAL0.js","names":[],"sources":["../../src/components/GrChip/grChipStyles.ts"],"sourcesContent":["import type { GrBadgeRadius, GrBadgeTone } from '../GrBadge/grBadgeStyles'\nimport { radiusClass, toneClass } from '../GrBadge/grBadgeStyles'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nexport type GrChipTone = GrBadgeTone\nexport type GrChipSize = GrComponentSize\nexport type GrChipRadius = GrBadgeRadius\n\n/**\n * Размеры у чипа свои, а не бейджевые.\n *\n * Шкал кегля в пакете две: контрольная `xs…lg` (12/13/14/16) у полей и мельче\n * `3xs…md` (10/11/12/14) у метки — `GrBadge`, `GrTooltip`. Чип берёт\n * контрольную: по нему кликают, и цель нажатия обязана совпадать с соседним\n * контролом, а не с подписью. Отсюда же явная высота — у метки её нет вовсе,\n * а у цели нажатия она и есть главное.\n *\n * Тона и радиусы при этом переиспользуются у `GrBadge` без изменений: чип\n * должен стоять с бейджем в одном ряду и не расходиться с ним по цвету.\n */\nexport const chipSizeClassBySize: Record<GrChipSize, string> = {\n  xs: 'h-6 gap-1 px-2 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'h-7 gap-1 px-2.5 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'h-8 gap-1.5 px-3 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n  lg: 'h-9 gap-1.5 px-3.5 text-[length:var(--gr-control-text-lg)] leading-[var(--gr-control-leading-lg)]',\n}\n\n/** Крестик и иконка не растут вместе с кеглем один в один — плитка бы разъехалась. */\nexport const chipIconSizeClassBySize: Record<GrChipSize, string> = {\n  xs: 'h-3 w-3',\n  sm: 'h-3.5 w-3.5',\n  md: 'h-4 w-4',\n  lg: 'h-4 w-4',\n}\n\nexport const chipRootClass = 'inline-flex max-w-full items-center border align-middle whitespace-nowrap'\n\n/** Подпись жмётся, а не ломает ряд: чип с длинным тегом не должен рвать раскладку. */\nexport const chipLabelClass = 'min-w-0 truncate'\n\nexport const chipInteractiveClass = 'cursor-pointer transition-colors duration-[var(--gr-duration-fast)] ease-[var(--gr-ease-out)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-offset-1 focus-visible:ring-offset-[var(--gr-bg)]'\n\n/**\n * Disabled гасится токеном фона, а не `opacity`: прозрачность разбавляет\n * выверенные на AA токены текста и роняет контраст (`library-conventions.md`).\n */\nexport const chipDisabledClass = 'cursor-not-allowed bg-[var(--gr-chip-disabled-bg,var(--gr-muted))] text-[var(--gr-chip-disabled-fg,var(--gr-disabled-fg))] border-[var(--gr-chip-disabled-brd,var(--gr-brd))]'\n\n/**\n * Выбранный чип берёт **плотный** вариант своего тона, а не оттенок соседнего.\n *\n * Тон остаётся тем же — иначе набор фильтров превратился бы в радугу, — но\n * меняется вес заливки: светлая подложка сменяется насыщенной, как у\n * filled-бейджа. Это перепад светлоты, а не оттенка, поэтому различие\n * переживает и монохром, и дальтонизм.\n *\n * Одной заливки всё же мало: **`font-600` остаётся вторым, нецветовым\n * каналом** (WCAG 1.4.1). Он же вытягивает случай, когда потребитель поставил\n * `dark` всему набору и заливка у выбранного и невыбранного совпадает.\n */\nexport const chipSelectedClass = 'font-600'\n\n/** Крестик наследует цвет тона: своей роли у него нет, он часть плитки. */\nexport const chipCloseClass = 'shrink-0 inline-flex items-center justify-center rounded-[var(--gr-radius-full)] text-current transition-colors duration-[var(--gr-duration-fast)] ease-[var(--gr-ease-out)] hover:bg-[color-mix(in_srgb,currentColor_18%,transparent)]'\n\n/**\n * Крестик-кнопка стоит в таб-порядке и обязана показывать фокус сама: она\n * появляется только там, где чип не виджет, то есть кольца на корне нет.\n */\nexport const chipCloseButtonClass = `${chipCloseClass} cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]`\n\nexport const chipIconClass = 'shrink-0'\n\nexport function grChipClass(options: {\n  tone: GrChipTone\n  dark: boolean\n  size: GrChipSize\n  radius: GrChipRadius\n  interactive: boolean\n  selected: boolean\n  disabled: boolean\n}): string {\n  return [\n    chipRootClass,\n    radiusClass(options.radius, options.size),\n    chipSizeClassBySize[options.size],\n    // Выбор поднимает вес заливки до плотного варианта того же тона.\n    options.disabled ? chipDisabledClass : toneClass(options.tone, options.dark || options.selected),\n    options.interactive && !options.disabled ? chipInteractiveClass : '',\n    options.selected ? chipSelectedClass : '',\n  ].filter(Boolean).join(' ')\n}\n\n/**\n * Ступень чипа, равная по кеглю ступени бейджа.\n *\n * Нужна там, где чип заменил собой бейдж внутри контрола (`GrInputTag`,\n * `GrAutocomplete`, `GrSelect`): проп `tagSize` у них публичный, и `md` обязан\n * означать для потребителя то же, что означал. Шкалы сдвинуты на ступень —\n * бейдж `md` это 13px, а чип 13px — это `sm`.\n */\nexport function chipSizeForBadgeScale(size: GrChipSize): GrChipSize {\n  const byBadgeStep: Record<GrChipSize, GrChipSize> = { xs: 'xs', sm: 'xs', md: 'sm', lg: 'md' }\n\n  return byBadgeStep[size]\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,IAAa,sBAAkD;CAC7D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,0BAAsD;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,gBAAgB;;AAG7B,IAAa,iBAAiB;AAE9B,IAAa,uBAAuB;;;;;AAMpC,IAAa,oBAAoB;;;;;;;;;;;;;AAcjC,IAAa,oBAAoB;;AAGjC,IAAa,iBAAiB;;;;;AAM9B,IAAa,uBAAuB,GAAG,eAAe;AAEtD,IAAa,gBAAgB;AAE7B,SAAgB,YAAY,SAQjB;CACT,OAAO;EACL;EACA,YAAY,QAAQ,QAAQ,QAAQ,IAAI;EACxC,oBAAoB,QAAQ;EAE5B,QAAQ,WAAW,oBAAoB,UAAU,QAAQ,MAAM,QAAQ,QAAQ,QAAQ,QAAQ;EAC/F,QAAQ,eAAe,CAAC,QAAQ,WAAW,uBAAuB;EAClE,QAAQ,WAAW,oBAAoB;CACzC,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC5B;;;;;;;;;AAUA,SAAgB,sBAAsB,MAA8B;CAGlE,OAAO;EAF+C,IAAI;EAAM,IAAI;EAAM,IAAI;EAAM,IAAI;CAEjF,EAAY;AACrB"}
+{"version":3,"file":"grChipStyles-CA9Wj1_E.js","names":[],"sources":["../../src/components/GrChip/grChipStyles.ts"],"sourcesContent":["import type { GrBadgeRadius, GrBadgeTone } from '../GrBadge/grBadgeStyles'\nimport { radiusClass, toneClass } from '../GrBadge/grBadgeStyles'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nexport type GrChipTone = GrBadgeTone\nexport type GrChipSize = GrComponentSize\nexport type GrChipRadius = GrBadgeRadius\n\n/**\n * Размеры у чипа свои, а не бейджевые.\n *\n * Шкал кегля в пакете две: контрольная `xs…lg` (12/13/14/16) у полей и мельче\n * `3xs…md` (10/11/12/14) у метки — `GrBadge`, `GrTooltip`. Чип берёт\n * контрольную: по нему кликают, и цель нажатия обязана совпадать с соседним\n * контролом, а не с подписью. Отсюда же явная высота — у метки её нет вовсе,\n * а у цели нажатия она и есть главное.\n *\n * Тона и радиусы при этом переиспользуются у `GrBadge` без изменений: чип\n * должен стоять с бейджем в одном ряду и не расходиться с ним по цвету.\n */\nexport const chipSizeClassBySize: Record<GrChipSize, string> = {\n  xs: 'h-6 gap-1 px-2 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'h-7 gap-1 px-2.5 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'h-8 gap-1.5 px-3 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n  lg: 'h-9 gap-1.5 px-3.5 text-[length:var(--gr-control-text-lg)] leading-[var(--gr-control-leading-lg)]',\n}\n\n/** Крестик и иконка не растут вместе с кеглем один в один — плитка бы разъехалась. */\nexport const chipIconSizeClassBySize: Record<GrChipSize, string> = {\n  xs: 'h-3 w-3',\n  sm: 'h-3.5 w-3.5',\n  md: 'h-4 w-4',\n  lg: 'h-4 w-4',\n}\n\nexport const chipRootClass = 'inline-flex max-w-full items-center border align-middle whitespace-nowrap'\n\n/** Подпись жмётся, а не ломает ряд: чип с длинным тегом не должен рвать раскладку. */\nexport const chipLabelClass = 'min-w-0 truncate'\n\nexport const chipInteractiveClass = 'cursor-pointer transition-colors duration-[var(--gr-duration-fast)] ease-[var(--gr-ease-out)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-offset-1 focus-visible:ring-offset-[var(--gr-bg)]'\n\n/**\n * Disabled гасится токеном фона, а не `opacity`: прозрачность разбавляет\n * выверенные на AA токены текста и роняет контраст (`library-conventions.md`).\n */\nexport const chipDisabledClass = 'cursor-not-allowed bg-[var(--gr-chip-disabled-bg,var(--gr-muted))] text-[var(--gr-chip-disabled-fg,var(--gr-disabled-fg))] border-[var(--gr-chip-disabled-brd,var(--gr-brd))]'\n\n/**\n * Выбранный чип берёт **плотный** вариант своего тона, а не оттенок соседнего.\n *\n * Тон остаётся тем же — иначе набор фильтров превратился бы в радугу, — но\n * меняется вес заливки: светлая подложка сменяется насыщенной, как у\n * filled-бейджа. Это перепад светлоты, а не оттенка, поэтому различие\n * переживает и монохром, и дальтонизм.\n *\n * Одной заливки всё же мало: **`font-600` остаётся вторым, нецветовым\n * каналом** (WCAG 1.4.1). Он же вытягивает случай, когда потребитель поставил\n * `dark` всему набору и заливка у выбранного и невыбранного совпадает.\n */\nexport const chipSelectedClass = 'font-600'\n\n/** Крестик наследует цвет тона: своей роли у него нет, он часть плитки. */\nexport const chipCloseClass = 'shrink-0 inline-flex items-center justify-center rounded-[var(--gr-radius-full)] text-current transition-colors duration-[var(--gr-duration-fast)] ease-[var(--gr-ease-out)] hover:bg-[color-mix(in_srgb,currentColor_18%,transparent)]'\n\n/**\n * Крестик-кнопка стоит в таб-порядке и обязана показывать фокус сама: она\n * появляется только там, где чип не виджет, то есть кольца на корне нет.\n */\nexport const chipCloseButtonClass = `${chipCloseClass} cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]`\n\nexport const chipIconClass = 'shrink-0'\n\nexport function grChipClass(options: {\n  tone: GrChipTone\n  dark: boolean\n  size: GrChipSize\n  radius: GrChipRadius\n  interactive: boolean\n  selected: boolean\n  disabled: boolean\n}): string {\n  return [\n    chipRootClass,\n    radiusClass(options.radius, options.size),\n    chipSizeClassBySize[options.size],\n    // Выбор поднимает вес заливки до плотного варианта того же тона.\n    options.disabled ? chipDisabledClass : toneClass(options.tone, options.dark || options.selected),\n    options.interactive && !options.disabled ? chipInteractiveClass : '',\n    options.selected ? chipSelectedClass : '',\n  ].filter(Boolean).join(' ')\n}\n\n/**\n * Ступень чипа, равная по кеглю ступени бейджа.\n *\n * Нужна там, где чип заменил собой бейдж внутри контрола (`GrInputTag`,\n * `GrAutocomplete`, `GrSelect`): проп `tagSize` у них публичный, и `md` обязан\n * означать для потребителя то же, что означал. Шкалы сдвинуты на ступень —\n * бейдж `md` это 13px, а чип 13px — это `sm`.\n */\nexport function chipSizeForBadgeScale(size: GrChipSize): GrChipSize {\n  const byBadgeStep: Record<GrChipSize, GrChipSize> = { xs: 'xs', sm: 'xs', md: 'sm', lg: 'md' }\n\n  return byBadgeStep[size]\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,IAAa,sBAAkD;CAC7D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,0BAAsD;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,gBAAgB;;AAG7B,IAAa,iBAAiB;AAE9B,IAAa,uBAAuB;;;;;AAMpC,IAAa,oBAAoB;;;;;;;;;;;;;AAcjC,IAAa,oBAAoB;;AAGjC,IAAa,iBAAiB;;;;;AAM9B,IAAa,uBAAuB,GAAG,eAAe;AAEtD,IAAa,gBAAgB;AAE7B,SAAgB,YAAY,SAQjB;CACT,OAAO;EACL;EACA,YAAY,QAAQ,QAAQ,QAAQ,IAAI;EACxC,oBAAoB,QAAQ;EAE5B,QAAQ,WAAW,oBAAoB,UAAU,QAAQ,MAAM,QAAQ,QAAQ,QAAQ,QAAQ;EAC/F,QAAQ,eAAe,CAAC,QAAQ,WAAW,uBAAuB;EAClE,QAAQ,WAAW,oBAAoB;CACzC,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC5B;;;;;;;;;AAUA,SAAgB,sBAAsB,MAA8B;CAGlE,OAAO;EAF+C,IAAI;EAAM,IAAI;EAAM,IAAI;EAAM,IAAI;CAEjF,EAAY;AACrB"}

package/dist/chunks/{grPopoverStyles-CYAeO3Ov.js → grPopoverStyles-CncEkiPu.js}

@@ -1,4 +1,4 @@
-import { t as overlayPanelSurfaceClass } from "./overlayPanelSurface-BKeMhRx4.js";
+import { n as overlayPanelSurfaceClass } from "./overlayTransition-C0FDMx7Q.js";
 //#region src/components/shared/overlayOrigin.ts
 /**
 * `transform-origin` для scale-анимации всплывающей панели.

package/dist/chunks/{grPopoverStyles-CYAeO3Ov.js.map → grPopoverStyles-CncEkiPu.js.map}

@@ -1 +1 @@
-{"version":3,"file":"grPopoverStyles-CYAeO3Ov.js","names":[],"sources":["../../src/components/shared/overlayOrigin.ts","../../src/components/GrPopover/grPopoverStyles.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/dom'\n\n/**\n * `transform-origin` для scale-анимации всплывающей панели.\n *\n * Ключ — `resolvedPlacement`, то есть положение **после** `flip`: если снизу не\n * хватило места и панель перевернуло вверх, origin переворачивается вместе с\n * ней. Координаты панели к этому моменту уже посчитал `useFloating`, здесь\n * остаётся только направление роста относительно триггера.\n *\n * До выноса карта существовала копиями в `GrPopover` и `GrDropdown` — двенадцать\n * записей, совпадавших дословно, вместе с комментарием об одном и том же.\n *\n * Отдельным модулем от поверхности намеренно: списки выбора берут поверхность,\n * но своей анимации роста не имеют, и импорт соседа затащил бы им в чанк восемь\n * классов, которыми они не пользуются. Гейт `src/__tests__/safelist.test.ts`\n * назвал бы их поимённо — и был бы прав.\n *\n * Модуль безадресный: в `dist` он уезжает в общий чанк, который пресет не\n * сканирует, поэтому каждый потребитель объявляет эти классы в своём `safelist.ts`.\n */\nexport const overlayOriginClassByPlacement: Record<Placement, string> = {\n  'bottom-start': 'origin-top-left',\n  'bottom-end': 'origin-top-right',\n  'bottom': 'origin-top',\n  'top-start': 'origin-bottom-left',\n  'top-end': 'origin-bottom-right',\n  'top': 'origin-bottom',\n  'left-start': 'origin-top-right',\n  'left-end': 'origin-bottom-right',\n  'left': 'origin-right',\n  'right-start': 'origin-top-left',\n  'right-end': 'origin-bottom-left',\n  'right': 'origin-left',\n}\n\nexport function overlayOriginClass(placement: Placement): string {\n  return overlayOriginClassByPlacement[placement] ?? 'origin-top'\n}\n","import type { Placement } from '@floating-ui/dom'\n\nimport { overlayOriginClass } from '../shared/overlayOrigin'\nimport { overlayPanelSurfaceClass } from '../shared/overlayPanelSurface'\nimport type { GrComponentSize } from '../shared/sizes'\n\nexport type GrPopoverSize = GrComponentSize\n\n/**\n * Роль панели.\n *\n * `dialog` — произвольный интерактивный контент (значение по умолчанию).\n * Остальные нужны компонентам, которые строятся поверх этого примитива:\n * меню (`GrMenu`, `GrContextMenu`), списки, палитры. Роль задаёт потребитель,\n * потому что клавиатурный паттерн принадлежит ему, а не поповеру.\n */\nexport type GrPopoverRole = 'dialog' | 'menu' | 'listbox' | 'grid' | 'group' | 'none'\n\n/** Поле панели. `none` — поле рисует содержимое (меню, список опций). */\nexport type GrPopoverPadding = 'default' | 'none'\n\nexport const panelSizes: Record<GrPopoverSize, string> = {\n  xs: 'p-2 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'p-2.5 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'p-3 text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]',\n  lg: 'p-4 text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]',\n}\n\n/**\n * Поверхность панели.\n *\n * Ширина — `min()` из двух пределов, и они разной природы. Первый, `22rem`, —\n * потолок содержимого: читаемая ширина колонки текста. Он **дефолт**, а не\n * закон, и снимается хуком `--gr-popover-max-width` — примитив объявил, что\n * содержимое панели дело потребителя, и навязывать ему форму не вправе.\n * Тулбар, палитра и сетка шире прозы законно.\n *\n * Второй, `calc(100vw-1rem)`, — инвариант слоя: `useFloating` смещает панель в\n * пределах вьюпорта, но не сужает её. Он не настраивается ничем и снаружи не\n * отключается, потому что стоит вторым операндом `min()`: даже\n * `--gr-popover-max-width: 100vw` его не снимает, а лишь уступает ему место.\n *\n * Хуком, а не пропом, — по трём причинам. Спор специфичности не возникает\n * вовсе: кастомное свойство разрешается каскадом на самом элементе, а не\n * порядком правил в сгенерированном CSS (та же ловушка, что описана у\n * `panelSizesFlush`). Потолок можно менять по брейкпоинту и по теме — пропом\n * этого не сделать. И словарь компонента не растёт: значение остаётся\n * значением. Так же устроена высота списка у `GrCommandPalette`.\n */\n/**\n * Кегль без поля.\n *\n * Отдельная мапа, а не `contentClass=\"p-0\"`: поле и кегль приезжают одной\n * строкой равной специфичности, и кто победит — решал бы порядок правил в\n * сгенерированном CSS. Меню внутри поповера с `p-3` — визуально не меню.\n */\nexport const panelSizesFlush: Record<GrPopoverSize, string> = {\n  xs: 'text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]',\n  lg: 'text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]',\n}\n\n/**\n * Высота — тоже `min()` из двух пределов, но устроена иначе, чем ширина.\n *\n * Потолок ширины статичен: `calc(100vw-1rem)` не зависит от того, где стоит\n * триггер. Потолок высоты статичным быть не может — доступное место есть\n * расстояние до края вьюпорта на той стороне, куда панель встала, и меняется\n * оно на каждом скролле. Поэтому второй операнд здесь — не константа, а замер\n * слоя (`--gr-floating-available-height`, см. `useFloating`), и он пересчитан\n * уже **после** `flip`: сторона окончательная.\n *\n * `overflow-y: auto` идёт с потолком одной строкой намеренно. Потолок без\n * скролла не ограничивает, а обрезает: содержимое молча уходит под нижний край\n * панели, и добраться до него нельзя ничем. Пока потолок не упёрся, полоса не\n * рисуется, так что для коротких панелей не меняется ничего.\n *\n * Хук `--gr-popover-max-height` по умолчанию `100vh` — то есть «мнения нет»,\n * и высоту диктует замер. Он же служит фолбэком, пока позиция не посчитана\n * (первый кадр, SSR): панель не схлопывается в ноль, а просто не ограничена.\n */\nexport const popoverPanelBaseClass = `${overlayPanelSurfaceClass} max-w-[min(var(--gr-popover-max-width,22rem),calc(100vw-1rem))] max-h-[min(var(--gr-popover-max-height,100vh),var(--gr-floating-available-height,100vh))] overflow-y-auto focus:outline-none`\n\nexport function grPopoverPanelClass(\n  size: GrPopoverSize,\n  placement: Placement,\n  extra?: string,\n  padding: GrPopoverPadding = 'default',\n): string {\n  return [\n    popoverPanelBaseClass,\n    padding === 'none' ? panelSizesFlush[size] : panelSizes[size],\n    overlayOriginClass(placement),\n    extra ?? '',\n  ].filter(Boolean).join(' ')\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,IAAa,gCAA2D;CACtE,gBAAgB;CAChB,cAAc;CACd,UAAU;CACV,aAAa;CACb,WAAW;CACX,OAAO;CACP,cAAc;CACd,YAAY;CACZ,QAAQ;CACR,eAAe;CACf,aAAa;CACb,SAAS;AACX;AAEA,SAAgB,mBAAmB,WAA8B;CAC/D,OAAO,8BAA8B,cAAc;AACrD;;;ACjBA,IAAa,aAA4C;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAa,kBAAiD;CAC5D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;;;;;;;;;;AAqBA,IAAa,wBAAwB,GAAG,yBAAyB;AAEjE,SAAgB,oBACd,MACA,WACA,OACA,UAA4B,WACpB;CACR,OAAO;EACL;EACA,YAAY,SAAS,gBAAgB,QAAQ,WAAW;EACxD,mBAAmB,SAAS;EAC5B,SAAS;CACX,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC5B"}
+{"version":3,"file":"grPopoverStyles-CncEkiPu.js","names":[],"sources":["../../src/components/shared/overlayOrigin.ts","../../src/components/GrPopover/grPopoverStyles.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/dom'\n\n/**\n * `transform-origin` для scale-анимации всплывающей панели.\n *\n * Ключ — `resolvedPlacement`, то есть положение **после** `flip`: если снизу не\n * хватило места и панель перевернуло вверх, origin переворачивается вместе с\n * ней. Координаты панели к этому моменту уже посчитал `useFloating`, здесь\n * остаётся только направление роста относительно триггера.\n *\n * До выноса карта существовала копиями в `GrPopover` и `GrDropdown` — двенадцать\n * записей, совпадавших дословно, вместе с комментарием об одном и том же.\n *\n * Отдельным модулем от поверхности намеренно: списки выбора берут поверхность,\n * но своей анимации роста не имеют, и импорт соседа затащил бы им в чанк восемь\n * классов, которыми они не пользуются. Гейт `src/__tests__/safelist.test.ts`\n * назвал бы их поимённо — и был бы прав.\n *\n * Модуль безадресный: в `dist` он уезжает в общий чанк, который пресет не\n * сканирует, поэтому каждый потребитель объявляет эти классы в своём `safelist.ts`.\n */\nexport const overlayOriginClassByPlacement: Record<Placement, string> = {\n  'bottom-start': 'origin-top-left',\n  'bottom-end': 'origin-top-right',\n  'bottom': 'origin-top',\n  'top-start': 'origin-bottom-left',\n  'top-end': 'origin-bottom-right',\n  'top': 'origin-bottom',\n  'left-start': 'origin-top-right',\n  'left-end': 'origin-bottom-right',\n  'left': 'origin-right',\n  'right-start': 'origin-top-left',\n  'right-end': 'origin-bottom-left',\n  'right': 'origin-left',\n}\n\nexport function overlayOriginClass(placement: Placement): string {\n  return overlayOriginClassByPlacement[placement] ?? 'origin-top'\n}\n","import type { Placement } from '@floating-ui/dom'\n\nimport { overlayOriginClass } from '../shared/overlayOrigin'\nimport { overlayPanelSurfaceClass } from '../shared/overlayPanelSurface'\nimport type { GrComponentSize } from '../shared/sizes'\n\nexport type GrPopoverSize = GrComponentSize\n\n/**\n * Роль панели.\n *\n * `dialog` — произвольный интерактивный контент (значение по умолчанию).\n * Остальные нужны компонентам, которые строятся поверх этого примитива:\n * меню (`GrMenu`, `GrContextMenu`), списки, палитры. Роль задаёт потребитель,\n * потому что клавиатурный паттерн принадлежит ему, а не поповеру.\n */\nexport type GrPopoverRole = 'dialog' | 'menu' | 'listbox' | 'grid' | 'group' | 'none'\n\n/** Поле панели. `none` — поле рисует содержимое (меню, список опций). */\nexport type GrPopoverPadding = 'default' | 'none'\n\nexport const panelSizes: Record<GrPopoverSize, string> = {\n  xs: 'p-2 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'p-2.5 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'p-3 text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]',\n  lg: 'p-4 text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]',\n}\n\n/**\n * Поверхность панели.\n *\n * Ширина — `min()` из двух пределов, и они разной природы. Первый, `22rem`, —\n * потолок содержимого: читаемая ширина колонки текста. Он **дефолт**, а не\n * закон, и снимается хуком `--gr-popover-max-width` — примитив объявил, что\n * содержимое панели дело потребителя, и навязывать ему форму не вправе.\n * Тулбар, палитра и сетка шире прозы законно.\n *\n * Второй, `calc(100vw-1rem)`, — инвариант слоя: `useFloating` смещает панель в\n * пределах вьюпорта, но не сужает её. Он не настраивается ничем и снаружи не\n * отключается, потому что стоит вторым операндом `min()`: даже\n * `--gr-popover-max-width: 100vw` его не снимает, а лишь уступает ему место.\n *\n * Хуком, а не пропом, — по трём причинам. Спор специфичности не возникает\n * вовсе: кастомное свойство разрешается каскадом на самом элементе, а не\n * порядком правил в сгенерированном CSS (та же ловушка, что описана у\n * `panelSizesFlush`). Потолок можно менять по брейкпоинту и по теме — пропом\n * этого не сделать. И словарь компонента не растёт: значение остаётся\n * значением. Так же устроена высота списка у `GrCommandPalette`.\n */\n/**\n * Кегль без поля.\n *\n * Отдельная мапа, а не `contentClass=\"p-0\"`: поле и кегль приезжают одной\n * строкой равной специфичности, и кто победит — решал бы порядок правил в\n * сгенерированном CSS. Меню внутри поповера с `p-3` — визуально не меню.\n */\nexport const panelSizesFlush: Record<GrPopoverSize, string> = {\n  xs: 'text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]',\n  lg: 'text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]',\n}\n\n/**\n * Высота — тоже `min()` из двух пределов, но устроена иначе, чем ширина.\n *\n * Потолок ширины статичен: `calc(100vw-1rem)` не зависит от того, где стоит\n * триггер. Потолок высоты статичным быть не может — доступное место есть\n * расстояние до края вьюпорта на той стороне, куда панель встала, и меняется\n * оно на каждом скролле. Поэтому второй операнд здесь — не константа, а замер\n * слоя (`--gr-floating-available-height`, см. `useFloating`), и он пересчитан\n * уже **после** `flip`: сторона окончательная.\n *\n * `overflow-y: auto` идёт с потолком одной строкой намеренно. Потолок без\n * скролла не ограничивает, а обрезает: содержимое молча уходит под нижний край\n * панели, и добраться до него нельзя ничем. Пока потолок не упёрся, полоса не\n * рисуется, так что для коротких панелей не меняется ничего.\n *\n * Хук `--gr-popover-max-height` по умолчанию `100vh` — то есть «мнения нет»,\n * и высоту диктует замер. Он же служит фолбэком, пока позиция не посчитана\n * (первый кадр, SSR): панель не схлопывается в ноль, а просто не ограничена.\n */\nexport const popoverPanelBaseClass = `${overlayPanelSurfaceClass} max-w-[min(var(--gr-popover-max-width,22rem),calc(100vw-1rem))] max-h-[min(var(--gr-popover-max-height,100vh),var(--gr-floating-available-height,100vh))] overflow-y-auto focus:outline-none`\n\nexport function grPopoverPanelClass(\n  size: GrPopoverSize,\n  placement: Placement,\n  extra?: string,\n  padding: GrPopoverPadding = 'default',\n): string {\n  return [\n    popoverPanelBaseClass,\n    padding === 'none' ? panelSizesFlush[size] : panelSizes[size],\n    overlayOriginClass(placement),\n    extra ?? '',\n  ].filter(Boolean).join(' ')\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,IAAa,gCAA2D;CACtE,gBAAgB;CAChB,cAAc;CACd,UAAU;CACV,aAAa;CACb,WAAW;CACX,OAAO;CACP,cAAc;CACd,YAAY;CACZ,QAAQ;CACR,eAAe;CACf,aAAa;CACb,SAAS;AACX;AAEA,SAAgB,mBAAmB,WAA8B;CAC/D,OAAO,8BAA8B,cAAc;AACrD;;;ACjBA,IAAa,aAA4C;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAa,kBAAiD;CAC5D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;;;;;;;;;;AAqBA,IAAa,wBAAwB,GAAG,yBAAyB;AAEjE,SAAgB,oBACd,MACA,WACA,OACA,UAA4B,WACpB;CACR,OAAO;EACL;EACA,YAAY,SAAS,gBAAgB,QAAQ,WAAW;EACxD,mBAAmB,SAAS;EAC5B,SAAS;CACX,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC5B"}

package/dist/chunks/{grSelectStyles-D9EQ-pgK.js → grSelectStyles-Cam-IG9s.js}

@@ -1,4 +1,5 @@
-import { t as overlayPanelSurfaceClass } from "./overlayPanelSurface-BKeMhRx4.js";
+import { t as overlayListPanelClass } from "./overlayListPanel-D91jBCHU.js";
+import { n as overlayPanelSurfaceClass } from "./overlayTransition-C0FDMx7Q.js";
 //#region src/components/GrSelect/grSelectStyles.ts
 var defaultBaseClass = "w-full rounded-[var(--gr-radius-control)] border bg-[var(--gr-bg)] text-[var(--gr-fg)] transition-colors duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]";
 /**
@@ -126,7 +127,7 @@ function grSelectTriggerClass(options) {
 	if (options.view === "link") return [grSelectClass(options), "inline-flex items-center gap-1 text-left"].join(" ");
 	return [grSelectClass(options), "flex items-center justify-between text-left"].join(" ");
 }
-var grSelectPanelClasses = `${overlayPanelSurfaceClass} overflow-hidden`;
+var grSelectPanelClasses = `${overlayPanelSurfaceClass} ${overlayListPanelClass} overflow-hidden`;
 /** Общая подсветка наведения и активной опции панели. */
 var selectOptionHighlight = "bg-[color-mix(in_srgb,var(--gr-muted)_30%,transparent)]";
 var selectOptionBaseClass = "rounded-[var(--gr-radius-md)] px-3 py-2 text-left text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)]";

package/dist/chunks/grSelectStyles-Cam-IG9s.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grSelectStyles-Cam-IG9s.js","names":[],"sources":["../../src/components/GrSelect/grSelectStyles.ts"],"sourcesContent":["import type { GrComponentSize, GrControlState } from '../shared/sizes'\nimport { overlayListPanelClass } from '../shared/overlayListPanel'\nimport { overlayPanelSurfaceClass } from '../shared/overlayPanelSurface'\n\nexport type GrSelectView = 'default' | 'link'\nexport type GrSelectSize = GrComponentSize\nexport type GrSelectVariant = 'primary' | 'default' | 'muted' | 'danger'\nexport type GrSelectUnderline = 'auto' | 'always' | 'none'\nimport type { GrChipTone } from '../GrChip/grChipStyles'\n\nexport type GrSelectOptionsView = 'native' | 'panel'\n/**\n * Тип значения опции. Ограничен примитивами, которые переживают путь через DOM:\n * нативный `<select>` хранит в `option.value` только строку, поэтому значение\n * должно однозначно восстанавливаться из своего строкового представления.\n * Объектные модели потребовали бы отдельного key-экстрактора — см. `docs/components.md`.\n */\n/**\n * Значение опции. Объект допустим, но тогда обязателен проп `valueKey`: в DOM\n * значение живёт строкой, и без ключа объекты неотличимы друг от друга.\n */\nexport type GrSelectValue = string | number | object\nexport type GrSelectState = GrControlState\n\nexport type GrSelectOption<TValue extends GrSelectValue = string> = {\n  value: TValue\n  label: string\n  disabled?: boolean\n  /**\n   * Тон чипа в режиме `tags` — перекрывает `tagTone` для этой опции.\n   *\n   * Цвет у каждого тега свой — обычная модель (метки, категории, статусы), и\n   * без неё потребитель уходил в слот `#value` рисовать выбранное сам, теряя\n   * ровно то, что в `tags` сделано правильно: чипы снаружи `role=\"combobox\"`,\n   * снятие крестиком, сворачивание в «+N» и клавиатуру.\n   */\n  tone?: GrChipTone\n  /** Плотная заливка чипа этой опции — перекрывает `tagDark`. */\n  dark?: boolean\n}\n/** Группа опций: заголовок `label` + вложенные опции `options`. */\nexport type GrSelectOptionGroup<TValue extends GrSelectValue = string> = {\n  label: string\n  options: GrSelectOption<TValue>[]\n}\n/** Элемент списка опций: либо одиночная опция, либо группа опций. */\nexport type GrSelectOptionOrGroup<TValue extends GrSelectValue = string>\n  = | GrSelectOption<TValue>\n    | GrSelectOptionGroup<TValue>\nexport type GrSelectModelValue<TValue extends GrSelectValue = string> = TValue | TValue[]\n\nexport const defaultBaseClass = 'w-full rounded-[var(--gr-radius-control)] border bg-[var(--gr-bg)] text-[var(--gr-fg)] transition-colors duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]'\n\n/**\n * Цвет рамки по состоянию — та же карта, что у `GrInput` и `GrTextarea`: поля\n * одной формы обязаны показывать ошибку одинаково.\n */\nexport const borderClassByState: Record<GrSelectState, string> = {\n  default: 'border-[var(--gr-brd)]',\n  success: 'border-[var(--gr-success)] focus-visible:ring-[var(--gr-success)]',\n  warning: 'border-[var(--gr-warning)] focus-visible:ring-[var(--gr-warning)]',\n  danger: 'border-[var(--gr-danger)] focus-visible:ring-[var(--gr-danger)]',\n}\n\n/**\n * Ошибка валидации красится своей ролью, а не декоративным тоном `danger`:\n * `state=\"danger\"` — это подсветка по решению разработчика, `invalid` — вердикт\n * валидации, и тема вправе развести их по цвету.\n */\nexport const invalidBorderClass = 'border-[var(--gr-invalid-brd)] focus-visible:ring-[var(--gr-invalid-ring)]'\nexport const linkBaseClass = 'cursor-pointer inline-block w-auto align-baseline appearance-none bg-transparent border border-transparent px-0 py-0 rounded-[var(--gr-radius-control)] transition-colors duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]'\n\nexport const selectSizeClassBySize: Record<GrSelectSize, string> = {\n  xs: 'h-7 px-2.5 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'h-8 px-3 text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'h-10 px-3 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n  lg: 'h-11 px-4 text-[length:var(--gr-control-text-lg)] leading-[var(--gr-control-leading-lg)]',\n}\n\nexport const selectLinkSizeClassBySize: Record<GrSelectSize, string> = {\n  xs: 'text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n  lg: 'text-[length:var(--gr-control-text-lg)] leading-[var(--gr-control-leading-lg)]',\n}\n\n/**\n * Ссылка — это ТЕКСТ на фоне страницы, поэтому опасный тон берётся из\n * `--gr-danger-text`, а не из насыщенного `--gr-danger` (последний под текст не\n * рассчитан). Hover/active выводятся подмесом `--gr-fg` — той же формулой, что\n * `GrLink`. `primary` берётся из `--gr-primary-text` по той же причине: на фоне\n * страницы насыщенный `--gr-primary` под текст не рассчитан.\n *\n * Классы записаны литералами, а не собраны интерполяцией: safelist и скан\n * UnoCSS читают исходник, и вычисленная строка для них не класс.\n */\nexport const selectLinkVariantClassByVariant: Record<GrSelectVariant, string> = {\n  primary: 'text-[var(--gr-primary-text)] hover:text-[color-mix(in_srgb,var(--gr-primary-text)_92%,var(--gr-fg))] active:text-[color-mix(in_srgb,var(--gr-primary-text)_84%,var(--gr-fg))]',\n  default: 'text-[var(--gr-fg)] hover:text-[var(--gr-primary-text)] active:text-[color-mix(in_srgb,var(--gr-primary-text)_84%,var(--gr-fg))]',\n  muted: 'text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)] active:text-[var(--gr-fg)]',\n  danger: 'text-[var(--gr-danger-text)] hover:text-[color-mix(in_srgb,var(--gr-danger-text)_92%,var(--gr-fg))] active:text-[color-mix(in_srgb,var(--gr-danger-text)_84%,var(--gr-fg))]',\n}\n\n/**\n * Variant-классы для видимой метки в `view=\"link\"` + `optionsView=\"native\"`.\n * Hover-цвет приходит через `peer-hover:` от прозрачного `<select>`-overlay,\n * т.к. видимая метка имеет `pointer-events-none` и не получает hover напрямую.\n */\nexport const selectLinkNativeLabelVariantClassByVariant: Record<GrSelectVariant, string> = {\n  primary: 'text-[var(--gr-primary-text)] peer-hover:text-[color-mix(in_srgb,var(--gr-primary-text)_92%,var(--gr-fg))] peer-active:text-[color-mix(in_srgb,var(--gr-primary-text)_84%,var(--gr-fg))]',\n  default: 'text-[var(--gr-fg)] peer-hover:text-[var(--gr-primary-text)] peer-active:text-[color-mix(in_srgb,var(--gr-primary-text)_84%,var(--gr-fg))]',\n  muted: 'text-[var(--gr-muted-fg)] peer-hover:text-[var(--gr-fg)] peer-active:text-[var(--gr-fg)]',\n  danger: 'text-[var(--gr-danger-text)] peer-hover:text-[color-mix(in_srgb,var(--gr-danger-text)_92%,var(--gr-fg))] peer-active:text-[color-mix(in_srgb,var(--gr-danger-text)_84%,var(--gr-fg))]',\n}\n\nfunction selectLinkUnderlineClass(options: { underline: GrSelectUnderline, disabled: boolean }): string {\n  if (options.disabled)\n    return 'no-underline'\n  if (options.underline === 'always')\n    return 'underline underline-offset-4'\n  if (options.underline === 'none')\n    return 'no-underline'\n  return 'no-underline hover:underline hover:underline-offset-4'\n}\n\n/**\n * Underline-классы для видимой метки в `view=\"link\"` + `optionsView=\"native\"`.\n * Видимая метка имеет `pointer-events-none`, а hover получает прозрачный\n * `<select>`-overlay (peer), поэтому для `underline=\"auto\"` используем\n * `peer-hover:underline` вместо `hover:underline`.\n */\nfunction selectLinkNativeLabelUnderlineClass(options: { underline: GrSelectUnderline, disabled: boolean }): string {\n  if (options.disabled)\n    return 'no-underline'\n  if (options.underline === 'always')\n    return 'underline underline-offset-4'\n  if (options.underline === 'none')\n    return 'no-underline'\n  return 'no-underline peer-hover:underline peer-hover:underline-offset-4'\n}\n\n/**\n * Классы прозрачного `<select>`-overlay для `view=\"link\"` + `optionsView=\"native\"`.\n * Нативный селект растягивается на всю обёртку, но визуально невидим — ширину обёртки\n * задаёт видимый `<span>` с выбранной меткой, благодаря чему компонент в закрытом\n * состоянии занимает столько места, сколько нужно текущей опции (а не самой длинной).\n */\nexport const grSelectLinkNativeOverlayClass = 'peer absolute inset-0 w-full h-full m-0 p-0 border-0 bg-transparent text-transparent appearance-none opacity-0 cursor-pointer disabled:cursor-not-allowed focus:outline-none'\n\n/**\n * Классы видимой метки для `view=\"link\"` + `optionsView=\"native\"` (поверх прозрачного `<select>`).\n * Получает все link-стили (size/variant/underline), а также focus-ring через `peer-focus-visible`.\n */\nexport const grSelectLinkNativeLabelBaseClass = 'pointer-events-none inline-block whitespace-nowrap align-baseline rounded-[var(--gr-radius-control)] transition-colors duration-[var(--gr-duration-fast)]'\nexport const grSelectLinkNativeLabelDisabledClass = 'cursor-not-allowed text-[var(--gr-muted-fg)] no-underline'\nexport const grSelectLinkNativeLabelFocusClass = 'peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-[var(--gr-ring)]'\n\nexport function grSelectLinkNativeLabelClass(options: {\n  size: GrSelectSize\n  variant: GrSelectVariant\n  underline: GrSelectUnderline\n  disabled: boolean\n}): string {\n  return [\n    grSelectLinkNativeLabelBaseClass,\n    selectLinkSizeClassBySize[options.size],\n    selectLinkNativeLabelUnderlineClass({ underline: options.underline, disabled: options.disabled }),\n    selectLinkNativeLabelVariantClassByVariant[options.variant],\n    options.disabled ? grSelectLinkNativeLabelDisabledClass : '',\n    grSelectLinkNativeLabelFocusClass,\n  ]\n    .filter(Boolean)\n    .join(' ')\n}\n\nexport function grSelectClass(options: {\n  view: GrSelectView\n  size: GrSelectSize\n  disabled: boolean\n  variant: GrSelectVariant\n  underline: GrSelectUnderline\n  state?: GrSelectState\n  invalid?: boolean\n}): string {\n  if (options.view === 'link') {\n    return [\n      selectLinkSizeClassBySize[options.size],\n      selectLinkUnderlineClass({ underline: options.underline, disabled: options.disabled }),\n      selectLinkVariantClassByVariant[options.variant],\n      'disabled:cursor-not-allowed disabled:text-[var(--gr-muted-fg)] disabled:no-underline',\n    ].join(' ')\n  }\n\n  return [\n    selectSizeClassBySize[options.size],\n    // `invalid` сильнее `state`: ошибка перекрывает любую другую подсветку.\n    options.invalid ? invalidBorderClass : borderClassByState[options.state ?? 'default'],\n    // Заблокированный контрол гасится фоном и цветом текста, а не `opacity`:\n    // прозрачность разбавляет выверенные на AA токены и роняет контраст.\n    'disabled:cursor-not-allowed disabled:bg-[var(--gr-muted)] disabled:text-[var(--gr-muted-fg)]',\n  ].join(' ')\n}\n\nexport function grSelectNativeClass(options: {\n  view: GrSelectView\n  size: GrSelectSize\n  disabled: boolean\n  variant: GrSelectVariant\n  underline: GrSelectUnderline\n  showNativeChevron: boolean\n  state?: GrSelectState\n  invalid?: boolean\n}): string {\n  return [\n    grSelectClass(options),\n    options.showNativeChevron ? 'appearance-none pr-9' : '',\n  ]\n    .filter(Boolean)\n    .join(' ')\n}\n\nexport function grSelectTriggerClass(options: {\n  view: GrSelectView\n  optionsView: GrSelectOptionsView\n  size: GrSelectSize\n  disabled: boolean\n  variant: GrSelectVariant\n  underline: GrSelectUnderline\n  state?: GrSelectState\n  invalid?: boolean\n}): string {\n  if (options.optionsView !== 'panel') {\n    return grSelectClass(options)\n  }\n\n  if (options.view === 'link') {\n    return [\n      grSelectClass(options),\n      'inline-flex items-center gap-1 text-left',\n    ].join(' ')\n  }\n\n  return [\n    grSelectClass(options),\n    'flex items-center justify-between text-left',\n  ].join(' ')\n}\n\nexport const grSelectPanelClasses = `${overlayPanelSurfaceClass} ${overlayListPanelClass} overflow-hidden`\n\n/** Общая подсветка наведения и активной опции панели. */\nconst selectOptionHighlight = 'bg-[color-mix(in_srgb,var(--gr-muted)_30%,transparent)]'\n\nexport const selectOptionBaseClass = 'rounded-[var(--gr-radius-md)] px-3 py-2 text-left text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)]'\nexport const selectOptionLinkWidthClass = 'block min-w-full w-max whitespace-nowrap'\nexport const selectOptionWidthClass = 'w-full'\nexport const selectOptionEnabledClass = `hover:${selectOptionHighlight}`\nexport const selectOptionActiveClass = selectOptionHighlight\n/** Выключенная опция гасится токеном текста — по той же причине, что и контрол. */\nexport const selectOptionDisabledClass = 'cursor-not-allowed text-[var(--gr-muted-fg)]'\n\nexport function grSelectOptionClass(options: {\n  view: GrSelectView\n  disabled: boolean\n  active: boolean\n}): string {\n  return [\n    selectOptionBaseClass,\n    options.view === 'link' ? selectOptionLinkWidthClass : selectOptionWidthClass,\n    options.disabled ? selectOptionDisabledClass : selectOptionEnabledClass,\n    !options.disabled && options.active ? selectOptionActiveClass : '',\n  ]\n    .filter(Boolean)\n    .join(' ')\n}\n"],"mappings":";;;AAmDA,IAAa,mBAAmB;;;;;AAMhC,IAAa,qBAAoD;CAC/D,SAAS;CACT,SAAS;CACT,SAAS;CACT,QAAQ;AACV;;;;;;AAOA,IAAa,qBAAqB;AAClC,IAAa,gBAAgB;AAE7B,IAAa,wBAAsD;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,4BAA0D;CACrE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;AAYA,IAAa,kCAAmE;CAC9E,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;AACV;;;;;;AAOA,IAAa,6CAA8E;CACzF,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAEA,SAAS,yBAAyB,SAAsE;CACtG,IAAI,QAAQ,UACV,OAAO;CACT,IAAI,QAAQ,cAAc,UACxB,OAAO;CACT,IAAI,QAAQ,cAAc,QACxB,OAAO;CACT,OAAO;AACT;;;;;;;AAQA,SAAS,oCAAoC,SAAsE;CACjH,IAAI,QAAQ,UACV,OAAO;CACT,IAAI,QAAQ,cAAc,UACxB,OAAO;CACT,IAAI,QAAQ,cAAc,QACxB,OAAO;CACT,OAAO;AACT;;;;;;;AAQA,IAAa,iCAAiC;;;;;AAM9C,IAAa,mCAAmC;AAChD,IAAa,uCAAuC;AACpD,IAAa,oCAAoC;AAEjD,SAAgB,6BAA6B,SAKlC;CACT,OAAO;EACL;EACA,0BAA0B,QAAQ;EAClC,oCAAoC;GAAE,WAAW,QAAQ;GAAW,UAAU,QAAQ;EAAS,CAAC;EAChG,2CAA2C,QAAQ;EACnD,QAAQ,WAAW,uCAAuC;EAC1D;CACF,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;AACb;AAEA,SAAgB,cAAc,SAQnB;CACT,IAAI,QAAQ,SAAS,QACnB,OAAO;EACL,0BAA0B,QAAQ;EAClC,yBAAyB;GAAE,WAAW,QAAQ;GAAW,UAAU,QAAQ;EAAS,CAAC;EACrF,gCAAgC,QAAQ;EACxC;CACF,CAAC,CAAC,KAAK,GAAG;CAGZ,OAAO;EACL,sBAAsB,QAAQ;EAE9B,QAAQ,UAAU,qBAAqB,mBAAmB,QAAQ,SAAS;EAG3E;CACF,CAAC,CAAC,KAAK,GAAG;AACZ;AAEA,SAAgB,oBAAoB,SASzB;CACT,OAAO,CACL,cAAc,OAAO,GACrB,QAAQ,oBAAoB,yBAAyB,EACvD,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;AACb;AAEA,SAAgB,qBAAqB,SAS1B;CACT,IAAI,QAAQ,gBAAgB,SAC1B,OAAO,cAAc,OAAO;CAG9B,IAAI,QAAQ,SAAS,QACnB,OAAO,CACL,cAAc,OAAO,GACrB,0CACF,CAAC,CAAC,KAAK,GAAG;CAGZ,OAAO,CACL,cAAc,OAAO,GACrB,6CACF,CAAC,CAAC,KAAK,GAAG;AACZ;AAEA,IAAa,uBAAuB,GAAG,yBAAyB,GAAG,sBAAsB;;AAGzF,IAAM,wBAAwB;AAE9B,IAAa,wBAAwB;AACrC,IAAa,6BAA6B;AAC1C,IAAa,yBAAyB;AACtC,IAAa,2BAA2B,SAAS;AACjD,IAAa,0BAA0B;;AAEvC,IAAa,4BAA4B;AAEzC,SAAgB,oBAAoB,SAIzB;CACT,OAAO;EACL;EACA,QAAQ,SAAS,SAAS,6BAA6B;EACvD,QAAQ,WAAW,4BAA4B;EAC/C,CAAC,QAAQ,YAAY,QAAQ,SAAS,0BAA0B;CAClE,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;AACb"}

package/dist/chunks/{grSliderStyles-kaz6VXZ3.js → grSliderStyles-CqzV0hll.js}

@@ -62,7 +62,7 @@ var sliderFillEnabledClass = "bg-[var(--gr-slider-fill,var(--gr-primary))]";
 function sliderFillClass(disabled) {
 	return [sliderFillBaseClass, disabled ? sliderFillDisabledClass : sliderFillEnabledClass].join(" ");
 }
-var sliderThumbBaseClass = "absolute rounded-[var(--gr-radius-full)] border-2 border-[var(--gr-slider-thumb-border,var(--gr-slider-fill,var(--gr-primary)))] bg-[var(--gr-slider-thumb-bg,var(--gr-bg))] ring-1 ring-[color-mix(in_srgb,var(--gr-fg)_22%,transparent)] shadow-[var(--gr-shadow-1)] transition-[box-shadow,transform] duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-offset-1 focus-visible:ring-offset-[var(--gr-bg)]";
+var sliderThumbBaseClass = "absolute inline-flex items-center justify-center overflow-visible rounded-[var(--gr-radius-full)] border-2 border-[var(--gr-slider-thumb-border,var(--gr-slider-fill,var(--gr-primary)))] bg-[var(--gr-slider-thumb-bg,var(--gr-bg))] ring-1 ring-[color-mix(in_srgb,var(--gr-fg)_22%,transparent)] shadow-[var(--gr-shadow-1)] transition-[box-shadow,transform] duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-offset-1 focus-visible:ring-offset-[var(--gr-bg)]";
 /** Бегунок центрируется поперёк дорожки, а вдоль неё его ведёт inline-стиль. */
 var sliderThumbOrientationClass = {
 	horizontal: "top-1/2 -translate-x-1/2 -translate-y-1/2",

package/dist/chunks/grSliderStyles-CqzV0hll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grSliderStyles-CqzV0hll.js","names":[],"sources":["../../src/components/GrSlider/grSliderStyles.ts"],"sourcesContent":["import type { GrComponentSize } from '../shared/sizes'\n\nexport type GrSliderSize = GrComponentSize\n/** Значение: число (single) или кортеж `[lo, hi]` (range при `range=true`). */\nexport type GrSliderModelValue = number | [number, number]\n/** Метка деления: словарь `value → label` или просто массив значений (label = значение). */\nexport type GrSliderMarks = Record<number, string> | number[]\n\n/** Ориентация дорожки. В вертикальной минимум внизу — как на регуляторе громкости. */\nexport const GR_SLIDER_ORIENTATIONS = ['horizontal', 'vertical'] as const\nexport type GrSliderOrientation = typeof GR_SLIDER_ORIENTATIONS[number]\n\n/**\n * Кастомизация через CSS-переменные (можно задать на самом слайдере или любом\n * предке — inline `style`, класс, тема). Значение по умолчанию — второй аргумент\n * `var(--name, default)`, поэтому переопределять можно точечно:\n *\n * - `--gr-slider-rail`         — цвет фона дорожки (неактивная часть).\n * - `--gr-slider-fill`         — цвет активной (заполненной) части.\n * - `--gr-slider-thumb-bg`     — заливка бегунка.\n * - `--gr-slider-thumb-border` — цвет окантовки бегунка (по умолчанию = fill).\n * - `--gr-slider-thumb-size`   — диаметр бегунка (по умолчанию — из `size`).\n * - `--gr-slider-track-height` — толщина дорожки (по умолчанию — из `size`).\n * - `--gr-slider-length`       — длина вертикальной дорожки (по умолчанию `10rem`).\n */\n\n// Высота дорожки (rail/fill) по размеру — дефолт для `--gr-slider-track-height`.\nexport const sliderTrackHeightBySize: Record<GrSliderSize, string> = {\n  xs: 'h-[var(--gr-slider-track-height,0.1875rem)]',\n  sm: 'h-[var(--gr-slider-track-height,0.25rem)]',\n  md: 'h-[var(--gr-slider-track-height,0.375rem)]',\n  lg: 'h-[var(--gr-slider-track-height,0.5rem)]',\n}\n\n/** В вертикали та же толщина задаёт ширину, а длину берёт `--gr-slider-length`. */\nexport const sliderTrackWidthBySize: Record<GrSliderSize, string> = {\n  xs: 'w-[var(--gr-slider-track-height,0.1875rem)]',\n  sm: 'w-[var(--gr-slider-track-height,0.25rem)]',\n  md: 'w-[var(--gr-slider-track-height,0.375rem)]',\n  lg: 'w-[var(--gr-slider-track-height,0.5rem)]',\n}\n\nexport const sliderTrackVerticalLengthClass = 'h-[var(--gr-slider-length,10rem)]'\n\n// Размер «бегунка» (thumb) по размеру — дефолт для `--gr-slider-thumb-size`.\nexport const sliderThumbSizeBySize: Record<GrSliderSize, string> = {\n  xs: 'h-[var(--gr-slider-thumb-size,0.75rem)] w-[var(--gr-slider-thumb-size,0.75rem)]',\n  sm: 'h-[var(--gr-slider-thumb-size,0.875rem)] w-[var(--gr-slider-thumb-size,0.875rem)]',\n  md: 'h-[var(--gr-slider-thumb-size,1rem)] w-[var(--gr-slider-thumb-size,1rem)]',\n  lg: 'h-[var(--gr-slider-thumb-size,1.25rem)] w-[var(--gr-slider-thumb-size,1.25rem)]',\n}\n\n// Вертикальный отступ обёртки, чтобы thumb не обрезался краями дорожки.\nexport const sliderPaddingBySize: Record<GrSliderSize, string> = {\n  xs: 'py-1',\n  sm: 'py-1.5',\n  md: 'py-2',\n  lg: 'py-2.5',\n}\n\n/**\n * Дорожка — `--gr-brd`, а не полупрозрачный `--gr-muted`.\n *\n * Прежний дефолт (`color-mix(--gr-muted 45%, transparent)`) на светлой теме\n * давал #f1f5f9 при 45 % поверх почти такой же поверхности: непройденная часть\n * шкалы не читалась вовсе, и слайдер выглядел точкой на пустом месте — по нему\n * нельзя было понять ни диапазон, ни положение внутри него.\n */\nexport const sliderRailClass = 'absolute inset-0 rounded-[var(--gr-radius-full)] bg-[var(--gr-slider-rail,var(--gr-brd))]'\n\nexport const sliderFillBaseClass = 'absolute rounded-[var(--gr-radius-full)]'\n\n/** Заливка растёт вдоль дорожки: по горизонтали — влево-вправо, по вертикали — снизу вверх. */\nexport const sliderFillOrientationClass: Record<GrSliderOrientation, string> = {\n  horizontal: 'top-0 bottom-0',\n  vertical: 'left-0 right-0',\n}\n\n/**\n * Недоступный слайдер гасится токенами, а не `opacity`: прозрачность разбавляет\n * выверенные на AA токены и роняет контраст подписей меток.\n */\nexport const sliderFillDisabledClass = 'bg-[var(--gr-disabled-fg)]'\nexport const sliderFillEnabledClass = 'bg-[var(--gr-slider-fill,var(--gr-primary))]'\n\nexport function sliderFillClass(disabled: boolean): string {\n  return [sliderFillBaseClass, disabled ? sliderFillDisabledClass : sliderFillEnabledClass].join(' ')\n}\n\n// Окантовка бегунка: цветной border (по умолчанию = fill) + тонкая контрастная\n// обводка (`ring`), чтобы бегунок не сливался ни с фоном страницы, ни с заливкой.\n/*\n * `inline-flex` с центрированием — ради слота `#thumb`: без него содержимое\n * ручки прижималось бы к её верхнему левому углу, и центрировать его пришлось\n * бы каждому потребителю. Пустой ручке объявление ничего не меняет: она\n * позиционирована абсолютно и имеет заданный размер.\n */\nexport const sliderThumbBaseClass = 'absolute inline-flex items-center justify-center overflow-visible rounded-[var(--gr-radius-full)] border-2 border-[var(--gr-slider-thumb-border,var(--gr-slider-fill,var(--gr-primary)))] bg-[var(--gr-slider-thumb-bg,var(--gr-bg))] ring-1 ring-[color-mix(in_srgb,var(--gr-fg)_22%,transparent)] shadow-[var(--gr-shadow-1)] transition-[box-shadow,transform] duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-offset-1 focus-visible:ring-offset-[var(--gr-bg)]'\n\n/** Бегунок центрируется поперёк дорожки, а вдоль неё его ведёт inline-стиль. */\nexport const sliderThumbOrientationClass: Record<GrSliderOrientation, string> = {\n  horizontal: 'top-1/2 -translate-x-1/2 -translate-y-1/2',\n  vertical: 'left-1/2 -translate-x-1/2 translate-y-1/2',\n}\n\nexport const sliderThumbDisabledClass = 'cursor-not-allowed border-[var(--gr-disabled-fg)] bg-[var(--gr-disabled-bg)]'\nexport const sliderThumbEnabledClass = 'cursor-grab active:cursor-grabbing hover:scale-110'\n\nexport function sliderThumbClass(options: {\n  size: GrSliderSize\n  disabled: boolean\n  orientation?: GrSliderOrientation\n}): string {\n  return [\n    sliderThumbBaseClass,\n    sliderThumbOrientationClass[options.orientation ?? 'horizontal'],\n    sliderThumbSizeBySize[options.size],\n    options.disabled ? sliderThumbDisabledClass : sliderThumbEnabledClass,\n  ].join(' ')\n}\n\nexport const sliderTooltipBaseClass = 'pointer-events-none absolute whitespace-nowrap rounded-[var(--gr-radius-control)] bg-[var(--gr-fg)] px-1.5 py-0.5 text-[length:var(--gr-text-2xs)] font-medium leading-tight text-[var(--gr-bg)] shadow-[var(--gr-shadow-2)]'\n\n/** В вертикали подсказка уходит вбок: над бегунком она легла бы на дорожку. */\nexport const sliderTooltipOrientationClass: Record<GrSliderOrientation, string> = {\n  horizontal: 'bottom-full left-1/2 mb-2 -translate-x-1/2',\n  vertical: 'right-full top-1/2 mr-2 -translate-y-1/2',\n}\n\nexport function sliderTooltipClass(orientation: GrSliderOrientation = 'horizontal'): string {\n  return [sliderTooltipBaseClass, sliderTooltipOrientationClass[orientation]].join(' ')\n}\n\nexport const sliderMarkTickBaseClass = 'absolute h-1.5 w-1.5 rounded-[var(--gr-radius-full)] bg-[var(--gr-bg)] ring-1 ring-[var(--gr-brd)]'\n\nexport const sliderMarkTickOrientationClass: Record<GrSliderOrientation, string> = {\n  horizontal: 'top-1/2 -translate-x-1/2 -translate-y-1/2',\n  vertical: 'left-1/2 -translate-x-1/2 translate-y-1/2',\n}\n\nexport function sliderMarkTickClass(orientation: GrSliderOrientation = 'horizontal'): string {\n  return [sliderMarkTickBaseClass, sliderMarkTickOrientationClass[orientation]].join(' ')\n}\n// Подписи меток уводим под дорожку (`top-full` + отступ, ниже бегунка) и запрещаем\n// перенос (`whitespace-nowrap`) — иначе крайняя подпись рвётся по буквам.\nexport const sliderMarkLabelClass = 'absolute whitespace-nowrap text-[length:var(--gr-text-2xs)] leading-none text-[var(--gr-muted-fg)]'\n\nexport const sliderMarkLabelDisabledClass = 'text-[var(--gr-disabled-fg)]'\n\n/** Вертикальные подписи уходят вправо от дорожки: под ней им места нет. */\nexport const sliderMarkLabelVerticalClass = 'left-full ml-2.5 translate-y-1/2'\nexport const sliderMarkLabelHorizontalClass = 'top-full mt-2.5'\n\n// Выравнивание подписи по позиции: центр для внутренних меток, а крайние (0% и\n// 100%) прижимаем внутрь, чтобы они не вылезали за края дорожки и не обрезались.\nexport function sliderMarkLabelClassFor(\n  pct: number,\n  options: { orientation?: GrSliderOrientation, disabled?: boolean } = {},\n): string {\n  const orientation = options.orientation ?? 'horizontal'\n  const tone = options.disabled ? sliderMarkLabelDisabledClass : ''\n\n  if (orientation === 'vertical')\n    return [sliderMarkLabelClass, sliderMarkLabelVerticalClass, tone].filter(Boolean).join(' ')\n\n  const align = pct <= 0.5 ? 'translate-x-0' : pct >= 99.5 ? '-translate-x-full' : '-translate-x-1/2'\n  return [sliderMarkLabelClass, sliderMarkLabelHorizontalClass, align, tone].filter(Boolean).join(' ')\n}\n\nexport const sliderRootBaseClass = 'relative select-none'\n\nexport const sliderRootOrientationClass: Record<GrSliderOrientation, string> = {\n  horizontal: 'w-full',\n  vertical: 'inline-flex',\n}\n\n/** Горизонтальный отступ обёртки вертикали — та же роль, что у `py-*` у горизонтали. */\nexport const sliderPaddingVerticalBySize: Record<GrSliderSize, string> = {\n  xs: 'px-1',\n  sm: 'px-1.5',\n  md: 'px-2',\n  lg: 'px-2.5',\n}\n\nexport function sliderRootClass(options: {\n  size: GrSliderSize\n  disabled: boolean\n  hasMarks?: boolean\n  orientation?: GrSliderOrientation\n}): string {\n  const orientation = options.orientation ?? 'horizontal'\n  const vertical = orientation === 'vertical'\n\n  return [\n    sliderRootBaseClass,\n    sliderRootOrientationClass[orientation],\n    vertical ? sliderPaddingVerticalBySize[options.size] : sliderPaddingBySize[options.size],\n    // Резервируем место под подписи меток, чтобы они не наезжали на соседний контент.\n    options.hasMarks ? (vertical ? 'mr-10' : 'mb-7') : '',\n  ]\n    .filter(Boolean)\n    .join(' ')\n}\n"],"mappings":";;;;;;;;;;;;;;AA2BA,IAAa,0BAAwD;CACnE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,yBAAuD;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,iCAAiC;AAG9C,IAAa,wBAAsD;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAGA,IAAa,sBAAoD;CAC/D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;AAUA,IAAa,kBAAkB;AAE/B,IAAa,sBAAsB;;AAGnC,IAAa,6BAAkE;CAC7E,YAAY;CACZ,UAAU;AACZ;;;;;AAMA,IAAa,0BAA0B;AACvC,IAAa,yBAAyB;AAEtC,SAAgB,gBAAgB,UAA2B;CACzD,OAAO,CAAC,qBAAqB,WAAW,0BAA0B,sBAAsB,CAAC,CAAC,KAAK,GAAG;AACpG;AAUA,IAAa,uBAAuB;;AAGpC,IAAa,8BAAmE;CAC9E,YAAY;CACZ,UAAU;AACZ;AAEA,IAAa,2BAA2B;AACxC,IAAa,0BAA0B;AAEvC,SAAgB,iBAAiB,SAItB;CACT,OAAO;EACL;EACA,4BAA4B,QAAQ,eAAe;EACnD,sBAAsB,QAAQ;EAC9B,QAAQ,WAAW,2BAA2B;CAChD,CAAC,CAAC,KAAK,GAAG;AACZ;AAEA,IAAa,yBAAyB;;AAGtC,IAAa,gCAAqE;CAChF,YAAY;CACZ,UAAU;AACZ;AAEA,SAAgB,mBAAmB,cAAmC,cAAsB;CAC1F,OAAO,CAAC,wBAAwB,8BAA8B,YAAY,CAAC,CAAC,KAAK,GAAG;AACtF;AAEA,IAAa,0BAA0B;AAEvC,IAAa,iCAAsE;CACjF,YAAY;CACZ,UAAU;AACZ;AAEA,SAAgB,oBAAoB,cAAmC,cAAsB;CAC3F,OAAO,CAAC,yBAAyB,+BAA+B,YAAY,CAAC,CAAC,KAAK,GAAG;AACxF;AAGA,IAAa,uBAAuB;AAEpC,IAAa,+BAA+B;;AAG5C,IAAa,+BAA+B;AAC5C,IAAa,iCAAiC;AAI9C,SAAgB,wBACd,KACA,UAAqE,CAAC,GAC9D;CACR,MAAM,cAAc,QAAQ,eAAe;CAC3C,MAAM,OAAO,QAAQ,WAAW,+BAA+B;CAE/D,IAAI,gBAAgB,YAClB,OAAO;EAAC;EAAsB;EAA8B;CAAI,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAG5F,OAAO;EAAC;EAAsB;EADhB,OAAO,KAAM,kBAAkB,OAAO,OAAO,sBAAsB;EACZ;CAAI,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACrG;AAEA,IAAa,sBAAsB;AAEnC,IAAa,6BAAkE;CAC7E,YAAY;CACZ,UAAU;AACZ;;AAGA,IAAa,8BAA4D;CACvE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,SAAgB,gBAAgB,SAKrB;CACT,MAAM,cAAc,QAAQ,eAAe;CAC3C,MAAM,WAAW,gBAAgB;CAEjC,OAAO;EACL;EACA,2BAA2B;EAC3B,WAAW,4BAA4B,QAAQ,QAAQ,oBAAoB,QAAQ;EAEnF,QAAQ,WAAY,WAAW,UAAU,SAAU;CACrD,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;AACb"}

package/dist/chunks/{config-CbEbLyDE.js → grSortableListStyles-CxieDmpe.js}

@@ -1,5 +1,3 @@
-import { n as splitClassTokens } from "./classTokens-8v2XC74x.js";
-import { defineGranularComponent } from "@feugene/unocss-preset-granular/contract";
 //#region src/components/GrSortableList/grSortableListStyles.ts
 /**
 * Классы `GrSortableList`. Единственный источник правды для шаблона и
@@ -41,28 +39,4 @@ var contentClass = "min-w-0 flex-1 text-[length:var(--gr-text-sm)] leading-[var(
 var indicatorBeforeClass = "before:absolute before:inset-x-0 before:top-0 before:h-[var(--gr-sortable-indicator-width,2px)] before:bg-[var(--gr-sortable-indicator,var(--gr-primary))] before:content-empty";
 var indicatorAfterClass = "after:absolute after:inset-x-0 after:bottom-0 after:h-[var(--gr-sortable-indicator-width,2px)] after:bg-[var(--gr-sortable-indicator,var(--gr-primary))] after:content-empty";
 //#endregion
-//#region src/components/GrSortableList/safelist.ts
-var grSortableListSafelist = [.../* @__PURE__ */ new Set([
-	...Object.values(listClass).flatMap(splitClassTokens),
-	...splitClassTokens(rowLayoutClass),
-	...splitClassTokens(rowFocusClass),
-	...splitClassTokens(rowDraggingClass),
-	...splitClassTokens(rowGrabbedClass),
-	...splitClassTokens(rowDisabledClass),
-	...splitClassTokens(dividedClass),
-	...splitClassTokens(emptyClass),
-	...splitClassTokens(handleClass),
-	...splitClassTokens(handleDisabledClass),
-	...splitClassTokens(contentClass),
-	...splitClassTokens(indicatorBeforeClass),
-	...splitClassTokens(indicatorAfterClass)
-])];
-//#endregion
-//#region src/components/GrSortableList/config.ts
-var grSortableListConfig = defineGranularComponent(import.meta.url, {
-	name: "GrSortableList",
-	safelist: grSortableListSafelist,
-	dependencies: ["GrCard"]
-});
-//#endregion
-export { emptyClass as a, indicatorAfterClass as c, rowDisabledClass as d, rowDraggingClass as f, rowLayoutClass as h, dividedClass as i, indicatorBeforeClass as l, rowGrabbedClass as m, grSortableListSafelist as n, handleClass as o, rowFocusClass as p, contentClass as r, handleDisabledClass as s, grSortableListConfig as t, listClass as u };
+export { handleDisabledClass as a, listClass as c, rowFocusClass as d, rowGrabbedClass as f, handleClass as i, rowDisabledClass as l, dividedClass as n, indicatorAfterClass as o, rowLayoutClass as p, emptyClass as r, indicatorBeforeClass as s, contentClass as t, rowDraggingClass as u };

package/dist/chunks/grSortableListStyles-CxieDmpe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grSortableListStyles-CxieDmpe.js","names":[],"sources":["../../src/components/GrSortableList/grSortableListStyles.ts"],"sourcesContent":["export type GrSortableOrientation = 'horizontal' | 'vertical'\n\n/**\n * Классы `GrSortableList`. Единственный источник правды для шаблона и\n * `safelist.ts`: литерал, живущий только здесь, до скана UnoCSS не доходит —\n * хелпер уезжает в общий чанк `dist/chunks/`.\n */\n\nexport const listClass: Record<GrSortableOrientation, string> = {\n  vertical: 'flex flex-col',\n  horizontal: 'flex flex-row flex-wrap',\n}\n\nexport const rowLayoutClass = 'relative flex items-center gap-2 px-4 py-3 transition-colors duration-[var(--gr-duration-fast)]'\n\n/**\n * Строка — остановка роверного фокуса, поэтому кольцо на ней, а не на ручке:\n * с клавиатуры берут строку целиком, ручка остаётся affordance для мыши.\n */\nexport const rowFocusClass = 'focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] focus-visible:ring-inset'\n\nexport const rowDraggingClass = 'bg-[var(--gr-sortable-row-bg-active,var(--gr-muted))]'\n\n/** Взятая с клавиатуры строка обязана отличаться от просто сфокусированной. */\nexport const rowGrabbedClass = 'bg-[var(--gr-sortable-row-bg-active,var(--gr-muted))] ring-2 ring-[var(--gr-ring)] ring-inset'\n\nexport const rowDisabledClass = 'cursor-not-allowed bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]'\n\nexport const dividedClass = 'divide-y divide-[var(--gr-brd)]'\n\nexport const emptyClass = 'px-4 py-6 text-center text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)] text-[var(--gr-muted-fg)]'\n\n/**\n * Ручка не табируется: внутри роверного композита свой таб-стоп сломал бы\n * правило «один Tab на список» — тот же приём, что у ручки `GrTree`.\n */\n/**\n * `[touch-action:none]` вместо `touch-none`: утилиты нет ни в `presetMini`, ни\n * в extra-rules, класс молча не превратился бы в CSS — и вертикальный свайп по\n * ручке ушёл бы в прокрутку страницы. Тот же приём у дорожки `GrSlider`.\n */\nexport const handleClass = 'flex shrink-0 items-center justify-center rounded-[var(--gr-radius-sm)] text-[var(--gr-sortable-handle-color,var(--gr-muted-fg))] size-[var(--gr-sortable-handle-size,1.5rem)] cursor-grab [touch-action:none] focus:outline-none'\n\nexport const handleDisabledClass = 'cursor-not-allowed text-[var(--gr-muted-fg)]'\n\nexport const contentClass = 'min-w-0 flex-1 text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)]'\n\n/**\n * Куда встанет строка — псевдоэлемент самой строки, а не отдельный узел:\n * лишний узел между строками ломает и `divide-y`, и подсчёт позиций.\n */\nexport const indicatorBeforeClass = 'before:absolute before:inset-x-0 before:top-0 before:h-[var(--gr-sortable-indicator-width,2px)] before:bg-[var(--gr-sortable-indicator,var(--gr-primary))] before:content-empty'\n\nexport const indicatorAfterClass = 'after:absolute after:inset-x-0 after:bottom-0 after:h-[var(--gr-sortable-indicator-width,2px)] after:bg-[var(--gr-sortable-indicator,var(--gr-primary))] after:content-empty'\n"],"mappings":";;;;;;AAQA,IAAa,YAAmD;CAC9D,UAAU;CACV,YAAY;AACd;AAEA,IAAa,iBAAiB;;;;;AAM9B,IAAa,gBAAgB;AAE7B,IAAa,mBAAmB;;AAGhC,IAAa,kBAAkB;AAE/B,IAAa,mBAAmB;AAEhC,IAAa,eAAe;AAE5B,IAAa,aAAa;;;;;;;;;;AAW1B,IAAa,cAAc;AAE3B,IAAa,sBAAsB;AAEnC,IAAa,eAAe;;;;;AAM5B,IAAa,uBAAuB;AAEpC,IAAa,sBAAsB"}

package/dist/chunks/grTableStyles-CPSxDTOW.js

@@ -0,0 +1,66 @@
+//#region src/components/GrTable/grTableStyles.ts
+/**
+* `GrTable` — «тонкий» контейнер: он задаёт только кегль таблицы, паддинги
+* ячеек остаются за потребителем (см. `GrTableProps`). Поэтому карта здесь
+* одна, а метрики ячеек живут в `GrDataTable`, который рисует их сам.
+*/
+/**
+* Лестница 12/13/14/16 совпадает с `GrInput`, `GrTextarea` и `GrSelect` — это
+* типографика контролов пакета, а не самодеятельность таблицы. В шкале
+* `--gr-text-*` ступени 13px нет, и подстановка `--gr-text-sm` схлопнула бы
+* `sm` и `md` в один кегль. Перевод всей лестницы на токены — отдельная
+* системная задача.
+*/
+var tableSizes = {
+	xs: "text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]",
+	sm: "text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]",
+	md: "text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]",
+	lg: "text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]"
+};
+/**
+* Строка или группа строк, которая не входит в набор: подробности раскрытой
+* строки, распорки виртуализатора. Помеченная ею `<tr>` не полосатится, не
+* подсвечивается и **не участвует в счёте чётности** соседей.
+*/
+var DETAIL_ROW_ATTR = "data-gr-table-off-grid";
+/**
+* Только оттенок, без утилиты вокруг: целый класс отдельным литералом гейт
+* safelist читает как употреблённый в разметке и требует его объявить, хотя
+* сам по себе он нигде не стоит — он всегда хвост варианта.
+*/
+var STRIPE_TINT = "color-mix(in_srgb,var(--gr-muted)_35%,transparent)";
+var HOVER_TINT = "color-mix(in_srgb,var(--gr-muted)_45%,transparent)";
+/**
+* Чередование строк и подсветка под курсором — на таблице, а не на ячейках.
+*
+* Форм тела две, и селектора поэтому тоже два. Обычное тело — одна `<tbody>`
+* со строками; тело `GrDataTable` — группа `<tbody>` на строку, потому что
+* второй ярус обязан лежать со своей строкой в одной группе (см. `rowGroups`
+* у `GrTable`). Каждый селектор в чужой форме не совпадает ни с чем: в одной
+* группе строка набора всегда первая, а единственная `<tbody>` никогда не
+* чётная, — так что оба живут рядом и не спорят.
+*
+* `of S` здесь обязателен, и `:not()` снаружи его не заменяет: `nth-child`
+* считает позицию среди **всех** сиблингов, поэтому обычный фильтр убрал бы
+* полосу с самой служебной строки, но сдвинул бы чётность у всех, кто ниже.
+* Форма `of S` перенумеровывает по отфильтрованному набору — это и нужно.
+*/
+var stripedClass = [`[&>tbody>tr:nth-child(even_of_:not([${DETAIL_ROW_ATTR}]))]:bg-[${STRIPE_TINT}]`, `[&>tbody:nth-child(even_of_tbody:not([${DETAIL_ROW_ATTR}]))>tr:not([${DETAIL_ROW_ATTR}])]:bg-[${STRIPE_TINT}]`].join(" ");
+var hoverableClass = `[&>tbody>tr:not([${DETAIL_ROW_ATTR}]):hover]:bg-[${HOVER_TINT}]`;
+/**
+* Фон первой ячейки, когда колонка липкая.
+*
+* Наследовать фон строки нельзя, хотя это и просится: оттенки полосы и
+* подсветки **полупрозрачны** (`color-mix(…, transparent)`), и сквозь такую
+* ячейку уезжающие числа видно насквозь — проверено глазами. Поэтому те же
+* оттенки собираются заново поверх непрозрачной карточки: визуально это тот же
+* цвет, но без дыры.
+*/
+var STRIPE_OPAQUE = "color-mix(in_srgb,var(--gr-muted)_35%,var(--gr-card))";
+var HOVER_OPAQUE = "color-mix(in_srgb,var(--gr-muted)_45%,var(--gr-card))";
+var stickyColumnStripedClass = `[&>tbody>tr:nth-child(even_of_:not([${DETAIL_ROW_ATTR}]))>*:first-child]:bg-[${STRIPE_OPAQUE}]`;
+var stickyColumnHoverableClass = `[&>tbody>tr:not([${DETAIL_ROW_ATTR}]):hover>*:first-child]:bg-[${HOVER_OPAQUE}]`;
+var emptyCellClass = "px-4 py-8 text-center text-[var(--gr-muted-fg)]";
+var loadingRowCellClass = "px-4 py-3";
+//#endregion
+export { stickyColumnStripedClass as a, stickyColumnHoverableClass as i, hoverableClass as n, stripedClass as o, loadingRowCellClass as r, tableSizes as s, emptyCellClass as t };

package/dist/chunks/grTableStyles-CPSxDTOW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grTableStyles-CPSxDTOW.js","names":[],"sources":["../../src/components/GrTable/grTableStyles.ts"],"sourcesContent":["import type { GrComponentSize } from '../shared/sizes'\n\nexport type GrTableSize = GrComponentSize\n\n/**\n * `GrTable` — «тонкий» контейнер: он задаёт только кегль таблицы, паддинги\n * ячеек остаются за потребителем (см. `GrTableProps`). Поэтому карта здесь\n * одна, а метрики ячеек живут в `GrDataTable`, который рисует их сам.\n */\n/**\n * Лестница 12/13/14/16 совпадает с `GrInput`, `GrTextarea` и `GrSelect` — это\n * типографика контролов пакета, а не самодеятельность таблицы. В шкале\n * `--gr-text-*` ступени 13px нет, и подстановка `--gr-text-sm` схлопнула бы\n * `sm` и `md` в один кегль. Перевод всей лестницы на токены — отдельная\n * системная задача.\n */\nexport const tableSizes: Record<GrTableSize, string> = {\n  xs: 'text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  sm: 'text-[length:var(--gr-control-text-sm)] leading-[var(--gr-control-leading-sm)]',\n  md: 'text-[length:var(--gr-control-text-md)] leading-[var(--gr-leading-sm)]',\n  lg: 'text-[length:var(--gr-control-text-lg)] leading-[var(--gr-leading-base)]',\n}\n\n/**\n * Строка или группа строк, которая не входит в набор: подробности раскрытой\n * строки, распорки виртуализатора. Помеченная ею `<tr>` не полосатится, не\n * подсвечивается и **не участвует в счёте чётности** соседей.\n */\nexport const DETAIL_ROW_ATTR = 'data-gr-table-off-grid'\n\n/**\n * Только оттенок, без утилиты вокруг: целый класс отдельным литералом гейт\n * safelist читает как употреблённый в разметке и требует его объявить, хотя\n * сам по себе он нигде не стоит — он всегда хвост варианта.\n */\nconst STRIPE_TINT = 'color-mix(in_srgb,var(--gr-muted)_35%,transparent)'\nconst HOVER_TINT = 'color-mix(in_srgb,var(--gr-muted)_45%,transparent)'\n\n/**\n * Чередование строк и подсветка под курсором — на таблице, а не на ячейках.\n *\n * Форм тела две, и селектора поэтому тоже два. Обычное тело — одна `<tbody>`\n * со строками; тело `GrDataTable` — группа `<tbody>` на строку, потому что\n * второй ярус обязан лежать со своей строкой в одной группе (см. `rowGroups`\n * у `GrTable`). Каждый селектор в чужой форме не совпадает ни с чем: в одной\n * группе строка набора всегда первая, а единственная `<tbody>` никогда не\n * чётная, — так что оба живут рядом и не спорят.\n *\n * `of S` здесь обязателен, и `:not()` снаружи его не заменяет: `nth-child`\n * считает позицию среди **всех** сиблингов, поэтому обычный фильтр убрал бы\n * полосу с самой служебной строки, но сдвинул бы чётность у всех, кто ниже.\n * Форма `of S` перенумеровывает по отфильтрованному набору — это и нужно.\n */\nexport const stripedClass = [\n  `[&>tbody>tr:nth-child(even_of_:not([${DETAIL_ROW_ATTR}]))]:bg-[${STRIPE_TINT}]`,\n  `[&>tbody:nth-child(even_of_tbody:not([${DETAIL_ROW_ATTR}]))>tr:not([${DETAIL_ROW_ATTR}])]:bg-[${STRIPE_TINT}]`,\n].join(' ')\n\nexport const hoverableClass = `[&>tbody>tr:not([${DETAIL_ROW_ATTR}]):hover]:bg-[${HOVER_TINT}]`\n\n/**\n * Фон первой ячейки, когда колонка липкая.\n *\n * Наследовать фон строки нельзя, хотя это и просится: оттенки полосы и\n * подсветки **полупрозрачны** (`color-mix(…, transparent)`), и сквозь такую\n * ячейку уезжающие числа видно насквозь — проверено глазами. Поэтому те же\n * оттенки собираются заново поверх непрозрачной карточки: визуально это тот же\n * цвет, но без дыры.\n */\nconst STRIPE_OPAQUE = 'color-mix(in_srgb,var(--gr-muted)_35%,var(--gr-card))'\nconst HOVER_OPAQUE = 'color-mix(in_srgb,var(--gr-muted)_45%,var(--gr-card))'\n\nexport const stickyColumnStripedClass = `[&>tbody>tr:nth-child(even_of_:not([${DETAIL_ROW_ATTR}]))>*:first-child]:bg-[${STRIPE_OPAQUE}]`\n\nexport const stickyColumnHoverableClass = `[&>tbody>tr:not([${DETAIL_ROW_ATTR}]):hover>*:first-child]:bg-[${HOVER_OPAQUE}]`\n\nexport const emptyCellClass = 'px-4 py-8 text-center text-[var(--gr-muted-fg)]'\nexport const loadingRowCellClass = 'px-4 py-3'\n"],"mappings":";;;;;;;;;;;;;AAgBA,IAAa,aAA0C;CACrD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;AAOA,IAAa,kBAAkB;;;;;;AAO/B,IAAM,cAAc;AACpB,IAAM,aAAa;;;;;;;;;;;;;;;;AAiBnB,IAAa,eAAe,CAC1B,uCAAuC,gBAAgB,WAAW,YAAY,IAC9E,yCAAyC,gBAAgB,cAAc,gBAAgB,UAAU,YAAY,EAC/G,CAAC,CAAC,KAAK,GAAG;AAEV,IAAa,iBAAiB,oBAAoB,gBAAgB,gBAAgB,WAAW;;;;;;;;;;AAW7F,IAAM,gBAAgB;AACtB,IAAM,eAAe;AAErB,IAAa,2BAA2B,uCAAuC,gBAAgB,yBAAyB,cAAc;AAEtI,IAAa,6BAA6B,oBAAoB,gBAAgB,8BAA8B,aAAa;AAEzH,IAAa,iBAAiB;AAC9B,IAAa,sBAAsB"}

package/dist/chunks/{config-CMNfZO7S.js → grTabsStyles-DIz2VdIm.js}

@@ -1,5 +1,3 @@
-import { n as splitClassTokens } from "./classTokens-8v2XC74x.js";
-import { defineGranularComponent } from "@feugene/unocss-preset-granular/contract";
 //#region src/components/GrTabs/grTabsStyles.ts
 /** Высота вкладки повторяет шкалу `GrButton`: вкладки часто стоят с ним в один ряд. */
 var tabSizes = {
@@ -123,37 +121,4 @@ function grTabsEmptyClass(size) {
 	return [tabsEmptyBase, tabSizes[size]].join(" ");
 }
 //#endregion
-//#region src/components/GrTabs/safelist.ts
-var grTabsSafelist = [.../* @__PURE__ */ new Set([
-	...Object.values(tabSizes).flatMap(splitClassTokens),
-	...Object.values(tabBadgeSizes).flatMap(splitClassTokens),
-	...Object.values(tabCloseSizes).flatMap(splitClassTokens),
-	...Object.values(tabCloseIconSizes).flatMap(splitClassTokens),
-	...Object.values(tablistSizes).flatMap(splitClassTokens),
-	...Object.values(tablistLineSizes).flatMap(splitClassTokens),
-	...Object.values(tablistVariants).flatMap(splitClassTokens),
-	...Object.values(tablistVerticalVariants).flatMap(splitClassTokens),
-	...Object.values(tabVariantBase).flatMap(splitClassTokens),
-	...Object.values(tabStateClasses).flatMap((state) => [
-		...splitClassTokens(state.active),
-		...splitClassTokens(state.idle),
-		...splitClassTokens(state.disabled)
-	]),
-	...splitClassTokens(tablistBase),
-	...splitClassTokens(tablistScrollClass),
-	...splitClassTokens(tablistColumnClass),
-	...splitClassTokens(tabBase),
-	...splitClassTokens(tabBadgeBase),
-	...splitClassTokens(tabContentClass),
-	...splitClassTokens(tabIconClass),
-	...splitClassTokens(tabCloseBase),
-	...splitClassTokens(tabsEmptyBase)
-])];
-//#endregion
-//#region src/components/GrTabs/config.ts
-var grTabsConfig = defineGranularComponent(import.meta.url, {
-	name: "GrTabs",
-	safelist: grTabsSafelist
-});
-//#endregion
-export { grTabsEmptyClass as a, tabCloseIconSizes as c, grTabsCloseClass as i, tabContentClass as l, grTabsSafelist as n, grTabsListClass as o, grTabsBadgeClass as r, grTabsTabClass as s, grTabsConfig as t, tabIconClass as u };
+export { tablistVerticalVariants as C, tablistVariants as S, tablistBase as _, grTabsTabClass as a, tablistScrollClass as b, tabBase as c, tabCloseSizes as d, tabContentClass as f, tabVariantBase as g, tabStateClasses as h, grTabsListClass as i, tabCloseBase as l, tabSizes as m, grTabsCloseClass as n, tabBadgeBase as o, tabIconClass as p, grTabsEmptyClass as r, tabBadgeSizes as s, grTabsBadgeClass as t, tabCloseIconSizes as u, tablistColumnClass as v, tabsEmptyBase as w, tablistSizes as x, tablistLineSizes as y };

package/dist/chunks/grTabsStyles-DIz2VdIm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grTabsStyles-DIz2VdIm.js","names":[],"sources":["../../src/components/GrTabs/grTabsStyles.ts"],"sourcesContent":["import type { GrComponentSize } from '../shared/sizes'\n\nexport type GrTabsSize = GrComponentSize\n\n/**\n * `pills` — вкладки-таблетки в общей обойме, `line` — классический ряд с\n * подчёркиванием активной. Имя `pills` общее с `GrSegmented`: у компонентов\n * одна роль, и вид с таким названием у них совпадает.\n */\nexport const GR_TABS_VARIANTS = ['pills', 'line'] as const\nexport type GrTabsVariant = typeof GR_TABS_VARIANTS[number]\n\nexport type GrTabsOrientation = 'horizontal' | 'vertical'\n\n/** Высота вкладки повторяет шкалу `GrButton`: вкладки часто стоят с ним в один ряд. */\nexport const tabSizes: Record<GrTabsSize, string> = {\n  xs: 'h-7 px-2 text-[length:var(--gr-text-xs)] leading-[var(--gr-leading-xs)]',\n  sm: 'h-8 px-2.5 text-[length:var(--gr-text-xs)] leading-[var(--gr-leading-xs)]',\n  md: 'h-10 px-3 text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)]',\n  lg: 'h-11 px-4 text-[length:var(--gr-text-base)] leading-[var(--gr-leading-base)]',\n}\n\n/** Счётчик у вкладки: на ступень мельче подписи. */\nexport const tabBadgeSizes: Record<GrTabsSize, string> = {\n  xs: 'text-[length:var(--gr-text-2xs)] leading-[var(--gr-leading-2xs)] px-1 py-0.5',\n  sm: 'text-[length:var(--gr-text-2xs)] leading-[var(--gr-leading-2xs)] px-1.5 py-0.5',\n  md: 'text-[length:var(--gr-text-2xs)] leading-[var(--gr-leading-2xs)] px-1.5 py-0.5',\n  lg: 'text-[length:var(--gr-text-xs)] leading-[var(--gr-leading-xs)] px-2 py-0.5',\n}\n\n/** Обойма вокруг вкладок: на мелких ступенях рамка съедала бы высоту. */\nexport const tablistSizes: Record<GrTabsSize, string> = {\n  xs: 'gap-0.5 p-0.5',\n  sm: 'gap-1 p-1',\n  md: 'gap-1 p-1',\n  lg: 'gap-1 p-1.5',\n}\n\n/** `line` живёт без обоймы, поэтому и без внутренних отступов. */\nexport const tablistLineSizes: Record<GrTabsSize, string> = {\n  xs: 'gap-1',\n  sm: 'gap-2',\n  md: 'gap-2',\n  lg: 'gap-3',\n}\n\nexport const tablistBase = 'inline-flex max-w-full'\n\nexport const tablistVariants: Record<GrTabsVariant, string> = {\n  pills: 'rounded-[var(--gr-radius-lg)] border border-[var(--gr-brd)] bg-[var(--gr-muted)]',\n  line: 'border-b border-[var(--gr-brd)]',\n}\n\n/**\n * Вертикальный `line` подчёркивает вкладку сбоку, а не снизу: линия должна идти\n * вдоль списка, иначе она отделяет вкладки друг от друга вместо ряда целиком.\n */\nexport const tablistVerticalVariants: Record<GrTabsVariant, string> = {\n  pills: '',\n  line: 'border-b-0 border-r border-[var(--gr-brd)]',\n}\n\n/**\n * Переполнение прокручивается, а не переносится строкой: перенос ломает ряд и\n * уводит вкладки под панель. Полоса прокрутки скрыта — ряд ведёт клавиатура и\n * автоскролл к активной вкладке.\n */\nexport const tablistScrollClass = 'overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden'\n\n/** Вертикальный ряд — колонка; прокрутки ему не нужно: он растёт вниз. */\nexport const tablistColumnClass = 'flex-col'\n\nexport const tabBase = 'shrink-0 font-600 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]'\n\n// Цвет подчёркивания задаёт только состояние: `border-transparent` в базе имеет\n// ту же специфичность, что и цвет активной вкладки, и побеждал бы через раз —\n// по порядку правил в сгенерированном CSS, а не по порядку классов в атрибуте.\nexport const tabVariantBase: Record<GrTabsVariant, string> = {\n  pills: 'rounded-[var(--gr-radius-md)]',\n  line: 'rounded-[var(--gr-radius-md)] rounded-b-[var(--gr-radius-none)] border-b-2 -mb-px',\n}\n\nexport const tabStateClasses: Record<GrTabsVariant, { active: string, idle: string, disabled: string }> = {\n  pills: {\n    active: 'bg-[var(--gr-card)] text-[var(--gr-fg)] border border-[var(--gr-brd)]',\n    idle: 'text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)] hover:bg-[color-mix(in_srgb,var(--gr-card)_70%,transparent)]',\n    disabled: 'cursor-not-allowed text-[var(--gr-disabled-fg)]',\n  },\n  line: {\n    active: 'border-[var(--gr-primary)] text-[var(--gr-fg)]',\n    idle: 'border-transparent text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)] hover:border-[var(--gr-brd)]',\n    disabled: 'border-transparent cursor-not-allowed text-[var(--gr-disabled-fg)]',\n  },\n}\n\nexport const tabIconClass = 'h-4 w-4 shrink-0'\n\nexport const tabContentClass = 'inline-flex items-center gap-2'\n\n/**\n * Крестик закрытия. Кнопкой он быть не может: `role=\"tab\"` объявляет потомков\n * презентационными, и вложенный интерактив теряется у скринридера (axe:\n * `nested-interactive`). Поэтому это `<span>`, а клик по нему разбирает\n * обработчик самой вкладки.\n *\n * Своего фокус-кольца у него нет по той же причине — в таб-порядке он не стоит,\n * с клавиатуры закрытие идёт по `Delete`/`Backspace`.\n */\nexport const tabCloseBase = 'inline-flex items-center justify-center shrink-0 rounded-[var(--gr-radius-sm)] text-[var(--gr-muted-fg)] transition-colors hover:bg-[var(--gr-muted)] hover:text-[var(--gr-fg)]'\n\nexport const tabCloseSizes: Record<GrTabsSize, string> = {\n  xs: 'h-4 w-4',\n  sm: 'h-4 w-4',\n  md: 'h-5 w-5',\n  lg: 'h-5 w-5',\n}\n\nexport const tabCloseIconSizes: Record<GrTabsSize, string> = {\n  xs: 'h-3 w-3',\n  sm: 'h-3 w-3',\n  md: 'h-4 w-4',\n  lg: 'h-4 w-4',\n}\n\n/** Пустой ряд держит высоту вкладки: иначе соседние блоки прыгают при закрытии последней. */\nexport const tabsEmptyBase = 'inline-flex items-center text-[var(--gr-muted-fg)]'\n\nexport const tabBadgeBase = 'rounded-[var(--gr-radius-full)] bg-[var(--gr-secondary)] text-[var(--gr-secondary-fg)]'\n\nexport function grTabsListClass(options: {\n  variant: GrTabsVariant\n  size: GrTabsSize\n  orientation: GrTabsOrientation\n}): string {\n  const vertical = options.orientation === 'vertical'\n\n  return [\n    tablistBase,\n    tablistVariants[options.variant],\n    vertical ? tablistVerticalVariants[options.variant] : '',\n    options.variant === 'pills' ? tablistSizes[options.size] : tablistLineSizes[options.size],\n    vertical ? tablistColumnClass : tablistScrollClass,\n  ].filter(Boolean).join(' ')\n}\n\nexport function grTabsTabClass(options: {\n  variant: GrTabsVariant\n  size: GrTabsSize\n  active: boolean\n  disabled: boolean\n}): string {\n  const state = tabStateClasses[options.variant]\n\n  return [\n    tabBase,\n    tabVariantBase[options.variant],\n    tabSizes[options.size],\n    options.disabled ? state.disabled : options.active ? state.active : state.idle,\n  ].join(' ')\n}\n\nexport function grTabsBadgeClass(size: GrTabsSize): string {\n  return [tabBadgeBase, tabBadgeSizes[size]].join(' ')\n}\n\nexport function grTabsCloseClass(size: GrTabsSize): string {\n  return [tabCloseBase, tabCloseSizes[size]].join(' ')\n}\n\nexport function grTabsEmptyClass(size: GrTabsSize): string {\n  return [tabsEmptyBase, tabSizes[size]].join(' ')\n}\n"],"mappings":";;AAeA,IAAa,WAAuC;CAClD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,gBAA4C;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,eAA2C;CACtD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,mBAA+C;CAC1D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,cAAc;AAE3B,IAAa,kBAAiD;CAC5D,OAAO;CACP,MAAM;AACR;;;;;AAMA,IAAa,0BAAyD;CACpE,OAAO;CACP,MAAM;AACR;;;;;;AAOA,IAAa,qBAAqB;;AAGlC,IAAa,qBAAqB;AAElC,IAAa,UAAU;AAKvB,IAAa,iBAAgD;CAC3D,OAAO;CACP,MAAM;AACR;AAEA,IAAa,kBAA6F;CACxG,OAAO;EACL,QAAQ;EACR,MAAM;EACN,UAAU;CACZ;CACA,MAAM;EACJ,QAAQ;EACR,MAAM;EACN,UAAU;CACZ;AACF;AAEA,IAAa,eAAe;AAE5B,IAAa,kBAAkB;;;;;;;;;;AAW/B,IAAa,eAAe;AAE5B,IAAa,gBAA4C;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,oBAAgD;CAC3D,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,gBAAgB;AAE7B,IAAa,eAAe;AAE5B,SAAgB,gBAAgB,SAIrB;CACT,MAAM,WAAW,QAAQ,gBAAgB;CAEzC,OAAO;EACL;EACA,gBAAgB,QAAQ;EACxB,WAAW,wBAAwB,QAAQ,WAAW;EACtD,QAAQ,YAAY,UAAU,aAAa,QAAQ,QAAQ,iBAAiB,QAAQ;EACpF,WAAW,qBAAqB;CAClC,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AAC5B;AAEA,SAAgB,eAAe,SAKpB;CACT,MAAM,QAAQ,gBAAgB,QAAQ;CAEtC,OAAO;EACL;EACA,eAAe,QAAQ;EACvB,SAAS,QAAQ;EACjB,QAAQ,WAAW,MAAM,WAAW,QAAQ,SAAS,MAAM,SAAS,MAAM;CAC5E,CAAC,CAAC,KAAK,GAAG;AACZ;AAEA,SAAgB,iBAAiB,MAA0B;CACzD,OAAO,CAAC,cAAc,cAAc,KAAK,CAAC,CAAC,KAAK,GAAG;AACrD;AAEA,SAAgB,iBAAiB,MAA0B;CACzD,OAAO,CAAC,cAAc,cAAc,KAAK,CAAC,CAAC,KAAK,GAAG;AACrD;AAEA,SAAgB,iBAAiB,MAA0B;CACzD,OAAO,CAAC,eAAe,SAAS,KAAK,CAAC,CAAC,KAAK,GAAG;AACjD"}

package/dist/chunks/grTooltipStyles-CtbGEEGV.js

@@ -0,0 +1,24 @@
+//#region src/components/GrTooltip/grTooltipStyles.ts
+/** Панель подсказки: кегль и внутренние поля. */
+var panelSizes = {
+	xs: "px-1.5 py-0.5 text-[length:var(--gr-control-text-3xs)] leading-[var(--gr-control-leading-3xs)]",
+	sm: "px-2 py-1 text-[length:var(--gr-control-text-2xs)] leading-[var(--gr-control-leading-2xs)]",
+	md: "px-2 py-1 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]",
+	lg: "px-3 py-1.5 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]"
+};
+/** Ширина панели растёт вместе с кеглем — иначе на `lg` строка рвётся втрое. */
+var panelWidths = {
+	xs: "max-w-[220px]",
+	sm: "max-w-[260px]",
+	md: "max-w-[280px]",
+	lg: "max-w-[340px]"
+};
+/** Дефолтный триггер — иконка info из шкалы `GrIcon` (`xs…lg` → `14…20px`). */
+var triggerIconSizes = {
+	xs: "xs",
+	sm: "xs",
+	md: "sm",
+	lg: "md"
+};
+//#endregion
+export { panelWidths as n, triggerIconSizes as r, panelSizes as t };

package/dist/chunks/grTooltipStyles-CtbGEEGV.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grTooltipStyles-CtbGEEGV.js","names":[],"sources":["../../src/components/GrTooltip/grTooltipStyles.ts"],"sourcesContent":["import type { GrComponentSize } from '../shared/sizes'\n\nexport type GrTooltipSize = GrComponentSize\n\n/** Панель подсказки: кегль и внутренние поля. */\nexport const panelSizes: Record<GrTooltipSize, string> = {\n  xs: 'px-1.5 py-0.5 text-[length:var(--gr-control-text-3xs)] leading-[var(--gr-control-leading-3xs)]',\n  sm: 'px-2 py-1 text-[length:var(--gr-control-text-2xs)] leading-[var(--gr-control-leading-2xs)]',\n  md: 'px-2 py-1 text-[length:var(--gr-control-text-xs)] leading-[var(--gr-control-leading-xs)]',\n  lg: 'px-3 py-1.5 text-[length:var(--gr-control-text-md)] leading-[var(--gr-control-leading-md)]',\n}\n\n/** Ширина панели растёт вместе с кеглем — иначе на `lg` строка рвётся втрое. */\nexport const panelWidths: Record<GrTooltipSize, string> = {\n  xs: 'max-w-[220px]',\n  sm: 'max-w-[260px]',\n  md: 'max-w-[280px]',\n  lg: 'max-w-[340px]',\n}\n\n/** Дефолтный триггер — иконка info из шкалы `GrIcon` (`xs…lg` → `14…20px`). */\nexport const triggerIconSizes: Record<GrTooltipSize, GrComponentSize> = {\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n  lg: 'md',\n}\n"],"mappings":";;AAKA,IAAa,aAA4C;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,cAA6C;CACxD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;AAGA,IAAa,mBAA2D;CACtE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN"}