@coinbase/cds-mcp-server 8.32.2 → 8.33.0

package/CHANGELOG.md

@@ -8,6 +8,14 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 8.33.0 ((12/18/2025, 11:46 AM PST))
+
+This is an artificial version bump with no new change.
+
+## 8.32.3 (12/18/2025)
+
+This is an artificial version bump with no new change.
+
 ## 8.32.2 ((12/18/2025, 07:41 AM PST))
 
 This is an artificial version bump with no new change.

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

@@ -274,6 +274,43 @@ function ColorAndTransition() {
 }
 ```
 
+### Digit Transition Variants
+
+RollingNumber supports two digit transition styles via the `digitTransitionVariant` prop:
+
+- **`'every'`** (default): Rolls through every intermediate digit (e.g., 1→2→3→...→9).
+- **`'single'`**: Rolls directly to the new digit without showing intermediates. Direction (up/down) is based on the total value change.
+
+```tsx
+function DigitTransitionVariants() {
+  const price = 12345.67;
+  return (
+    <VStack gap={2}>
+      <Text font="label1">Every variant (default)</Text>
+      <RollingNumber
+        colorPulseOnUpdate
+        digitTransitionVariant="every"
+        font="display3"
+        format={{ style: 'currency', currency: 'USD' }}
+        value={price}
+      />
+      <Text font="label1">Single variant</Text>
+      <RollingNumber
+        colorPulseOnUpdate
+        digitTransitionVariant="single"
+        font="display3"
+        format={{ style: 'currency', currency: 'USD' }}
+        value={price}
+      />
+    </VStack>
+  );
+}
+```
+
+::::tip Direction-aware animation
+The single variant determines scroll direction based on the **total value change**, not individual digit changes. When the value increases, digits roll up (new digits enter from below). When the value decreases, digits roll down (new digits enter from above). This matches the behavior of the color pulse feature.
+::::
+
 ### Prefix and Suffix
 
 Attach text or React nodes before/after the number to create rich compositions. If the prefix/suffix is a string, it will pulse color together with the main number.
@@ -690,12 +727,13 @@ ValueSection
 | `borderTopWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
 | `borderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
 | `bottom` | `string \| number` | No | `-` | - |
-| `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 | `-` | 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. Defaults to {@code fg}. |
+| `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 | `'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 | `-` | - |
 | `dangerouslySetBackground` | `string \| OpaqueColorValue` | No | `-` | - |
 | `dangerouslySetColor` | `string \| OpaqueColorValue` | No | `-` | - |
 | `dataDetectorType` | `link \| none \| all \| email \| phoneNumber \| null` | No | `-` | Determines the types of data converted to clickable URLs in the text element. By default no data types are detected. |
+| `digitTransitionVariant` | `every \| single` | No | `'every'` | Style of digit transition animation. - every: Rolls through every intermediate digit (e.g., 1→2→3→...→9). - single: Rolls directly to the new digit without showing intermediates (e.g., 1→9). |
 | `disabled` | `boolean` | No | `-` | Add disabled opacity style to text Specifies the disabled state of the text view for testing purposes. |
 | `display` | `flex \| none` | No | `-` | - |
 | `dynamicTypeRamp` | `title1 \| title2 \| title3 \| headline \| body \| caption2 \| caption1 \| footnote \| subheadline \| callout \| largeTitle` | No | `-` | The Dynamic Type scale ramp to apply to this element on iOS. |
@@ -739,7 +777,7 @@ ValueSection
 | `minimumFontScale` | `number` | No | `-` | Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0). |
 | `mono` | `boolean` | No | `-` | Use monospace font family. |
 | `nativeID` | `string` | No | `-` | Used to reference react managed views from native code. |
-| `negativePulseColor` | `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 | `-` | Color token used for negative numeric changes. Defaults to {@code fgNegative}. |
+| `negativePulseColor` | `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 | `'fgNegative'` | Color token used for negative numeric changes. |
 | `noWrap` | `boolean` | No | `false` | Set text to be in a single line. |
 | `numberOfLines` | `number` | No | `-` | Truncates text after wrapping to a defined number of lines. Used to truncate the text with an ellipsis after computing the text layout, including line wrapping, such that the total number of lines does not exceed this number.  This prop is commonly used with ellipsizeMode. |
 | `onLayout` | `((event: LayoutChangeEvent) => void)` | No | `-` | Invoked on mount and layout changes with  {nativeEvent: { layout: {x, y, width, height}}}. |
@@ -758,7 +796,7 @@ ValueSection
 | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
-| `positivePulseColor` | `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 | `-` | Color token used for positive numeric changes. Defaults to {@code fgPositive}. |
+| `positivePulseColor` | `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 | `'fgPositive'` | Color token used for positive numeric changes. |
 | `prefix` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content rendered before the formatted value. |
 | `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
 | `renderEmptyNode` | `boolean` | No | `-` | - |
@@ -770,7 +808,7 @@ ValueSection
 | `styles` | `{ root?: StyleProp<ViewStyle>; visibleContent?: StyleProp<ViewStyle>; formattedValueSection?: StyleProp<ViewStyle>; prefix?: StyleProp<ViewStyle>; suffix?: StyleProp<ViewStyle>; i18nPrefix?: StyleProp<ViewStyle>; i18nSuffix?: StyleProp<ViewStyle>; integer?: StyleProp<ViewStyle>; fraction?: StyleProp<ViewStyle>; text?: StyleProp<TextStyle>; }` | No | `-` | Style overrides applied to RollingNumber slots. |
 | `suffix` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content rendered after the formatted value. |
 | `suppressHighlighting` | `boolean` | No | `-` | When true, no visual change is made when text is pressed down. By default, a gray oval highlights the text on press down. |
-| `tabularNumbers` | `boolean` | No | `false` | Activates the set of figures where numbers are all of the same size, allowing them to be easily aligned. Enables tabular figures on the underlying {@link Text}. All digits render with equal width. Defaults to {@code true}. |
+| `tabularNumbers` | `boolean` | No | `false true` | Activates the set of figures where numbers are all of the same size, allowing them to be easily aligned. Enables tabular figures on the underlying {@link Text}. All digits render with equal width. |
 | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Used to locate this view in end-to-end tests. 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` | `left \| right \| auto \| center \| justify` | No | `-` | - |
 | `textBreakStrategy` | `simple \| highQuality \| balanced` | No | `-` | Set text break strategy on Android API Level 23+ default is highQuality. |

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

@@ -248,6 +248,7 @@ function Example() {
         format={{ style: 'currency', currency: 'USD' }}
         transition={{
           color: { duration: 0.3, ease: 'easeInOut' },
+          opacity: { duration: 0.3, ease: 'easeInOut' },
           y: { duration: 0.3, ease: 'easeIn' },
         }}
         value={price}
@@ -260,6 +261,7 @@ function Example() {
         format={{ style: 'currency', currency: 'USD' }}
         transition={{
           color: { duration: 1.2, ease: 'easeInOut' },
+          opacity: { duration: 1.2, ease: 'easeInOut' },
           y: { duration: 1.2, ease: 'easeIn' },
         }}
         value={price}
@@ -284,8 +286,9 @@ function Example() {
         font="title1"
         format={{ style: 'currency', currency: 'USD' }}
         transition={{
-          y: { duration: 0.1, ease: 'easeIn' },
           color: { duration: 1.2, ease: 'easeInOut' },
+          opacity: { duration: 0.1, ease: 'easeInOut' },
+          y: { duration: 0.1, ease: 'easeIn' },
         }}
         value={price}
       />
@@ -298,6 +301,7 @@ function Example() {
         font="title1"
         format={{ style: 'currency', currency: 'USD' }}
         transition={{
+          opacity: { duration: 2, ease: 'easeInOut' },
           y: {
             type: 'spring',
             stiffness: 1000,
@@ -316,8 +320,9 @@ function Example() {
         font="title1"
         format={{ style: 'currency', currency: 'USD' }}
         transition={{
-          y: { duration: 0.25, ease: 'easeOut' },
           color: { duration: 0.5, ease: 'easeInOut' },
+          opacity: { duration: 0.5, ease: 'easeInOut' },
+          y: { duration: 0.25, ease: 'easeOut' },
         }}
         value={price}
       />
@@ -329,6 +334,108 @@ function Example() {
 }
 ```
 
+### Digit Transition Variants
+
+RollingNumber supports two digit transition styles via the `digitTransitionVariant` prop:
+
+- **`'every'`** (default): Rolls through every intermediate digit (e.g., 1→2→3→...→9).
+- **`'single'`**: Rolls directly to the new digit without showing intermediates. Direction (up/down) is based on the total value change.
+
+```tsx live
+function Example() {
+  const [price, setPrice] = React.useState(12345.67);
+  const [variant, setVariant] = React.useState<'every' | 'single'>('single');
+
+  const onIncrease = () => setPrice((p) => Math.round((p + Math.random() * 500 + 100) * 100) / 100);
+  const onDecrease = () =>
+    setPrice((p) => Math.max(0, Math.round((p - Math.random() * 500 - 100) * 100) / 100));
+  const onRandom = () =>
+    setPrice((p) => {
+      const delta = (Math.random() - 0.5) * 1000;
+      return Math.max(0, Math.round((p + delta) * 100) / 100);
+    });
+
+  return (
+    <VStack gap={2}>
+      <Text as="p" display="block" font="label1">
+        Digit transition variant: <strong>{variant}</strong>
+      </Text>
+      <RollingNumber
+        digitTransitionVariant={variant}
+        font="display1"
+        format={{ style: 'currency', currency: 'USD' }}
+        value={price}
+      />
+      <HStack gap={2}>
+        <Button onClick={onIncrease}>Increase</Button>
+        <Button onClick={onDecrease}>Decrease</Button>
+        <Button onClick={onRandom}>Random</Button>
+      </HStack>
+      <HStack gap={2}>
+        <Button
+          variant={variant === 'every' ? 'primary' : 'secondary'}
+          onClick={() => setVariant('every')}
+        >
+          Every
+        </Button>
+        <Button
+          variant={variant === 'single' ? 'primary' : 'secondary'}
+          onClick={() => setVariant('single')}
+        >
+          Single
+        </Button>
+      </HStack>
+    </VStack>
+  );
+}
+```
+
+#### Variant comparison
+
+```tsx live
+function Example() {
+  const [price, setPrice] = React.useState(98765.43);
+
+  const onNext = () =>
+    setPrice((p) => {
+      const delta = (Math.random() - 0.5) * 2000;
+      return Math.max(0, Math.round((p + delta) * 100) / 100);
+    });
+
+  return (
+    <VStack gap={2}>
+      <Text as="p" display="block" font="label1">
+        Every variant (default)
+      </Text>
+      <RollingNumber
+        colorPulseOnUpdate
+        digitTransitionVariant="every"
+        font="display3"
+        format={{ style: 'currency', currency: 'USD' }}
+        value={price}
+      />
+      <Text as="p" display="block" font="label1">
+        Single variant
+      </Text>
+      <RollingNumber
+        colorPulseOnUpdate
+        digitTransitionVariant="single"
+        font="display3"
+        format={{ style: 'currency', currency: 'USD' }}
+        value={price}
+      />
+      <Button alignSelf="flex-start" onClick={onNext}>
+        Random Change
+      </Button>
+    </VStack>
+  );
+}
+```
+
+::::tip Direction-aware animation
+The single variant determines scroll direction based on the **total value change**, not individual digit changes. When the value increases, digits roll up (new digits enter from below). When the value decreases, digits roll down (new digits enter from above). This matches the behavior of the color pulse feature.
+::::
+
 ### Prefix and Suffix
 
 Attach text or React nodes before/after the number to create rich compositions. If the prefix/suffix is a string, it will pulse color together with the main number.
@@ -903,7 +1010,7 @@ ValueSection
 | `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 | `-` | - |
-| `ariaLive` | `off \| assertive \| polite` | No | `-` | aria-live politeness level. Defaults to {@code polite}. |
+| `ariaLive` | `off \| assertive \| polite` | No | `'polite'` | aria-live politeness level. |
 | `as` | `symbol \| object \| style \| div \| 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 \| 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 \| svg \| 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` | `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 | `-` | - |
@@ -927,11 +1034,12 @@ ValueSection
 | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
 | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | 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. |
-| `color` | `((Color \| { base?: Color; phone?: Color \| undefined; tablet?: Color \| undefined; desktop?: Color \| undefined; }) & Color) \| undefined` | No | `-` | 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. Defaults to {@code fg}. |
-| `colorPulseOnUpdate` | `boolean` | No | `-` | Enables color pulsing on positive or negative changes. Defaults to {@code false}. |
+| `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 | `-` | - |
 | `dangerouslySetBackground` | `string` | No | `-` | - |
 | `dangerouslySetColor` | `string` | No | `-` | - |
+| `digitTransitionVariant` | `every \| single` | No | `'every'` | Style of digit transition animation. - every: Rolls through every intermediate digit (e.g., 1→2→3→...→9). - single: Rolls directly to the new digit without showing intermediates (e.g., 1→9). |
 | `disabled` | `boolean` | No | `-` | - |
 | `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 | `-` | - |
@@ -980,7 +1088,7 @@ ValueSection
 | `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
 | `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
 | `mono` | `boolean` | No | `-` | Use monospace font family. |
-| `negativePulseColor` | `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 | `-` | Color token used for negative numeric changes. Defaults to {@code fgNegative}. |
+| `negativePulseColor` | `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 | `'fgNegative'` | Color token used for negative numeric changes. |
 | `noWrap` | `boolean` | No | `false` | Set text to be in a single line. |
 | `numberOfLines` | `number` | No | `-` | - |
 | `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
@@ -994,7 +1102,7 @@ ValueSection
 | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
 | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
 | `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
-| `positivePulseColor` | `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 | `-` | Color token used for positive numeric changes. Defaults to {@code fgPositive}. |
+| `positivePulseColor` | `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 | `'fgPositive'` | Color token used for positive numeric changes. |
 | `prefix` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content rendered before the formatted value. |
 | `ref` | `any` | No | `-` | - |
 | `renderEmptyNode` | `boolean` | No | `-` | - |
@@ -1004,7 +1112,7 @@ ValueSection
 | `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. |
 | `suffix` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content rendered after the formatted value. |
-| `tabularNumbers` | `boolean` | No | `false` | Activates the set of figures where numbers are all of the same size, allowing them to be easily aligned. Enables tabular figures on the underlying {@link Text}. Defaults to {@code true}. |
+| `tabularNumbers` | `boolean` | No | `false true` | Activates the set of figures where numbers are all of the same size, allowing them to be easily aligned. Enables tabular figures on the underlying {@link Text}. |
 | `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/package.json

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