@coinbase/cds-mcp-server 8.44.0 → 8.44.1

package/mcp-docs/web/components/ProgressBarWithFixedLabels.txt

@@ -269,15 +269,15 @@ function Example() {
 
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
-| `className` | `string` | No | `-` | Custom class name for the progress bar with fixed labels root. |
-| `classNames` | `{ root?: string; labelContainer?: string \| undefined; startLabel?: string \| undefined; endLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for the progress bar with fixed labels. |
+| `className` | `string` | No | `-` | - |
+| `classNames` | `{ root?: string; labelContainer?: string \| undefined; startLabel?: string \| undefined; endLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the ProgressBarWithFixedLabels component |
 | `disableAnimateOnMount` | `boolean` | No | `false` | Disable animation on component mount |
 | `disabled` | `boolean` | No | `-` | Toggle used to show a disabled progress visualization |
 | `endLabel` | `number \| { value: number; render: (num: number, disabled?: boolean \| undefined) => ReactNode; }` | No | `-` | Label that is pinned to the end of the container. If a number is used then it will format it as a percentage. |
 | `labelPlacement` | `above \| below \| beside` | No | `beside` | Position of label relative to the bar |
 | `startLabel` | `number \| { value: number; render: (num: number, disabled?: boolean \| undefined) => ReactNode; }` | No | `-` | Label that is pinned to the start of the container. If a number is used then it will format it as a percentage. |
-| `style` | `CSSProperties` | No | `-` | Custom styles for the progress bar with fixed labels root. |
-| `styles` | `{ root?: CSSProperties; labelContainer?: CSSProperties \| undefined; startLabel?: CSSProperties \| undefined; endLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for the progress bar with fixed labels. |
+| `style` | `CSSProperties` | No | `-` | - |
+| `styles` | `{ root?: CSSProperties; labelContainer?: CSSProperties \| undefined; startLabel?: CSSProperties \| undefined; endLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the ProgressBarWithFixedLabels component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 
 
@@ -285,9 +285,9 @@ function Example() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | progress bar with fixed labels root. |
-| `labelContainer` | `-` | label container. |
-| `startLabel` | `-` | start label. |
-| `endLabel` | `-` | end label. |
+| `root` | `-` | Root element |
+| `labelContainer` | `-` | Label container element |
+| `startLabel` | `-` | Start label element |
+| `endLabel` | `-` | End label element |
 
 

package/mcp-docs/web/components/ProgressBarWithFloatLabel.txt

@@ -240,13 +240,13 @@ function Example() {
 | --- | --- | --- | --- | --- |
 | `label` | `number \| { value: number; render: (num: number, disabled?: boolean \| undefined) => ReactNode; }` | Yes | `-` | Label that is floated at the end of the filled in bar. If a number is used then it will format it as a percentage. |
 | `progress` | `number` | Yes | `-` | Number between 0-1 representing the progress percentage |
-| `className` | `string` | No | `-` | Custom class name for the progress bar with float label root. |
-| `classNames` | `{ root?: string; labelContainer?: string \| undefined; label?: string \| undefined; } \| undefined` | No | `-` | Custom class names for the progress bar with float label. |
+| `className` | `string` | No | `-` | - |
+| `classNames` | `{ root?: string; labelContainer?: string \| undefined; label?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the ProgressBarWithFloatLabel component |
 | `disableAnimateOnMount` | `boolean` | No | `false` | Disable animation on component mount |
 | `disabled` | `boolean` | No | `-` | Toggle used to show a disabled progress visualization |
 | `labelPlacement` | `above \| below` | No | `above` | Position of label relative to the bar |
-| `style` | `CSSProperties` | No | `-` | Custom styles for the progress bar with float label root. |
-| `styles` | `{ root?: CSSProperties; labelContainer?: CSSProperties \| undefined; label?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for the progress bar with float label. |
+| `style` | `CSSProperties` | No | `-` | - |
+| `styles` | `{ root?: CSSProperties; labelContainer?: CSSProperties \| undefined; label?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the ProgressBarWithFloatLabel component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 
 
@@ -254,8 +254,8 @@ function Example() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | progress bar with float label root. |
-| `labelContainer` | `-` | label container. |
-| `label` | `-` | label. |
+| `root` | `-` | Root element |
+| `labelContainer` | `-` | Label container element |
+| `label` | `-` | Label element |
 
 

package/mcp-docs/web/components/ProgressCircle.txt

@@ -448,8 +448,8 @@ function Example() {
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
 | `progress` | `number` | Yes | `-` | Number between 0-1 representing the progress percentage |
-| `className` | `string` | No | `-` | Custom class name for the progress circle root. |
-| `classNames` | `{ root?: string; svg?: string \| undefined; circle?: string \| undefined; progress?: string \| undefined; } \| undefined` | No | `-` | Custom class names for the progress circle. |
+| `className` | `string` | No | `-` | - |
+| `classNames` | `{ root?: string; svg?: string \| undefined; circle?: string \| undefined; progress?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the ProgressCircle component |
 | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `primary` | Custom progress color. |
 | `contentNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Optional component to override the default content rendered inside the circle. |
 | `disableAnimateOnMount` | `boolean` | No | `false` | Disable animation on component mount |
@@ -461,8 +461,8 @@ function Example() {
 | `onAnimationStart` | `(() => void)` | No | `-` | Callback fired when the progress animation starts. |
 | `ref` | `RefObject<HTMLDivElement> \| ((instance: HTMLDivElement \| null) => void) \| null` | No | `-` | - |
 | `size` | `number` | No | `-` | Optional size in px for the visualization. This is useful if the visualization is used in an HStack. If this is omitted the visualization will fill the parent width or height. Since its a circular visualization it will fill the smaller of the parent width or height |
-| `style` | `CSSProperties` | No | `-` | Custom styles for the progress circle root. |
-| `styles` | `{ root?: CSSProperties; svg?: CSSProperties \| undefined; circle?: CSSProperties \| undefined; progress?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for the progress circle. |
+| `style` | `CSSProperties` | No | `-` | - |
+| `styles` | `{ root?: CSSProperties; svg?: CSSProperties \| undefined; circle?: CSSProperties \| undefined; progress?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the ProgressCircle component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 | `weight` | `normal \| heavy \| thin \| semiheavy` | No | `normal` | Toggle used to change thickness of progress visualization |
 
@@ -471,9 +471,9 @@ function Example() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | progress circle root. |
-| `svg` | `-` | progress circle svg. |
-| `circle` | `-` | background circle. |
-| `progress` | `-` | foreground circle. |
+| `root` | `-` | Root element |
+| `svg` | `-` | SVG element |
+| `circle` | `-` | Background circle element |
+| `progress` | `-` | Foreground progress circle element |
 
 

package/mcp-docs/web/components/RadioCell.txt

@@ -98,7 +98,6 @@ function CustomRadioCellExample() {
 | `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
 | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
 | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
-| `analyticsId` | `string` | No | `-` | - |
 | `as` | `label` | No | `-` | The underlying element or component the polymorphic component will render.  Changing as also changes the inherited native props (e.g. href for as=a) and the expected ref type. |
 | `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `background` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | Background color of the overlay (element being interacted with). |
@@ -134,7 +133,6 @@ function CustomRadioCellExample() {
 | `disabled` | `boolean` | No | `-` | Is the element currently disabled. Disable user interaction. |
 | `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
 | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
-| `eventConfig` | `EventHandlerCustomConfig` | No | `-` | - |
 | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
 | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
 | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
@@ -219,10 +217,10 @@ function CustomRadioCellExample() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | - |
-| `radioContainer` | `-` | - |
-| `title` | `-` | - |
-| `description` | `-` | - |
-| `contentContainer` | `-` | - |
+| `root` | `-` | Root element |
+| `radioContainer` | `-` | Radio input container element |
+| `title` | `-` | Title text element |
+| `description` | `-` | Description text element |
+| `contentContainer` | `-` | Content container element |
 
 

package/mcp-docs/web/components/ReferenceLine.txt

@@ -582,7 +582,7 @@ function DraggablePriceTarget() {
 | `beaconLabelPreferredSide` | `left \| right` | No | `'right'` | Preferred side for beacon labels. |
 | `beaconStroke` | `string` | No | `'var(--color-bg)'` | Stroke color of the scrubber beacon circle. |
 | `beaconTransitions` | `{ update?: Transition$1; pulse?: Transition$1 \| undefined; pulseRepeatDelay?: number \| undefined; } \| undefined` | No | `-` | Transition configuration for the scrubber beacon. |
-| `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; beaconLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for scrubber elements. |
+| `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; beaconLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Scrubber component |
 | `hideBeaconLabels` | `boolean` | No | `-` | Hides the beacon labels while keeping the line label visible (if provided). |
 | `hideLine` | `boolean` | No | `-` | Hides the scrubber line. |
 | `hideOverlay` | `boolean` | No | `-` | Hides the overlay rect which obscures data beyond the scrubber position. |
@@ -596,7 +596,7 @@ function DraggablePriceTarget() {
 | `overlayOffset` | `number` | No | `2` | Offset of the overlay rect relative to the drawing area. Useful for when scrubbing over lines, where the stroke width would cause part of the line to be visible. |
 | `ref` | `((instance: ScrubberBeaconGroupRef \| null) => void) \| RefObject<ScrubberBeaconGroupRef> \| null` | No | `-` | - |
 | `seriesIds` | `string[]` | No | `-` | Array of series IDs to highlight when scrubbing with scrubber beacons. By default, all series will be highlighted. |
-| `styles` | `{ overlay?: CSSProperties; beacon?: CSSProperties \| undefined; line?: CSSProperties \| undefined; beaconLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for scrubber elements. |
+| `styles` | `{ overlay?: CSSProperties; beacon?: CSSProperties \| undefined; line?: CSSProperties \| undefined; beaconLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Scrubber component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 
 

package/mcp-docs/web/components/RollingNumber.txt

@@ -1094,7 +1094,7 @@ ValueSection
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
 | `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | - |
 | `className` | `string \| undefined` | No | `-` | - |
-| `classNames` | `{ root?: string; visibleContent?: string \| undefined; formattedValueSection?: string \| undefined; prefix?: string \| undefined; suffix?: string \| undefined; i18nPrefix?: string \| undefined; i18nSuffix?: string \| undefined; integer?: string \| undefined; fraction?: string \| undefined; text?: string \| undefined; } \| undefined` | No | `-` | Class name overrides applied to RollingNumber slots. |
+| `classNames` | `{ root?: string; visibleContent?: string \| undefined; formattedValueSection?: string \| undefined; prefix?: string \| undefined; suffix?: string \| undefined; i18nPrefix?: string \| undefined; i18nSuffix?: string \| undefined; integer?: string \| undefined; fraction?: string \| undefined; text?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the RollingNumber component |
 | `color` | `((Color \| { base?: Color; phone?: Color \| undefined; tablet?: Color \| undefined; desktop?: Color \| undefined; }) & Color) \| undefined` | No | `'fg'` | Base text color token. When {@link colorPulseOnUpdate } is true, the color briefly pulses to a positive or negative mid color before returning to this base color. |
 | `colorPulseOnUpdate` | `boolean` | No | `-` | Enables color pulsing on positive or negative changes. |
 | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
@@ -1364,7 +1364,7 @@ ValueSection
 | `slot` | `string \| undefined` | No | `-` | - |
 | `spellCheck` | `Booleanish \| undefined` | No | `-` | - |
 | `style` | `CSSProperties` | No | `-` | - |
-| `styles` | `{ root?: CSSProperties; visibleContent?: CSSProperties \| undefined; formattedValueSection?: CSSProperties \| undefined; prefix?: CSSProperties \| undefined; suffix?: CSSProperties \| undefined; i18nPrefix?: CSSProperties \| undefined; i18nSuffix?: CSSProperties \| undefined; integer?: CSSProperties \| undefined; fraction?: CSSProperties \| undefined; text?: CSSProperties \| undefined; } \| undefined` | No | `-` | Inline style overrides applied to RollingNumber slots. |
+| `styles` | `{ root?: CSSProperties; visibleContent?: CSSProperties \| undefined; formattedValueSection?: CSSProperties \| undefined; prefix?: CSSProperties \| undefined; suffix?: CSSProperties \| undefined; i18nPrefix?: CSSProperties \| undefined; i18nSuffix?: CSSProperties \| undefined; integer?: CSSProperties \| undefined; fraction?: CSSProperties \| undefined; text?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the RollingNumber component |
 | `suffix` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content rendered after the formatted value. |
 | `suppressContentEditableWarning` | `boolean \| undefined` | No | `-` | - |
 | `suppressHydrationWarning` | `boolean \| undefined` | No | `-` | - |
@@ -1393,15 +1393,15 @@ ValueSection
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | Inline style override applied to the outer container element. |
-| `visibleContent` | `-` | Inline style override applied to the animated content wrapper that is visually rendered. |
-| `formattedValueSection` | `-` | Inline style override applied to the wrapper for the formatted numeric value. |
-| `prefix` | `-` | Inline style override applied to the prefix section rendered from props. |
-| `suffix` | `-` | Inline style override applied to the suffix section rendered from props. |
-| `i18nPrefix` | `-` | The prefix generated by Intl.NumberFormat, for example, the $ in $1,000. |
-| `i18nSuffix` | `-` | The suffix generated by Intl.NumberFormat, for example, the K in 100K. |
-| `integer` | `-` | Inline styles applied to the integer portion of the formatted value. |
-| `fraction` | `-` | Inline styles applied to the fractional portion of the formatted value. |
-| `text` | `-` | Inline styles applied to the Text component rendering digits and symbols. |
+| `root` | `-` | Outer container element |
+| `visibleContent` | `-` | Animated visible content wrapper |
+| `formattedValueSection` | `-` | Formatted numeric value wrapper |
+| `prefix` | `-` | Prefix section (from props) |
+| `suffix` | `-` | Suffix section (from props) |
+| `i18nPrefix` | `-` | Prefix from Intl.NumberFormat (e.g. $ in $1,000) |
+| `i18nSuffix` | `-` | Suffix from Intl.NumberFormat (e.g. K in 100K) |
+| `integer` | `-` | Integer portion of formatted value |
+| `fraction` | `-` | Fractional portion of formatted value |
+| `text` | `-` | Text element for digits and symbols |
 
 

package/mcp-docs/web/components/Scrubber.txt

@@ -743,7 +743,7 @@ function PercentageBeaconLabels() {
 | `beaconLabelPreferredSide` | `left \| right` | No | `'right'` | Preferred side for beacon labels. |
 | `beaconStroke` | `string` | No | `'var(--color-bg)'` | Stroke color of the scrubber beacon circle. |
 | `beaconTransitions` | `{ update?: Transition$1; pulse?: Transition$1 \| undefined; pulseRepeatDelay?: number \| undefined; } \| undefined` | No | `-` | Transition configuration for the scrubber beacon. |
-| `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; beaconLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for scrubber elements. |
+| `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; beaconLabel?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Scrubber component |
 | `hideBeaconLabels` | `boolean` | No | `-` | Hides the beacon labels while keeping the line label visible (if provided). |
 | `hideLine` | `boolean` | No | `-` | Hides the scrubber line. |
 | `hideOverlay` | `boolean` | No | `-` | Hides the overlay rect which obscures data beyond the scrubber position. |
@@ -757,7 +757,7 @@ function PercentageBeaconLabels() {
 | `overlayOffset` | `number` | No | `2` | Offset of the overlay rect relative to the drawing area. Useful for when scrubbing over lines, where the stroke width would cause part of the line to be visible. |
 | `ref` | `((instance: ScrubberBeaconGroupRef \| null) => void) \| RefObject<ScrubberBeaconGroupRef> \| null` | No | `-` | - |
 | `seriesIds` | `string[]` | No | `-` | Array of series IDs to highlight when scrubbing with scrubber beacons. By default, all series will be highlighted. |
-| `styles` | `{ overlay?: CSSProperties; beacon?: CSSProperties \| undefined; line?: CSSProperties \| undefined; beaconLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for scrubber elements. |
+| `styles` | `{ overlay?: CSSProperties; beacon?: CSSProperties \| undefined; line?: CSSProperties \| undefined; beaconLabel?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Scrubber component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 
 
@@ -765,9 +765,9 @@ function PercentageBeaconLabels() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `overlay` | `-` | - |
-| `beacon` | `-` | - |
-| `line` | `-` | - |
-| `beaconLabel` | `-` | - |
+| `overlay` | `-` | Overlay element |
+| `beacon` | `-` | Beacon circle element |
+| `line` | `-` | Scrubber line element |
+| `beaconLabel` | `-` | Beacon label element |
 
 

package/mcp-docs/web/components/SelectAlpha.txt

@@ -1405,7 +1405,7 @@ function CustomComponentExamples() {
 | `align` | `center \| start \| end` | No | `'start'` | Alignment of the value node. |
 | `bordered` | `boolean` | No | `true` | Add a border around all sides of the box. Determines if the control should have a default border. |
 | `className` | `string` | No | `-` | CSS class name for the root element |
-| `classNames` | `{ root?: string; control?: string \| undefined; controlStartNode?: string \| undefined; controlInputNode?: string \| undefined; controlValueNode?: string \| undefined; controlLabelNode?: string \| undefined; controlHelperTextNode?: string \| undefined; controlEndNode?: string \| undefined; dropdown?: string \| undefined; option?: string \| undefined; optionCell?: string \| undefined; optionContent?: string \| undefined; optionLabel?: string \| undefined; optionDescription?: string \| undefined; selectAllDivider?: string \| undefined; emptyContentsContainer?: string \| undefined; emptyContentsText?: string \| undefined; optionGroup?: string \| undefined; } \| undefined` | No | `-` | Custom class names for different parts of the select |
+| `classNames` | `{ root?: string; control?: string \| undefined; controlStartNode?: string \| undefined; controlInputNode?: string \| undefined; controlValueNode?: string \| undefined; controlLabelNode?: string \| undefined; controlHelperTextNode?: string \| undefined; controlEndNode?: string \| undefined; dropdown?: string \| undefined; option?: string \| undefined; optionCell?: string \| undefined; optionContent?: string \| undefined; optionLabel?: string \| undefined; optionDescription?: string \| undefined; selectAllDivider?: string \| undefined; emptyContentsContainer?: string \| undefined; emptyContentsText?: string \| undefined; optionGroup?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Select component |
 | `clearAllLabel` | `string` | No | `-` | Label for the Clear All option in multi-select mode |
 | `compact` | `boolean` | No | `-` | Whether to use compact styling for the select |
 | `controlAccessibilityLabel` | `string` | No | `-` | Accessibility label for the control |
@@ -1430,7 +1430,7 @@ function CustomComponentExamples() {
 | `setOpen` | `((open: boolean \| ((open: boolean) => boolean)) => void)` | No | `-` | Callback to update the open state |
 | `startNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
 | `style` | `CSSProperties` | No | `-` | Inline styles for the root element |
-| `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for different parts of the select |
+| `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Select component |
 | `testID` | `string` | No | `-` | Test ID for the root element |
 | `type` | `multi \| single` | No | `-` | Whether the select allows single or multiple selections |
 | `variant` | `primary \| secondary \| positive \| negative \| foregroundMuted \| foreground` | No | `foregroundMuted` | Determines the sentiment of the input. Because we allow startContent and endContent to be custom ReactNode, the content placed inside these slots will not change colors according to the variant. You will have to add that yourself |
@@ -1440,25 +1440,25 @@ function CustomComponentExamples() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | root container |
-| `control` | `-` | control element |
-| `controlStartNode` | `-` | start node element |
-| `controlInputNode` | `-` | input node element |
-| `controlValueNode` | `-` | value node element |
-| `controlLabelNode` | `-` | label node element |
-| `controlHelperTextNode` | `-` | helper text node element |
-| `controlEndNode` | `-` | end node element |
+| `root` | `-` | Root container element |
+| `control` | `-` | Control element |
+| `controlStartNode` | `-` | Start node element |
+| `controlInputNode` | `-` | Input node element |
+| `controlValueNode` | `-` | Value node element |
+| `controlLabelNode` | `-` | Label node element |
+| `controlHelperTextNode` | `-` | Helper text node element |
+| `controlEndNode` | `-` | End node element |
 | `controlBlendStyles` | `-` | Blend styles for control interactivity |
-| `dropdown` | `-` | dropdown container |
-| `option` | `-` | individual options |
-| `optionCell` | `-` | option cell element |
-| `optionContent` | `-` | option content wrapper |
-| `optionLabel` | `-` | option label element |
-| `optionDescription` | `-` | option description element |
-| `optionBlendStyles` | `-` | Blend styles for option interactivity |
-| `selectAllDivider` | `-` | select all divider element |
-| `emptyContentsContainer` | `-` | empty contents container element |
-| `emptyContentsText` | `-` | empty contents text element |
-| `optionGroup` | `-` | option group element |
+| `dropdown` | `-` | Dropdown container element |
+| `option` | `-` | Option element |
+| `optionCell` | `-` | Option cell element |
+| `optionContent` | `-` | Option content wrapper |
+| `optionLabel` | `-` | Option label element |
+| `optionDescription` | `-` | Option description element |
+| `optionBlendStyles` | `-` | Option blend styles for interactivity |
+| `selectAllDivider` | `-` | Select all divider element |
+| `emptyContentsContainer` | `-` | Empty contents container element |
+| `emptyContentsText` | `-` | Empty contents text element |
+| `optionGroup` | `-` | Option group element |
 
 

package/mcp-docs/web/components/SelectChip.txt

@@ -187,7 +187,6 @@ function SelectChipExample() {
 | `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
 | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
 | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
-| `analyticsId` | `string` | No | `-` | - |
 | `as` | `button` | No | `-` | The underlying element or component the polymorphic component will render.  Changing as also changes the inherited native props (e.g. href for as=a) and the expected ref type. |
 | `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `background` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | Background color of the overlay (element being interacted with). |
@@ -213,7 +212,7 @@ function SelectChipExample() {
 | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
 | `className` | `string` | No | `-` | Apply class names to the outer container. |
-| `classNames` | `{ root?: string; content?: string \| undefined; } \| undefined` | No | `-` | Class names for the components |
+| `classNames` | `{ root?: string; content?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Chip component |
 | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
 | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `compact` | `boolean` | No | `-` | Reduces spacing around Chip content |
@@ -229,7 +228,6 @@ function SelectChipExample() {
 | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
 | `enableMobileModal` | `boolean` | No | `-` | Enable to have Dropdown render its content inside a Modal as opposed to a relatively positioned Popover Ideal for mobile or smaller devices. |
 | `end` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode placed after the value |
-| `eventConfig` | `EventHandlerCustomConfig` | No | `-` | - |
 | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
 | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
 | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
@@ -299,7 +297,7 @@ function SelectChipExample() {
 | `showOverlay` | `boolean` | No | `false` | Display an overlay over all content below the Popover menu |
 | `start` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode placed before the value |
 | `style` | `CSSProperties` | No | `-` | - |
-| `styles` | `{ root?: CSSProperties; content?: CSSProperties \| undefined; } \| undefined` | No | `-` | Apply styles to the container and content. |
+| `styles` | `{ root?: CSSProperties; content?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Chip component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 | `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
 | `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |

package/mcp-docs/web/components/SelectChipAlpha.txt

@@ -460,7 +460,7 @@ function ExampleDisabled() {
 | `align` | `center \| start \| end` | No | `'start'` | Alignment of the value node. |
 | `bordered` | `boolean` | No | `true` | Add a border around all sides of the box. Determines if the control should have a default border. |
 | `className` | `string` | No | `-` | CSS class name for the root element |
-| `classNames` | `{ root?: string; control?: string \| undefined; controlStartNode?: string \| undefined; controlInputNode?: string \| undefined; controlValueNode?: string \| undefined; controlLabelNode?: string \| undefined; controlHelperTextNode?: string \| undefined; controlEndNode?: string \| undefined; dropdown?: string \| undefined; option?: string \| undefined; optionCell?: string \| undefined; optionContent?: string \| undefined; optionLabel?: string \| undefined; optionDescription?: string \| undefined; selectAllDivider?: string \| undefined; emptyContentsContainer?: string \| undefined; emptyContentsText?: string \| undefined; optionGroup?: string \| undefined; } \| undefined` | No | `-` | Custom class names for different parts of the select |
+| `classNames` | `{ root?: string; control?: string \| undefined; controlStartNode?: string \| undefined; controlInputNode?: string \| undefined; controlValueNode?: string \| undefined; controlLabelNode?: string \| undefined; controlHelperTextNode?: string \| undefined; controlEndNode?: string \| undefined; dropdown?: string \| undefined; option?: string \| undefined; optionCell?: string \| undefined; optionContent?: string \| undefined; optionLabel?: string \| undefined; optionDescription?: string \| undefined; selectAllDivider?: string \| undefined; emptyContentsContainer?: string \| undefined; emptyContentsText?: string \| undefined; optionGroup?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Select component |
 | `clearAllLabel` | `string` | No | `-` | Label for the Clear All option in multi-select mode |
 | `compact` | `boolean` | No | `-` | Whether to use compact styling for the select |
 | `controlAccessibilityLabel` | `string` | No | `-` | Accessibility label for the control |
@@ -487,7 +487,7 @@ function ExampleDisabled() {
 | `setOpen` | `((open: boolean \| ((open: boolean) => boolean)) => void)` | No | `-` | Callback to update the open state |
 | `startNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
 | `style` | `CSSProperties` | No | `-` | Inline styles for the root element |
-| `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for different parts of the select |
+| `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Select component |
 | `testID` | `string` | No | `-` | Test ID for the root element |
 | `type` | `multi \| single` | No | `-` | Whether the select allows single or multiple selections |
 
@@ -496,25 +496,25 @@ function ExampleDisabled() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | root container |
-| `control` | `-` | control element |
-| `controlStartNode` | `-` | start node element |
-| `controlInputNode` | `-` | input node element |
-| `controlValueNode` | `-` | value node element |
-| `controlLabelNode` | `-` | label node element |
-| `controlHelperTextNode` | `-` | helper text node element |
-| `controlEndNode` | `-` | end node element |
+| `root` | `-` | Root container element |
+| `control` | `-` | Control element |
+| `controlStartNode` | `-` | Start node element |
+| `controlInputNode` | `-` | Input node element |
+| `controlValueNode` | `-` | Value node element |
+| `controlLabelNode` | `-` | Label node element |
+| `controlHelperTextNode` | `-` | Helper text node element |
+| `controlEndNode` | `-` | End node element |
 | `controlBlendStyles` | `-` | Blend styles for control interactivity |
-| `dropdown` | `-` | dropdown container |
-| `option` | `-` | individual options |
-| `optionCell` | `-` | option cell element |
-| `optionContent` | `-` | option content wrapper |
-| `optionLabel` | `-` | option label element |
-| `optionDescription` | `-` | option description element |
-| `optionBlendStyles` | `-` | Blend styles for option interactivity |
-| `selectAllDivider` | `-` | select all divider element |
-| `emptyContentsContainer` | `-` | empty contents container element |
-| `emptyContentsText` | `-` | empty contents text element |
-| `optionGroup` | `-` | option group element |
+| `dropdown` | `-` | Dropdown container element |
+| `option` | `-` | Option element |
+| `optionCell` | `-` | Option cell element |
+| `optionContent` | `-` | Option content wrapper |
+| `optionLabel` | `-` | Option label element |
+| `optionDescription` | `-` | Option description element |
+| `optionBlendStyles` | `-` | Option blend styles for interactivity |
+| `selectAllDivider` | `-` | Select all divider element |
+| `emptyContentsContainer` | `-` | Empty contents container element |
+| `emptyContentsText` | `-` | Empty contents text element |
+| `optionGroup` | `-` | Option group element |
 
 

package/mcp-docs/web/components/SelectOption.txt

@@ -70,7 +70,7 @@ function DefaultSelect() {
 | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
 | `bottomContent` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | The content to display below the main cell content |
-| `classNames` | `{ root?: string; contentContainer?: string \| undefined; topContent?: string \| undefined; bottomContent?: string \| undefined; pressable?: string \| undefined; media?: string \| undefined; childrenContainer?: string \| undefined; intermediary?: string \| undefined; end?: string \| undefined; accessory?: string \| undefined; } \| undefined` | No | `-` | Class names for the components |
+| `classNames` | `{ root?: string; contentContainer?: string \| undefined; topContent?: string \| undefined; bottomContent?: string \| undefined; pressable?: string \| undefined; media?: string \| undefined; childrenContainer?: string \| undefined; intermediary?: string \| undefined; end?: string \| undefined; accessory?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Cell component |
 | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
 | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `compact` | `boolean` | No | `-` | - |
@@ -149,7 +149,7 @@ function DefaultSelect() {
 | `shouldOverflow` | `boolean` | No | `-` | - |
 | `shouldTruncate` | `boolean` | No | `true` | Controls whether the main content should truncate with an ellipsis. Defaults to true (truncates) when not provided. |
 | `style` | `CSSProperties` | No | `-` | - |
-| `styles` | `{ root?: CSSProperties; contentContainer?: CSSProperties \| undefined; topContent?: CSSProperties \| undefined; bottomContent?: CSSProperties \| undefined; pressable?: CSSProperties \| undefined; media?: CSSProperties \| undefined; childrenContainer?: CSSProperties \| undefined; intermediary?: CSSProperties \| undefined; end?: CSSProperties \| undefined; accessory?: CSSProperties \| undefined; } \| undefined` | No | `-` | Styles for the components |
+| `styles` | `{ root?: CSSProperties; contentContainer?: CSSProperties \| undefined; topContent?: CSSProperties \| undefined; bottomContent?: CSSProperties \| undefined; pressable?: CSSProperties \| undefined; media?: CSSProperties \| undefined; childrenContainer?: CSSProperties \| undefined; intermediary?: CSSProperties \| undefined; end?: CSSProperties \| undefined; accessory?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Cell component |
 | `tabIndex` | `number` | No | `-` | Necessary to control roving tabindex for accessibility https://www.w3.org/TR/wai-aria-practices/#kbd_roving_tabindex |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 | `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |

package/mcp-docs/web/components/Sidebar.txt

@@ -723,7 +723,7 @@ function TradingInterface() {
 | `borderedTop` | `boolean` | No | `-` | Add a border to the top side of the box. |
 | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
-| `classNames` | `{ root?: string; logo?: string \| undefined; content?: string \| undefined; end?: string \| undefined; } \| undefined` | No | `-` | Custom class names for the sidebar components. |
+| `classNames` | `{ root?: string; logo?: string \| undefined; content?: string \| undefined; end?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Sidebar component |
 | `collapsed` | `boolean` | No | `false` | Use collapsed to show only the logo |
 | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
 | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
@@ -789,7 +789,7 @@ function TradingInterface() {
 | `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
 | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `style` | `CSSProperties` | No | `-` | - |
-| `styles` | `{ root?: CSSProperties; logo?: CSSProperties \| undefined; content?: CSSProperties \| undefined; end?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for the sidebar components. |
+| `styles` | `{ root?: CSSProperties; logo?: CSSProperties \| undefined; content?: CSSProperties \| undefined; end?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Sidebar component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 | `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
 | `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
@@ -807,9 +807,9 @@ function TradingInterface() {
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | root sidebar container. |
-| `logo` | `-` | logo container. |
-| `content` | `-` | content container (children list). |
-| `end` | `-` | end container (renderEnd). |
+| `root` | `-` | Root sidebar container element |
+| `logo` | `-` | Logo container element |
+| `content` | `-` | Content container element (children list) |
+| `end` | `-` | End container element (renderEnd) |
 
 

package/mcp-docs/web/components/SidebarItem.txt

@@ -236,7 +236,6 @@ function Accessibility() {
 | `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
 | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
 | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
-| `analyticsId` | `string` | No | `-` | - |
 | `as` | `button` | No | `-` | The underlying element or component the polymorphic component will render.  Changing as also changes the inherited native props (e.g. href for as=a) and the expected ref type. |
 | `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `blendStyles` | `InteractableBlendStyles` | No | `-` | - |
@@ -267,7 +266,6 @@ function Accessibility() {
 | `disabled` | `boolean` | No | `-` | Is the element currently disabled. |
 | `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
 | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
-| `eventConfig` | `EventHandlerCustomConfig` | No | `-` | - |
 | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
 | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
 | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |

package/mcp-docs/web/components/Stepper.txt

@@ -736,7 +736,7 @@ It follows the same structure as `classNames`:
 | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
 | `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | - |
-| `classNames` | `{ root?: string; step?: string \| undefined; substepContainer?: string \| undefined; label?: string \| undefined; progress?: string \| undefined; icon?: string \| undefined; header?: string \| undefined; } \| undefined` | No | `-` | Optional CSS class names for specific child elements of Stepper |
+| `classNames` | `{ root?: string; step?: string \| undefined; substepContainer?: string \| undefined; label?: string \| undefined; progress?: string \| undefined; icon?: string \| undefined; header?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Stepper component |
 | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
 | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `complete` | `boolean` | No | `-` | Set this to true to visualize a completely filled/complete Stepper |
@@ -803,7 +803,7 @@ It follows the same structure as `classNames`:
 | `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
 | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `style` | `CSSProperties` | No | `-` | - |
-| `styles` | `{ root?: CSSProperties; step?: CSSProperties \| undefined; substepContainer?: CSSProperties \| undefined; label?: CSSProperties \| undefined; progress?: CSSProperties \| undefined; icon?: CSSProperties \| undefined; header?: CSSProperties \| undefined; } \| undefined` | No | `-` | Inline styles for specific child elements of Stepper |
+| `styles` | `{ root?: CSSProperties; step?: CSSProperties \| undefined; substepContainer?: CSSProperties \| undefined; label?: CSSProperties \| undefined; progress?: CSSProperties \| undefined; icon?: CSSProperties \| undefined; header?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Stepper component |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
 | `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
 | `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
@@ -820,12 +820,12 @@ It follows the same structure as `classNames`:
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | root Stepper container element |
-| `step` | `-` | Step subcomponent |
-| `substepContainer` | `-` | SubstepContainer subcomponent |
-| `label` | `-` | Label subcomponent |
-| `progress` | `-` | Progress subcomponent |
-| `icon` | `-` | Icon subcomponent |
-| `header` | `-` | Header subcomponent |
+| `root` | `-` | Root Stepper container element |
+| `step` | `-` | Step subcomponent element |
+| `substepContainer` | `-` | Substep container element |
+| `label` | `-` | Label subcomponent element |
+| `progress` | `-` | Progress subcomponent element |
+| `icon` | `-` | Icon subcomponent element |
+| `header` | `-` | Header subcomponent element |
 
 

package/mcp-docs/web/components/TabbedChipsAlpha.txt

@@ -238,9 +238,9 @@ render(<Example />);
 
 | Selector | Static class name | Description |
 | --- | --- | --- |
-| `root` | `-` | Style applied to the root container. |
-| `scrollContainer` | `-` | Style applied to the scroll container. |
-| `paddle` | `-` | Style applied to the paddle icon buttons. |
-| `tabs` | `-` | Style applied to the root of the Tabs component. |
+| `root` | `-` | Root container element |
+| `scrollContainer` | `-` | Scroll container element |
+| `paddle` | `-` | Paddle icon buttons |
+| `tabs` | `-` | Tabs root element |
 
 

package/mcp-docs/web/components/TileButton.txt

@@ -53,7 +53,6 @@ import { TileButton } from '@coinbase/cds-web/buttons/TileButton'
 | `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
 | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
 | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
-| `analyticsId` | `string` | No | `-` | - |
 | `aria-activedescendant` | `string \| undefined` | No | `-` | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. |
 | `aria-atomic` | `Booleanish \| undefined` | No | `-` | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. |
 | `aria-autocomplete` | `none \| inline \| list \| both \| undefined` | No | `-` | Indicates whether inputting text could trigger display of one or more predictions of the users intended value for an input and specifies how predictions would be presented if they are made. |
@@ -154,7 +153,6 @@ import { TileButton } from '@coinbase/cds-web/buttons/TileButton'
 | `draggable` | `Booleanish \| undefined` | No | `-` | - |
 | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
 | `enterKeyHint` | `search \| enter \| done \| go \| next \| previous \| send \| undefined` | No | `-` | - |
-| `eventConfig` | `EventHandlerCustomConfig` | No | `-` | - |
 | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
 | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
 | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |

package/mcp-docs/web/components/Tray.txt

@@ -1140,7 +1140,7 @@ function ResponsiveTrayExample() {
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
 | `onCloseComplete` | `() => void` | Yes | `-` | Action that will happen when tray is dismissed |
-| `classNames` | `{ root?: string; overlay?: string \| undefined; container?: string \| undefined; header?: string \| undefined; title?: string \| undefined; content?: string \| undefined; handleBar?: string \| undefined; handleBarHandle?: string \| undefined; closeButton?: string \| undefined; } \| undefined` | No | `-` | Class names for the tray elements |
+| `classNames` | `{ readonly root?: string; readonly overlay?: string \| undefined; readonly container?: string \| undefined; readonly header?: string \| undefined; readonly title?: string \| undefined; readonly content?: string \| undefined; readonly handleBar?: string \| undefined; readonly handleBarHandle?: string \| undefined; readonly closeButton?: string \| undefined; } \| undefined` | No | `-` | - |
 | `closeAccessibilityHint` | `string` | No | `-` | Sets an accessible hint or description for the close button. On web, maps to aria-describedby and lists the id(s) of the element(s) that describe the element on which the attribute is set. On mobile, a string that helps users understand what will happen when they perform an action on the accessibility element when that result is not clear from the accessibility label. |
 | `closeAccessibilityLabel` | `string` | No | `-` | Sets an accessible label for the close button. On web, maps to aria-label and defines a string value that labels an interactive element. On mobile, VoiceOver will read this string when a user selects the associated element. |
 | `focusTabIndexElements` | `boolean` | No | `-` | Allow any element with tabIndex attribute to be focusable in FocusTrap, rather than only focusing specific interactive element types like button. This can be useful when having long content in a Modal. |
@@ -1158,7 +1158,7 @@ function ResponsiveTrayExample() {
 | `restoreFocusOnUnmount` | `boolean` | No | `true` | If true, the focus trap will restore focus to the previously focused element when it unmounts.  WARNING: If you disable this, you need to ensure that focus is restored properly so it doesnt end up on the body |
 | `role` | `dialog \| alertdialog` | No | `-` | WAI-ARIA Roles |
 | `showHandleBar` | `boolean` | No | `-` | Show a handle bar indicator at the top of the tray. The handle bar is positioned inside the tray content area. |
-| `styles` | `{ root?: CSSProperties; overlay?: CSSProperties \| undefined; container?: CSSProperties \| undefined; header?: CSSProperties \| undefined; title?: CSSProperties \| undefined; content?: CSSProperties \| undefined; handleBar?: CSSProperties \| undefined; handleBarHandle?: CSSProperties \| undefined; closeButton?: CSSProperties \| undefined; } \| undefined` | No | `-` | Inline styles for the tray elements |
+| `styles` | `{ readonly root?: CSSProperties; readonly overlay?: CSSProperties \| undefined; readonly container?: CSSProperties \| undefined; readonly header?: CSSProperties \| undefined; readonly title?: CSSProperties \| undefined; readonly content?: CSSProperties \| undefined; readonly handleBar?: CSSProperties \| undefined; readonly handleBarHandle?: CSSProperties \| undefined; readonly closeButton?: CSSProperties \| undefined; } \| undefined` | No | `-` | - |
 | `title` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Text or ReactNode for optional Tray title |
 | `verticalDrawerPercentageOfView` | `string` | No | `"85%"` | Allow user of component to define maximum percentage of screen that can be taken up by the Drawer when pinned to the bottom or top. |
 | `zIndex` | `number` | No | `-` | z-index for the tray overlay |