@cueplusplus/ui 0.19.0 → 0.20.1

package/dist/system/frame-clock.d.ts

@@ -0,0 +1,33 @@
+//#region src/system/frame-clock.d.ts
+interface FrameClockOptions {
+  /** Frames per second. Defaults to `30`, cueplusplus.com's `VIDEO_FPS`. */
+  fps?: number;
+  /** How many frames the loop holds. */
+  durationInFrames: number;
+  /** Start again at frame 0 after the last. Defaults to `true`; `false` holds the last frame. */
+  loop?: boolean;
+  /**
+   * Whether the clock runs. Defaults to `true`. Pass `false` while the
+   * animation is off screen: a paused clock schedules nothing and, resumed,
+   * continues from the frame it stopped on.
+   */
+  playing?: boolean;
+  /** The frame shown while held still (a thumbnail, or reduced motion). Defaults to the middle of the loop. */
+  stillFrame?: number;
+}
+/**
+ * A frame counter for a loop illustration: what Remotion's `useCurrentFrame`
+ * gave cueplusplus.com's service animations, without Remotion (spec
+ * 2026-10-04-cue-site-verbatim §4.4). Frame maths written against
+ * `useCurrentFrame` ports unchanged.
+ *
+ * Driven by `requestAnimationFrame` against elapsed time, so a slow frame never
+ * slows the animation down. It never advances while paused or still, and held
+ * still it returns `stillFrame` and schedules nothing.
+ *
+ * @example
+ * const frame = useFrameClock({ durationInFrames: 300, playing: onScreen });
+ */
+declare function useFrameClock({ fps, durationInFrames, loop, playing, stillFrame }: FrameClockOptions): number;
+//#endregion
+export { FrameClockOptions, useFrameClock };

package/dist/system/frame-clock.js

@@ -0,0 +1,56 @@
+"use client";
+import { usePrefersReducedMotion } from "../instruments/_motion.js";
+import { useStill } from "./still.js";
+import * as React from "react";
+//#region src/system/frame-clock.ts
+/**
+* A frame counter for a loop illustration: what Remotion's `useCurrentFrame`
+* gave cueplusplus.com's service animations, without Remotion (spec
+* 2026-10-04-cue-site-verbatim §4.4). Frame maths written against
+* `useCurrentFrame` ports unchanged.
+*
+* Driven by `requestAnimationFrame` against elapsed time, so a slow frame never
+* slows the animation down. It never advances while paused or still, and held
+* still it returns `stillFrame` and schedules nothing.
+*
+* @example
+* const frame = useFrameClock({ durationInFrames: 300, playing: onScreen });
+*/
+function useFrameClock({ fps = 30, durationInFrames, loop = true, playing = true, stillFrame }) {
+	const held = useStill();
+	const reduced = usePrefersReducedMotion();
+	const still = held || reduced;
+	const seat = stillFrame ?? Math.floor(durationInFrames / 2);
+	const [frame, setFrame] = React.useState(0);
+	const elapsed = React.useRef(0);
+	React.useEffect(() => {
+		if (still || !playing || durationInFrames <= 0) return;
+		let last = performance.now();
+		let handle = requestAnimationFrame(function step() {
+			const now = performance.now();
+			elapsed.current += now - last;
+			last = now;
+			const total = Math.floor(elapsed.current * fps / 1e3);
+			setFrame(loop ? total % durationInFrames : Math.min(total, durationInFrames - 1));
+			if (!loop && total >= durationInFrames - 1) return;
+			handle = requestAnimationFrame(step);
+		});
+		const onVisibility = () => {
+			if (!document.hidden) last = performance.now();
+		};
+		document.addEventListener("visibilitychange", onVisibility);
+		return () => {
+			cancelAnimationFrame(handle);
+			document.removeEventListener("visibilitychange", onVisibility);
+		};
+	}, [
+		still,
+		playing,
+		fps,
+		durationInFrames,
+		loop
+	]);
+	return still ? seat : frame;
+}
+//#endregion
+export { useFrameClock };

package/dist/system/index.d.ts

@@ -8,7 +8,8 @@ import { useDensities, useFonts, useThemes } from "./theme-registry.js";
 import { ControlSize, useControlHeight, useDensity } from "./use-density.js";
 import { useTheme } from "./use-theme.js";
 import { StillProvider, StillProviderProps, useStill } from "./still.js";
+import { FrameClockOptions, useFrameClock } from "./frame-clock.js";
 import { FontScope, FontScopeProps } from "./font-scope.js";
 import { DEFAULT_PAINT, DEFAULT_STYLE_SET, PAINTS, Paint, STYLE_SETS, StyleSet } from "@cueplusplus/tokens";
 import { Density as DensityLevel, DensityEntry, FontEntry, FontName, Mode, ThemeManifest, ThemeName } from "@cueplusplus/theme-base";
-export { type ControlSize, CuePortalFrame, type CuePortalFrameProps, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, Density, type DensityEntry, type DensityLevel, type DensityProps, type FontEntry, type FontFamilies, type FontName, FontScope, type FontScopeProps, type Mode, PAINTS, type Paint, type PersistedPreferences, type PrepaintDefaults, type PrepaintOptions, type ResolvedMode, STYLE_SETS, StillProvider, type StillProviderProps, type StyleSet, type ThemeContextValue, type ThemeManifest, type ThemeName, ThemeProvider, type ThemeProviderProps, type ThemeRegistry, type TokenOverrides, isSafeTokenValue, prepaintScript, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useStill, useTheme, useThemes };
+export { type ControlSize, CuePortalFrame, type CuePortalFrameProps, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, Density, type DensityEntry, type DensityLevel, type DensityProps, type FontEntry, type FontFamilies, type FontName, FontScope, type FontScopeProps, type FrameClockOptions, type Mode, PAINTS, type Paint, type PersistedPreferences, type PrepaintDefaults, type PrepaintOptions, type ResolvedMode, STYLE_SETS, StillProvider, type StillProviderProps, type StyleSet, type ThemeContextValue, type ThemeManifest, type ThemeName, ThemeProvider, type ThemeProviderProps, type ThemeRegistry, type TokenOverrides, isSafeTokenValue, prepaintScript, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useStill, useTheme, useThemes };

package/dist/system/index.js

@@ -7,6 +7,7 @@ import { ThemeProvider } from "./theme-provider.js";
 import { CuePortalFrame, useCuePortalProps } from "./portal.js";
 import { useControlHeight, useDensity } from "./use-density.js";
 import { useTheme } from "./use-theme.js";
+import { useFrameClock } from "./frame-clock.js";
 import { FontScope } from "./font-scope.js";
 import { DEFAULT_PAINT, DEFAULT_STYLE_SET, PAINTS, STYLE_SETS } from "@cueplusplus/tokens";
-export { CuePortalFrame, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, Density, FontScope, PAINTS, STYLE_SETS, StillProvider, ThemeProvider, isSafeTokenValue, prepaintScript, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useStill, useTheme, useThemes };
+export { CuePortalFrame, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, Density, FontScope, PAINTS, STYLE_SETS, StillProvider, ThemeProvider, isSafeTokenValue, prepaintScript, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useStill, useTheme, useThemes };

package/dist/system/still.js

@@ -43,5 +43,18 @@ function useStill() {
 	const reduced = usePrefersReducedMotion();
 	return still || reduced;
 }
+/**
+* Whether a {@link StillProvider} above holds this subtree still — the
+* provider's half of {@link useStill}, without the reader's motion preference.
+* For the one component that must tell a held thumbnail from a reader who
+* prefers reduced motion, because the two mean different things to it
+* (`TextScramble`: a thumbnail holds the first phrase, reduced motion still
+* cycles phrases without scrambling them, as cueplusplus.com does).
+*
+* @internal Not part of the public API.
+*/
+function useStillHeld() {
+	return React.useContext(StillContext);
+}
 //#endregion
-export { StillProvider, useStill };
+export { StillProvider, useStill, useStillHeld };

package/dist/system/theme-registry.d.ts

@@ -41,7 +41,7 @@ declare function useThemes(): readonly ThemeManifest[];
  */
 declare function useDensities(): readonly DensityEntry[];
 /**
- * The font pairings, by the same rule: the base twelve, then the active theme's.
+ * The font pairings, by the same rule: the base fourteen, then the active theme's.
  *
  * @throws If called outside a `<ThemeProvider>`.
  * @example

package/dist/system/theme-registry.js

@@ -68,7 +68,7 @@ function useDensities() {
 	return useRegistry("useDensities", (registry) => registry.densities);
 }
 /**
-* The font pairings, by the same rule: the base twelve, then the active theme's.
+* The font pairings, by the same rule: the base fourteen, then the active theme's.
 *
 * @throws If called outside a `<ThemeProvider>`.
 * @example

package/manifest/components/autocomplete.json

@@ -278,6 +278,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/bento.json

@@ -20,7 +20,7 @@
       "props": [
         {
           "name": "cols",
-          "type": "4 | 2 | 3",
+          "type": "2 | 4 | 3",
           "required": false,
           "defaultValue": "3",
           "description": "How many columns at `lg`. Defaults to `3`. Two from `sm`, one below it.",
@@ -37,7 +37,7 @@
         },
         {
           "name": "rows",
-          "type": "1 | 4 | 2 | 3",
+          "type": "1 | 2 | 4 | 3",
           "required": false,
           "defaultValue": null,
           "description": "How many rows to declare from `sm` up.\n\nOnly worth setting where a tile spans rows: a `rowSpan` over implicit\ntracks sizes itself to the tile's own content, which is not a span.",
@@ -65,7 +65,7 @@
         },
         {
           "name": "gap",
-          "type": "0 | 1 | 4 | 8 | 2 | 3 | 5 | 6 | 7",
+          "type": "0 | 1 | 2 | 4 | 8 | 3 | 5 | 6 | 7",
           "required": false,
           "defaultValue": "4",
           "description": "Which rung of the density space ladder to spend between tiles. Defaults to `4`.",
@@ -109,7 +109,7 @@
       "props": [
         {
           "name": "span",
-          "type": "1 | 4 | 2 | 3",
+          "type": "1 | 2 | 4 | 3",
           "required": false,
           "defaultValue": null,
           "description": "How many columns to cover. Clamped by the container to its own `cols`.",

package/manifest/components/color-area.json

@@ -30,10 +30,20 @@
   "tokensUsed": [
     "--cue-bg",
     "--cue-border",
+    "--cue-border-strong",
+    "--cue-danger",
     "--cue-fg",
     "--cue-focus",
     "--cue-focus-ring",
     "--cue-radius-control",
+    "--cue-radius-scale",
+    "--cue-space-3",
+    "--cue-space-4",
+    "--cue-space-5",
+    "--cue-style-control-radius",
+    "--cue-style-field-hover-edge",
+    "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-width"
   ],
   "summary": "The two-axis colour field — saturation against brightness by default.",

package/manifest/components/color-field.json

@@ -76,12 +76,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-1",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -90,6 +92,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/color-picker.json

@@ -210,12 +210,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -224,6 +226,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/combobox.json

@@ -281,6 +281,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/composer.json

@@ -212,12 +212,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -226,6 +228,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/data-table-pagination.json

@@ -63,9 +63,12 @@
     "--cue-fg",
     "--cue-fg-subtle",
     "--cue-font-mono",
+    "--cue-pad-row-x",
     "--cue-space-1",
     "--cue-space-2",
     "--cue-space-3",
+    "--cue-style-cell-leading",
+    "--cue-style-cell-pad",
     "--cue-text-label"
   ],
   "summary": "The pager: four buttons, the position, and the row count.",

package/manifest/components/data-table-toolbar.json

@@ -93,9 +93,12 @@
     "--cue-fg",
     "--cue-fg-subtle",
     "--cue-font-mono",
+    "--cue-pad-row-x",
     "--cue-space-1",
     "--cue-space-2",
     "--cue-space-3",
+    "--cue-style-cell-leading",
+    "--cue-style-cell-pad",
     "--cue-text-label"
   ],
   "summary": "The strip above a table: one search box, a match count, your controls.",

package/manifest/components/date-field.json

@@ -67,12 +67,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-1",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -81,6 +83,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/date-picker.json

@@ -230,12 +230,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -244,6 +246,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/date-range-picker.json

@@ -230,12 +230,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -244,6 +246,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/delegation-card.json

@@ -153,6 +153,7 @@
   "defaultVariants": {},
   "tokensUsed": [
     "--cue-border",
+    "--cue-border-strong",
     "--cue-danger",
     "--cue-fg-muted",
     "--cue-fg-subtle",
@@ -162,10 +163,15 @@
     "--cue-icon-sm",
     "--cue-ok",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
+    "--cue-style-control-radius",
+    "--cue-style-field-hover-edge",
+    "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-width",
     "--cue-text-micro",
     "--cue-text-ui"

package/manifest/components/env-var-input.json

@@ -167,12 +167,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -181,6 +183,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/file-upload.json

@@ -167,11 +167,16 @@
     "--cue-icon-sm",
     "--cue-ok",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-1",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
+    "--cue-style-control-radius",
+    "--cue-style-field-hover-edge",
+    "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-width",
     "--cue-sunken",
     "--cue-surface-2",

package/manifest/components/font-scope.json

@@ -9,7 +9,7 @@
   "props": [
     {
       "name": "font",
-      "type": "\"source\" | \"system\" | \"geist\" | \"geist-mono\" | \"inter\" | \"plex\" | \"roboto\" | \"apple\" | \"office\" | \"inter-source\" | \"dm\" | \"calsans\" | \"fraunces-mono\"",
+      "type": "\"source\" | \"system\" | \"geist\" | \"geist-mono\" | \"inter\" | \"plex\" | \"roboto\" | \"apple\" | \"office\" | \"inter-source\" | \"dm\" | \"calsans\" | \"fraunces-mono\" | \"jetbrains-mono\"",
       "required": true,
       "defaultValue": null,
       "description": "The pairing this subtree is set in.",
@@ -28,7 +28,8 @@
           "inter-source",
           "dm",
           "calsans",
-          "fraunces-mono"
+          "fraunces-mono",
+          "jetbrains-mono"
         ]
       }
     },

package/manifest/components/grid.json

@@ -9,7 +9,7 @@
   "props": [
     {
       "name": "cols",
-      "type": "1 | 4 | 2 | 3 | 5 | 6",
+      "type": "1 | 2 | 4 | 3 | 5 | 6",
       "required": false,
       "defaultValue": "1",
       "description": "How many equal columns. Defaults to `1`. Ignored when `minItemWidth` is set.",
@@ -29,7 +29,7 @@
     },
     {
       "name": "gap",
-      "type": "0 | 1 | 4 | 8 | 2 | 3 | 5 | 6 | 7",
+      "type": "0 | 1 | 2 | 4 | 8 | 3 | 5 | 6 | 7",
       "required": false,
       "defaultValue": "4",
       "description": "Which rung of the density space ladder to spend between cells. Defaults to `4`.",

package/manifest/components/input-group.json

@@ -87,12 +87,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -101,6 +103,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/input.json

@@ -84,11 +84,13 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -97,6 +99,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/ledger.json

@@ -73,7 +73,7 @@
         },
         {
           "name": "headingLevel",
-          "type": "4 | 2 | 3",
+          "type": "2 | 4 | 3",
           "required": false,
           "defaultValue": "2",
           "description": "Which heading element the tier's name is. Defaults to `2`.\n\nThe outline is the navigation: a screen-reader user moves through a long\nledger by heading, so the levels have to describe the real nesting of the\npage the ledger sits in, not the ledger's own idea of itself.",

package/manifest/components/markdown-text.json

@@ -46,7 +46,7 @@
     },
     {
       "name": "headingLevel",
-      "type": "4 | 2 | 3",
+      "type": "2 | 4 | 3",
       "required": false,
       "defaultValue": "2",
       "description": "The heading level `#` renders at; `##` and below follow it, clamped at\n`h6`. Defaults to `2`, because model output is a passage inside a page\nthat already owns its `h1`.",

package/manifest/components/message.json

@@ -108,15 +108,23 @@
     "--cue-accent",
     "--cue-accent-fg",
     "--cue-border",
+    "--cue-border-strong",
+    "--cue-danger",
     "--cue-fg",
     "--cue-fg-subtle",
     "--cue-font-mono",
     "--cue-leading-ui",
     "--cue-radius-control",
     "--cue-radius-overlay",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
+    "--cue-space-5",
+    "--cue-style-control-radius",
+    "--cue-style-field-hover-edge",
+    "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-label-case",
     "--cue-style-label-face",
     "--cue-style-label-tracking",

package/manifest/components/multi-select.json

@@ -271,6 +271,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",

package/manifest/components/musical-time-input.json

@@ -115,12 +115,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -129,6 +131,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-input-face",

package/manifest/components/number-field.json

@@ -104,12 +104,14 @@
     "--cue-paint-stroke-to",
     "--cue-paint-stroke-width",
     "--cue-radius-control",
+    "--cue-radius-scale",
     "--cue-space-2",
     "--cue-space-3",
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-body-weight",
     "--cue-style-check-edge",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",
@@ -118,6 +120,7 @@
     "--cue-style-field-focus-offset",
     "--cue-style-field-hover-edge",
     "--cue-style-field-pad",
+    "--cue-style-field-radius",
     "--cue-style-focus-edge",
     "--cue-style-focus-width",
     "--cue-style-glyph-ink",