basalt-ui 1.19.1 → 1.21.0

package/src/agent-chat/thread-message.tsx

@@ -615,7 +615,7 @@ type VirtualizedTranscriptProps = {
  */
 function NonVirtualizedRows({ rows, height }: VirtualizedTranscriptProps): JSX.Element {
   return (
-    // theme-allow — degrade target owns its own scroll node, same as the real virtualizer below.
+    // theme-allow raw-scroll-container — degrade target owns its own scroll node, same as the real virtualizer below.
     <Box style={{ height, overflow: 'auto' }}>
       <Stack gap="sm">
         {rows.map((row) => (
@@ -895,7 +895,7 @@ const LazyVirtualizedRows = lazy(() =>
         })
 
         return (
-          // theme-allow — TanStack Virtual measures/scrolls this element (never nest in BasaltStickToBottom, see ./virtualize).
+          // theme-allow raw-scroll-container — TanStack Virtual measures/scrolls this element (never nest in BasaltStickToBottom, see ./virtualize).
           <Box ref={parentRef} style={{ height, overflow: 'auto' }}>
             <Box style={{ height: virtualizer.getTotalSize(), position: 'relative' }}>
               {virtualizer.getVirtualItems().map((virtualItem) => {
@@ -938,7 +938,7 @@ const LazyVirtualizedRows = lazy(() =>
  * flash without paying that cost — it settles state before any row has meaningfully mounted.
  */
 function VirtualizeSuspenseFallback({ height }: { readonly height: number | string }): JSX.Element {
-  // theme-allow — placeholder owns its own scroll node, matching the real virtualizer's shape.
+  // theme-allow raw-scroll-container — placeholder owns its own scroll node, matching the real virtualizer's shape.
   return <Box style={{ height, overflow: 'auto' }} />
 }
 

package/src/agent-chat/tool-chip.tsx

@@ -138,7 +138,7 @@ export function ToolChip({
                 width: 6,
                 height: 6,
                 flexShrink: 0,
-                borderRadius: '50%', // theme-allow: a 6px state dot is a circle, not a surface corner — no radius token expresses it
+                borderRadius: '50%', // theme-allow raw-surface — a 6px state dot is a circle, not a surface corner
                 backgroundColor: dotToken,
               }}
             />

package/src/charts/kinds/Bars.tsx

@@ -125,7 +125,7 @@ export type BarsProps<T> = {
   /** Legend config forwarded to `CartesianChart`; `false` disables the legend (sparkline escape).
    * Default `{ placement: 'bottom' }`. */
   legend?: ChartLegendConfig | false
-  /** Accessible text alternative, forwarded as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `CartesianChart` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean

package/src/charts/kinds/Donut.tsx

@@ -50,7 +50,7 @@ export type DonutProps<K extends string = SeriesKey> = {
   centerContent?: ReactNode
   innerRatio?: number
   padAngle?: number
-  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `ChartFrame` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean
@@ -208,7 +208,8 @@ function DonutPlot<K extends string = SeriesKey>(props: DonutPlotProps<K>) {
           style={{
             position: 'absolute',
             inset: 0,
-            display: 'flex', // theme-allow: centering over the donut hole — charts/ is Mantine-free, so Center is unavailable here
+            // Centering over the donut hole; charts/ is Mantine-free, so Center is unavailable here.
+            display: 'flex',
             alignItems: 'center',
             justifyContent: 'center',
             pointerEvents: 'none',

package/src/charts/kinds/DualPanel.tsx

@@ -94,7 +94,7 @@ export type DualPanelProps<T> = {
   /** Legend config forwarded to `ChartFrame`; `false` disables the legend (sparkline escape).
    * Default `{ placement: 'bottom' }`. */
   legend?: ChartLegendConfig | false
-  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `ChartFrame` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean
@@ -521,7 +521,7 @@ function DualPanelPlot<T>(props: DualPanelPlotProps<T>) {
             </>
           )}
 
-          {/* theme-allow basalt/hand-rolled-plot: TWO panes over one x scale is not a single
+          {/* theme-allow-file basalt/hand-rolled-plot: TWO panes over one x scale is not a single
               cartesian plot, so `CartesianChart` (one plot rect, one or two y axes) cannot express
               it. This file therefore assembles the plot itself — but from the SAME parts every
               other chart gets: `ChartFrame`, `autoMargin` + `probeAxisLabels`, `useChartCursor`,

package/src/charts/kinds/Heatmap.tsx

@@ -53,7 +53,7 @@ export type HeatmapProps<T> = {
   renderTooltip?: (cell: HeatmapCell) => ReactNode
   /** Optional gradient legend strip below the grid (faint → solid color). */
   legend?: { min: string; max: string }
-  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded to `ChartFrame` as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `ChartFrame` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean

package/src/charts/kinds/MultiLine.tsx

@@ -52,7 +52,7 @@ export type MultiLineProps<T> = {
   /** Legend config forwarded to `CartesianChart`; `false` disables the legend (sparkline escape).
    * Default `{ placement: 'bottom' }`. */
   legend?: ChartLegendConfig | false
-  /** Accessible text alternative, forwarded to `CartesianChart` as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded to `CartesianChart` as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `CartesianChart` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean

package/src/charts/kinds/StackedArea.tsx

@@ -33,7 +33,7 @@ export type StackedAreaProps<T> = {
   /** Legend config forwarded to `CartesianChart`; `false` disables the legend (sparkline escape).
    * Default `{ placement: 'bottom' }`. */
   legend?: ChartLegendConfig | false
-  /** Accessible text alternative, forwarded as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `CartesianChart` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean

package/src/charts/kinds/ZonedLine.tsx

@@ -73,7 +73,7 @@ export type ZonedLineProps<T> = {
   /** Legend config forwarded to `CartesianChart`; `false` disables the legend (sparkline escape).
    * Default `{ placement: 'bottom' }`. */
   legend?: ChartLegendConfig | false
-  /** Accessible text alternative, forwarded to `CartesianChart` as `aria-label` (+ `role="img"`). */
+  /** Accessible text alternative, forwarded to `CartesianChart` as `aria-label` (+ `role="group"`). */
   ariaLabel?: string
   /** Forwarded to `CartesianChart` — see `ChartPending`'s JSDoc for the three-state rationale. */
   isPending?: boolean

package/src/charts/primitives/ChartLegend.tsx

@@ -158,7 +158,7 @@ function LegendSwatch({ item, idPrefix }: { item: LegendEntry; idPrefix: string
         style={{
           width: 11,
           height: 11,
-          borderRadius: 3, // theme-allow: sub-scale legend-swatch corner, below the 4px radius floor
+          borderRadius: 3, // theme-allow raw-surface — sub-scale legend-swatch corner, below the 4px radius floor
           backgroundColor: item.color,
           opacity: item.fillOpacity ?? 0.7,
           flexShrink: 0,
@@ -211,7 +211,7 @@ function LegendChildSwatch({ item }: { item: LegendEntry }) {
         style={{
           width: 10,
           height: 10,
-          borderRadius: 2, // theme-allow: sub-scale legend-swatch corner, below the 4px radius floor
+          borderRadius: 2, // theme-allow raw-surface — sub-scale legend-swatch corner, below the 4px radius floor
           backgroundColor: item.color,
           opacity: item.fillOpacity ?? 0.7,
           flexShrink: 0,

package/src/charts/primitives/ChartTooltip.tsx

@@ -121,7 +121,7 @@ export function TooltipRow({
             style={{
               width: 8,
               height: 8,
-              borderRadius: 2, // theme-allow: sub-scale tooltip micro-corner, below the 4px radius floor
+              borderRadius: 2, // theme-allow raw-surface — sub-scale tooltip micro-corner, below the 4px radius floor
               backgroundColor: color,
               flexShrink: 0,
             }}