@portnet/ui 6.0.2 → 6.0.3

package/dist/esm/v2/theme/cssVariables.js

@@ -1,13 +1,3 @@
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 /**
  * CSS Variables emitter — Portnet UI v2
  *
@@ -35,13 +25,13 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  *   same resolvers (./_brand, ./_brandSecondary) so mismatches are
  *   structurally impossible.
  */
-import { ink, surface, border, semantic, status, dark, fontFamily, fontSize, fontWeight, lineHeight, letterSpacing, spacing, radius, shadows, duration, easing, zIndex, density, layout, breakpoints, state } from "../tokens";
+import { ink, surface, border, semantic, status, dark, fontFamily, fontSize, fontWeight, lineHeight, letterSpacing, spacing, radius, shadows, duration, easing, zIndex, density, layout, breakpoints, state, chartCategorical } from "../tokens";
 import { resolveBrand } from "./_brand";
 import { resolveBrandSecondary } from "./_brandSecondary";
 
 /** Options for the CSS-variable emitter / injector. */
 
-var STYLE_TAG_ID = "portnet-ui-v2-tokens";
+const STYLE_TAG_ID = "portnet-ui-v2-tokens";
 
 /**
  * Spacing partition: numeric grid keys (s1..s10) vs semantic aliases
@@ -51,30 +41,21 @@ var STYLE_TAG_ID = "portnet-ui-v2-tokens";
  *
  * Uses Object.entries at module-load time — pure / no side-effects.
  */
-var NUMERIC_GRID_RE = /^s\d+$/;
-var SPACING_ENTRIES = Object.entries(spacing);
-var NUMERIC_ENTRIES = SPACING_ENTRIES.filter(function (_ref) {
-  var _ref2 = _slicedToArray(_ref, 1),
-    k = _ref2[0];
-  return NUMERIC_GRID_RE.test(k);
-});
-var ALIAS_ENTRIES = SPACING_ENTRIES.filter(function (_ref3) {
-  var _ref4 = _slicedToArray(_ref3, 1),
-    k = _ref4[0];
-  return !NUMERIC_GRID_RE.test(k);
-});
+const NUMERIC_GRID_RE = /^s\d+$/;
+const SPACING_ENTRIES = Object.entries(spacing);
+const NUMERIC_ENTRIES = SPACING_ENTRIES.filter(([k]) => NUMERIC_GRID_RE.test(k));
+const ALIAS_ENTRIES = SPACING_ENTRIES.filter(([k]) => !NUMERIC_GRID_RE.test(k));
 
 /**
  * Emits the canonical :root block + sidebar / density / dark-mode overrides.
  * Pass a partial `brand` / `brandSecondary` to mirror a host theme override
  * (use the SAME object you pass to createPortnetTheme so the two layers agree).
  */
-export function getCssVariables() {
-  var _radius$none;
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  var brand = resolveBrand(options.brand);
-  var brandSecondary = resolveBrandSecondary(options.brandSecondary);
-  var lightVars = ["/* \u2500\u2500 Brand \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--accent: ".concat(brand.accent, ";"), "--accent-hover: ".concat(brand.accentHover, ";"), "--accent-soft: ".concat(brand.accentSoft, ";"), "--accent-fg: ".concat(brand.accentFg, ";"), "", "/* \u2500\u2500 Brand secondary \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--secondary: ".concat(brandSecondary.secondary, ";"), "--secondary-fg: ".concat(brandSecondary.secondaryFg, ";"), "", "/* \u2500\u2500 Ink \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--fg: ".concat(ink.fg, ";"), "--fg-muted: ".concat(ink.fgMuted, ";"), "--fg-subtle: ".concat(ink.fgSubtle, ";"), "--fg-inverse: ".concat(ink.fgInverse, ";"), "", "/* \u2500\u2500 Surface \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--bg: ".concat(surface.bg, ";"), "--bg-elev: ".concat(surface.bgElev, ";"), "--bg-subtle: ".concat(surface.bgSubtle, ";"), "--bg-hover: ".concat(surface.bgHover, ";"), "--surface: ".concat(surface.surface, ";"), "", "/* \u2500\u2500 Border \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--border: ".concat(border.border, ";"), "--border-strong: ".concat(border.borderStrong, ";"), "", "/* \u2500\u2500 Semantic \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "/* Each concept has a saturated fill (--<name>) and a darker text */", "/* foreground (--<name>-fg). Pair fills with text on the same surface. */", "--success: ".concat(semantic.success, ";"), "--success-soft: ".concat(semantic.successSoft, ";"), "--success-fg: ".concat(semantic.successFg, ";"), "--warning: ".concat(semantic.warning, ";"), "--warning-soft: ".concat(semantic.warningSoft, ";"), "--warning-fg: ".concat(semantic.warningFg, ";"), "--danger: ".concat(semantic.danger, ";"), "--danger-soft: ".concat(semantic.dangerSoft, ";"), "--danger-fg: ".concat(semantic.dangerFg, ";"), "--info: ".concat(semantic.info, ";"), "--info-soft: ".concat(semantic.infoSoft, ";"), "--info-fg: ".concat(semantic.infoFg, ";"), "", "/* \u2500\u2500 Status palette \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--status-new-soft: ".concat(status["new"].soft, ";"), "--status-new-fg: ".concat(status["new"].fg, ";"), "--status-sent-soft: ".concat(status.sent.soft, ";"), "--status-sent-fg: ".concat(status.sent.fg, ";"), "--status-pending-soft: ".concat(status.pending.soft, ";"), "--status-pending-fg: ".concat(status.pending.fg, ";"), "--status-approved-soft: ".concat(status.approved.soft, ";"), "--status-approved-fg: ".concat(status.approved.fg, ";"), "--status-rejected-soft: ".concat(status.rejected.soft, ";"), "--status-rejected-fg: ".concat(status.rejected.fg, ";"), "--status-neutral-soft: ".concat(status.neutral.soft, ";"), "--status-neutral-fg: ".concat(status.neutral.fg, ";"), "", "/* \u2500\u2500 State overlays (B2 \u2014 currentColor-based) \u2500\u2500\u2500 */", "--state-hover-overlay: ".concat(state.hoverOverlay, ";"), "--state-pressed-overlay: ".concat(state.pressedOverlay, ";"), "--state-selected-overlay: ".concat(state.selectedOverlay, ";"), "", "/* \u2500\u2500 Typography \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--font-sans: ".concat(fontFamily.sans, ";"), "--font-mono: ".concat(fontFamily.mono, ";"), "--text-display: ".concat(fontSize.display, "px;"), "--text-h2: ".concat(fontSize.h2, "px;"), "--text-h3: ".concat(fontSize.h3, "px;"), "--text-h4: ".concat(fontSize.h4, "px;"), "--text-body: ".concat(fontSize.body, "px;"), "--text-sm: ".concat(fontSize.sm, "px;"), "--text-xs: ".concat(fontSize.xs, "px;"), "--fw-regular: ".concat(fontWeight.regular, ";"), "--fw-medium: ".concat(fontWeight.medium, ";"), "--fw-semibold: ".concat(fontWeight.semibold, ";"), "--fw-bold: ".concat(fontWeight.bold, ";"), // NOTE: there is deliberately no heavier weight than bold (700). Batch 1
+export function getCssVariables(options = {}) {
+  const brand = resolveBrand(options.brand);
+  const brandSecondary = resolveBrandSecondary(options.brandSecondary);
+  const lightVars = [`/* ── Brand ─────────────────────────────────────── */`, `--accent: ${brand.accent};`, `--accent-hover: ${brand.accentHover};`, `--accent-soft: ${brand.accentSoft};`, `--accent-fg: ${brand.accentFg};`, ``, `/* ── Brand secondary ───────────────────────────── */`, `--secondary: ${brandSecondary.secondary};`, `--secondary-fg: ${brandSecondary.secondaryFg};`, ``, `/* ── Ink ───────────────────────────────────────── */`, `--fg: ${ink.fg};`, `--fg-muted: ${ink.fgMuted};`, `--fg-subtle: ${ink.fgSubtle};`, `--fg-inverse: ${ink.fgInverse};`, ``, `/* ── Surface ───────────────────────────────────── */`, `--bg: ${surface.bg};`, `--bg-elev: ${surface.bgElev};`, `--bg-subtle: ${surface.bgSubtle};`, `--bg-hover: ${surface.bgHover};`, `--surface: ${surface.surface};`, ``, `/* ── Border ────────────────────────────────────── */`, `--border: ${border.border};`, `--border-strong: ${border.borderStrong};`, ``, `/* ── Semantic ──────────────────────────────────── */`, `/* Each concept has a saturated fill (--<name>) and a darker text */`, `/* foreground (--<name>-fg). Pair fills with text on the same surface. */`, `--success: ${semantic.success};`, `--success-soft: ${semantic.successSoft};`, `--success-fg: ${semantic.successFg};`, `--warning: ${semantic.warning};`, `--warning-soft: ${semantic.warningSoft};`, `--warning-fg: ${semantic.warningFg};`, `--danger: ${semantic.danger};`, `--danger-soft: ${semantic.dangerSoft};`, `--danger-fg: ${semantic.dangerFg};`, `--info: ${semantic.info};`, `--info-soft: ${semantic.infoSoft};`, `--info-fg: ${semantic.infoFg};`, ``, `/* ── Status palette ────────────────────────────── */`, `--status-new-soft: ${status.new.soft};`, `--status-new-fg: ${status.new.fg};`, `--status-sent-soft: ${status.sent.soft};`, `--status-sent-fg: ${status.sent.fg};`, `--status-pending-soft: ${status.pending.soft};`, `--status-pending-fg: ${status.pending.fg};`, `--status-approved-soft: ${status.approved.soft};`, `--status-approved-fg: ${status.approved.fg};`, `--status-rejected-soft: ${status.rejected.soft};`, `--status-rejected-fg: ${status.rejected.fg};`, `--status-neutral-soft: ${status.neutral.soft};`, `--status-neutral-fg: ${status.neutral.fg};`, ``, `/* ── Chart categorical palette (gap G-37) ────── */`, `/* Category fills, NOT workflow state — see tokens/chart. Emitted */`, `/* for CSS and sx; chart libraries should take the JS token, since */`, `/* an SVG presentation attribute given a var() is not resolved by */`, `/* every renderer. NO DARK OVERRIDE IS NEEDED, deliberately: every */`, `/* entry clears the 3:1 non-text floor on the light AND the dark */`, `/* surface, which is the constraint the values were solved for. */`, ...chartCategorical.map((c, i) => `--chart-${i + 1}: ${c};`), ``, `/* ── State overlays (B2 — currentColor-based) ─── */`, `--state-hover-overlay: ${state.hoverOverlay};`, `--state-pressed-overlay: ${state.pressedOverlay};`, `--state-selected-overlay: ${state.selectedOverlay};`, ``, `/* ── Typography ────────────────────────────────── */`, `--font-sans: ${fontFamily.sans};`, `--font-mono: ${fontFamily.mono};`, `--text-display: ${fontSize.display}px;`, `--text-h2: ${fontSize.h2}px;`, `--text-h3: ${fontSize.h3}px;`, `--text-h4: ${fontSize.h4}px;`, `--text-body: ${fontSize.body}px;`, `--text-sm: ${fontSize.sm}px;`, `--text-xs: ${fontSize.xs}px;`, `--fw-regular: ${fontWeight.regular};`, `--fw-medium: ${fontWeight.medium};`, `--fw-semibold: ${fontWeight.semibold};`, `--fw-bold: ${fontWeight.bold};`,
+  // NOTE: there is deliberately no heavier weight than bold (700). Batch 1
   // dropped the black weight from the typography tokens, and this file kept
   // emitting the matching variable for a while — resolving to the literal
   // string "undefined" in :root, which silently flattened every consumer that
@@ -84,43 +65,59 @@ export function getCssVariables() {
   // The old variable name is deliberately not written out: banned-patterns
   // scans raw file text with no comment awareness, so naming it here — even to
   // record its removal — trips the rule that protects this block.
-  "--lh-tight: ".concat(lineHeight.tight, ";"), "--lh-snug: ".concat(lineHeight.snug, ";"), "--lh-normal: ".concat(lineHeight.normal, ";"), "--lh-loose: ".concat(lineHeight.loose, ";"), // A7-02 — letter-spacing scale. Six token names were referenced fleet-wide
+  `--lh-tight: ${lineHeight.tight};`, `--lh-snug: ${lineHeight.snug};`, `--lh-normal: ${lineHeight.normal};`, `--lh-loose: ${lineHeight.loose};`,
+  // A7-02 — letter-spacing scale. Six token names were referenced fleet-wide
   // that this emitter never emitted, so their var() fallbacks were the only
   // thing that ever rendered (R-2.3 / R-AI.1 magic values wearing a token's
   // name). These two had a real platform basis — -0.01em was hardcoded twice
   // in tokens/typography.ts itself, 0.04em inside KV and ConfirmDialog — so
   // they are promoted. `--border-subtle`, `--r-xs`, `--icon-sm`, `--icon-xl`
   // were local inventions and are fixed at their call sites instead.
-  "--ls-tight: ".concat(letterSpacing.tight, ";"), "--ls-normal: ".concat(letterSpacing.normal, ";"), "--ls-wide: ".concat(letterSpacing.wide, ";"), "", "/* \u2500\u2500 Spacing \u2014 numeric grid (8 px base) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */"].concat(_toConsumableArray(NUMERIC_ENTRIES.map(function (_ref5) {
-    var _ref6 = _slicedToArray(_ref5, 2),
-      k = _ref6[0],
-      v = _ref6[1];
-    return "--s-".concat(k.slice(1), ": ").concat(v, "px;");
-  })), ["", "/* \u2500\u2500 Spacing \u2014 semantic aliases \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */"], _toConsumableArray(ALIAS_ENTRIES.map(function (_ref7) {
-    var _ref8 = _slicedToArray(_ref7, 2),
-      k = _ref8[0],
-      v = _ref8[1];
-    return "--space-".concat(k, ": ").concat(v, "px;");
-  })), ["", "/* \u2500\u2500 Radius \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--r-none: ".concat((_radius$none = radius.none) !== null && _radius$none !== void 0 ? _radius$none : 0, "px;"), "--r-sm: ".concat(radius.sm, "px;"), "--r-md: ".concat(radius.md, "px;"), "--r-lg: ".concat(radius.lg, "px;"), "--r-xl: ".concat(radius.xl, "px;"), "--r-full: ".concat(radius.full, "px;"), "", "/* \u2500\u2500 Shadows \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--shadow-xs: ".concat(shadows.xs, ";"), "--shadow-sm: ".concat(shadows.sm, ";"), "--shadow-md: ".concat(shadows.md, ";"), "--shadow-lg: ".concat(shadows.lg, ";"), "--shadow-focus: ".concat(shadows.focus, ";")], _toConsumableArray(shadows.focusFallback ? ["--shadow-focus-fallback: ".concat(shadows.focusFallback, ";")] : []), ["", "/* \u2500\u2500 Motion (temporal vocabulary) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--duration-fast: ".concat(duration.fast, "ms;"), "--duration-base: ".concat(duration.base, "ms;"), "--duration-slow: ".concat(duration.slow, "ms;"), "", "/* \u2500\u2500 Motion (semantic aliases \u2014 B6) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", // Same numeric values as fast/base/slow; intent-readable at the
+  `--ls-tight: ${letterSpacing.tight};`, `--ls-normal: ${letterSpacing.normal};`, `--ls-wide: ${letterSpacing.wide};`, ``, `/* ── Spacing — numeric grid (8 px base) ─────────── */`,
+  // s1..s10 → --s-1 .. --s-10 (preserves all existing consumers).
+  ...NUMERIC_ENTRIES.map(([k, v]) => `--s-${k.slice(1)}: ${v}px;`), ``, `/* ── Spacing — semantic aliases ────────────────── */`,
+  // xs/sm/md/lg/xl/xxl → --space-xs .. --space-xxl. The "space-"
+  // prefix is mandatory: emitting them as raw --xs/--md/--lg
+  // would pollute the global CSS variable namespace.
+  ...ALIAS_ENTRIES.map(([k, v]) => `--space-${k}: ${v}px;`), ``, `/* ── Radius ────────────────────────────────────── */`, `--r-none: ${radius.none ?? 0}px;`, `--r-sm: ${radius.sm}px;`, `--r-md: ${radius.md}px;`, `--r-lg: ${radius.lg}px;`, `--r-xl: ${radius.xl}px;`, `--r-full: ${radius.full}px;`, ``, `/* ── Shadows ───────────────────────────────────── */`, `--shadow-xs: ${shadows.xs};`, `--shadow-sm: ${shadows.sm};`, `--shadow-md: ${shadows.md};`, `--shadow-lg: ${shadows.lg};`, `--shadow-focus: ${shadows.focus};`,
+  // Static rgba fallback for non-CSS-vars contexts (SSR strings,
+  // raw inline `style={{ boxShadow: ... }}` props that bypass CSS).
+  ...(shadows.focusFallback ? [`--shadow-focus-fallback: ${shadows.focusFallback};`] : []), ``, `/* ── Motion (temporal vocabulary) ──────────────── */`, `--duration-fast: ${duration.fast}ms;`, `--duration-base: ${duration.base}ms;`, `--duration-slow: ${duration.slow}ms;`, ``, `/* ── Motion (semantic aliases — B6) ────────────── */`,
+  // Same numeric values as fast/base/slow; intent-readable at the
   // call site. transition() helper recognises both vocabularies.
-  "--duration-microinteraction: ".concat(duration.microinteraction, "ms;"), "--duration-state-change: ".concat(duration.stateChange, "ms;"), "--duration-page-transition: ".concat(duration.pageTransition, "ms;"), "", "/* \u2500\u2500 Easing \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--easing-out: ".concat(easing.out, ";"), "--easing-in: ".concat(easing["in"], ";"), "--easing-soft: ".concat(easing.soft, ";"), "", "/* \u2500\u2500 Z-index \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */"], _toConsumableArray(Object.entries(zIndex).map(function (_ref9) {
-    var _ref0 = _slicedToArray(_ref9, 2),
-      k = _ref0[0],
-      v = _ref0[1];
-    return "--z-".concat(k, ": ").concat(v, ";");
-  })), ["", "/* \u2500\u2500 Layout \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--sidebar-w: ".concat(layout.sidebar, "px;"), "--topbar-h: ".concat(layout.topbar, "px;"), "--content-max: ".concat(layout.contentMax, "px;"), "--form-max: ".concat(layout.formMax, "px;"), "--tactile-min: ".concat(layout.tactileMin, "px;"), "", "/* \u2500\u2500 Breakpoints (R-RS.1) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", // The single breakpoint scale, also wired into the MUI theme and the
+  `--duration-microinteraction: ${duration.microinteraction}ms;`, `--duration-state-change: ${duration.stateChange}ms;`, `--duration-page-transition: ${duration.pageTransition}ms;`, ``, `/* ── Easing ────────────────────────────────────── */`, `--easing-out: ${easing.out};`, `--easing-in: ${easing.in};`, `--easing-soft: ${easing.soft};`, ``, `/* ── Z-index ───────────────────────────────────── */`,
+  // Iterates the full zIndex object — picks up popover/snackbar/
+  // tooltip slots added in Batch 1 and skipLink (Batch 11 / B3)
+  // without code changes here.
+  ...Object.entries(zIndex).map(([k, v]) => `--z-${k}: ${v};`), ``, `/* ── Layout ────────────────────────────────────── */`, `--sidebar-w: ${layout.sidebar}px;`, `--topbar-h: ${layout.topbar}px;`, `--content-max: ${layout.contentMax}px;`, `--form-max: ${layout.formMax}px;`, `--tactile-min: ${layout.tactileMin}px;`, ``, `/* ── Form field widths (G-H) ───────────────── */`,
+  // A7-02 CLASS, SEVENTH INSTANCE. `Field.FIELD_MAX_WIDTH` consumes these
+  // as `var(--field-w-s, 200px)`, and Field's docblock states the five
+  // values are "exposees en variables CSS pour etre revues sans toucher au
+  // code" — the stated escape hatch for a decision that same docblock flags
+  // as needing design confirmation.
+  //
+  // This emitter never emitted them, so only the fallbacks ever rendered:
+  // the widths were unrevisable without a code change and the promise was
+  // false. Exactly what the A7-02 note above records for the letter-spacing
+  // scale — a var() fallback wearing a token's name.
+  //
+  // Emitted from `layout.fieldWidth` so there is ONE source. The component
+  // keeps its fallbacks, so a host that never calls injectCssVariables still
+  // renders correct widths; where the variables exist, they win.
+  `--field-w-xs: ${layout.fieldWidth.xs}px;`, `--field-w-s: ${layout.fieldWidth.s}px;`, `--field-w-m: ${layout.fieldWidth.m}px;`, `--field-w-l: ${layout.fieldWidth.l}px;`, ``, `/* ── Breakpoints (R-RS.1) ──────────────────────── */`,
+  // The single breakpoint scale, also wired into the MUI theme and the
   // mq() string helpers. Media queries can't read var(), so these are
   // for @container queries, clamp() and JS (getComputedStyle) — they
   // exist so no consumer hardcodes a raw px breakpoint anywhere.
-  "--bp-xs: ".concat(breakpoints.xs, "px;"), "--bp-sm: ".concat(breakpoints.sm, "px;"), "--bp-md: ".concat(breakpoints.md, "px;"), "--bp-lg: ".concat(breakpoints.lg, "px;"), "--bp-xl: ".concat(breakpoints.xl, "px;"), "", "/* \u2500\u2500 Density (default = comfortable) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */", "--row-h: ".concat(density.comfortable.row, "px;"), "--input-h: ".concat(density.comfortable.input, "px;"), "--btn-h: ".concat(density.comfortable.btn, "px;"), "--text-fs: ".concat(density.comfortable.fontSize, "px;")]);
-  var collapsedSidebar = "[data-nav-collapsed=\"true\"] { --sidebar-w: ".concat(layout.sidebarMin, "px; }");
+  `--bp-xs: ${breakpoints.xs}px;`, `--bp-sm: ${breakpoints.sm}px;`, `--bp-md: ${breakpoints.md}px;`, `--bp-lg: ${breakpoints.lg}px;`, `--bp-xl: ${breakpoints.xl}px;`, ``, `/* ── Density (default = comfortable) ───────────── */`, `--row-h: ${density.comfortable.row}px;`, `--input-h: ${density.comfortable.input}px;`, `--btn-h: ${density.comfortable.btn}px;`, `--text-fs: ${density.comfortable.fontSize}px;`];
+  const collapsedSidebar = `[data-nav-collapsed="true"] { --sidebar-w: ${layout.sidebarMin}px; }`;
 
   /* Density tier overrides — emitted in order of granularity so a
    * cascading selector like `[data-density][data-density="compact"]`
    * (host-side specificity hack) resolves predictably. */
-  var spaciousDensity = ["[data-density=\"spacious\"] {", "  --row-h: ".concat(density.spacious.row, "px;"), "  --input-h: ".concat(density.spacious.input, "px;"), "  --btn-h: ".concat(density.spacious.btn, "px;"), "  --text-fs: ".concat(density.spacious.fontSize, "px;"), "}"].join("\n");
-  var compactDensity = ["[data-density=\"compact\"] {", "  --row-h: ".concat(density.compact.row, "px;"), "  --input-h: ".concat(density.compact.input, "px;"), "  --btn-h: ".concat(density.compact.btn, "px;"), "  --text-fs: ".concat(density.compact.fontSize, "px;"), "}"].join("\n");
-  var ultraCompactDensity = ["[data-density=\"ultra-compact\"] {", "  --row-h: ".concat(density.ultraCompact.row, "px;"), "  --input-h: ".concat(density.ultraCompact.input, "px;"), "  --btn-h: ".concat(density.ultraCompact.btn, "px;"), "  --text-fs: ".concat(density.ultraCompact.fontSize, "px;"), "}"].join("\n");
+  const spaciousDensity = [`[data-density="spacious"] {`, `  --row-h: ${density.spacious.row}px;`, `  --input-h: ${density.spacious.input}px;`, `  --btn-h: ${density.spacious.btn}px;`, `  --text-fs: ${density.spacious.fontSize}px;`, `}`].join("\n");
+  const compactDensity = [`[data-density="compact"] {`, `  --row-h: ${density.compact.row}px;`, `  --input-h: ${density.compact.input}px;`, `  --btn-h: ${density.compact.btn}px;`, `  --text-fs: ${density.compact.fontSize}px;`, `}`].join("\n");
+  const ultraCompactDensity = [`[data-density="ultra-compact"] {`, `  --row-h: ${density.ultraCompact.row}px;`, `  --input-h: ${density.ultraCompact.input}px;`, `  --btn-h: ${density.ultraCompact.btn}px;`, `  --text-fs: ${density.ultraCompact.fontSize}px;`, `}`].join("\n");
 
   /* ── Dark mode overrides ────────────────────────────────────
    * Soft variants (semantic + status) are DERIVED via color-mix
@@ -130,24 +127,20 @@ export function getCssVariables() {
    * The 22-24% mix produces a tinted overlay that adapts to host
    * brand overrides automatically.
    * ───────────────────────────────────────────────────────── */
-  var darkVars = ["[data-theme=\"dark\"] {", "  --bg: ".concat(dark.bg, ";"), "  --bg-elev: ".concat(dark.bgElev, ";"), "  --bg-subtle: ".concat(dark.bgSubtle, ";"), "  --bg-hover: ".concat(dark.bgHover, ";"), "  --surface: ".concat(dark.surface, ";"), "  --border: ".concat(dark.border, ";"), "  --border-strong: ".concat(dark.borderStrong, ";"), "  --fg: ".concat(dark.fg, ";"), "  --fg-muted: ".concat(dark.fgMuted, ";"), "  --fg-subtle: ".concat(dark.fgSubtle, ";"), "  --fg-inverse: ".concat(dark.fgInverse, ";"), "  --accent-soft: ".concat(dark.accentSoft, ";"), "", "  /* Soft semantic fills \u2014 derived from the saturated colour */", "  --success-soft: color-mix(in srgb, var(--success) 24%, transparent);", "  --warning-soft: color-mix(in srgb, var(--warning) 24%, transparent);", "  --danger-soft:  color-mix(in srgb, var(--danger)  24%, transparent);", "  --info-soft:    color-mix(in srgb, var(--info)    24%, transparent);", "", "  /* Status FG \u2014 overridden for dark-mode visibility */", "  --status-new-fg: ".concat(dark.status["new"].fg, ";"), "  --status-sent-fg: ".concat(dark.status.sent.fg, ";"), "  --status-pending-fg: ".concat(dark.status.pending.fg, ";"), "  --status-approved-fg: ".concat(dark.status.approved.fg, ";"), "  --status-rejected-fg: ".concat(dark.status.rejected.fg, ";"), "  --status-neutral-fg: ".concat(dark.status.neutral.fg, ";"), "", "  /* Status soft \u2014 derived from the dark-mode FG */", "  --status-new-soft:      color-mix(in srgb, var(--status-new-fg)      22%, transparent);", "  --status-sent-soft:     color-mix(in srgb, var(--status-sent-fg)     22%, transparent);", "  --status-pending-soft:  color-mix(in srgb, var(--status-pending-fg)  22%, transparent);", "  --status-approved-soft: color-mix(in srgb, var(--status-approved-fg) 22%, transparent);", "  --status-rejected-soft: color-mix(in srgb, var(--status-rejected-fg) 22%, transparent);", "  --status-neutral-soft:  color-mix(in srgb, var(--status-neutral-fg)  22%, transparent);", "}"].join("\n");
+  const darkVars = [`[data-theme="dark"] {`, `  --bg: ${dark.bg};`, `  --bg-elev: ${dark.bgElev};`, `  --bg-subtle: ${dark.bgSubtle};`, `  --bg-hover: ${dark.bgHover};`, `  --surface: ${dark.surface};`, `  --border: ${dark.border};`, `  --border-strong: ${dark.borderStrong};`, `  --fg: ${dark.fg};`, `  --fg-muted: ${dark.fgMuted};`, `  --fg-subtle: ${dark.fgSubtle};`, `  --fg-inverse: ${dark.fgInverse};`, `  --accent-soft: ${dark.accentSoft};`, ``, `  /* Soft semantic fills — derived from the saturated colour */`, `  --success-soft: color-mix(in srgb, var(--success) 24%, transparent);`, `  --warning-soft: color-mix(in srgb, var(--warning) 24%, transparent);`, `  --danger-soft:  color-mix(in srgb, var(--danger)  24%, transparent);`, `  --info-soft:    color-mix(in srgb, var(--info)    24%, transparent);`, ``, `  /* Status FG — overridden for dark-mode visibility */`, `  --status-new-fg: ${dark.status.new.fg};`, `  --status-sent-fg: ${dark.status.sent.fg};`, `  --status-pending-fg: ${dark.status.pending.fg};`, `  --status-approved-fg: ${dark.status.approved.fg};`, `  --status-rejected-fg: ${dark.status.rejected.fg};`, `  --status-neutral-fg: ${dark.status.neutral.fg};`, ``, `  /* Status soft — derived from the dark-mode FG */`, `  --status-new-soft:      color-mix(in srgb, var(--status-new-fg)      22%, transparent);`, `  --status-sent-soft:     color-mix(in srgb, var(--status-sent-fg)     22%, transparent);`, `  --status-pending-soft:  color-mix(in srgb, var(--status-pending-fg)  22%, transparent);`, `  --status-approved-soft: color-mix(in srgb, var(--status-approved-fg) 22%, transparent);`, `  --status-rejected-soft: color-mix(in srgb, var(--status-rejected-fg) 22%, transparent);`, `  --status-neutral-soft:  color-mix(in srgb, var(--status-neutral-fg)  22%, transparent);`, `}`].join("\n");
 
   /* Dev-only validation — catches the regression class that motivated it: a
    * token removed from ../tokens while this emitter still references it, which
    * puts the literal "undefined" into :root instead of failing loudly. See the
    * note beside --fw-bold above. */
   if (typeof console !== "undefined") {
-    var offenders = lightVars.filter(function (l) {
-      return /:\s*undefined\b/.test(l);
-    });
+    const offenders = lightVars.filter(l => /:\s*undefined\b/.test(l));
     if (offenders.length) {
       // eslint-disable-next-line no-console
       console.warn("[@portnet/ui v2] cssVariables emitted undefined values — check token imports:", offenders);
     }
   }
-  return [":root {"].concat(_toConsumableArray(lightVars.map(function (line) {
-    return line ? "  ".concat(line) : "";
-  })), ["}", "", collapsedSidebar, "", spaciousDensity, "", compactDensity, "", ultraCompactDensity, "", darkVars]).join("\n");
+  return [`:root {`, ...lightVars.map(line => line ? `  ${line}` : ""), `}`, ``, collapsedSidebar, ``, spaciousDensity, ``, compactDensity, ``, ultraCompactDensity, ``, darkVars].join("\n");
 }
 
 /**
@@ -161,11 +154,11 @@ export function getCssVariables() {
  */
 export function injectCssVariables(arg) {
   if (typeof document === "undefined") return;
-  var opts = typeof arg === "string" ? {
+  const opts = typeof arg === "string" ? {
     id: arg
   } : arg || {};
-  var id = opts.id || STYLE_TAG_ID;
-  var tag = document.getElementById(id);
+  const id = opts.id || STYLE_TAG_ID;
+  let tag = document.getElementById(id);
   if (!tag) {
     tag = document.createElement("style");
     tag.id = id;
@@ -185,14 +178,14 @@ export function injectCssVariables(arg) {
  */
 export function removeCssVariables(arg) {
   if (typeof document === "undefined") return;
-  var id = typeof arg === "string" ? arg : arg && arg.id || STYLE_TAG_ID;
-  var tag = document.getElementById(id);
+  const id = typeof arg === "string" ? arg : arg && arg.id || STYLE_TAG_ID;
+  const tag = document.getElementById(id);
   if (tag) tag.remove();
 }
-var cssVariablesApi = {
-  getCssVariables: getCssVariables,
-  injectCssVariables: injectCssVariables,
-  removeCssVariables: removeCssVariables
+const cssVariablesApi = {
+  getCssVariables,
+  injectCssVariables,
+  removeCssVariables
 };
 export default cssVariablesApi;
 //# sourceMappingURL=cssVariables.js.map

package/dist/esm/v2/theme/cssVariables.js.map

@@ -1 +1 @@
-{"version":3,"file":"cssVariables.js","names":["ink","surface","border","semantic","status","dark","fontFamily","fontSize","fontWeight","lineHeight","letterSpacing","spacing","radius","shadows","duration","easing","zIndex","density","layout","breakpoints","state","resolveBrand","resolveBrandSecondary","STYLE_TAG_ID","NUMERIC_GRID_RE","SPACING_ENTRIES","Object","entries","NUMERIC_ENTRIES","filter","_ref","_ref2","_slicedToArray","k","test","ALIAS_ENTRIES","_ref3","_ref4","getCssVariables","_radius$none","options","arguments","length","undefined","brand","brandSecondary","lightVars","concat","accent","accentHover","accentSoft","accentFg","secondary","secondaryFg","fg","fgMuted","fgSubtle","fgInverse","bg","bgElev","bgSubtle","bgHover","borderStrong","success","successSoft","successFg","warning","warningSoft","warningFg","danger","dangerSoft","dangerFg","info","infoSoft","infoFg","soft","sent","pending","approved","rejected","neutral","hoverOverlay","pressedOverlay","selectedOverlay","sans","mono","display","h2","h3","h4","body","sm","xs","regular","medium","semibold","bold","tight","snug","normal","loose","wide","_toConsumableArray","map","_ref5","_ref6","v","slice","_ref7","_ref8","none","md","lg","xl","full","focus","focusFallback","fast","base","slow","microinteraction","stateChange","pageTransition","out","_ref9","_ref0","sidebar","topbar","contentMax","formMax","tactileMin","comfortable","row","input","btn","collapsedSidebar","sidebarMin","spaciousDensity","spacious","join","compactDensity","compact","ultraCompactDensity","ultraCompact","darkVars","console","offenders","l","warn","line","injectCssVariables","arg","document","opts","id","tag","getElementById","createElement","head","appendChild","textContent","removeCssVariables","remove","cssVariablesApi"],"sources":["../../../../src/lib/v2/theme/cssVariables.ts"],"sourcesContent":["/**\r\n * CSS Variables emitter — Portnet UI v2\r\n *\r\n * Generates a CSS string declaring all tokens as :root variables.\r\n * Mount once at app boot via:\r\n *\r\n *   import { injectCssVariables } from \"@portnet/ui/v2/theme\";\r\n *   injectCssVariables();\r\n *\r\n * Or render `getCssVariables()` inside a `<style>` tag if SSR'd.\r\n *\r\n * Brand override (host-level theming):\r\n *\r\n *   injectCssVariables({\r\n *     brand: { accent: \"#2962FF\" },\r\n *     brandSecondary: { secondary: \"#4FB8CF\" },\r\n *   });\r\n *   // Or via the unified theme factory (see createPortnetTheme):\r\n *   //   createPortnetTheme({ brand: {...}, brandSecondary: {...} })\r\n *\r\n *   Override is deep-merged onto the default brand / brandSecondary:\r\n *   any field you omit falls back to the token default. Use the SAME\r\n *   override objects when calling createPortnetTheme so the MUI\r\n *   palette and CSS variables stay in sync — both layers consume the\r\n *   same resolvers (./_brand, ./_brandSecondary) so mismatches are\r\n *   structurally impossible.\r\n */\r\nimport {\r\n  ink, surface, border, semantic, status, dark,\r\n  fontFamily, fontSize, fontWeight, lineHeight, letterSpacing,\r\n  spacing, radius, shadows, duration, easing, zIndex,\r\n  density, layout, breakpoints,\r\n  state,\r\n} from \"../tokens\";\r\nimport { resolveBrand, type BrandTokens } from \"./_brand\";\r\nimport { resolveBrandSecondary, type BrandSecondaryTokens } from \"./_brandSecondary\";\r\n\r\n/** Options for the CSS-variable emitter / injector. */\r\ntype CssVariablesOptions = {\r\n  id?: string;\r\n  brand?: Partial<BrandTokens>;\r\n  brandSecondary?: Partial<BrandSecondaryTokens>;\r\n};\r\n\r\nconst STYLE_TAG_ID = \"portnet-ui-v2-tokens\";\r\n\r\n/**\r\n * Spacing partition: numeric grid keys (s1..s10) vs semantic aliases\r\n * (xs/sm/md/lg/xl/xxl). Two output namespaces so the alias names\r\n * cannot collide with the grid (s-N) and cannot pollute the global\r\n * variable namespace by emitting unprefixed --md / --lg / --xl.\r\n *\r\n * Uses Object.entries at module-load time — pure / no side-effects.\r\n */\r\nconst NUMERIC_GRID_RE = /^s\\d+$/;\r\nconst SPACING_ENTRIES = Object.entries(spacing);\r\nconst NUMERIC_ENTRIES = SPACING_ENTRIES.filter(([k]) => NUMERIC_GRID_RE.test(k));\r\nconst ALIAS_ENTRIES   = SPACING_ENTRIES.filter(([k]) => !NUMERIC_GRID_RE.test(k));\r\n\r\n/**\r\n * Emits the canonical :root block + sidebar / density / dark-mode overrides.\r\n * Pass a partial `brand` / `brandSecondary` to mirror a host theme override\r\n * (use the SAME object you pass to createPortnetTheme so the two layers agree).\r\n */\r\nexport function getCssVariables(options: CssVariablesOptions = {}): string {\r\n  const brand          = resolveBrand(options.brand);\r\n  const brandSecondary = resolveBrandSecondary(options.brandSecondary);\r\n\r\n  const lightVars = [\r\n    `/* ── Brand ─────────────────────────────────────── */`,\r\n    `--accent: ${brand.accent};`,\r\n    `--accent-hover: ${brand.accentHover};`,\r\n    `--accent-soft: ${brand.accentSoft};`,\r\n    `--accent-fg: ${brand.accentFg};`,\r\n    ``,\r\n    `/* ── Brand secondary ───────────────────────────── */`,\r\n    `--secondary: ${brandSecondary.secondary};`,\r\n    `--secondary-fg: ${brandSecondary.secondaryFg};`,\r\n    ``,\r\n    `/* ── Ink ───────────────────────────────────────── */`,\r\n    `--fg: ${ink.fg};`,\r\n    `--fg-muted: ${ink.fgMuted};`,\r\n    `--fg-subtle: ${ink.fgSubtle};`,\r\n    `--fg-inverse: ${ink.fgInverse};`,\r\n    ``,\r\n    `/* ── Surface ───────────────────────────────────── */`,\r\n    `--bg: ${surface.bg};`,\r\n    `--bg-elev: ${surface.bgElev};`,\r\n    `--bg-subtle: ${surface.bgSubtle};`,\r\n    `--bg-hover: ${surface.bgHover};`,\r\n    `--surface: ${surface.surface};`,\r\n    ``,\r\n    `/* ── Border ────────────────────────────────────── */`,\r\n    `--border: ${border.border};`,\r\n    `--border-strong: ${border.borderStrong};`,\r\n    ``,\r\n    `/* ── Semantic ──────────────────────────────────── */`,\r\n    `/* Each concept has a saturated fill (--<name>) and a darker text */`,\r\n    `/* foreground (--<name>-fg). Pair fills with text on the same surface. */`,\r\n    `--success: ${semantic.success};`,\r\n    `--success-soft: ${semantic.successSoft};`,\r\n    `--success-fg: ${semantic.successFg};`,\r\n    `--warning: ${semantic.warning};`,\r\n    `--warning-soft: ${semantic.warningSoft};`,\r\n    `--warning-fg: ${semantic.warningFg};`,\r\n    `--danger: ${semantic.danger};`,\r\n    `--danger-soft: ${semantic.dangerSoft};`,\r\n    `--danger-fg: ${semantic.dangerFg};`,\r\n    `--info: ${semantic.info};`,\r\n    `--info-soft: ${semantic.infoSoft};`,\r\n    `--info-fg: ${semantic.infoFg};`,\r\n    ``,\r\n    `/* ── Status palette ────────────────────────────── */`,\r\n    `--status-new-soft: ${status.new.soft};`,\r\n    `--status-new-fg: ${status.new.fg};`,\r\n    `--status-sent-soft: ${status.sent.soft};`,\r\n    `--status-sent-fg: ${status.sent.fg};`,\r\n    `--status-pending-soft: ${status.pending.soft};`,\r\n    `--status-pending-fg: ${status.pending.fg};`,\r\n    `--status-approved-soft: ${status.approved.soft};`,\r\n    `--status-approved-fg: ${status.approved.fg};`,\r\n    `--status-rejected-soft: ${status.rejected.soft};`,\r\n    `--status-rejected-fg: ${status.rejected.fg};`,\r\n    `--status-neutral-soft: ${status.neutral.soft};`,\r\n    `--status-neutral-fg: ${status.neutral.fg};`,\r\n    ``,\r\n    `/* ── State overlays (B2 — currentColor-based) ─── */`,\r\n    `--state-hover-overlay: ${state.hoverOverlay};`,\r\n    `--state-pressed-overlay: ${state.pressedOverlay};`,\r\n    `--state-selected-overlay: ${state.selectedOverlay};`,\r\n    ``,\r\n    `/* ── Typography ────────────────────────────────── */`,\r\n    `--font-sans: ${fontFamily.sans};`,\r\n    `--font-mono: ${fontFamily.mono};`,\r\n    `--text-display: ${fontSize.display}px;`,\r\n    `--text-h2: ${fontSize.h2}px;`,\r\n    `--text-h3: ${fontSize.h3}px;`,\r\n    `--text-h4: ${fontSize.h4}px;`,\r\n    `--text-body: ${fontSize.body}px;`,\r\n    `--text-sm: ${fontSize.sm}px;`,\r\n    `--text-xs: ${fontSize.xs}px;`,\r\n    `--fw-regular: ${fontWeight.regular};`,\r\n    `--fw-medium: ${fontWeight.medium};`,\r\n    `--fw-semibold: ${fontWeight.semibold};`,\r\n    `--fw-bold: ${fontWeight.bold};`,\r\n    // NOTE: there is deliberately no heavier weight than bold (700). Batch 1\r\n    // dropped the black weight from the typography tokens, and this file kept\r\n    // emitting the matching variable for a while — resolving to the literal\r\n    // string \"undefined\" in :root, which silently flattened every consumer that\r\n    // referenced it. The dev-only check at the end of this function exists\r\n    // because of that incident.\r\n    //\r\n    // The old variable name is deliberately not written out: banned-patterns\r\n    // scans raw file text with no comment awareness, so naming it here — even to\r\n    // record its removal — trips the rule that protects this block.\r\n    `--lh-tight: ${lineHeight.tight};`,\r\n    `--lh-snug: ${lineHeight.snug};`,\r\n    `--lh-normal: ${lineHeight.normal};`,\r\n    `--lh-loose: ${lineHeight.loose};`,\r\n    // A7-02 — letter-spacing scale. Six token names were referenced fleet-wide\r\n    // that this emitter never emitted, so their var() fallbacks were the only\r\n    // thing that ever rendered (R-2.3 / R-AI.1 magic values wearing a token's\r\n    // name). These two had a real platform basis — -0.01em was hardcoded twice\r\n    // in tokens/typography.ts itself, 0.04em inside KV and ConfirmDialog — so\r\n    // they are promoted. `--border-subtle`, `--r-xs`, `--icon-sm`, `--icon-xl`\r\n    // were local inventions and are fixed at their call sites instead.\r\n    `--ls-tight: ${letterSpacing.tight};`,\r\n    `--ls-normal: ${letterSpacing.normal};`,\r\n    `--ls-wide: ${letterSpacing.wide};`,\r\n    ``,\r\n    `/* ── Spacing — numeric grid (8 px base) ─────────── */`,\r\n    // s1..s10 → --s-1 .. --s-10 (preserves all existing consumers).\r\n    ...NUMERIC_ENTRIES.map(([k, v]) => `--s-${k.slice(1)}: ${v}px;`),\r\n    ``,\r\n    `/* ── Spacing — semantic aliases ────────────────── */`,\r\n    // xs/sm/md/lg/xl/xxl → --space-xs .. --space-xxl. The \"space-\"\r\n    // prefix is mandatory: emitting them as raw --xs/--md/--lg\r\n    // would pollute the global CSS variable namespace.\r\n    ...ALIAS_ENTRIES.map(([k, v]) => `--space-${k}: ${v}px;`),\r\n    ``,\r\n    `/* ── Radius ────────────────────────────────────── */`,\r\n    `--r-none: ${radius.none ?? 0}px;`,\r\n    `--r-sm: ${radius.sm}px;`,\r\n    `--r-md: ${radius.md}px;`,\r\n    `--r-lg: ${radius.lg}px;`,\r\n    `--r-xl: ${radius.xl}px;`,\r\n    `--r-full: ${radius.full}px;`,\r\n    ``,\r\n    `/* ── Shadows ───────────────────────────────────── */`,\r\n    `--shadow-xs: ${shadows.xs};`,\r\n    `--shadow-sm: ${shadows.sm};`,\r\n    `--shadow-md: ${shadows.md};`,\r\n    `--shadow-lg: ${shadows.lg};`,\r\n    `--shadow-focus: ${shadows.focus};`,\r\n    // Static rgba fallback for non-CSS-vars contexts (SSR strings,\r\n    // raw inline `style={{ boxShadow: ... }}` props that bypass CSS).\r\n    ...(shadows.focusFallback\r\n      ? [`--shadow-focus-fallback: ${shadows.focusFallback};`]\r\n      : []),\r\n    ``,\r\n    `/* ── Motion (temporal vocabulary) ──────────────── */`,\r\n    `--duration-fast: ${duration.fast}ms;`,\r\n    `--duration-base: ${duration.base}ms;`,\r\n    `--duration-slow: ${duration.slow}ms;`,\r\n    ``,\r\n    `/* ── Motion (semantic aliases — B6) ────────────── */`,\r\n    // Same numeric values as fast/base/slow; intent-readable at the\r\n    // call site. transition() helper recognises both vocabularies.\r\n    `--duration-microinteraction: ${duration.microinteraction}ms;`,\r\n    `--duration-state-change: ${duration.stateChange}ms;`,\r\n    `--duration-page-transition: ${duration.pageTransition}ms;`,\r\n    ``,\r\n    `/* ── Easing ────────────────────────────────────── */`,\r\n    `--easing-out: ${easing.out};`,\r\n    `--easing-in: ${easing.in};`,\r\n    `--easing-soft: ${easing.soft};`,\r\n    ``,\r\n    `/* ── Z-index ───────────────────────────────────── */`,\r\n    // Iterates the full zIndex object — picks up popover/snackbar/\r\n    // tooltip slots added in Batch 1 and skipLink (Batch 11 / B3)\r\n    // without code changes here.\r\n    ...Object.entries(zIndex).map(([k, v]) => `--z-${k}: ${v};`),\r\n    ``,\r\n    `/* ── Layout ────────────────────────────────────── */`,\r\n    `--sidebar-w: ${layout.sidebar}px;`,\r\n    `--topbar-h: ${layout.topbar}px;`,\r\n    `--content-max: ${layout.contentMax}px;`,\r\n    `--form-max: ${layout.formMax}px;`,\r\n    `--tactile-min: ${layout.tactileMin}px;`,\r\n    ``,\r\n    `/* ── Breakpoints (R-RS.1) ──────────────────────── */`,\r\n    // The single breakpoint scale, also wired into the MUI theme and the\r\n    // mq() string helpers. Media queries can't read var(), so these are\r\n    // for @container queries, clamp() and JS (getComputedStyle) — they\r\n    // exist so no consumer hardcodes a raw px breakpoint anywhere.\r\n    `--bp-xs: ${breakpoints.xs}px;`,\r\n    `--bp-sm: ${breakpoints.sm}px;`,\r\n    `--bp-md: ${breakpoints.md}px;`,\r\n    `--bp-lg: ${breakpoints.lg}px;`,\r\n    `--bp-xl: ${breakpoints.xl}px;`,\r\n    ``,\r\n    `/* ── Density (default = comfortable) ───────────── */`,\r\n    `--row-h: ${density.comfortable.row}px;`,\r\n    `--input-h: ${density.comfortable.input}px;`,\r\n    `--btn-h: ${density.comfortable.btn}px;`,\r\n    `--text-fs: ${density.comfortable.fontSize}px;`,\r\n  ];\r\n\r\n  const collapsedSidebar = `[data-nav-collapsed=\"true\"] { --sidebar-w: ${layout.sidebarMin}px; }`;\r\n\r\n  /* Density tier overrides — emitted in order of granularity so a\r\n   * cascading selector like `[data-density][data-density=\"compact\"]`\r\n   * (host-side specificity hack) resolves predictably. */\r\n  const spaciousDensity = [\r\n    `[data-density=\"spacious\"] {`,\r\n    `  --row-h: ${density.spacious.row}px;`,\r\n    `  --input-h: ${density.spacious.input}px;`,\r\n    `  --btn-h: ${density.spacious.btn}px;`,\r\n    `  --text-fs: ${density.spacious.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  const compactDensity = [\r\n    `[data-density=\"compact\"] {`,\r\n    `  --row-h: ${density.compact.row}px;`,\r\n    `  --input-h: ${density.compact.input}px;`,\r\n    `  --btn-h: ${density.compact.btn}px;`,\r\n    `  --text-fs: ${density.compact.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  const ultraCompactDensity = [\r\n    `[data-density=\"ultra-compact\"] {`,\r\n    `  --row-h: ${density.ultraCompact.row}px;`,\r\n    `  --input-h: ${density.ultraCompact.input}px;`,\r\n    `  --btn-h: ${density.ultraCompact.btn}px;`,\r\n    `  --text-fs: ${density.ultraCompact.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  /* ── Dark mode overrides ────────────────────────────────────\r\n   * Soft variants (semantic + status) are DERIVED via color-mix\r\n   * from the saturated colour or the dark-mode status FG. The\r\n   * static light-mode soft hex codes are too pale on dark\r\n   * surfaces and fail WCAG 1.4.11 non-text contrast.\r\n   * The 22-24% mix produces a tinted overlay that adapts to host\r\n   * brand overrides automatically.\r\n   * ───────────────────────────────────────────────────────── */\r\n  const darkVars = [\r\n    `[data-theme=\"dark\"] {`,\r\n    `  --bg: ${dark.bg};`,\r\n    `  --bg-elev: ${dark.bgElev};`,\r\n    `  --bg-subtle: ${dark.bgSubtle};`,\r\n    `  --bg-hover: ${dark.bgHover};`,\r\n    `  --surface: ${dark.surface};`,\r\n    `  --border: ${dark.border};`,\r\n    `  --border-strong: ${dark.borderStrong};`,\r\n    `  --fg: ${dark.fg};`,\r\n    `  --fg-muted: ${dark.fgMuted};`,\r\n    `  --fg-subtle: ${dark.fgSubtle};`,\r\n    `  --fg-inverse: ${dark.fgInverse};`,\r\n    `  --accent-soft: ${dark.accentSoft};`,\r\n    ``,\r\n    `  /* Soft semantic fills — derived from the saturated colour */`,\r\n    `  --success-soft: color-mix(in srgb, var(--success) 24%, transparent);`,\r\n    `  --warning-soft: color-mix(in srgb, var(--warning) 24%, transparent);`,\r\n    `  --danger-soft:  color-mix(in srgb, var(--danger)  24%, transparent);`,\r\n    `  --info-soft:    color-mix(in srgb, var(--info)    24%, transparent);`,\r\n    ``,\r\n    `  /* Status FG — overridden for dark-mode visibility */`,\r\n    `  --status-new-fg: ${dark.status.new.fg};`,\r\n    `  --status-sent-fg: ${dark.status.sent.fg};`,\r\n    `  --status-pending-fg: ${dark.status.pending.fg};`,\r\n    `  --status-approved-fg: ${dark.status.approved.fg};`,\r\n    `  --status-rejected-fg: ${dark.status.rejected.fg};`,\r\n    `  --status-neutral-fg: ${dark.status.neutral.fg};`,\r\n    ``,\r\n    `  /* Status soft — derived from the dark-mode FG */`,\r\n    `  --status-new-soft:      color-mix(in srgb, var(--status-new-fg)      22%, transparent);`,\r\n    `  --status-sent-soft:     color-mix(in srgb, var(--status-sent-fg)     22%, transparent);`,\r\n    `  --status-pending-soft:  color-mix(in srgb, var(--status-pending-fg)  22%, transparent);`,\r\n    `  --status-approved-soft: color-mix(in srgb, var(--status-approved-fg) 22%, transparent);`,\r\n    `  --status-rejected-soft: color-mix(in srgb, var(--status-rejected-fg) 22%, transparent);`,\r\n    `  --status-neutral-soft:  color-mix(in srgb, var(--status-neutral-fg)  22%, transparent);`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  /* Dev-only validation — catches the regression class that motivated it: a\r\n   * token removed from ../tokens while this emitter still references it, which\r\n   * puts the literal \"undefined\" into :root instead of failing loudly. See the\r\n   * note beside --fw-bold above. */\r\n  if (typeof console !== \"undefined\") {\r\n    const offenders = lightVars.filter((l) => /:\\s*undefined\\b/.test(l));\r\n    if (offenders.length) {\r\n      // eslint-disable-next-line no-console\r\n      console.warn(\r\n        \"[@portnet/ui v2] cssVariables emitted undefined values — check token imports:\",\r\n        offenders,\r\n      );\r\n    }\r\n  }\r\n\r\n  return [\r\n    `:root {`,\r\n    ...lightVars.map((line) => (line ? `  ${line}` : \"\")),\r\n    `}`,\r\n    ``,\r\n    collapsedSidebar,\r\n    ``,\r\n    spaciousDensity,\r\n    ``,\r\n    compactDensity,\r\n    ``,\r\n    ultraCompactDensity,\r\n    ``,\r\n    darkVars,\r\n  ].join(\"\\n\");\r\n}\r\n\r\n/**\r\n * Inject the variables into <head> at runtime.\r\n * Idempotent: replaces a previous tag if present.\r\n *\r\n * Backward-compatible signatures:\r\n *   injectCssVariables();                                   // default id, no override\r\n *   injectCssVariables(\"my-style-id\");                      // legacy string id\r\n *   injectCssVariables({ id, brand, brandSecondary });      // options form\r\n */\r\nexport function injectCssVariables(arg?: string | CssVariablesOptions): void {\r\n  if (typeof document === \"undefined\") return;\r\n  const opts: CssVariablesOptions = typeof arg === \"string\" ? { id: arg } : (arg || {});\r\n  const id = opts.id || STYLE_TAG_ID;\r\n\r\n  let tag = document.getElementById(id);\r\n  if (!tag) {\r\n    tag = document.createElement(\"style\");\r\n    tag.id = id;\r\n    document.head.appendChild(tag);\r\n  }\r\n  tag.textContent = getCssVariables(opts);\r\n}\r\n\r\n/**\r\n * Remove the injected style tag. Symmetrical with\r\n * injectCssVariables — needed for theme switching, hot-reload\r\n * and test cleanup. No-op when the tag is absent or in SSR.\r\n *\r\n *   removeCssVariables();              // default id\r\n *   removeCssVariables(\"my-style-id\"); // legacy string id\r\n *   removeCssVariables({ id });        // options form\r\n */\r\nexport function removeCssVariables(arg?: string | CssVariablesOptions): void {\r\n  if (typeof document === \"undefined\") return;\r\n  const id = typeof arg === \"string\"\r\n    ? arg\r\n    : ((arg && arg.id) || STYLE_TAG_ID);\r\n  const tag = document.getElementById(id);\r\n  if (tag) tag.remove();\r\n}\r\n\r\nconst cssVariablesApi = { getCssVariables, injectCssVariables, removeCssVariables };\r\nexport default cssVariablesApi;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"cssVariables.js","names":["ink","surface","border","semantic","status","dark","fontFamily","fontSize","fontWeight","lineHeight","letterSpacing","spacing","radius","shadows","duration","easing","zIndex","density","layout","breakpoints","state","chartCategorical","resolveBrand","resolveBrandSecondary","STYLE_TAG_ID","NUMERIC_GRID_RE","SPACING_ENTRIES","Object","entries","NUMERIC_ENTRIES","filter","k","test","ALIAS_ENTRIES","getCssVariables","options","brand","brandSecondary","lightVars","accent","accentHover","accentSoft","accentFg","secondary","secondaryFg","fg","fgMuted","fgSubtle","fgInverse","bg","bgElev","bgSubtle","bgHover","borderStrong","success","successSoft","successFg","warning","warningSoft","warningFg","danger","dangerSoft","dangerFg","info","infoSoft","infoFg","new","soft","sent","pending","approved","rejected","neutral","map","c","i","hoverOverlay","pressedOverlay","selectedOverlay","sans","mono","display","h2","h3","h4","body","sm","xs","regular","medium","semibold","bold","tight","snug","normal","loose","wide","v","slice","none","md","lg","xl","full","focus","focusFallback","fast","base","slow","microinteraction","stateChange","pageTransition","out","in","sidebar","topbar","contentMax","formMax","tactileMin","fieldWidth","s","m","l","comfortable","row","input","btn","collapsedSidebar","sidebarMin","spaciousDensity","spacious","join","compactDensity","compact","ultraCompactDensity","ultraCompact","darkVars","console","offenders","length","warn","line","injectCssVariables","arg","document","opts","id","tag","getElementById","createElement","head","appendChild","textContent","removeCssVariables","remove","cssVariablesApi"],"sources":["../../../../src/lib/v2/theme/cssVariables.ts"],"sourcesContent":["/**\r\n * CSS Variables emitter — Portnet UI v2\r\n *\r\n * Generates a CSS string declaring all tokens as :root variables.\r\n * Mount once at app boot via:\r\n *\r\n *   import { injectCssVariables } from \"@portnet/ui/v2/theme\";\r\n *   injectCssVariables();\r\n *\r\n * Or render `getCssVariables()` inside a `<style>` tag if SSR'd.\r\n *\r\n * Brand override (host-level theming):\r\n *\r\n *   injectCssVariables({\r\n *     brand: { accent: \"#2962FF\" },\r\n *     brandSecondary: { secondary: \"#4FB8CF\" },\r\n *   });\r\n *   // Or via the unified theme factory (see createPortnetTheme):\r\n *   //   createPortnetTheme({ brand: {...}, brandSecondary: {...} })\r\n *\r\n *   Override is deep-merged onto the default brand / brandSecondary:\r\n *   any field you omit falls back to the token default. Use the SAME\r\n *   override objects when calling createPortnetTheme so the MUI\r\n *   palette and CSS variables stay in sync — both layers consume the\r\n *   same resolvers (./_brand, ./_brandSecondary) so mismatches are\r\n *   structurally impossible.\r\n */\r\nimport {\r\n  ink, surface, border, semantic, status, dark,\r\n  fontFamily, fontSize, fontWeight, lineHeight, letterSpacing,\r\n  spacing, radius, shadows, duration, easing, zIndex,\r\n  density, layout, breakpoints,\r\n  state,\r\n  chartCategorical,\r\n} from \"../tokens\";\r\nimport { resolveBrand, type BrandTokens } from \"./_brand\";\r\nimport { resolveBrandSecondary, type BrandSecondaryTokens } from \"./_brandSecondary\";\r\n\r\n/** Options for the CSS-variable emitter / injector. */\r\ntype CssVariablesOptions = {\r\n  id?: string | undefined;\r\n  brand?: Partial<BrandTokens> | undefined;\r\n  brandSecondary?: Partial<BrandSecondaryTokens> | undefined;\r\n};\r\n\r\nconst STYLE_TAG_ID = \"portnet-ui-v2-tokens\";\r\n\r\n/**\r\n * Spacing partition: numeric grid keys (s1..s10) vs semantic aliases\r\n * (xs/sm/md/lg/xl/xxl). Two output namespaces so the alias names\r\n * cannot collide with the grid (s-N) and cannot pollute the global\r\n * variable namespace by emitting unprefixed --md / --lg / --xl.\r\n *\r\n * Uses Object.entries at module-load time — pure / no side-effects.\r\n */\r\nconst NUMERIC_GRID_RE = /^s\\d+$/;\r\nconst SPACING_ENTRIES = Object.entries(spacing);\r\nconst NUMERIC_ENTRIES = SPACING_ENTRIES.filter(([k]) => NUMERIC_GRID_RE.test(k));\r\nconst ALIAS_ENTRIES   = SPACING_ENTRIES.filter(([k]) => !NUMERIC_GRID_RE.test(k));\r\n\r\n/**\r\n * Emits the canonical :root block + sidebar / density / dark-mode overrides.\r\n * Pass a partial `brand` / `brandSecondary` to mirror a host theme override\r\n * (use the SAME object you pass to createPortnetTheme so the two layers agree).\r\n */\r\nexport function getCssVariables(options: CssVariablesOptions = {}): string {\r\n  const brand          = resolveBrand(options.brand);\r\n  const brandSecondary = resolveBrandSecondary(options.brandSecondary);\r\n\r\n  const lightVars = [\r\n    `/* ── Brand ─────────────────────────────────────── */`,\r\n    `--accent: ${brand.accent};`,\r\n    `--accent-hover: ${brand.accentHover};`,\r\n    `--accent-soft: ${brand.accentSoft};`,\r\n    `--accent-fg: ${brand.accentFg};`,\r\n    ``,\r\n    `/* ── Brand secondary ───────────────────────────── */`,\r\n    `--secondary: ${brandSecondary.secondary};`,\r\n    `--secondary-fg: ${brandSecondary.secondaryFg};`,\r\n    ``,\r\n    `/* ── Ink ───────────────────────────────────────── */`,\r\n    `--fg: ${ink.fg};`,\r\n    `--fg-muted: ${ink.fgMuted};`,\r\n    `--fg-subtle: ${ink.fgSubtle};`,\r\n    `--fg-inverse: ${ink.fgInverse};`,\r\n    ``,\r\n    `/* ── Surface ───────────────────────────────────── */`,\r\n    `--bg: ${surface.bg};`,\r\n    `--bg-elev: ${surface.bgElev};`,\r\n    `--bg-subtle: ${surface.bgSubtle};`,\r\n    `--bg-hover: ${surface.bgHover};`,\r\n    `--surface: ${surface.surface};`,\r\n    ``,\r\n    `/* ── Border ────────────────────────────────────── */`,\r\n    `--border: ${border.border};`,\r\n    `--border-strong: ${border.borderStrong};`,\r\n    ``,\r\n    `/* ── Semantic ──────────────────────────────────── */`,\r\n    `/* Each concept has a saturated fill (--<name>) and a darker text */`,\r\n    `/* foreground (--<name>-fg). Pair fills with text on the same surface. */`,\r\n    `--success: ${semantic.success};`,\r\n    `--success-soft: ${semantic.successSoft};`,\r\n    `--success-fg: ${semantic.successFg};`,\r\n    `--warning: ${semantic.warning};`,\r\n    `--warning-soft: ${semantic.warningSoft};`,\r\n    `--warning-fg: ${semantic.warningFg};`,\r\n    `--danger: ${semantic.danger};`,\r\n    `--danger-soft: ${semantic.dangerSoft};`,\r\n    `--danger-fg: ${semantic.dangerFg};`,\r\n    `--info: ${semantic.info};`,\r\n    `--info-soft: ${semantic.infoSoft};`,\r\n    `--info-fg: ${semantic.infoFg};`,\r\n    ``,\r\n    `/* ── Status palette ────────────────────────────── */`,\r\n    `--status-new-soft: ${status.new.soft};`,\r\n    `--status-new-fg: ${status.new.fg};`,\r\n    `--status-sent-soft: ${status.sent.soft};`,\r\n    `--status-sent-fg: ${status.sent.fg};`,\r\n    `--status-pending-soft: ${status.pending.soft};`,\r\n    `--status-pending-fg: ${status.pending.fg};`,\r\n    `--status-approved-soft: ${status.approved.soft};`,\r\n    `--status-approved-fg: ${status.approved.fg};`,\r\n    `--status-rejected-soft: ${status.rejected.soft};`,\r\n    `--status-rejected-fg: ${status.rejected.fg};`,\r\n    `--status-neutral-soft: ${status.neutral.soft};`,\r\n    `--status-neutral-fg: ${status.neutral.fg};`,\r\n    ``,\r\n    `/* ── Chart categorical palette (gap G-37) ────── */`,\r\n    `/* Category fills, NOT workflow state — see tokens/chart. Emitted */`,\r\n    `/* for CSS and sx; chart libraries should take the JS token, since */`,\r\n    `/* an SVG presentation attribute given a var() is not resolved by */`,\r\n    `/* every renderer. NO DARK OVERRIDE IS NEEDED, deliberately: every */`,\r\n    `/* entry clears the 3:1 non-text floor on the light AND the dark */`,\r\n    `/* surface, which is the constraint the values were solved for. */`,\r\n    ...chartCategorical.map((c, i) => `--chart-${i + 1}: ${c};`),\r\n    ``,\r\n    `/* ── State overlays (B2 — currentColor-based) ─── */`,\r\n    `--state-hover-overlay: ${state.hoverOverlay};`,\r\n    `--state-pressed-overlay: ${state.pressedOverlay};`,\r\n    `--state-selected-overlay: ${state.selectedOverlay};`,\r\n    ``,\r\n    `/* ── Typography ────────────────────────────────── */`,\r\n    `--font-sans: ${fontFamily.sans};`,\r\n    `--font-mono: ${fontFamily.mono};`,\r\n    `--text-display: ${fontSize.display}px;`,\r\n    `--text-h2: ${fontSize.h2}px;`,\r\n    `--text-h3: ${fontSize.h3}px;`,\r\n    `--text-h4: ${fontSize.h4}px;`,\r\n    `--text-body: ${fontSize.body}px;`,\r\n    `--text-sm: ${fontSize.sm}px;`,\r\n    `--text-xs: ${fontSize.xs}px;`,\r\n    `--fw-regular: ${fontWeight.regular};`,\r\n    `--fw-medium: ${fontWeight.medium};`,\r\n    `--fw-semibold: ${fontWeight.semibold};`,\r\n    `--fw-bold: ${fontWeight.bold};`,\r\n    // NOTE: there is deliberately no heavier weight than bold (700). Batch 1\r\n    // dropped the black weight from the typography tokens, and this file kept\r\n    // emitting the matching variable for a while — resolving to the literal\r\n    // string \"undefined\" in :root, which silently flattened every consumer that\r\n    // referenced it. The dev-only check at the end of this function exists\r\n    // because of that incident.\r\n    //\r\n    // The old variable name is deliberately not written out: banned-patterns\r\n    // scans raw file text with no comment awareness, so naming it here — even to\r\n    // record its removal — trips the rule that protects this block.\r\n    `--lh-tight: ${lineHeight.tight};`,\r\n    `--lh-snug: ${lineHeight.snug};`,\r\n    `--lh-normal: ${lineHeight.normal};`,\r\n    `--lh-loose: ${lineHeight.loose};`,\r\n    // A7-02 — letter-spacing scale. Six token names were referenced fleet-wide\r\n    // that this emitter never emitted, so their var() fallbacks were the only\r\n    // thing that ever rendered (R-2.3 / R-AI.1 magic values wearing a token's\r\n    // name). These two had a real platform basis — -0.01em was hardcoded twice\r\n    // in tokens/typography.ts itself, 0.04em inside KV and ConfirmDialog — so\r\n    // they are promoted. `--border-subtle`, `--r-xs`, `--icon-sm`, `--icon-xl`\r\n    // were local inventions and are fixed at their call sites instead.\r\n    `--ls-tight: ${letterSpacing.tight};`,\r\n    `--ls-normal: ${letterSpacing.normal};`,\r\n    `--ls-wide: ${letterSpacing.wide};`,\r\n    ``,\r\n    `/* ── Spacing — numeric grid (8 px base) ─────────── */`,\r\n    // s1..s10 → --s-1 .. --s-10 (preserves all existing consumers).\r\n    ...NUMERIC_ENTRIES.map(([k, v]) => `--s-${k.slice(1)}: ${v}px;`),\r\n    ``,\r\n    `/* ── Spacing — semantic aliases ────────────────── */`,\r\n    // xs/sm/md/lg/xl/xxl → --space-xs .. --space-xxl. The \"space-\"\r\n    // prefix is mandatory: emitting them as raw --xs/--md/--lg\r\n    // would pollute the global CSS variable namespace.\r\n    ...ALIAS_ENTRIES.map(([k, v]) => `--space-${k}: ${v}px;`),\r\n    ``,\r\n    `/* ── Radius ────────────────────────────────────── */`,\r\n    `--r-none: ${radius.none ?? 0}px;`,\r\n    `--r-sm: ${radius.sm}px;`,\r\n    `--r-md: ${radius.md}px;`,\r\n    `--r-lg: ${radius.lg}px;`,\r\n    `--r-xl: ${radius.xl}px;`,\r\n    `--r-full: ${radius.full}px;`,\r\n    ``,\r\n    `/* ── Shadows ───────────────────────────────────── */`,\r\n    `--shadow-xs: ${shadows.xs};`,\r\n    `--shadow-sm: ${shadows.sm};`,\r\n    `--shadow-md: ${shadows.md};`,\r\n    `--shadow-lg: ${shadows.lg};`,\r\n    `--shadow-focus: ${shadows.focus};`,\r\n    // Static rgba fallback for non-CSS-vars contexts (SSR strings,\r\n    // raw inline `style={{ boxShadow: ... }}` props that bypass CSS).\r\n    ...(shadows.focusFallback\r\n      ? [`--shadow-focus-fallback: ${shadows.focusFallback};`]\r\n      : []),\r\n    ``,\r\n    `/* ── Motion (temporal vocabulary) ──────────────── */`,\r\n    `--duration-fast: ${duration.fast}ms;`,\r\n    `--duration-base: ${duration.base}ms;`,\r\n    `--duration-slow: ${duration.slow}ms;`,\r\n    ``,\r\n    `/* ── Motion (semantic aliases — B6) ────────────── */`,\r\n    // Same numeric values as fast/base/slow; intent-readable at the\r\n    // call site. transition() helper recognises both vocabularies.\r\n    `--duration-microinteraction: ${duration.microinteraction}ms;`,\r\n    `--duration-state-change: ${duration.stateChange}ms;`,\r\n    `--duration-page-transition: ${duration.pageTransition}ms;`,\r\n    ``,\r\n    `/* ── Easing ────────────────────────────────────── */`,\r\n    `--easing-out: ${easing.out};`,\r\n    `--easing-in: ${easing.in};`,\r\n    `--easing-soft: ${easing.soft};`,\r\n    ``,\r\n    `/* ── Z-index ───────────────────────────────────── */`,\r\n    // Iterates the full zIndex object — picks up popover/snackbar/\r\n    // tooltip slots added in Batch 1 and skipLink (Batch 11 / B3)\r\n    // without code changes here.\r\n    ...Object.entries(zIndex).map(([k, v]) => `--z-${k}: ${v};`),\r\n    ``,\r\n    `/* ── Layout ────────────────────────────────────── */`,\r\n    `--sidebar-w: ${layout.sidebar}px;`,\r\n    `--topbar-h: ${layout.topbar}px;`,\r\n    `--content-max: ${layout.contentMax}px;`,\r\n    `--form-max: ${layout.formMax}px;`,\r\n    `--tactile-min: ${layout.tactileMin}px;`,\r\n    ``,\r\n    `/* ── Form field widths (G-H) ───────────────── */`,\r\n    // A7-02 CLASS, SEVENTH INSTANCE. `Field.FIELD_MAX_WIDTH` consumes these\r\n    // as `var(--field-w-s, 200px)`, and Field's docblock states the five\r\n    // values are \"exposees en variables CSS pour etre revues sans toucher au\r\n    // code\" — the stated escape hatch for a decision that same docblock flags\r\n    // as needing design confirmation.\r\n    //\r\n    // This emitter never emitted them, so only the fallbacks ever rendered:\r\n    // the widths were unrevisable without a code change and the promise was\r\n    // false. Exactly what the A7-02 note above records for the letter-spacing\r\n    // scale — a var() fallback wearing a token's name.\r\n    //\r\n    // Emitted from `layout.fieldWidth` so there is ONE source. The component\r\n    // keeps its fallbacks, so a host that never calls injectCssVariables still\r\n    // renders correct widths; where the variables exist, they win.\r\n    `--field-w-xs: ${layout.fieldWidth.xs}px;`,\r\n    `--field-w-s: ${layout.fieldWidth.s}px;`,\r\n    `--field-w-m: ${layout.fieldWidth.m}px;`,\r\n    `--field-w-l: ${layout.fieldWidth.l}px;`,\r\n    ``,\r\n    `/* ── Breakpoints (R-RS.1) ──────────────────────── */`,\r\n    // The single breakpoint scale, also wired into the MUI theme and the\r\n    // mq() string helpers. Media queries can't read var(), so these are\r\n    // for @container queries, clamp() and JS (getComputedStyle) — they\r\n    // exist so no consumer hardcodes a raw px breakpoint anywhere.\r\n    `--bp-xs: ${breakpoints.xs}px;`,\r\n    `--bp-sm: ${breakpoints.sm}px;`,\r\n    `--bp-md: ${breakpoints.md}px;`,\r\n    `--bp-lg: ${breakpoints.lg}px;`,\r\n    `--bp-xl: ${breakpoints.xl}px;`,\r\n    ``,\r\n    `/* ── Density (default = comfortable) ───────────── */`,\r\n    `--row-h: ${density.comfortable.row}px;`,\r\n    `--input-h: ${density.comfortable.input}px;`,\r\n    `--btn-h: ${density.comfortable.btn}px;`,\r\n    `--text-fs: ${density.comfortable.fontSize}px;`,\r\n  ];\r\n\r\n  const collapsedSidebar = `[data-nav-collapsed=\"true\"] { --sidebar-w: ${layout.sidebarMin}px; }`;\r\n\r\n  /* Density tier overrides — emitted in order of granularity so a\r\n   * cascading selector like `[data-density][data-density=\"compact\"]`\r\n   * (host-side specificity hack) resolves predictably. */\r\n  const spaciousDensity = [\r\n    `[data-density=\"spacious\"] {`,\r\n    `  --row-h: ${density.spacious.row}px;`,\r\n    `  --input-h: ${density.spacious.input}px;`,\r\n    `  --btn-h: ${density.spacious.btn}px;`,\r\n    `  --text-fs: ${density.spacious.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  const compactDensity = [\r\n    `[data-density=\"compact\"] {`,\r\n    `  --row-h: ${density.compact.row}px;`,\r\n    `  --input-h: ${density.compact.input}px;`,\r\n    `  --btn-h: ${density.compact.btn}px;`,\r\n    `  --text-fs: ${density.compact.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  const ultraCompactDensity = [\r\n    `[data-density=\"ultra-compact\"] {`,\r\n    `  --row-h: ${density.ultraCompact.row}px;`,\r\n    `  --input-h: ${density.ultraCompact.input}px;`,\r\n    `  --btn-h: ${density.ultraCompact.btn}px;`,\r\n    `  --text-fs: ${density.ultraCompact.fontSize}px;`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  /* ── Dark mode overrides ────────────────────────────────────\r\n   * Soft variants (semantic + status) are DERIVED via color-mix\r\n   * from the saturated colour or the dark-mode status FG. The\r\n   * static light-mode soft hex codes are too pale on dark\r\n   * surfaces and fail WCAG 1.4.11 non-text contrast.\r\n   * The 22-24% mix produces a tinted overlay that adapts to host\r\n   * brand overrides automatically.\r\n   * ───────────────────────────────────────────────────────── */\r\n  const darkVars = [\r\n    `[data-theme=\"dark\"] {`,\r\n    `  --bg: ${dark.bg};`,\r\n    `  --bg-elev: ${dark.bgElev};`,\r\n    `  --bg-subtle: ${dark.bgSubtle};`,\r\n    `  --bg-hover: ${dark.bgHover};`,\r\n    `  --surface: ${dark.surface};`,\r\n    `  --border: ${dark.border};`,\r\n    `  --border-strong: ${dark.borderStrong};`,\r\n    `  --fg: ${dark.fg};`,\r\n    `  --fg-muted: ${dark.fgMuted};`,\r\n    `  --fg-subtle: ${dark.fgSubtle};`,\r\n    `  --fg-inverse: ${dark.fgInverse};`,\r\n    `  --accent-soft: ${dark.accentSoft};`,\r\n    ``,\r\n    `  /* Soft semantic fills — derived from the saturated colour */`,\r\n    `  --success-soft: color-mix(in srgb, var(--success) 24%, transparent);`,\r\n    `  --warning-soft: color-mix(in srgb, var(--warning) 24%, transparent);`,\r\n    `  --danger-soft:  color-mix(in srgb, var(--danger)  24%, transparent);`,\r\n    `  --info-soft:    color-mix(in srgb, var(--info)    24%, transparent);`,\r\n    ``,\r\n    `  /* Status FG — overridden for dark-mode visibility */`,\r\n    `  --status-new-fg: ${dark.status.new.fg};`,\r\n    `  --status-sent-fg: ${dark.status.sent.fg};`,\r\n    `  --status-pending-fg: ${dark.status.pending.fg};`,\r\n    `  --status-approved-fg: ${dark.status.approved.fg};`,\r\n    `  --status-rejected-fg: ${dark.status.rejected.fg};`,\r\n    `  --status-neutral-fg: ${dark.status.neutral.fg};`,\r\n    ``,\r\n    `  /* Status soft — derived from the dark-mode FG */`,\r\n    `  --status-new-soft:      color-mix(in srgb, var(--status-new-fg)      22%, transparent);`,\r\n    `  --status-sent-soft:     color-mix(in srgb, var(--status-sent-fg)     22%, transparent);`,\r\n    `  --status-pending-soft:  color-mix(in srgb, var(--status-pending-fg)  22%, transparent);`,\r\n    `  --status-approved-soft: color-mix(in srgb, var(--status-approved-fg) 22%, transparent);`,\r\n    `  --status-rejected-soft: color-mix(in srgb, var(--status-rejected-fg) 22%, transparent);`,\r\n    `  --status-neutral-soft:  color-mix(in srgb, var(--status-neutral-fg)  22%, transparent);`,\r\n    `}`,\r\n  ].join(\"\\n\");\r\n\r\n  /* Dev-only validation — catches the regression class that motivated it: a\r\n   * token removed from ../tokens while this emitter still references it, which\r\n   * puts the literal \"undefined\" into :root instead of failing loudly. See the\r\n   * note beside --fw-bold above. */\r\n  if (typeof console !== \"undefined\") {\r\n    const offenders = lightVars.filter((l) => /:\\s*undefined\\b/.test(l));\r\n    if (offenders.length) {\r\n      // eslint-disable-next-line no-console\r\n      console.warn(\r\n        \"[@portnet/ui v2] cssVariables emitted undefined values — check token imports:\",\r\n        offenders,\r\n      );\r\n    }\r\n  }\r\n\r\n  return [\r\n    `:root {`,\r\n    ...lightVars.map((line) => (line ? `  ${line}` : \"\")),\r\n    `}`,\r\n    ``,\r\n    collapsedSidebar,\r\n    ``,\r\n    spaciousDensity,\r\n    ``,\r\n    compactDensity,\r\n    ``,\r\n    ultraCompactDensity,\r\n    ``,\r\n    darkVars,\r\n  ].join(\"\\n\");\r\n}\r\n\r\n/**\r\n * Inject the variables into <head> at runtime.\r\n * Idempotent: replaces a previous tag if present.\r\n *\r\n * Backward-compatible signatures:\r\n *   injectCssVariables();                                   // default id, no override\r\n *   injectCssVariables(\"my-style-id\");                      // legacy string id\r\n *   injectCssVariables({ id, brand, brandSecondary });      // options form\r\n */\r\nexport function injectCssVariables(arg?: string | CssVariablesOptions): void {\r\n  if (typeof document === \"undefined\") return;\r\n  const opts: CssVariablesOptions = typeof arg === \"string\" ? { id: arg } : (arg || {});\r\n  const id = opts.id || STYLE_TAG_ID;\r\n\r\n  let tag = document.getElementById(id);\r\n  if (!tag) {\r\n    tag = document.createElement(\"style\");\r\n    tag.id = id;\r\n    document.head.appendChild(tag);\r\n  }\r\n  tag.textContent = getCssVariables(opts);\r\n}\r\n\r\n/**\r\n * Remove the injected style tag. Symmetrical with\r\n * injectCssVariables — needed for theme switching, hot-reload\r\n * and test cleanup. No-op when the tag is absent or in SSR.\r\n *\r\n *   removeCssVariables();              // default id\r\n *   removeCssVariables(\"my-style-id\"); // legacy string id\r\n *   removeCssVariables({ id });        // options form\r\n */\r\nexport function removeCssVariables(arg?: string | CssVariablesOptions): void {\r\n  if (typeof document === \"undefined\") return;\r\n  const id = typeof arg === \"string\"\r\n    ? arg\r\n    : ((arg && arg.id) || STYLE_TAG_ID);\r\n  const tag = document.getElementById(id);\r\n  if (tag) tag.remove();\r\n}\r\n\r\nconst cssVariablesApi = { getCssVariables, injectCssVariables, removeCssVariables };\r\nexport default cssVariablesApi;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/v2/theme/index.js

@@ -22,11 +22,11 @@ export { getCssVariables, injectCssVariables, removeCssVariables } from "./cssVa
  * Additive, non-breaking: type-only re-exports, no runtime change.
  */
 
-var themeApi = {
-  createPortnetTheme: createPortnetTheme,
-  getCssVariables: getCssVariables,
-  injectCssVariables: injectCssVariables,
-  removeCssVariables: removeCssVariables
+const themeApi = {
+  createPortnetTheme,
+  getCssVariables,
+  injectCssVariables,
+  removeCssVariables
 };
 export default themeApi;
 //# sourceMappingURL=index.js.map

package/dist/esm/v2/theme/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["createPortnetTheme","getCssVariables","injectCssVariables","removeCssVariables","default","themeApi"],"sources":["../../../../src/lib/v2/theme/index.ts"],"sourcesContent":["import createPortnetTheme from \"./createPortnetTheme\";\r\nimport {\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n} from \"./cssVariables\";\r\n\r\nexport { default as createPortnetTheme } from \"./createPortnetTheme\";\r\nexport {\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n} from \"./cssVariables\";\r\n\r\n/**\r\n * Public typed contract of the theme factory.\r\n *\r\n * Every host module wraps `createPortnetTheme` in a local `build<Module>Theme`\r\n * helper (see the GU modules' `utils/appearance`), and those wrappers need to\r\n * declare their own option surface without redefining it. Before this export\r\n * the options type was module-private, which forced consumers into either\r\n * `brand?: object` or an `as Parameters<typeof createPortnetTheme>[0]`\r\n * assertion — both of which the Platform TypeScript Guidelines forbid\r\n * (\"Never use object\", \"Avoid unsafe assertions\").\r\n *\r\n * `BrandTokens` / `BrandSecondaryTokens` are surfaced for the same reason: a\r\n * host that receives a partial brand payload from the shell (themeReceived)\r\n * must be able to type that payload against the shared token group instead of\r\n * inventing a local twin.\r\n *\r\n * Additive, non-breaking: type-only re-exports, no runtime change.\r\n */\r\nexport type { CreatePortnetThemeOptions } from \"./createPortnetTheme\";\r\nexport type { BrandTokens } from \"./_brand\";\r\nexport type { BrandSecondaryTokens } from \"./_brandSecondary\";\r\n\r\nconst themeApi = {\r\n  createPortnetTheme,\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n};\r\nexport default themeApi;\r\n"],"mappings":"AAAA,OAAOA,kBAAkB,MAAM,sBAAsB;AACrD,SACEC,eAAe,EACfC,kBAAkB,EAClBC,kBAAkB,QACb,gBAAgB;AAEvB,SAASC,OAAO,IAAIJ,kBAAkB,QAAQ,sBAAsB;AACpE,SACEC,eAAe,EACfC,kBAAkB,EAClBC,kBAAkB,QACb,gBAAgB;;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAKA,IAAME,QAAQ,GAAG;EACfL,kBAAkB,EAAlBA,kBAAkB;EAClBC,eAAe,EAAfA,eAAe;EACfC,kBAAkB,EAAlBA,kBAAkB;EAClBC,kBAAkB,EAAlBA;AACF,CAAC;AACD,eAAeE,QAAQ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["createPortnetTheme","getCssVariables","injectCssVariables","removeCssVariables","default","themeApi"],"sources":["../../../../src/lib/v2/theme/index.ts"],"sourcesContent":["import createPortnetTheme from \"./createPortnetTheme\";\r\nimport {\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n} from \"./cssVariables\";\r\n\r\nexport { default as createPortnetTheme } from \"./createPortnetTheme\";\r\nexport {\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n} from \"./cssVariables\";\r\n\r\n/**\r\n * Public typed contract of the theme factory.\r\n *\r\n * Every host module wraps `createPortnetTheme` in a local `build<Module>Theme`\r\n * helper (see the GU modules' `utils/appearance`), and those wrappers need to\r\n * declare their own option surface without redefining it. Before this export\r\n * the options type was module-private, which forced consumers into either\r\n * `brand?: object` or an `as Parameters<typeof createPortnetTheme>[0]`\r\n * assertion — both of which the Platform TypeScript Guidelines forbid\r\n * (\"Never use object\", \"Avoid unsafe assertions\").\r\n *\r\n * `BrandTokens` / `BrandSecondaryTokens` are surfaced for the same reason: a\r\n * host that receives a partial brand payload from the shell (themeReceived)\r\n * must be able to type that payload against the shared token group instead of\r\n * inventing a local twin.\r\n *\r\n * Additive, non-breaking: type-only re-exports, no runtime change.\r\n */\r\nexport type { CreatePortnetThemeOptions } from \"./createPortnetTheme\";\r\nexport type { BrandTokens } from \"./_brand\";\r\nexport type { BrandSecondaryTokens } from \"./_brandSecondary\";\r\n\r\nconst themeApi = {\r\n  createPortnetTheme,\r\n  getCssVariables,\r\n  injectCssVariables,\r\n  removeCssVariables,\r\n};\r\nexport default themeApi;\r\n"],"mappings":"AAAA,OAAOA,kBAAkB,MAAM,sBAAsB;AACrD,SACEC,eAAe,EACfC,kBAAkB,EAClBC,kBAAkB,QACb,gBAAgB;AAEvB,SAASC,OAAO,IAAIJ,kBAAkB,QAAQ,sBAAsB;AACpE,SACEC,eAAe,EACfC,kBAAkB,EAClBC,kBAAkB,QACb,gBAAgB;;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAKA,MAAME,QAAQ,GAAG;EACfL,kBAAkB;EAClBC,eAAe;EACfC,kBAAkB;EAClBC;AACF,CAAC;AACD,eAAeE,QAAQ","ignoreList":[]}

package/dist/esm/v2/tokens/breakpoints.js

@@ -36,7 +36,7 @@
  */
 
 /* Ascending, mobile-first. xs = 0 is the base band (phones 320-480). */
-export var breakpoints = Object.freeze({
+export const breakpoints = Object.freeze({
   xs: 0,
   sm: 481,
   md: 768,
@@ -49,12 +49,12 @@ export var breakpoints = Object.freeze({
 
 /* Ordered key list — the canonical iteration order for any mobile-first
  * cascade (base -> up). Re-used by Layout.js so the order can't drift. */
-export var BREAKPOINT_KEYS = Object.freeze(["xs", "sm", "md", "lg", "xl"]);
+export const BREAKPOINT_KEYS = Object.freeze(["xs", "sm", "md", "lg", "xl"]);
 
 /* MUI parity: down()/between() subtract this from the upper bound so a
  * `down(key)` query and the matching `up(key)` query never overlap at
  * the exact pixel. Mirrors MUI's default step (5/100 = 0.05px). */
-var STEP = 0.05;
+const STEP = 0.05;
 
 /**
  * Resolve a key to its numeric min-width, falling back to 0 for an
@@ -62,13 +62,13 @@ var STEP = 0.05;
  * emitting a NaN width (which silently disables the whole query).
  */
 export function bpValue(key) {
-  var v = breakpoints[key];
+  const v = breakpoints[key];
   return typeof v === "number" ? v : 0;
 }
 
 /* Next key up the scale, or null when `key` is the largest. */
 function nextKey(key) {
-  var i = BREAKPOINT_KEYS.indexOf(key);
+  const i = BREAKPOINT_KEYS.indexOf(key);
   return i >= 0 && i < BREAKPOINT_KEYS.length - 1 ? BREAKPOINT_KEYS[i + 1] : null;
 }
 
@@ -87,18 +87,18 @@ function nextKey(key) {
  * Usage (sx object key):
  *   sx={{ [mq.up("md")]: { flexDirection: "row" } }}
  */
-export var mq = Object.freeze({
-  up: function up(key) {
-    return "@media (min-width:".concat(bpValue(key), "px)");
+export const mq = Object.freeze({
+  up(key) {
+    return `@media (min-width:${bpValue(key)}px)`;
   },
-  down: function down(key) {
-    return "@media (max-width:".concat(bpValue(key) - STEP, "px)");
+  down(key) {
+    return `@media (max-width:${bpValue(key) - STEP}px)`;
   },
-  between: function between(start, end) {
-    return "@media (min-width:".concat(bpValue(start), "px) and (max-width:").concat(bpValue(end) - STEP, "px)");
+  between(start, end) {
+    return `@media (min-width:${bpValue(start)}px) and (max-width:${bpValue(end) - STEP}px)`;
   },
-  only: function only(key) {
-    var next = nextKey(key);
+  only(key) {
+    const next = nextKey(key);
     return next ? mq.between(key, next) : mq.up(key);
   }
 });

package/dist/esm/v2/tokens/breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints.js","names":["breakpoints","Object","freeze","xs","sm","md","lg","xl","BREAKPOINT_KEYS","STEP","bpValue","key","v","nextKey","i","indexOf","length","mq","up","concat","down","between","start","end","only","next"],"sources":["../../../../src/lib/v2/tokens/breakpoints.ts"],"sourcesContent":["/**\r\n * Breakpoint tokens — Portnet UI v2\r\n * Aligned with Design System v1.0 §07 (Responsive) + R-RS.1.\r\n *\r\n * SINGLE SOURCE OF TRUTH for the responsive breakpoint scale.\r\n * Previously these lived inside tokens/density.js, conflating two\r\n * unrelated concerns (row/control density vs. viewport breakpoints).\r\n * They now live here; density.js re-exports `breakpoints` so every\r\n * existing `import { breakpoints } from \"@portnet/ui/v2/tokens\"`\r\n * (and the `densityLayout` shape) keeps working unchanged.\r\n *\r\n * Two layers consume this scale and MUST stay in lockstep:\r\n *   1. The MUI theme — createPortnetTheme wires `breakpoints` into\r\n *      createTheme's `breakpoints.values`, so `theme.breakpoints.up()`\r\n *      and every `sx={{ prop: { xs, md } }}` on a MUI component resolve\r\n *      against THESE values.\r\n *   2. The CSS layer — the `mq` helpers below emit the SAME media\r\n *      queries as strings, for:\r\n *        - the theme-free v2 Box/Stack responsive sx engine (Layout.js),\r\n *        - raw `.css` / container styles,\r\n *        - any `sx={{ [mq.up(\"md\")]: {...} }}`,\r\n *      and the `--bp-*` CSS variables emitted by cssVariables.js for\r\n *      pure-CSS / container-query consumers.\r\n *\r\n * IMPORTANT — keep `breakpoints` a PURE value map ({ key: number }).\r\n * MUI's createTheme iterates `breakpoints.values` to build its own\r\n * up/down/between; a non-numeric key (e.g. a helper function) would be\r\n * mis-read as a breakpoint named \"up\". Helpers therefore live on the\r\n * SEPARATE `mq` export, never on `breakpoints` itself.\r\n *\r\n * Charter viewport targets covered:\r\n *   - xs band : 320 / 360 / 375 / 390 / 414  (phones, base, no query)\r\n *   - md      : 768 / 820                     (tablet)\r\n *   - lg      : 1024                          (small desktop / landscape tablet)\r\n *   - xl band : 1280 / 1440 / 1920            (desktop)\r\n */\r\n\r\n/* Ascending, mobile-first. xs = 0 is the base band (phones 320-480). */\r\nexport const breakpoints = Object.freeze({\r\n  xs:    0,\r\n  sm:  481,\r\n  md:  768,\r\n  lg: 1024,\r\n  xl: 1280,\r\n});\r\n\r\n/* Local key type — canonical union of breakpoint keys. Not exported;\r\n * the public token surface is unchanged. */\r\ntype BreakpointKey = keyof typeof breakpoints;\r\n\r\n/* Ordered key list — the canonical iteration order for any mobile-first\r\n * cascade (base -> up). Re-used by Layout.js so the order can't drift. */\r\nexport const BREAKPOINT_KEYS = Object.freeze([\"xs\", \"sm\", \"md\", \"lg\", \"xl\"] as const);\r\n\r\n/* MUI parity: down()/between() subtract this from the upper bound so a\r\n * `down(key)` query and the matching `up(key)` query never overlap at\r\n * the exact pixel. Mirrors MUI's default step (5/100 = 0.05px). */\r\nconst STEP = 0.05;\r\n\r\n/**\r\n * Resolve a key to its numeric min-width, falling back to 0 for an\r\n * unknown key so a typo degrades to \"always matches\" rather than\r\n * emitting a NaN width (which silently disables the whole query).\r\n */\r\nexport function bpValue(key: BreakpointKey): number {\r\n  const v = breakpoints[key];\r\n  return typeof v === \"number\" ? v : 0;\r\n}\r\n\r\n/* Next key up the scale, or null when `key` is the largest. */\r\nfunction nextKey(key: BreakpointKey) {\r\n  const i = BREAKPOINT_KEYS.indexOf(key);\r\n  return i >= 0 && i < BREAKPOINT_KEYS.length - 1\r\n    ? BREAKPOINT_KEYS[i + 1]\r\n    : null;\r\n}\r\n\r\n/**\r\n * Token-derived media-query string helpers. Output is identical in\r\n * intent to MUI's `theme.breakpoints.*` so the CSS layer and the\r\n * JS/MUI layer can never diverge.\r\n *\r\n *   mq.up(\"md\")            -> \"@media (min-width:<md>px)\"\r\n *   mq.down(\"md\")          -> \"@media (max-width:<md - 0.05>px)\"\r\n *   mq.between(\"sm\",\"lg\")  -> \"@media (min-width:<sm>px) and (max-width:<lg - 0.05>px)\"\r\n *   mq.only(\"md\")          -> mq.between(\"md\",\"lg\")\r\n *\r\n * Usage (theme-free CSS layer / raw stylesheet):\r\n *   `${mq.up(\"md\")}{ .x{ gap:24px } }`\r\n * Usage (sx object key):\r\n *   sx={{ [mq.up(\"md\")]: { flexDirection: \"row\" } }}\r\n */\r\nexport const mq = Object.freeze({\r\n  up(key: BreakpointKey): string {\r\n    return `@media (min-width:${bpValue(key)}px)`;\r\n  },\r\n  down(key: BreakpointKey): string {\r\n    return `@media (max-width:${bpValue(key) - STEP}px)`;\r\n  },\r\n  between(start: BreakpointKey, end: BreakpointKey): string {\r\n    return `@media (min-width:${bpValue(start)}px) and (max-width:${bpValue(end) - STEP}px)`;\r\n  },\r\n  only(key: BreakpointKey): string {\r\n    const next = nextKey(key);\r\n    return next ? mq.between(key, next) : mq.up(key);\r\n  },\r\n});\r\n\r\nexport default breakpoints;\r\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,OAAO,IAAMA,WAAW,GAAGC,MAAM,CAACC,MAAM,CAAC;EACvCC,EAAE,EAAK,CAAC;EACRC,EAAE,EAAG,GAAG;EACRC,EAAE,EAAG,GAAG;EACRC,EAAE,EAAE,IAAI;EACRC,EAAE,EAAE;AACN,CAAC,CAAC;;AAEF;AACA;;AAGA;AACA;AACA,OAAO,IAAMC,eAAe,GAAGP,MAAM,CAACC,MAAM,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;;AAErF;AACA;AACA;AACA,IAAMO,IAAI,GAAG,IAAI;;AAEjB;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,OAAOA,CAACC,GAAkB,EAAU;EAClD,IAAMC,CAAC,GAAGZ,WAAW,CAACW,GAAG,CAAC;EAC1B,OAAO,OAAOC,CAAC,KAAK,QAAQ,GAAGA,CAAC,GAAG,CAAC;AACtC;;AAEA;AACA,SAASC,OAAOA,CAACF,GAAkB,EAAE;EACnC,IAAMG,CAAC,GAAGN,eAAe,CAACO,OAAO,CAACJ,GAAG,CAAC;EACtC,OAAOG,CAAC,IAAI,CAAC,IAAIA,CAAC,GAAGN,eAAe,CAACQ,MAAM,GAAG,CAAC,GAC3CR,eAAe,CAACM,CAAC,GAAG,CAAC,CAAC,GACtB,IAAI;AACV;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMG,EAAE,GAAGhB,MAAM,CAACC,MAAM,CAAC;EAC9BgB,EAAE,WAAAA,GAACP,GAAkB,EAAU;IAC7B,4BAAAQ,MAAA,CAA4BT,OAAO,CAACC,GAAG,CAAC;EAC1C,CAAC;EACDS,IAAI,WAAAA,KAACT,GAAkB,EAAU;IAC/B,4BAAAQ,MAAA,CAA4BT,OAAO,CAACC,GAAG,CAAC,GAAGF,IAAI;EACjD,CAAC;EACDY,OAAO,WAAAA,QAACC,KAAoB,EAAEC,GAAkB,EAAU;IACxD,4BAAAJ,MAAA,CAA4BT,OAAO,CAACY,KAAK,CAAC,yBAAAH,MAAA,CAAsBT,OAAO,CAACa,GAAG,CAAC,GAAGd,IAAI;EACrF,CAAC;EACDe,IAAI,WAAAA,KAACb,GAAkB,EAAU;IAC/B,IAAMc,IAAI,GAAGZ,OAAO,CAACF,GAAG,CAAC;IACzB,OAAOc,IAAI,GAAGR,EAAE,CAACI,OAAO,CAACV,GAAG,EAAEc,IAAI,CAAC,GAAGR,EAAE,CAACC,EAAE,CAACP,GAAG,CAAC;EAClD;AACF,CAAC,CAAC;AAEF,eAAeX,WAAW","ignoreList":[]}
+{"version":3,"file":"breakpoints.js","names":["breakpoints","Object","freeze","xs","sm","md","lg","xl","BREAKPOINT_KEYS","STEP","bpValue","key","v","nextKey","i","indexOf","length","mq","up","down","between","start","end","only","next"],"sources":["../../../../src/lib/v2/tokens/breakpoints.ts"],"sourcesContent":["/**\r\n * Breakpoint tokens — Portnet UI v2\r\n * Aligned with Design System v1.0 §07 (Responsive) + R-RS.1.\r\n *\r\n * SINGLE SOURCE OF TRUTH for the responsive breakpoint scale.\r\n * Previously these lived inside tokens/density.js, conflating two\r\n * unrelated concerns (row/control density vs. viewport breakpoints).\r\n * They now live here; density.js re-exports `breakpoints` so every\r\n * existing `import { breakpoints } from \"@portnet/ui/v2/tokens\"`\r\n * (and the `densityLayout` shape) keeps working unchanged.\r\n *\r\n * Two layers consume this scale and MUST stay in lockstep:\r\n *   1. The MUI theme — createPortnetTheme wires `breakpoints` into\r\n *      createTheme's `breakpoints.values`, so `theme.breakpoints.up()`\r\n *      and every `sx={{ prop: { xs, md } }}` on a MUI component resolve\r\n *      against THESE values.\r\n *   2. The CSS layer — the `mq` helpers below emit the SAME media\r\n *      queries as strings, for:\r\n *        - the theme-free v2 Box/Stack responsive sx engine (Layout.js),\r\n *        - raw `.css` / container styles,\r\n *        - any `sx={{ [mq.up(\"md\")]: {...} }}`,\r\n *      and the `--bp-*` CSS variables emitted by cssVariables.js for\r\n *      pure-CSS / container-query consumers.\r\n *\r\n * IMPORTANT — keep `breakpoints` a PURE value map ({ key: number }).\r\n * MUI's createTheme iterates `breakpoints.values` to build its own\r\n * up/down/between; a non-numeric key (e.g. a helper function) would be\r\n * mis-read as a breakpoint named \"up\". Helpers therefore live on the\r\n * SEPARATE `mq` export, never on `breakpoints` itself.\r\n *\r\n * Charter viewport targets covered:\r\n *   - xs band : 320 / 360 / 375 / 390 / 414  (phones, base, no query)\r\n *   - md      : 768 / 820                     (tablet)\r\n *   - lg      : 1024                          (small desktop / landscape tablet)\r\n *   - xl band : 1280 / 1440 / 1920            (desktop)\r\n */\r\n\r\n/* Ascending, mobile-first. xs = 0 is the base band (phones 320-480). */\r\nexport const breakpoints = Object.freeze({\r\n  xs:    0,\r\n  sm:  481,\r\n  md:  768,\r\n  lg: 1024,\r\n  xl: 1280,\r\n});\r\n\r\n/* Local key type — canonical union of breakpoint keys. Not exported;\r\n * the public token surface is unchanged. */\r\ntype BreakpointKey = keyof typeof breakpoints;\r\n\r\n/* Ordered key list — the canonical iteration order for any mobile-first\r\n * cascade (base -> up). Re-used by Layout.js so the order can't drift. */\r\nexport const BREAKPOINT_KEYS = Object.freeze([\"xs\", \"sm\", \"md\", \"lg\", \"xl\"] as const);\r\n\r\n/* MUI parity: down()/between() subtract this from the upper bound so a\r\n * `down(key)` query and the matching `up(key)` query never overlap at\r\n * the exact pixel. Mirrors MUI's default step (5/100 = 0.05px). */\r\nconst STEP = 0.05;\r\n\r\n/**\r\n * Resolve a key to its numeric min-width, falling back to 0 for an\r\n * unknown key so a typo degrades to \"always matches\" rather than\r\n * emitting a NaN width (which silently disables the whole query).\r\n */\r\nexport function bpValue(key: BreakpointKey): number {\r\n  const v = breakpoints[key];\r\n  return typeof v === \"number\" ? v : 0;\r\n}\r\n\r\n/* Next key up the scale, or null when `key` is the largest. */\r\nfunction nextKey(key: BreakpointKey) {\r\n  const i = BREAKPOINT_KEYS.indexOf(key);\r\n  return i >= 0 && i < BREAKPOINT_KEYS.length - 1\r\n    ? BREAKPOINT_KEYS[i + 1]\r\n    : null;\r\n}\r\n\r\n/**\r\n * Token-derived media-query string helpers. Output is identical in\r\n * intent to MUI's `theme.breakpoints.*` so the CSS layer and the\r\n * JS/MUI layer can never diverge.\r\n *\r\n *   mq.up(\"md\")            -> \"@media (min-width:<md>px)\"\r\n *   mq.down(\"md\")          -> \"@media (max-width:<md - 0.05>px)\"\r\n *   mq.between(\"sm\",\"lg\")  -> \"@media (min-width:<sm>px) and (max-width:<lg - 0.05>px)\"\r\n *   mq.only(\"md\")          -> mq.between(\"md\",\"lg\")\r\n *\r\n * Usage (theme-free CSS layer / raw stylesheet):\r\n *   `${mq.up(\"md\")}{ .x{ gap:24px } }`\r\n * Usage (sx object key):\r\n *   sx={{ [mq.up(\"md\")]: { flexDirection: \"row\" } }}\r\n */\r\nexport const mq = Object.freeze({\r\n  up(key: BreakpointKey): string {\r\n    return `@media (min-width:${bpValue(key)}px)`;\r\n  },\r\n  down(key: BreakpointKey): string {\r\n    return `@media (max-width:${bpValue(key) - STEP}px)`;\r\n  },\r\n  between(start: BreakpointKey, end: BreakpointKey): string {\r\n    return `@media (min-width:${bpValue(start)}px) and (max-width:${bpValue(end) - STEP}px)`;\r\n  },\r\n  only(key: BreakpointKey): string {\r\n    const next = nextKey(key);\r\n    return next ? mq.between(key, next) : mq.up(key);\r\n  },\r\n});\r\n\r\nexport default breakpoints;\r\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,OAAO,MAAMA,WAAW,GAAGC,MAAM,CAACC,MAAM,CAAC;EACvCC,EAAE,EAAK,CAAC;EACRC,EAAE,EAAG,GAAG;EACRC,EAAE,EAAG,GAAG;EACRC,EAAE,EAAE,IAAI;EACRC,EAAE,EAAE;AACN,CAAC,CAAC;;AAEF;AACA;;AAGA;AACA;AACA,OAAO,MAAMC,eAAe,GAAGP,MAAM,CAACC,MAAM,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;;AAErF;AACA;AACA;AACA,MAAMO,IAAI,GAAG,IAAI;;AAEjB;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,OAAOA,CAACC,GAAkB,EAAU;EAClD,MAAMC,CAAC,GAAGZ,WAAW,CAACW,GAAG,CAAC;EAC1B,OAAO,OAAOC,CAAC,KAAK,QAAQ,GAAGA,CAAC,GAAG,CAAC;AACtC;;AAEA;AACA,SAASC,OAAOA,CAACF,GAAkB,EAAE;EACnC,MAAMG,CAAC,GAAGN,eAAe,CAACO,OAAO,CAACJ,GAAG,CAAC;EACtC,OAAOG,CAAC,IAAI,CAAC,IAAIA,CAAC,GAAGN,eAAe,CAACQ,MAAM,GAAG,CAAC,GAC3CR,eAAe,CAACM,CAAC,GAAG,CAAC,CAAC,GACtB,IAAI;AACV;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMG,EAAE,GAAGhB,MAAM,CAACC,MAAM,CAAC;EAC9BgB,EAAEA,CAACP,GAAkB,EAAU;IAC7B,OAAO,qBAAqBD,OAAO,CAACC,GAAG,CAAC,KAAK;EAC/C,CAAC;EACDQ,IAAIA,CAACR,GAAkB,EAAU;IAC/B,OAAO,qBAAqBD,OAAO,CAACC,GAAG,CAAC,GAAGF,IAAI,KAAK;EACtD,CAAC;EACDW,OAAOA,CAACC,KAAoB,EAAEC,GAAkB,EAAU;IACxD,OAAO,qBAAqBZ,OAAO,CAACW,KAAK,CAAC,sBAAsBX,OAAO,CAACY,GAAG,CAAC,GAAGb,IAAI,KAAK;EAC1F,CAAC;EACDc,IAAIA,CAACZ,GAAkB,EAAU;IAC/B,MAAMa,IAAI,GAAGX,OAAO,CAACF,GAAG,CAAC;IACzB,OAAOa,IAAI,GAAGP,EAAE,CAACG,OAAO,CAACT,GAAG,EAAEa,IAAI,CAAC,GAAGP,EAAE,CAACC,EAAE,CAACP,GAAG,CAAC;EAClD;AACF,CAAC,CAAC;AAEF,eAAeX,WAAW","ignoreList":[]}