@coinbase/cds-mcp-server 8.51.0 → 8.52.1

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

@@ -252,7 +252,7 @@ An icon button with a badge showing the notification count. Uses `DotCount` to d
 
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
-| `name` | `key \| search \| pin \| filter \| visible \| continuous \| auto \| loop \| warning \| error \| account \| activity \| add \| addPeople \| advancedMarketSelector \| advancedTradeProduct \| affiliates \| airdrop \| airdropAlt \| airdropCoins \| airdropParachute \| alien \| allTimeHigh \| allocation \| annotation \| api \| apiPlug \| apothecary \| appSwitcher \| apple \| appleLogo \| application \| arrowDown \| arrowLeft \| arrowRight \| arrowUp \| arrowsHorizontal \| arrowsUpDown \| arrowsVertical \| artwork \| assetHubProduct \| assetManagementProduct \| astronautHelmet \| atSign \| atomScience \| autoCar \| avatar \| average \| backArrow \| ballot \| ballotbox \| bandage \| bank \| barChartSimple \| barChartWindow \| base \| baseApps \| baseFeed \| baseNotification \| baseQuickBuy \| baseSquare \| baseTransact \| baseVerification \| baseWallet \| baseball \| basketball \| beaker \| beginningArrow \| bell \| bellCheck \| bellPlus \| birthcertificate \| block \| blockchain \| blog \| book \| bookmark \| borrowProduct \| boxing \| bridging \| briefcase \| briefcaseAlt \| browser \| bug \| building \| calculator \| calendar \| calendarBlank \| calendarDates \| calendarEmpty \| calendarHeart \| calendarMoney \| calendarStar \| camera \| candlesticks \| car \| card \| caret \| caretDown \| caretLeft \| caretRight \| caretUp \| cash \| cashAustralianDollar \| cashBrazilianReal \| cashBrazillianReal \| cashCanadianDollar \| cashCoins \| cashEUR \| cashGBP \| cashIndonesianRupiah \| cashJPY \| cashPhilippinePeso \| cashPolishZloty \| cashRupee \| cashSingaporeDollar \| cashSwissFranc \| cashThaiBaht \| cashTurkishLira \| cashUSD \| cashUaeDirham \| cashVietnameseDong \| chainLink \| chartBar \| chartCandles \| chartLine \| chartPie \| chartPieCircle \| chartVolume \| chatBotAgent \| chatBubble \| chatRequests \| checkboxChecked \| checkboxEmpty \| checkmark \| chess \| circleCheckmark \| circleCross \| circulatingSupply \| city \| clipboard \| clock \| clockOutline \| close \| closeCaption \| clothing \| cloud \| cloudPartial \| cloudProduct \| cluster \| coinbase \| coinbaseCardProduct \| coinbaseOne \| coinbaseOneCard \| coinbaseOneLogo \| coinbaseRewards \| coinsCrypto \| collapse \| collectibles \| collection \| comment \| commentPlus \| commerceProduct \| compass \| complianceProduct \| compose \| computerChip \| concierge \| conciergeBell \| config \| convert \| copy \| corporation \| creatorCoin \| cricket \| cross \| crossTrade \| crypto \| cryptobasics \| crystalBall \| crystalBallInsight \| currencies \| custodyProduct \| dashboard \| dataMarketplaceProduct \| dataStack \| defi \| delegateProduct \| deposit \| derivatives \| derivativesProduct \| derivativesProductNew \| developerAPIProduct \| developerPlatformProduct \| dex \| diagonalDownArrow \| diagonalRightArrow \| diagonalUpArrow \| diamond \| diamondIncentives \| dinnerPlate \| directDeposit \| directDepositIcon \| disabledPhone \| discordLogo \| distribution \| document \| documentation \| dot \| doubleChevronRight \| downArrow \| download \| drag \| drops \| earn \| earnProduct \| earnRewards \| earthquake \| educationBook \| educationPencil \| email \| endArrow \| entertainment \| ethereum \| eventContracts \| exchangeProduct \| exclamationMark \| expand \| expandAddress \| expandAll \| externalLink \| eye \| faceScan \| faces \| factory \| faucet \| fib \| filmStrip \| filterLineStack \| fingerprint \| flame \| folder \| folderArrow \| folderOpen \| followAdd \| following \| football \| fork \| forwardArrow \| fscsProtection \| gab \| games \| gaming \| gasFees \| gasFeesAlt \| gauge \| gaugeEmpty \| gaugeHigh \| gaugeHighLow \| gaugeHighMid \| gaugeLow \| gaugeLowHigh \| gaugeLowMid \| gaugeMedium \| gavel \| gear \| generalCharacter \| ghost \| gif \| giftBox \| giftCard \| gitHubLogo \| globe \| golf \| googleLogo \| greenEnergy \| grid \| group \| hamburger \| hammer \| heart \| helpCenterProduct \| helpCenterQuestionMark \| hiddenEye \| hockey \| home \| horizontalLine \| hospital \| hospitalCross \| hurricane \| ideal \| identityCard \| image \| info \| initiator \| instagramLogo \| instantUnstakingClock \| institute \| institutionalProduct \| interest \| invisible \| invoice \| keyboard \| laptop \| leadChart \| leadCoin \| learningRewardsProduct \| light \| lightbulb \| lightning \| lightningBolt \| lineChartCrypto \| list \| location \| lock \| login \| logout \| magnifyingGlass \| marketCap \| medal \| megaphone \| menu \| metaverse \| microphone \| microphoneCordless \| microscope \| mint \| minus \| mma \| moneyCardCoin \| moon \| more \| moreVertical \| motorsport \| music \| musicArticles \| needle \| newsFeed \| newsletter \| nft \| nftBuy \| nftOffer \| nftProduct \| nftSale \| noRocket \| noWifi \| nodeProduct \| oil \| options \| orderBook \| orderHistory \| outline \| pFPS \| paperAirplane \| paperclip \| participate \| participateProduct \| passKey \| passport \| pause \| pay \| payProduct \| paymentCard \| payments \| payouts \| paypal \| pencil \| peopleGroup \| peopleStar \| percentage \| perpetualSwap \| phone \| pieChartData \| pieChartWithArrow \| pillBottle \| pillCapsule \| plane \| planet \| play \| playbutton \| plusMinus \| podiumStar \| politicsBuilding \| politicsCandidate \| politicsFlag \| politicsGavel \| politicsPodium \| politicsStar \| powerTool \| priceAlerts \| priceAlertsCheck \| primePoduct \| privateClientProduct \| proProduct \| profile \| protection \| pulse \| pyramid \| qrCode \| qrCodeAlt \| queryTransact \| questionMark \| quotation \| rain \| ratingsCheck \| ratingsChecks \| ratingsStar \| reCenter \| rectangle \| recurring \| refresh \| regulated \| regulatedFutures \| report \| rewardsProduct \| ribbon \| robot \| rocket \| rocketShip \| rollingSpot \| rosettaProduct \| rottenTomato \| royalty \| safe \| save \| savingsBank \| scanQrCode \| scienceAtom \| scienceBeaker \| scienceMoon \| securityKey \| securityShield \| seen \| sendReceive \| setPinCode \| settings \| share \| shield \| shieldOutline \| shoe \| shoppingCart \| signinProduct \| singleCoin \| singleNote \| singlecloud \| smartContract \| snow \| soccer \| socialChat \| socialReshare \| socialShare \| sofort \| sortDoubleArrow \| sortDown \| sortDownCenter \| sortUp \| sortUpCenter \| soundOff \| soundOn \| sparkle \| speaker \| speechBubble \| stableCoin \| stablecoinStack \| staggeredList \| stake \| staking \| star \| starAward \| starBubble \| starTrophy \| statusDot \| step0 \| step1 \| step2 \| step3 \| step4 \| step5 \| step6 \| step7 \| step8 \| step9 \| strategy \| sun \| support \| tag \| taxes \| taxesReceipt \| telephone \| tennis \| test \| thermometer \| thumbsDown \| thumbsDownOutline \| thumbsUp \| thumbsUpOutline \| tokenLaunchCoin \| tokenLaunchRocket \| tokenSales \| tornado \| trading \| transactions \| trashCan \| trophy \| trophyCup \| tshirt \| tv \| tvStand \| twitterLogo \| ultility \| umbrella \| undo \| unfollowPeople \| unknown \| unlock \| upArrow \| upload \| usdc \| venturesProduct \| verifiedBadge \| verifiedPools \| verticalLine \| virus \| waasProduct \| wallet \| walletLogo \| walletProduct \| webhooks \| wellness \| wifi \| wind \| wireTransfer \| withdraw \| wrapToken \| xLogo` | Yes | `-` | Name of the icon, as defined in Figma. |
+| `name` | `key \| search \| pin \| filter \| visible \| continuous \| auto \| loop \| image \| menu \| list \| application \| document \| grid \| group \| warning \| error \| account \| activity \| add \| addPeople \| advancedMarketSelector \| advancedTradeProduct \| affiliates \| airdrop \| airdropAlt \| airdropCoins \| airdropParachute \| alien \| allTimeHigh \| allocation \| annotation \| api \| apiPlug \| apothecary \| appSwitcher \| apple \| appleLogo \| arrowDown \| arrowLeft \| arrowRight \| arrowUp \| arrowsHorizontal \| arrowsUpDown \| arrowsVertical \| artwork \| assetHubProduct \| assetManagementProduct \| astronautHelmet \| atSign \| atomScience \| autoCar \| avatar \| average \| backArrow \| ballot \| ballotbox \| bandage \| bank \| barChartSimple \| barChartWindow \| base \| baseApps \| baseFeed \| baseNotification \| baseQuickBuy \| baseSquare \| baseTransact \| baseVerification \| baseWallet \| baseball \| basketball \| beaker \| beginningArrow \| bell \| bellCheck \| bellPlus \| birthcertificate \| block \| blockchain \| blog \| book \| bookmark \| borrowProduct \| boxing \| bridging \| briefcase \| briefcaseAlt \| browser \| bug \| building \| calculator \| calendar \| calendarBlank \| calendarDates \| calendarEmpty \| calendarHeart \| calendarMoney \| calendarStar \| camera \| candlesticks \| car \| card \| caret \| caretDown \| caretLeft \| caretRight \| caretUp \| cash \| cashAustralianDollar \| cashBrazilianReal \| cashBrazillianReal \| cashCanadianDollar \| cashCoins \| cashEUR \| cashGBP \| cashIndonesianRupiah \| cashJPY \| cashPhilippinePeso \| cashPolishZloty \| cashRupee \| cashSingaporeDollar \| cashSwissFranc \| cashThaiBaht \| cashTurkishLira \| cashUSD \| cashUaeDirham \| cashVietnameseDong \| chainLink \| chartBar \| chartCandles \| chartLine \| chartPie \| chartPieCircle \| chartVolume \| chatBotAgent \| chatBubble \| chatRequests \| checkboxChecked \| checkboxEmpty \| checkmark \| chess \| circleCheckmark \| circleCross \| circulatingSupply \| city \| clipboard \| clock \| clockOutline \| close \| closeCaption \| clothing \| cloud \| cloudPartial \| cloudProduct \| cluster \| coinbase \| coinbaseCardProduct \| coinbaseOne \| coinbaseOneCard \| coinbaseOneLogo \| coinbaseRewards \| coinsCrypto \| collapse \| collectibles \| collection \| comment \| commentPlus \| commerceProduct \| compass \| complianceProduct \| compose \| computerChip \| concierge \| conciergeBell \| config \| convert \| copy \| corporation \| creatorCoin \| cricket \| cross \| crossTrade \| crypto \| cryptobasics \| crystalBall \| crystalBallInsight \| currencies \| custodyProduct \| dashboard \| dataMarketplaceProduct \| dataStack \| defi \| delegateProduct \| deposit \| derivatives \| derivativesProduct \| derivativesProductNew \| developerAPIProduct \| developerPlatformProduct \| dex \| diagonalDownArrow \| diagonalRightArrow \| diagonalUpArrow \| diamond \| diamondIncentives \| dinnerPlate \| directDeposit \| directDepositIcon \| disabledPhone \| discordLogo \| distribution \| documentation \| dot \| doubleChevronRight \| downArrow \| download \| drag \| drops \| earn \| earnProduct \| earnRewards \| earthquake \| educationBook \| educationPencil \| email \| endArrow \| entertainment \| ethereum \| eventContracts \| exchangeProduct \| exclamationMark \| expand \| expandAddress \| expandAll \| externalLink \| eye \| faceScan \| faces \| factory \| faucet \| fib \| filmStrip \| filterLineStack \| fingerprint \| flame \| folder \| folderArrow \| folderOpen \| followAdd \| following \| football \| fork \| forwardArrow \| fscsProtection \| gab \| games \| gaming \| gasFees \| gasFeesAlt \| gauge \| gaugeEmpty \| gaugeHigh \| gaugeHighLow \| gaugeHighMid \| gaugeLow \| gaugeLowHigh \| gaugeLowMid \| gaugeMedium \| gavel \| gear \| generalCharacter \| ghost \| gif \| giftBox \| giftCard \| gitHubLogo \| globe \| golf \| googleLogo \| greenEnergy \| hamburger \| hammer \| heart \| helpCenterProduct \| helpCenterQuestionMark \| hiddenEye \| hockey \| home \| horizontalLine \| hospital \| hospitalCross \| hurricane \| ideal \| identityCard \| info \| initiator \| instagramLogo \| instantUnstakingClock \| institute \| institutionalProduct \| interest \| invisible \| invoice \| keyboard \| laptop \| leadChart \| leadCoin \| learningRewardsProduct \| light \| lightbulb \| lightning \| lightningBolt \| lineChartCrypto \| location \| lock \| login \| logout \| magnifyingGlass \| marketCap \| medal \| megaphone \| metaverse \| microphone \| microphoneCordless \| microscope \| mint \| minus \| mma \| moneyCardCoin \| moon \| more \| moreVertical \| motorsport \| music \| musicArticles \| needle \| newsFeed \| newsletter \| nft \| nftBuy \| nftOffer \| nftProduct \| nftSale \| noRocket \| noWifi \| nodeProduct \| oil \| options \| orderBook \| orderHistory \| outline \| pFPS \| paperAirplane \| paperclip \| participate \| participateProduct \| passKey \| passport \| pause \| pay \| payProduct \| paymentCard \| payments \| payouts \| paypal \| pencil \| peopleGroup \| peopleStar \| percentage \| perpetualSwap \| phone \| pieChartData \| pieChartWithArrow \| pillBottle \| pillCapsule \| plane \| planet \| play \| playbutton \| plusMinus \| podiumStar \| politicsBuilding \| politicsCandidate \| politicsFlag \| politicsGavel \| politicsPodium \| politicsStar \| powerTool \| priceAlerts \| priceAlertsCheck \| primePoduct \| privateClientProduct \| proProduct \| profile \| protection \| pulse \| pyramid \| qrCode \| qrCodeAlt \| queryTransact \| questionMark \| quotation \| rain \| ratingsCheck \| ratingsChecks \| ratingsStar \| reCenter \| rectangle \| recurring \| refresh \| regulated \| regulatedFutures \| report \| rewardsProduct \| ribbon \| robot \| rocket \| rocketShip \| rollingSpot \| rosettaProduct \| rottenTomato \| royalty \| safe \| save \| savingsBank \| scanQrCode \| scienceAtom \| scienceBeaker \| scienceMoon \| securityKey \| securityShield \| seen \| sendReceive \| setPinCode \| settings \| share \| shield \| shieldOutline \| shoe \| shoppingCart \| signinProduct \| singleCoin \| singleNote \| singlecloud \| smartContract \| snow \| soccer \| socialChat \| socialReshare \| socialShare \| sofort \| sortDoubleArrow \| sortDown \| sortDownCenter \| sortUp \| sortUpCenter \| soundOff \| soundOn \| sparkle \| speaker \| speechBubble \| stableCoin \| stablecoinStack \| staggeredList \| stake \| staking \| star \| starAward \| starBubble \| starTrophy \| statusDot \| step0 \| step1 \| step2 \| step3 \| step4 \| step5 \| step6 \| step7 \| step8 \| step9 \| strategy \| sun \| support \| tag \| taxes \| taxesReceipt \| telephone \| tennis \| test \| thermometer \| thumbsDown \| thumbsDownOutline \| thumbsUp \| thumbsUpOutline \| tokenLaunchCoin \| tokenLaunchRocket \| tokenSales \| tornado \| trading \| transactions \| trashCan \| trophy \| trophyCup \| tshirt \| tv \| tvStand \| twitterLogo \| ultility \| umbrella \| undo \| unfollowPeople \| unknown \| unlock \| upArrow \| upload \| usdc \| venturesProduct \| verifiedBadge \| verifiedPools \| verticalLine \| virus \| waasProduct \| wallet \| walletLogo \| walletProduct \| webhooks \| wellness \| wifi \| wind \| wireTransfer \| withdraw \| wrapToken \| xLogo` | Yes | `-` | Name of the icon, as defined in Figma. |
 | `about` | `string \| undefined` | No | `-` | - |
 | `accessKey` | `string \| undefined` | No | `-` | - |
 | `active` | `boolean` | No | `-` | Whether the icon is active |
@@ -271,7 +271,7 @@ An icon button with a badge showing the notification count. Uses `DotCount` to d
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -397,7 +397,7 @@ An icon button with a badge showing the notification count. Uses `DotCount` to d
 | `iconSize` | `xs \| s \| m \| l` | No | `compact ? 's' : 'm'` | Size for the icon rendered inside the button. |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -103,7 +103,7 @@ Since this component is low-level, it doesn't require much accessibility out of
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -225,7 +225,7 @@ Since this component is low-level, it doesn't require much accessibility out of
 | `hidden` | `boolean \| undefined` | No | `-` | - |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -29,6 +29,45 @@ The only prop required is `series`, which takes an array of series objects. Each
 />
 ```
 
+### Layout
+
+Lines can be rendered horizontally or vertically by setting the `layout` prop.
+
+```jsx live
+function HorizontalLine() {
+  const dataset = [
+    { month: 'Jan', seoul: 21 },
+    { month: 'Feb', seoul: 28 },
+    { month: 'Mar', seoul: 41 },
+    { month: 'Apr', seoul: 73 },
+    { month: 'May', seoul: 99 },
+    { month: 'June', seoul: 144 },
+    { month: 'July', seoul: 319 },
+    { month: 'Aug', seoul: 249 },
+    { month: 'Sept', seoul: 131 },
+    { month: 'Oct', seoul: 55 },
+    { month: 'Nov', seoul: 48 },
+    { month: 'Dec', seoul: 25 },
+  ];
+
+  return (
+    <LineChart
+      height={400}
+      layout="horizontal"
+      series={[
+        { id: 'seoul', data: dataset.map((d) => d.seoul), color: 'var(--color-accentBoldBlue)' },
+      ]}
+      showXAxis
+      showYAxis
+      xAxis={{ label: 'rainfall (mm)' }}
+      yAxis={{
+        data: dataset.map((d) => d.month),
+      }}
+    />
+  );
+}
+```
+
 LineChart also supports multiple lines, interaction, and axes.
 Other props, such as `areaType` can be applied to the chart as a whole or per series.
 
@@ -1973,6 +2012,7 @@ function ForecastAssetPrice() {
 | `inset` | `number \| Partial<ChartInset>` | No | `-` | Inset around the entire chart (outside the axes). |
 | `justifyContent` | `ResponsiveProp<left \| right \| center \| normal \| start \| end \| flex-start \| flex-end \| space-between \| space-around \| space-evenly \| stretch>` | No | `-` | - |
 | `key` | `Key \| null` | No | `-` | - |
+| `layout` | `horizontal \| vertical` | No | `'vertical'` | Chart layout - describes the direction bars/areas grow. - vertical (default): Bars grow vertically. X is category axis, Y is value axis. - horizontal: Bars grow horizontally. Y is category axis, X is value axis. |
 | `left` | `ResponsiveProp<Left<string \| number>>` | No | `-` | - |
 | `legend` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Whether to show the legend or a custom legend element. - true renders the default Legend component - A React element renders that element as the legend - false or omitted hides the legend |
 | `legendAccessibilityLabel` | `string` | No | `'Legend'` | Accessibility label for the legend group. |
@@ -2027,8 +2067,8 @@ function ForecastAssetPrice() {
 | `userSelect` | `ResponsiveProp<text \| none \| all \| auto>` | No | `-` | - |
 | `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
 | `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
-| `xAxis` | `(Partial<AxisConfigProps> & SharedProps & { bandGridLinePlacement?: AxisBandPlacement; bandTickMarkPlacement?: AxisBandPlacement \| undefined; label?: string \| undefined; labelGap?: number \| undefined; minTickLabelGap?: number \| undefined; requestedTickCount?: number \| undefined; showGrid?: boolean \| undefined; showLine?: boolean \| undefined; showTickMarks?: boolean \| undefined; tickMarkSize?: number \| undefined; ticks?: number[] \| ((value: number) => boolean) \| undefined; tickMarkLabelGap?: number \| undefined; tickInterval?: number \| undefined; tickMinStep?: number \| undefined; tickMaxStep?: number \| undefined; } & { className?: string \| undefined; classNames?: { root?: string \| undefined; label?: string \| undefined; tickLabel?: string \| undefined; gridLine?: string \| undefined; line?: string \| undefined; tickMark?: string \| undefined; } \| undefined; style?: CSSProperties \| undefined; styles?: { root?: CSSProperties \| undefined; label?: CSSProperties \| undefined; tickLabel?: CSSProperties \| undefined; gridLine?: CSSProperties \| undefined; line?: CSSProperties \| undefined; tickMark?: CSSProperties \| undefined; } \| undefined; GridLineComponent?: LineComponent \| undefined; LineComponent?: LineComponent \| undefined; TickMarkLineComponent?: LineComponent \| undefined; tickLabelFormatter?: ((value: number) => ChartTextChildren) \| undefined; TickLabelComponent?: AxisTickLabelComponent \| undefined; } & { position?: top \| bottom \| undefined; height?: number \| undefined; }) \| undefined` | No | `-` | Configuration for x-axis. Accepts axis config and axis props. To show the axis, set showXAxis to true. |
-| `yAxis` | `(Partial<AxisConfigProps> & SharedProps & { bandGridLinePlacement?: AxisBandPlacement; bandTickMarkPlacement?: AxisBandPlacement \| undefined; label?: string \| undefined; labelGap?: number \| undefined; minTickLabelGap?: number \| undefined; requestedTickCount?: number \| undefined; showGrid?: boolean \| undefined; showLine?: boolean \| undefined; showTickMarks?: boolean \| undefined; tickMarkSize?: number \| undefined; ticks?: number[] \| ((value: number) => boolean) \| undefined; tickMarkLabelGap?: number \| undefined; tickInterval?: number \| undefined; tickMinStep?: number \| undefined; tickMaxStep?: number \| undefined; } & { className?: string \| undefined; classNames?: { root?: string \| undefined; label?: string \| undefined; tickLabel?: string \| undefined; gridLine?: string \| undefined; line?: string \| undefined; tickMark?: string \| undefined; } \| undefined; style?: CSSProperties \| undefined; styles?: { root?: CSSProperties \| undefined; label?: CSSProperties \| undefined; tickLabel?: CSSProperties \| undefined; gridLine?: CSSProperties \| undefined; line?: CSSProperties \| undefined; tickMark?: CSSProperties \| undefined; } \| undefined; GridLineComponent?: LineComponent \| undefined; LineComponent?: LineComponent \| undefined; TickMarkLineComponent?: LineComponent \| undefined; tickLabelFormatter?: ((value: number) => ChartTextChildren) \| undefined; TickLabelComponent?: AxisTickLabelComponent \| undefined; } & { axisId?: string \| undefined; position?: left \| right \| undefined; width?: number \| undefined; }) \| undefined` | No | `-` | Configuration for y-axis. Accepts axis config and axis props. To show the axis, set showYAxis to true. |
+| `xAxis` | `(Partial<CartesianAxisConfigProps> & SharedProps & { bandGridLinePlacement?: AxisBandPlacement; bandTickMarkPlacement?: AxisBandPlacement \| undefined; label?: string \| undefined; labelGap?: number \| undefined; minTickLabelGap?: number \| undefined; requestedTickCount?: number \| undefined; showGrid?: boolean \| undefined; showLine?: boolean \| undefined; showTickMarks?: boolean \| undefined; tickMarkSize?: number \| undefined; ticks?: number[] \| ((value: number) => boolean) \| undefined; tickMarkLabelGap?: number \| undefined; tickInterval?: number \| undefined; tickMinStep?: number \| undefined; tickMaxStep?: number \| undefined; } & { className?: string \| undefined; classNames?: { root?: string \| undefined; label?: string \| undefined; tickLabel?: string \| undefined; gridLine?: string \| undefined; line?: string \| undefined; tickMark?: string \| undefined; } \| undefined; style?: CSSProperties \| undefined; styles?: { root?: CSSProperties \| undefined; label?: CSSProperties \| undefined; tickLabel?: CSSProperties \| undefined; gridLine?: CSSProperties \| undefined; line?: CSSProperties \| undefined; tickMark?: CSSProperties \| undefined; } \| undefined; GridLineComponent?: LineComponent \| undefined; LineComponent?: LineComponent \| undefined; TickMarkLineComponent?: LineComponent \| undefined; tickLabelFormatter?: ((value: number) => ChartTextChildren) \| undefined; TickLabelComponent?: AxisTickLabelComponent \| undefined; } & { axisId?: string \| undefined; position?: top \| bottom \| undefined; height?: number \| undefined; }) \| undefined` | No | `-` | Configuration for x-axis. Accepts axis config and axis props. To show the axis, set showXAxis to true. |
+| `yAxis` | `(Partial<CartesianAxisConfigProps> & SharedProps & { bandGridLinePlacement?: AxisBandPlacement; bandTickMarkPlacement?: AxisBandPlacement \| undefined; label?: string \| undefined; labelGap?: number \| undefined; minTickLabelGap?: number \| undefined; requestedTickCount?: number \| undefined; showGrid?: boolean \| undefined; showLine?: boolean \| undefined; showTickMarks?: boolean \| undefined; tickMarkSize?: number \| undefined; ticks?: number[] \| ((value: number) => boolean) \| undefined; tickMarkLabelGap?: number \| undefined; tickInterval?: number \| undefined; tickMinStep?: number \| undefined; tickMaxStep?: number \| undefined; } & { className?: string \| undefined; classNames?: { root?: string \| undefined; label?: string \| undefined; tickLabel?: string \| undefined; gridLine?: string \| undefined; line?: string \| undefined; tickMark?: string \| undefined; } \| undefined; style?: CSSProperties \| undefined; styles?: { root?: CSSProperties \| undefined; label?: CSSProperties \| undefined; tickLabel?: CSSProperties \| undefined; gridLine?: CSSProperties \| undefined; line?: CSSProperties \| undefined; tickMark?: CSSProperties \| undefined; } \| undefined; GridLineComponent?: LineComponent \| undefined; LineComponent?: LineComponent \| undefined; TickMarkLineComponent?: LineComponent \| undefined; tickLabelFormatter?: ((value: number) => ChartTextChildren) \| undefined; TickLabelComponent?: AxisTickLabelComponent \| undefined; } & { axisId?: string \| undefined; position?: left \| right \| undefined; width?: number \| undefined; }) \| undefined` | No | `-` | Configuration for y-axis. Accepts axis config and axis props. To show the axis, set showYAxis to true. |
 | `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 
 

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

@@ -235,7 +235,7 @@ Use the `underline` prop on inline links within body text to ensure they are dis
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -355,7 +355,7 @@ Use the `underline` prop on inline links within body text to ensure they are dis
 | `hrefLang` | `string \| undefined` | No | `-` | - |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -667,7 +667,7 @@ Mapping to `styles` / `classNames` keys:
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -795,7 +795,7 @@ Mapping to `styles` / `classNames` keys:
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
 | `innerSpacing` | `CellSpacing` | No | `-` | The spacing to use on the inner content of Cell |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `intermediary` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | For internal use only. |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |

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

@@ -56,10 +56,12 @@ function BasicExample() {
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
 | `source` | `LottieSource<string>` | Yes | `-` | The source of animation. Should be pulled from |
+| `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 | `-` | - |
+| `as` | `div` | 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 | `-` | - |
-| `autoplay` | `boolean` | No | `false` | A boolean flag indicating whether or not the animation should start automatically when mounted. This only affects the imperative API. |
+| `autoplay` | `boolean` | No | `-` | A boolean flag indicating whether or not the animation should start automatically when mounted. This only affects the imperative API. |
 | `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 | `-` | - |
 | `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 | `-` | - |
@@ -87,8 +89,10 @@ function BasicExample() {
 | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
 | `filterSize` | `FilterSizeConfig` | No | `-` | In order to render drop shadows, the filter size needs to be set to increase the render surface of the element. You can set the x, y, width and height of filters manually. |
 | `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 | `-` | - |
 | `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
+| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
 | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
 | `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
 | `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
@@ -111,10 +115,11 @@ function BasicExample() {
 | `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
 | `handlers` | `LottieEventHandlersMap` | No | `-` | - |
 | `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
+| `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 | `-` | - |
 | `lineHeight` | `ResponsiveProp<LineHeight \| inherit>` | No | `-` | - |
-| `loop` | `boolean` | No | `false` | A boolean flag indicating whether or not the animation should loop. |
+| `loop` | `boolean` | No | `-` | A boolean flag indicating whether or not the animation should loop. |
 | `margin` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
 | `marginBottom` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
 | `marginEnd` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
@@ -127,6 +132,7 @@ function BasicExample() {
 | `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
 | `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
 | `onAnimationFinish` | `(() => void)` | No | `-` | A callback function which will be called when animation is finished. Note that on mobile, this callback will be called only when loop is set to false. |
+| `onChange` | `FormEventHandler<HTMLDivElement>` | No | `-` | - |
 | `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
 | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |

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

@@ -48,8 +48,8 @@ function Example() {
 
 | Prop | Type | Required | Default | Description |
 | --- | --- | --- | --- | --- |
-| `height` | `string \| number` | Yes | `-` | We use aspect ratio to calculate the unset dimension based on the set dimension and a given aspect ratio. Only width or height is allowed, but not both. |
-| `width` | `string \| number` | Yes | `-` | We use aspect ratio to calculate the unset dimension based on the set dimension and a given aspect ratio. Only width or height is allowed, but not both. |
+| `height` | `string \| number` | Yes | `-` | - |
+| `width` | `string \| number` | Yes | `-` | - |
 | `onFinish` | `(() => void)` | No | `-` | - |
 | `status` | `loading \| success \| cardSuccess \| failure \| pending` | No | `-` | - |
 | `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/Modal.txt

@@ -162,6 +162,70 @@ function ChainedModalsExample() {
 }
 ```
 
+### Scrollable Modal Content
+
+If the Modal has content which is expected to overflow and doesn't have focusable elements, set the following props to ensure the scrollable content can be navigated using keyboard arrows:
+
+- `focusTabIndexElements`: `true`
+- `disableArrowKeyNavigation`: `true`
+
+As well, assign a `tabIndex` greater than or equal to `0` to the ModalBody so that the overflow can be reached via keyboard.
+
+```jsx live
+function Example() {
+  const [visible, setVisible] = useState(false);
+  return (
+    <>
+      <Button onClick={() => setVisible(true)}>Open Modal</Button>
+      <Modal
+        focusTabIndexElements
+        disableArrowKeyNavigation
+        onRequestClose={() => setVisible(false)}
+        visible={visible}
+      >
+        <ModalHeader
+          backAccessibilityLabel="Back"
+          closeAccessibilityLabel="Close"
+          onBackButtonClick={() => setVisible(false)}
+          testID="Basic Modal Test ID"
+          title="Basic Modal"
+        />
+        <ModalBody tabIndex={0} testID="modal-body">
+          <VStack>
+            <Text font="title1" paddingBottom={10}>
+              This tray has content which will overflow.
+            </Text>
+            <Text font="title1" paddingBottom={10}>
+              To enable keyboard scrolling, certain props have to be set.
+            </Text>
+            <Text font="title1" paddingBottom={10}>
+              Otherwise, the content won't be viewable to users who navigate using a keyboard.
+            </Text>
+            <Text font="title1" paddingBottom={10}>
+              It's important to account for this to ensure an accessible experience.
+            </Text>
+            <Text font="title1" paddingBottom={10}>
+              Here's some text that is in the overflow and needs to be scrolled to.
+            </Text>
+            <Text font="title1" paddingBottom={10}>
+              Here's some more text to help more easily showcase scrolling.
+            </Text>
+          </VStack>
+        </ModalBody>
+        <ModalFooter
+          primaryAction={<Button onClick={() => setVisible(false)}>Save</Button>}
+          secondaryAction={
+            <Button onClick={() => setVisible(false)} variant="secondary">
+              Cancel
+            </Button>
+          }
+        />
+      </Modal>
+    </>
+  );
+}
+```
+
 ## Props
 
 | Prop | Type | Required | Default | Description |
@@ -199,7 +263,8 @@ function ChainedModalsExample() {
 | `dangerouslyDisableResponsiveness` | `boolean` | No | `false` | Disable responsiveness so it maintains the same UI across different viewports. |
 | `dangerouslySetBackground` | `string` | No | `-` | - |
 | `dangerouslySetPosition` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | Set the position for the modal dialogue |
-| `disableFocusTrap` | `boolean` | No | `false` | Set disableFocusTrap to disable keyboard listeners responsible for focus trap behavior This can be useful for scenarios like Yubikey 2fa |
+| `disableArrowKeyNavigation` | `boolean` | No | `false` | If true, the focus trap will not allow arrow key navigation. |
+| `disableFocusTrap` | `boolean` | No | `-` | Disables the focus trap to allow normal keyboard navigation. |
 | `disableOverlayPress` | `boolean` | No | `false` | Disable overlay click that closes the Modal |
 | `disablePortal` | `boolean` | No | `-` | Disable React portal integration |
 | `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
@@ -209,7 +274,7 @@ function ChainedModalsExample() {
 | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
 | `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
-| `focusTabIndexElements` | `boolean` | No | `false` | 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. |
+| `focusTabIndexElements` | `boolean` | No | `false` | If true, the focus trap will include all elements with tabIndex values in the list of focusable elements. |
 | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
 | `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
 | `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |

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

@@ -294,7 +294,7 @@ function Example() {
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -409,7 +409,7 @@ function Example() {
 | `hidden` | `boolean \| undefined` | No | `-` | - |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -575,6 +575,7 @@ function ScatterplotWithCustomLabels() {
 | `x` | `string \| number` | No | `-` | - |
 | `x1` | `string \| number` | No | `-` | - |
 | `x2` | `string \| number` | No | `-` | - |
+| `xAxisId` | `string` | No | `first x-axis defined in chart props.` | Optional X-axis id to specify which axis to plot along. |
 | `xChannelSelector` | `string` | No | `-` | - |
 | `xHeight` | `string \| number` | No | `-` | - |
 | `xlinkActuate` | `string` | No | `-` | - |

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

@@ -101,7 +101,7 @@ On web, all [ARIA attributes](https://developer.mozilla.org/en-US/docs/Web/Acces
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -224,7 +224,7 @@ On web, all [ARIA attributes](https://developer.mozilla.org/en-US/docs/Web/Acces
 | `hidden` | `boolean \| undefined` | No | `-` | - |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -645,7 +645,7 @@ function DraggablePriceTarget() {
 | `beaconStroke` | `string` | No | `'var(--color-bg)'` | Stroke color of the scrubber beacon circle. |
 | `beaconTransitions` | `{ enter?: Transition$1 \| null; update?: Transition$1 \| null \| undefined; pulse?: Transition$1 \| undefined; pulseRepeatDelay?: number \| undefined; } \| undefined` | No | `-` | Transition configuration for the scrubber beacon. |
 | `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; label?: 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). |
+| `hideBeaconLabels` | `boolean` | No | `true in horizontal layout, false in vertical layout.` | 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. |
 | `idlePulse` | `boolean` | No | `-` | Pulse the beacons while at rest. |

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

@@ -1024,7 +1024,7 @@ ValueSection
 | `aria-colindextext` | `string \| undefined` | No | `-` | Defines a human readable text alternative of aria-colindex. |
 | `aria-colspan` | `number \| undefined` | No | `-` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. |
 | `aria-controls` | `string \| undefined` | No | `-` | Identifies the element (or elements) whose contents or presence are controlled by the current element. |
-| `aria-current` | `boolean \| time \| location \| true \| false \| page \| step \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
+| `aria-current` | `boolean \| time \| true \| false \| page \| step \| location \| date \| undefined` | No | `-` | Indicates the element that represents the current item within a container or set of related elements. |
 | `aria-describedby` | `string \| undefined` | No | `-` | Identifies the element (or elements) that describes the object. |
 | `aria-description` | `string \| undefined` | No | `-` | Defines a string value that describes or annotates the current element. |
 | `aria-details` | `string \| undefined` | No | `-` | Identifies the element that provides a detailed, extended description for the object. |
@@ -1146,7 +1146,7 @@ ValueSection
 | `hidden` | `boolean \| undefined` | No | `-` | - |
 | `id` | `string \| undefined` | No | `-` | - |
 | `inlist` | `any` | No | `-` | - |
-| `inputMode` | `search \| text \| none \| email \| tel \| url \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
+| `inputMode` | `search \| text \| none \| tel \| url \| email \| numeric \| decimal \| undefined` | No | `-` | Hints at the type of data that might be entered by the user while editing the element or its contents |
 | `is` | `string \| undefined` | No | `-` | Specify that a standard HTML element should behave like a defined custom built-in element |
 | `itemID` | `string \| undefined` | No | `-` | - |
 | `itemProp` | `string \| undefined` | No | `-` | - |

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

@@ -87,6 +87,7 @@ All series will be scrubbed by default. You can set `seriesIds` to show only spe
 
 Setting `label` on a series will display a label to the side of the scrubber beacon, and
 setting `label` on Scrubber displays a label above the scrubber line.
+In `layout="horizontal"`, beacon labels are intentionally hidden to avoid overlap with scrubber beacons.
 
 ```jsx live
 <LineChart
@@ -724,6 +725,188 @@ function PercentageBeaconLabels() {
 }
 ```
 
+#### Multi Line Beacon Label
+
+You can use a custom `BeaconLabelComponent` to render each beacon label as two lines (team name + percentage).
+
+```jsx live
+function MatchupBeaconLabels() {
+  const matchupBlueData = [
+    47, 50, 51, 52, 53, 53, 53, 53, 52, 51, 51, 52, 53, 55, 57, 58, 59, 61, 63, 65, 64, 64, 64, 64,
+    64, 63, 63, 63, 64, 66, 68, 70, 71, 72, 74, 76, 76, 75, 74, 73, 74, 75, 75, 78,
+  ];
+  const matchupRedData = matchupBlueData.map((value) => 100 - value);
+  const matchupTeamLabels = {
+    blue: 'BLUE',
+    red: 'RED',
+  };
+
+  const TeamBeaconLabel = memo(
+    ({
+      color = 'var(--color-fgPrimary)',
+      teamLabel,
+      percentageLabel,
+      transition,
+      x,
+      y,
+      dx,
+      horizontalAlignment,
+      onDimensionsChange,
+      ...chartTextProps
+    }) => {
+      const teamLabelDimensionsRef = useRef(null);
+      const percentageLabelDimensionsRef = useRef(null);
+
+      const emitCombinedDimensions = useCallback(() => {
+        if (!onDimensionsChange) {
+          return;
+        }
+
+        const teamRect = teamLabelDimensionsRef.current;
+        const percentageRect = percentageLabelDimensionsRef.current;
+
+        if (!teamRect || !percentageRect) {
+          return;
+        }
+
+        const minX = Math.min(teamRect.x, percentageRect.x);
+        const minY = Math.min(teamRect.y, percentageRect.y);
+        const maxX = Math.max(teamRect.x + teamRect.width, percentageRect.x + percentageRect.width);
+        const maxY = Math.max(
+          teamRect.y + teamRect.height,
+          percentageRect.y + percentageRect.height,
+        );
+
+        onDimensionsChange({
+          x: minX,
+          y: minY,
+          width: maxX - minX,
+          height: maxY - minY,
+        });
+      }, [onDimensionsChange]);
+
+      const handleTeamLabelDimensionsChange = useCallback(
+        (rect) => {
+          teamLabelDimensionsRef.current = rect;
+          emitCombinedDimensions();
+        },
+        [emitCombinedDimensions],
+      );
+
+      const handlePercentageLabelDimensionsChange = useCallback(
+        (rect) => {
+          percentageLabelDimensionsRef.current = rect;
+          emitCombinedDimensions();
+        },
+        [emitCombinedDimensions],
+      );
+
+      return (
+        <m.g animate={{ y }} initial={false} transition={transition}>
+          <ChartText
+            disableRepositioning
+            color={color}
+            dx={dx}
+            font="legal"
+            horizontalAlignment={horizontalAlignment}
+            onDimensionsChange={handleTeamLabelDimensionsChange}
+            verticalAlignment="bottom"
+            x={x}
+            y={transition ? 0 : y}
+            {...chartTextProps}
+          >
+            {teamLabel}
+          </ChartText>
+          <ChartText
+            disableRepositioning
+            color={color}
+            dx={dx}
+            font="title3"
+            horizontalAlignment={horizontalAlignment}
+            onDimensionsChange={handlePercentageLabelDimensionsChange}
+            verticalAlignment="top"
+            x={x}
+            y={transition ? 0 : y}
+          >
+            {percentageLabel}
+          </ChartText>
+        </m.g>
+      );
+    },
+  );
+
+  const MatchupScrubberBeaconLabel = memo(({ seriesId, color, ...props }) => {
+    const { getSeriesData, dataLength } = useCartesianChartContext();
+    const { scrubberPosition } = useScrubberContext();
+
+    const seriesData = useMemo(
+      () => getLineData(getSeriesData(seriesId)),
+      [getSeriesData, seriesId],
+    );
+
+    const dataIndex = useMemo(() => {
+      return scrubberPosition ?? Math.max(0, dataLength - 1);
+    }, [scrubberPosition, dataLength]);
+
+    const teamLabel = matchupTeamLabels[seriesId] ?? String(seriesId).toUpperCase();
+
+    const value = useMemo(() => {
+      if (seriesData === undefined) {
+        return null;
+      }
+
+      return seriesData[dataIndex];
+    }, [dataIndex, seriesData]);
+
+    return (
+      <TeamBeaconLabel
+        {...props}
+        color={color}
+        percentageLabel={`${value ?? 0}%`}
+        seriesId={seriesId}
+        teamLabel={teamLabel}
+      />
+    );
+  });
+
+  return (
+    <LineChart
+      enableScrubbing
+      showArea
+      areaType="dotted"
+      height={250}
+      series={[
+        {
+          id: 'blue',
+          data: matchupBlueData,
+          color: 'rgb(var(--blue50))',
+          label: 'BLUE',
+        },
+        {
+          id: 'red',
+          data: matchupRedData,
+          color: 'rgb(var(--red50))',
+          label: 'RED',
+        },
+      ]}
+      xAxis={{
+        range: ({ min, max }) => ({ min, max: max - 64 }),
+      }}
+      yAxis={{
+        domain: { min: 0, max: 100 },
+      }}
+    >
+      <Scrubber
+        idlePulse
+        BeaconLabelComponent={MatchupScrubberBeaconLabel}
+        beaconLabelHorizontalOffset={16}
+        beaconLabelPreferredSide="right"
+      />
+    </LineChart>
+  );
+}
+```
+
 ## Props
 
 | Prop | Type | Required | Default | Description |
@@ -740,7 +923,7 @@ function PercentageBeaconLabels() {
 | `beaconStroke` | `string` | No | `'var(--color-bg)'` | Stroke color of the scrubber beacon circle. |
 | `beaconTransitions` | `{ enter?: Transition$1 \| null; update?: Transition$1 \| null \| undefined; pulse?: Transition$1 \| undefined; pulseRepeatDelay?: number \| undefined; } \| undefined` | No | `-` | Transition configuration for the scrubber beacon. |
 | `classNames` | `{ overlay?: string; beacon?: string \| undefined; line?: string \| undefined; label?: 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). |
+| `hideBeaconLabels` | `boolean` | No | `true in horizontal layout, false in vertical layout.` | 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. |
 | `idlePulse` | `boolean` | No | `-` | Pulse the beacons while at rest. |