@coinbase/cds-mcp-server 8.19.1 → 8.20.1

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

@@ -190,7 +190,7 @@ function SelectChipExample() {
 | `as` | `button` | No | `-` | - |
 | `aspectRatio` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto` | 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). |
-| `blendStyles` | `{ background?: string; pressedBackground?: string \| undefined; disabledBackground?: string \| undefined; hoveredBackground?: string \| undefined; borderColor?: string \| undefined; pressedBorderColor?: string \| undefined; disabledBorderColor?: string \| undefined; hoveredBorderColor?: string \| undefined; } \| undefined` | No | `-` | Custom color overrides for different interaction states. Base colors (background, borderColor) are used directly, while interaction state colors (hovered, pressed, disabled) are used as alternative base colors for blending calculations with blend strength and color scheme considerations. |
+| `blendStyles` | `InteractableBlendStyles` | No | `-` | - |
 | `block` | `boolean` | No | `false` | Set element to block and expand to 100% width. Makes the Popover Subject fill the width of the parent container |
 | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
 | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
@@ -255,6 +255,7 @@ function SelectChipExample() {
 | `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
 | `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
 | `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
+| `invertColorScheme` | `boolean` | No | `false` | Invert the foreground and background colors to emphasize the Chip. Depending on your theme, it may be dangerous to use this prop in conjunction with transparentWhileInactive. |
 | `justifyContent` | `ResponsiveProp<left \| right \| center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| space-between \| space-around \| space-evenly>` | No | `-` | - |
 | `key` | `Key \| null` | No | `-` | - |
 | `left` | `ResponsiveProp<Left<string \| number>>` | No | `-` | - |
@@ -307,7 +308,7 @@ function SelectChipExample() {
 | `transparentWhilePressed` | `boolean` | No | `-` | Mark the background and border as transparent even while element is interacted with (elevation underlay issue). Must be used in conjunction with the pressed prop |
 | `type` | `button \| submit \| reset` | No | `-` | - |
 | `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
-| `value` | `string \| (readonly string[] & string)` | No | `-` | Pass a value that will prepopulate the select input. This will replace the placeholder text. Default selected value, or preselected value |
+| `value` | `string` | No | `-` | Pass a value that will prepopulate the select input. This will replace the placeholder text. Default selected value, or preselected value |
 | `valueLabel` | `string` | No | `-` | Optional label for selected value when using a value/label object model |
 | `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
 | `width` | `((Width<string \| number> \| { base?: Width<string \| number>; phone?: Width<string \| number> \| undefined; tablet?: Width<string \| number> \| undefined; desktop?: Width<string \| number> \| undefined; }) & Width<string \| number>) \| undefined` | No | `100%` | Width of input as a percentage string or number converted to pixels. |

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

@@ -22,7 +22,7 @@ function DefaultSelect() {
   const options = ['Option 1', 'Option 2', 'Option 3', 'Option 4', 'Option 5', 'Option 6'];
   return (
     <VStack paddding={2}>
-      <Select value={value} placeholder="Choose something..." onChange={setValue}>
+      <OldSelect value={value} placeholder="Choose something..." onChange={setValue}>
         {options.map((option) => (
           <SelectOption
             value={option}
@@ -32,7 +32,7 @@ function DefaultSelect() {
             media={<CellMedia type="icon" name="upload" />}
           />
         ))}
-      </Select>
+      </OldSelect>
     </VStack>
   );
 }

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

@@ -24,7 +24,7 @@ Check [Sidebar](/components/navigation/Sidebar) for usage examples
 | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
 | `as` | `button` | No | `-` | - |
 | `aspectRatio` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto` | No | `-` | - |
-| `blendStyles` | `{ background?: string; pressedBackground?: string \| undefined; disabledBackground?: string \| undefined; hoveredBackground?: string \| undefined; borderColor?: string \| undefined; pressedBorderColor?: string \| undefined; disabledBorderColor?: string \| undefined; hoveredBorderColor?: string \| undefined; } \| undefined` | No | `-` | Custom color overrides for different interaction states. Base colors (background, borderColor) are used directly, while interaction state colors (hovered, pressed, disabled) are used as alternative base colors for blending calculations with blend strength and color scheme considerations. |
+| `blendStyles` | `InteractableBlendStyles` | No | `-` | - |
 | `block` | `boolean` | No | `-` | Set element to block and expand to 100% width. |
 | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
 | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |

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

@@ -54,7 +54,7 @@ import { TileButton } from '@coinbase/cds-web/buttons/TileButton'
 | `as` | `symbol \| object \| style \| svg \| a \| abbr \| address \| area \| article \| aside \| audio \| b \| base \| bdi \| bdo \| big \| blockquote \| body \| br \| button \| canvas \| caption \| center \| cite \| code \| col \| colgroup \| data \| datalist \| dd \| del \| details \| dfn \| dialog \| div \| dl \| dt \| em \| embed \| fieldset \| figcaption \| figure \| footer \| form \| h1 \| h2 \| h3 \| h4 \| h5 \| h6 \| head \| header \| hgroup \| hr \| html \| i \| iframe \| img \| input \| ins \| kbd \| keygen \| label \| legend \| li \| link \| main \| map \| mark \| menu \| menuitem \| meta \| meter \| nav \| noindex \| noscript \| ol \| optgroup \| option \| output \| p \| param \| picture \| pre \| progress \| q \| rp \| rt \| ruby \| s \| samp \| search \| slot \| script \| section \| select \| small \| source \| span \| strong \| sub \| summary \| sup \| table \| template \| tbody \| td \| textarea \| tfoot \| th \| thead \| time \| title \| tr \| track \| u \| ul \| var \| video \| wbr \| webview \| animate \| animateMotion \| animateTransform \| circle \| clipPath \| defs \| desc \| ellipse \| feBlend \| feColorMatrix \| feComponentTransfer \| feComposite \| feConvolveMatrix \| feDiffuseLighting \| feDisplacementMap \| feDistantLight \| feDropShadow \| feFlood \| feFuncA \| feFuncB \| feFuncG \| feFuncR \| feGaussianBlur \| feImage \| feMerge \| feMergeNode \| feMorphology \| feOffset \| fePointLight \| feSpecularLighting \| feSpotLight \| feTile \| feTurbulence \| filter \| foreignObject \| g \| image \| line \| linearGradient \| marker \| mask \| metadata \| mpath \| path \| pattern \| polygon \| polyline \| radialGradient \| rect \| set \| stop \| switch \| text \| textPath \| tspan \| use \| view \| ComponentClass<any, any> \| FunctionComponent<any>` | No | `-` | - |
 | `aspectRatio` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto` | 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). |
-| `blendStyles` | `{ background?: string; pressedBackground?: string \| undefined; disabledBackground?: string \| undefined; hoveredBackground?: string \| undefined; borderColor?: string \| undefined; pressedBorderColor?: string \| undefined; disabledBorderColor?: string \| undefined; hoveredBorderColor?: string \| undefined; } \| undefined` | No | `-` | Custom color overrides for different interaction states. Base colors (background, borderColor) are used directly, while interaction state colors (hovered, pressed, disabled) are used as alternative base colors for blending calculations with blend strength and color scheme considerations. |
+| `blendStyles` | `InteractableBlendStyles` | No | `-` | - |
 | `block` | `boolean` | No | `-` | Set element to block and expand to 100% width. |
 | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
 | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |

package/mcp-docs/web/routes.txt

@@ -89,6 +89,7 @@
 - [Switch](web/components/Switch.txt): A control for toggling between on and off.
 - [SelectOption](web/components/SelectOption.txt): A single option of a Select component.
 - [SelectChip](web/components/SelectChip.txt): A Chip and Select control for selecting from a list of options.
+- [SelectAlpha](web/components/SelectAlpha.txt): A flexible select component for both single and multi-selection, built for web applications with comprehensive accessibility support.
 - [Select](web/components/Select.txt): A Dropdown control for selecting from a list of options.
 - [SearchInput](web/components/SearchInput.txt): A control for searching a dataset.
 - [RadioGroup](web/components/RadioGroup.txt): Radio is a control component that allows users to select one option from a set.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-mcp-server",
-  "version": "8.19.1",
+  "version": "8.20.1",
   "description": "Coinbase Design System - MCP Server",
   "repository": {
     "type": "git",