@cueplusplus/ui 0.18.2 → 0.19.0

package/manifest/components/hover-card.json

@@ -146,7 +146,6 @@
     "--cue-control-sm",
     "--cue-fg",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-font-mono",
     "--cue-leading-ui",
     "--cue-paint-rim-width",
@@ -174,6 +173,7 @@
     "--cue-style-body-size",
     "--cue-style-body-weight",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-display-variation",
     "--cue-style-group-label-ink",
     "--cue-style-group-label-pad",

package/manifest/components/kbd.json

@@ -24,6 +24,7 @@
     "--cue-space-2",
     "--cue-style-chip-size",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-kbd-edge",
     "--cue-style-kbd-fill",
     "--cue-style-kbd-height",

package/manifest/components/keyword.json

@@ -0,0 +1,67 @@
+{
+  "name": "Keyword",
+  "slug": "keyword",
+  "group": "chrome",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": false,
+  "description": "A word in a title filled with the Look's keyword gradient.\n\nReads `style-keyword-fill`, a gradient of the theme's own inks, through\n`background-clip: text`. Where the browser cannot clip a background to text, or\nin forced colours, it is the accent instead, so the word is never transparent.\nUnset, the fill is the accent itself.\n\nStatic markup — no `\"use client\"`.",
+  "props": [
+    {
+      "name": "children",
+      "type": "ReactNode",
+      "required": true,
+      "defaultValue": null,
+      "description": "The words to mark: one word or a short phrase in a title.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    }
+  ],
+  "typeReferences": [
+    "React.ComponentPropsWithoutRef<\"span\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-accent",
+    "--cue-style-keyword-fill"
+  ],
+  "summary": "A word in a title filled with the Look's keyword gradient, with a solid accent fallback.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<h1>The world's first <Keyword>predictive</Keyword> retail system.</h1>",
+      "language": "tsx"
+    }
+  ],
+  "status": "stable",
+  "url": "/docs/components/keyword",
+  "mdUrl": "/docs/components/keyword.md",
+  "jsonUrl": "/r/components/keyword.json",
+  "whenToUse": [
+    "One word or a short phrase a marketing title leans on: “the world's first *predictive* system”."
+  ],
+  "whenNotToUse": [
+    "Whole sentences or body copy. A gradient across running text is hard to read.",
+    "Links or emphasis in prose. Use `Link` or `<strong>`."
+  ],
+  "commonMistakes": [
+    "Assuming the gradient shows everywhere. Without `background-clip: text`, and in forced colours, it is the accent; the word is never transparent."
+  ],
+  "specimens": [
+    {
+      "title": "Keyword",
+      "group": "chrome",
+      "components": [
+        "Keyword"
+      ],
+      "code": "<p className=\"m-0 text-(length:--cue-text-title) font-semibold text-fg\">\n  Payments <Keyword>infrastructure</Keyword> for the internet\n</p>",
+      "note": "An inline word filled with the set's keyword gradient. Where text cannot be a background clip it is the accent, and in forced colours it is the system's text colour.",
+      "interaction": "none."
+    }
+  ]
+}

package/manifest/components/ledger.json

@@ -80,9 +80,9 @@
           "control": {
             "kind": "enum",
             "members": [
-              4,
               2,
-              3
+              3,
+              4
             ],
             "min": 2,
             "max": 4
@@ -170,8 +170,8 @@
           "control": {
             "kind": "enum",
             "members": [
-              4,
-              3
+              3,
+              4
             ],
             "min": 3,
             "max": 4

package/manifest/components/logo-strip.json

@@ -0,0 +1,93 @@
+{
+  "name": "LogoStrip",
+  "slug": "logo-strip",
+  "group": "chrome",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": false,
+  "description": "A row of names under a caption: the \"trusted by\" strip of a product page.\n\nText wordmarks only, set in the display face at a muted ink, never an image: a\nreal company's mark is a trademark that is not this library's to draw, and a\ngallery page's names are fictional. The row wraps, and centres when it does.\n\nStatic markup — no `\"use client\"`.",
+  "props": [
+    {
+      "name": "names",
+      "type": "readonly string[]",
+      "required": true,
+      "defaultValue": null,
+      "description": "The names, as text. A real company's logo is never drawn here.",
+      "control": {
+        "kind": "array",
+        "fixture": "agent.transcript"
+      }
+    },
+    {
+      "name": "caption",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": null,
+      "description": "The line above the row, e.g. \"Trusted by teams at\".",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    }
+  ],
+  "typeReferences": [
+    "React.ComponentPropsWithoutRef<\"div\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-fg-muted",
+    "--cue-font-mono",
+    "--cue-font-sans",
+    "--cue-space-4",
+    "--cue-space-7",
+    "--cue-style-label-case",
+    "--cue-style-label-face",
+    "--cue-style-label-ink",
+    "--cue-style-label-size",
+    "--cue-style-label-tracking",
+    "--cue-text-label",
+    "--cue-text-micro",
+    "--cue-text-title",
+    "--cue-tracking-caps",
+    "--cue-tracking-caps-loose",
+    "--cue-tracking-caps-tight"
+  ],
+  "summary": "A caption and a row of names: the “trusted by” strip of a product page, in text.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<LogoStrip caption=\"Trusted by teams at\" names={[\"Northwind\", \"Halcyon\", \"Kestrel\"]} />",
+      "language": "tsx"
+    }
+  ],
+  "status": "stable",
+  "url": "/docs/components/logo-strip",
+  "mdUrl": "/docs/components/logo-strip.md",
+  "jsonUrl": "/r/components/logo-strip.json",
+  "whenToUse": [
+    "Under a landing hero, to say who uses the product.",
+    "A row of partner or customer names on a marketing page."
+  ],
+  "whenNotToUse": [
+    "Real company logos. This draws text wordmarks only; a real mark is a trademark that is not ours to draw.",
+    "Navigation or links. The names are not interactive."
+  ],
+  "commonMistakes": [
+    "Using real client names on a gallery or demo page. Gallery pages are fictional."
+  ],
+  "specimens": [
+    {
+      "title": "LogoStrip",
+      "group": "chrome",
+      "components": [
+        "LogoStrip"
+      ],
+      "code": "<LogoStrip caption=\"Trusted by teams at\" names={[\"Northwind\", \"Contoso\", \"Fabrikam\", \"Tailspin\", \"Litware\"]} />",
+      "note": "A row of wordmarks, drawn as text. A real brand's logo is never drawn here; a page that has the right to one passes its own art.",
+      "interaction": "none."
+    }
+  ]
+}

package/manifest/components/markdown-text.json

@@ -53,9 +53,9 @@
       "control": {
         "kind": "enum",
         "members": [
-          4,
           2,
-          3
+          3,
+          4
         ],
         "min": 2,
         "max": 4

package/manifest/components/menubar.json

@@ -140,7 +140,6 @@
     "--cue-control-sm",
     "--cue-fg",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-focus",
     "--cue-focus-ring",
     "--cue-font-mono",
@@ -169,6 +168,7 @@
     "--cue-style-body-size",
     "--cue-style-body-weight",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-display-variation",
     "--cue-style-focus-width",
     "--cue-style-group-label-ink",

package/manifest/components/motif.json

@@ -0,0 +1,90 @@
+{
+  "name": "Motif",
+  "slug": "motif",
+  "group": "brand",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": false,
+  "description": "The art a Look draws in a hero: a ribbon, a halftone, a gloss object or a\nparticle word, whichever the style set chooses (spec 2026-10-02 §3.4).\n\n**The Look chooses, at the CSS layer.** Every offered variant is rendered, each\nin a wrapper whose `display` is the set's `style-motif-*` token, `none` unless\nthe set turns it on. So switching the Look switches the art with no re-render,\nthe server and the browser draw the same markup, and the paint pack `none` stays\nempty. A Look that turns none on draws nothing here and takes no room: the\ncontainer's own `display` is `style-motif-shown`, which the build derives as\n`block` for a set that shows a motif and which is `none` everywhere else. The\nparticle variant animates only while it is the one displayed.\n\nStatic markup — no `\"use client\"`; the particle variant is its own client island.",
+  "props": [
+    {
+      "name": "variants",
+      "type": "readonly MotifVariant[]",
+      "required": false,
+      "defaultValue": "[\"ribbon\", \"halftone\", \"gloss\", \"particles\"]",
+      "description": "The variants this page offers. The Look shows at most one of them. Defaults to all four.",
+      "control": {
+        "kind": "array"
+      }
+    },
+    {
+      "name": "seed",
+      "type": "number",
+      "required": false,
+      "defaultValue": "1",
+      "description": "The same seed draws the same picture, on the server and in the browser. Defaults to `1`.",
+      "control": {
+        "kind": "number"
+      }
+    },
+    {
+      "name": "word",
+      "type": "string",
+      "required": false,
+      "defaultValue": "CUE",
+      "description": "The word the particle variant draws. Defaults to `\"CUE\"`.",
+      "control": {
+        "kind": "string"
+      }
+    }
+  ],
+  "typeReferences": [
+    "React.ComponentPropsWithoutRef<\"div\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-style-motif-gloss",
+    "--cue-style-motif-halftone",
+    "--cue-style-motif-particles",
+    "--cue-style-motif-ribbon",
+    "--cue-style-motif-shown"
+  ],
+  "summary": "The art a Look draws in a hero — a ribbon, a halftone, a gloss object or a particle word — chosen by the style set.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<Hero title=\"Payments infrastructure\" media={<Motif seed={2} />} />",
+      "language": "tsx"
+    }
+  ],
+  "status": "stable",
+  "url": "/docs/components/motif",
+  "mdUrl": "/docs/components/motif.md",
+  "jsonUrl": "/r/components/motif.json",
+  "whenToUse": [
+    "`Hero`'s `media` slot on a landing page, so each Look brings its own art.",
+    "Any decorative panel whose art should follow the Look."
+  ],
+  "whenNotToUse": [
+    "Meaningful imagery: a chart, a product shot, a diagram. A motif is decoration and is hidden from assistive technology.",
+    "A specific motif regardless of Look. Use `Ribbon`, `Halftone`, `GlossObject` or `ParticleMark` directly."
+  ],
+  "commonMistakes": [
+    "Expecting it to draw under every Look. A set that turns no motif on draws nothing here, which is that Look's choice."
+  ],
+  "specimens": [
+    {
+      "title": "Motif",
+      "group": "brand",
+      "components": [
+        "Motif"
+      ],
+      "code": "<Specimens>\n  {Object.entries(MOTIF_TOKENS).map(([variant, token]) => (\n    <Specimen key={variant} label={variant} wide>\n      <div className=\"w-64\" style={{ [token]: \"block\", \"--cue-style-motif-shown\": \"block\" } as React.CSSProperties}>\n        <Motif seed={3} word=\"CUE\" />\n      </div>\n    </Specimen>\n  ))}\n</Specimens>",
+      "note": "The art a Look draws in a hero. Every offered variant is in the markup, each hidden until the style set turns its token on, so switching the Look switches the art with no re-render. Each specimen below sets one token inline to show what a set would.",
+      "interaction": "none. The particle variant animates only while it is shown, on screen, in a visible tab, and not held still."
+    }
+  ]
+}

package/manifest/components/multi-select.json

@@ -261,6 +261,7 @@
     "--cue-style-chip-size",
     "--cue-style-chip-tracking",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-control-step-size",
     "--cue-style-disabled-edge",
     "--cue-style-disabled-fill",

package/manifest/components/navigation-menu.json

@@ -255,6 +255,7 @@
     "--cue-style-body-size",
     "--cue-style-body-weight",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-display-variation",
     "--cue-style-focus-width",
     "--cue-style-group-label-ink",

package/manifest/components/page-shell.json

@@ -87,6 +87,7 @@
   "variants": {},
   "defaultVariants": {},
   "tokensUsed": [
+    "--cue-border",
     "--cue-fg",
     "--cue-fg-muted",
     "--cue-font-mono",
@@ -100,11 +101,15 @@
     "--cue-space-7",
     "--cue-style-body-face",
     "--cue-style-body-weight",
+    "--cue-style-display-case",
     "--cue-style-display-variation",
+    "--cue-style-frame-lines-content",
+    "--cue-style-grid-lines-content",
     "--cue-style-heading-ink",
     "--cue-style-lede-ink",
     "--cue-style-lede-leading",
     "--cue-style-lede-size",
+    "--cue-style-page-frame-position",
     "--cue-style-page-title-face",
     "--cue-style-page-title-leading",
     "--cue-style-page-title-size",

package/manifest/components/particle-mark.json

@@ -0,0 +1,75 @@
+{
+  "name": "ParticleMark",
+  "slug": "particle-mark",
+  "group": "brand",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": true,
+  "description": "A word drawn as a field of dots that drift and settle — a studio site's mark\n(spec 2026-10-02 §3.4). The dots are the accent, read from the canvas's own\ncomputed style, so they follow the Look.\n\n**It costs nothing at rest.** It animates only while its element is displayed,\non screen and in a visible tab, and while {@link useStill} is false (a still\nthumbnail, or a reader who prefers reduced motion). Otherwise it draws one\nstill frame. That frame is redrawn whenever any theme axis changes anywhere above\nit, the system colour scheme flips, a face finishes loading, or it resizes, so a\npaused mark is never left in an old palette. Unmounting disconnects every\nobserver and cancels every frame.\n\nDecorative: hidden from assistive technology.",
+  "props": [
+    {
+      "name": "word",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "The word the dots draw, short: a name or a mark.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "seed",
+      "type": "number",
+      "required": false,
+      "defaultValue": "1",
+      "description": "Which scatter. Defaults to `1`.",
+      "control": {
+        "kind": "number"
+      }
+    }
+  ],
+  "typeReferences": [
+    "React.ComponentPropsWithoutRef<\"canvas\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-accent"
+  ],
+  "summary": "A word drawn as drifting dots in the accent, still when it is offscreen, hidden or motion is reduced.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<ParticleMark word=\"CUE\" className=\"h-40 w-full\" />",
+      "language": "tsx"
+    }
+  ],
+  "status": "stable",
+  "url": "/docs/components/particle-mark",
+  "mdUrl": "/docs/components/particle-mark.md",
+  "jsonUrl": "/r/components/particle-mark.json",
+  "whenToUse": [
+    "A studio or product site's mark in its hero."
+  ],
+  "whenNotToUse": [
+    "Text a reader must read. It is decorative and hidden from assistive technology.",
+    "Many on one page. Each is a canvas; one per page is the intent."
+  ],
+  "commonMistakes": [
+    "Assuming it animates in a thumbnail. Under `StillProvider still`, or with reduced motion, it draws one still frame."
+  ],
+  "specimens": [
+    {
+      "title": "ParticleMark",
+      "group": "brand",
+      "components": [
+        "ParticleMark"
+      ],
+      "code": "<ParticleMark word=\"CUE\" className=\"h-32 w-64\" />",
+      "note": "A word drawn as a field of dots in the accent. It costs nothing at rest: off screen, in a hidden tab or held still, it draws one frame and stops.",
+      "interaction": "none. Prefer reduced motion and it holds its still frame."
+    }
+  ]
+}

package/manifest/components/popover.json

@@ -176,7 +176,6 @@
     "--cue-control-sm",
     "--cue-fg",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-font-mono",
     "--cue-leading-ui",
     "--cue-paint-rim-width",
@@ -204,6 +203,7 @@
     "--cue-style-body-size",
     "--cue-style-body-weight",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-display-variation",
     "--cue-style-group-label-ink",
     "--cue-style-group-label-pad",

package/manifest/components/preview.json

@@ -72,7 +72,7 @@
     },
     {
       "name": "font",
-      "type": "\"source\" | \"system\" | \"geist\" | \"geist-mono\" | \"inter\" | \"plex\" | \"roboto\" | \"apple\" | \"office\" | \"inter-source\" | \"dm\" | \"calsans\"",
+      "type": "\"source\" | \"system\" | \"geist\" | \"geist-mono\" | \"inter\" | \"plex\" | \"roboto\" | \"apple\" | \"office\" | \"inter-source\" | \"dm\" | \"calsans\" | \"fraunces-mono\"",
       "required": false,
       "defaultValue": null,
       "description": "A font pairing for the stage only, stamped as `data-font` and republished to\nReact, so an overlay opened on the stage wears the stage's pairing rather\nthan the page's, and `useTheme().font` read on the stage reports it. The\nstage also takes `font-sans` when a pairing is named: `data-font` re-declares\nthe family's custom properties, but `font-family` inherits as an already\ncomputed value, so unclassed text on the stage would otherwise keep the\nfamily it resolved above it. Unset, the stage inherits and adds neither.",
@@ -90,19 +90,21 @@
           "office",
           "inter-source",
           "dm",
-          "calsans"
+          "calsans",
+          "fraunces-mono"
         ]
       }
     },
     {
       "name": "styleSet",
-      "type": "\"console\" | \"editorial\" | \"marketing\" | \"graphite\" | \"tender\" | \"zine\" | \"kiln\" | \"porcelain\"",
+      "type": "\"command\" | \"console\" | \"editorial\" | \"marketing\" | \"graphite\" | \"tender\" | \"zine\" | \"kiln\" | \"porcelain\" | \"ledger\" | \"monolith\" | \"prism\"",
       "required": false,
       "defaultValue": null,
       "description": "A style set for the stage only: `console`, `editorial`, `marketing` or\n`graphite`.\n\nUnset, the stage inherits and **no attribute is emitted at all** — the same\nrule the other four follow here — unless the stage names a `theme`, a `mode`\nor a `font`. Then it restates the set in force around it, because a set's\nblock declares values that read those axes (its seam ink and band rule\nread the theme, its control and display faces read the pairing) and a\ncustom property resolves where it is declared: restated, they resolve\nagainst the stage. Unlike `theme`, naming one loads nothing and needs\nnothing: every set is emitted by `@cueplusplus/tokens` into the stylesheet\nevery consumer already imports, so a stage is scoped to\n`[data-style=\"<name>\"]` and the block is on the page by construction.\n\nThe set is republished to React as well as stamped, so a popover opened on\nthe stage follows the stage rather than the page — a portal mounts on\n`<body>` and inherits nothing from the stage's DOM.",
       "control": {
         "kind": "enum",
         "members": [
+          "command",
           "console",
           "editorial",
           "marketing",
@@ -110,7 +112,10 @@
           "tender",
           "zine",
           "kiln",
-          "porcelain"
+          "porcelain",
+          "ledger",
+          "monolith",
+          "prism"
         ]
       }
     },

package/manifest/components/radio-group.json

@@ -45,7 +45,6 @@
     "--cue-border-strong",
     "--cue-danger",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-focus",
     "--cue-focus-ring",
     "--cue-font-mono",

package/manifest/components/radio.json

@@ -56,7 +56,6 @@
     "--cue-border-strong",
     "--cue-danger",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-focus",
     "--cue-focus-ring",
     "--cue-font-mono",

package/manifest/components/ribbon.json

@@ -0,0 +1,65 @@
+{
+  "name": "Ribbon",
+  "slug": "ribbon",
+  "group": "brand",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": false,
+  "description": "A flowing ribbon of layered bands in the theme's own inks — the payments-page\nmotif (spec 2026-10-02 §3.4). Five bezier bands cross the frame on a diagonal,\neach a gradient from the accent to the foreground's mix, so it reads in every\ntheme and both modes. Decorative: hidden from assistive technology.\n\nStatic markup — no `\"use client\"`.",
+  "props": [
+    {
+      "name": "seed",
+      "type": "number",
+      "required": false,
+      "defaultValue": "1",
+      "description": "Which ribbon: the same seed draws the same bands. Defaults to `1`.",
+      "control": {
+        "kind": "number"
+      }
+    }
+  ],
+  "typeReferences": [
+    "React.SVGProps<SVGSVGElement>"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-accent",
+    "--cue-fg"
+  ],
+  "summary": "A flowing ribbon of layered bands in the theme's inks: the payments-page motif.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<Ribbon seed={3} className=\"h-64 w-full\" />",
+      "language": "tsx"
+    }
+  ],
+  "status": "stable",
+  "url": "/docs/components/ribbon",
+  "mdUrl": "/docs/components/ribbon.md",
+  "jsonUrl": "/r/components/ribbon.json",
+  "whenToUse": [
+    "Hero art on a product or payments page, at any size; it stretches to its box."
+  ],
+  "whenNotToUse": [
+    "Content imagery. It is decorative and hidden from assistive technology."
+  ],
+  "commonMistakes": [
+    "Changing its colours with props. It reads the theme's accent and foreground, so it follows the Look."
+  ],
+  "specimens": [
+    {
+      "title": "Ribbon",
+      "group": "brand",
+      "components": [
+        "Ribbon"
+      ],
+      "code": "<Specimens>\n  {[1, 2, 3].map((seed) => (\n    <Specimen key={seed} label={`seed ${seed}`} wide>\n      <Ribbon seed={seed} className=\"h-40 w-64\" />\n    </Specimen>\n  ))}\n</Specimens>",
+      "note": "Layered bezier bands in the theme's own inks. The seed is the picture: the same seed draws the same ribbon on the server and in the browser.",
+      "interaction": "none."
+    }
+  ]
+}

package/manifest/components/scrollable-tabs-list.json

@@ -67,6 +67,7 @@
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-focus-width",
     "--cue-style-group-gap",
     "--cue-style-segment-edge",

package/manifest/components/segmented-control.json

@@ -153,6 +153,7 @@
     "--cue-space-4",
     "--cue-space-5",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-focus-width",
     "--cue-style-segment-edge",
     "--cue-style-segment-ground",

package/manifest/components/sheet.json

@@ -166,7 +166,6 @@
     "--cue-control-sm",
     "--cue-fg",
     "--cue-fg-muted",
-    "--cue-fg-subtle",
     "--cue-font-mono",
     "--cue-leading-ui",
     "--cue-paint-rim-width",
@@ -195,6 +194,7 @@
     "--cue-style-body-size",
     "--cue-style-body-weight",
     "--cue-style-control-face",
+    "--cue-style-control-radius",
     "--cue-style-display-variation",
     "--cue-style-group-label-ink",
     "--cue-style-group-label-pad",

package/manifest/components/sidebar.json

@@ -223,6 +223,7 @@
     "--cue-style-label-weight",
     "--cue-style-nav-active-ground",
     "--cue-style-nav-ink",
+    "--cue-style-rail-counter-content",
     "--cue-style-selected-ground",
     "--cue-style-selected-ink",
     "--cue-style-selected-weight",

package/manifest/components/skeleton.json

@@ -17,6 +17,7 @@
   "tokensUsed": [
     "--cue-radius-control",
     "--cue-radius-scale",
+    "--cue-style-control-radius",
     "--cue-style-skeleton-radius",
     "--cue-surface-2"
   ],