From 4b08005d8e7ea1bc6a78ce35b220e239d8355db3 Mon Sep 17 00:00:00 2001 From: Darius Cepulis Date: Wed, 25 Feb 2026 14:54:51 -0600 Subject: [PATCH] chore(site): update Base UI from beta to stable release (#610) --- pnpm-lock.yaml | 41 +++++++++++++----------- site/CLAUDE.md | 2 +- site/package.json | 2 +- site/src/components/ImageRadioGroup.tsx | 4 +-- site/src/components/NavBar/MobileNav.tsx | 2 +- site/src/components/Search/Search.tsx | 2 +- site/src/components/Select.tsx | 18 +++-------- site/src/components/ToggleGroup.tsx | 4 +-- site/src/components/Tooltip.tsx | 2 +- 9 files changed, 36 insertions(+), 41 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 55158fa9..bc8defdf 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -429,9 +429,9 @@ importers: '@astrojs/sitemap': specifier: ^3.6.0 version: 3.6.0 - '@base-ui-components/react': - specifier: 1.0.0-beta.4 - version: 1.0.0-beta.4(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) + '@base-ui/react': + specifier: ^1.2.0 + version: 1.2.0(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) '@mux/mux-node': specifier: ^12.8.1 version: 12.8.1 @@ -833,6 +833,10 @@ packages: resolution: {integrity: sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==} engines: {node: '>=6.9.0'} + '@babel/runtime@7.28.6': + resolution: {integrity: sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==} + engines: {node: '>=6.9.0'} + '@babel/template@7.27.2': resolution: {integrity: sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==} engines: {node: '>=6.9.0'} @@ -861,10 +865,9 @@ packages: resolution: {integrity: sha512-ubmJ6TShyaD69VE9DQrlXcdkvJbmwWPB8qYj0H2kaJi29O7vJT9ajSdBd2W8CG34pwL9pYA74fi7RHC1qbLoVQ==} engines: {node: ^20.19.0 || >=22.12.0} - '@base-ui-components/react@1.0.0-beta.4': - resolution: {integrity: sha512-sPYKj26gbFHD2ZsrMYqQshXnMuomBodzPn+d0dDxWieTj232XCQ9QGt9fU9l5SDGC9hi8s24lDlg9FXPSI7T8A==} + '@base-ui/react@1.2.0': + resolution: {integrity: sha512-O6aEQHcm+QyGTFY28xuwRD3SEJGZOBDpyjN2WvpfWYFVhg+3zfXPysAILqtM0C1kWC82MccOE/v1j+GHXE4qIw==} engines: {node: '>=14.0.0'} - deprecated: Package was renamed to @base-ui/react peerDependencies: '@types/react': ^17 || ^18 || ^19 react: ^17 || ^18 || ^19 @@ -873,9 +876,8 @@ packages: '@types/react': optional: true - '@base-ui-components/utils@0.1.2': - resolution: {integrity: sha512-aEitDGpMsYO2qnSpYOwZNykn9Rzn2ioyEVk2fyDRH7t+TIHVKpp9CeV7SPTq43M9mMSDxQ+7UeZJVkrj2dCVIQ==} - deprecated: Package was renamed to @base-ui/utils + '@base-ui/utils@0.2.5': + resolution: {integrity: sha512-oYC7w0gp76RI5MxprlGLV0wze0SErZaRl3AAkeP3OnNB/UBMb6RqNf6ZSIlxOc9Qp68Ab3C2VOcJQyRs7Xc7Vw==} peerDependencies: '@types/react': ^17 || ^18 || ^19 react: ^17 || ^18 || ^19 @@ -6525,8 +6527,8 @@ packages: resolution: {integrity: sha512-ulAk51I9UVUyJgxlv9M6lFot2WP3e7t8Kz9+IS6D4rVba1tR9kON+Ey69f+1R4Q8cd45Lod6a4IcJIxnzGc/zA==} engines: {node: '>=18'} - tabbable@6.3.0: - resolution: {integrity: sha512-EIHvdY5bPLuWForiR/AN2Bxngzpuwn1is4asboytXtpTgsArc+WmSJKVLlhdh71u7jFcryDqB2A8lQvj78MkyQ==} + tabbable@6.4.0: + resolution: {integrity: sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg==} tailwind-merge@3.4.0: resolution: {integrity: sha512-uSaO4gnW+b3Y2aWoWfFpX62vn2sR3skfhbjsEnaBI81WD1wBLlHZe5sWf0AqjksNdYTbGBEd0UasQMT3SNV15g==} @@ -7892,6 +7894,8 @@ snapshots: '@babel/runtime@7.28.4': {} + '@babel/runtime@7.28.6': {} + '@babel/template@7.27.2': dependencies: '@babel/code-frame': 7.27.1 @@ -7943,23 +7947,22 @@ snapshots: '@babel/helper-string-parser': 8.0.0-rc.1 '@babel/helper-validator-identifier': 8.0.0-rc.1 - '@base-ui-components/react@1.0.0-beta.4(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)': + '@base-ui/react@1.2.0(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)': dependencies: - '@babel/runtime': 7.28.4 - '@base-ui-components/utils': 0.1.2(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) + '@babel/runtime': 7.28.6 + '@base-ui/utils': 0.2.5(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) '@floating-ui/react-dom': 2.1.6(react-dom@19.2.3(react@19.2.3))(react@19.2.3) '@floating-ui/utils': 0.2.10 react: 19.2.3 react-dom: 19.2.3(react@19.2.3) - reselect: 5.1.1 - tabbable: 6.3.0 + tabbable: 6.4.0 use-sync-external-store: 1.6.0(react@19.2.3) optionalDependencies: '@types/react': 19.2.7 - '@base-ui-components/utils@0.1.2(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)': + '@base-ui/utils@0.2.5(@types/react@19.2.7)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)': dependencies: - '@babel/runtime': 7.28.4 + '@babel/runtime': 7.28.6 '@floating-ui/utils': 0.2.10 react: 19.2.3 react-dom: 19.2.3(react@19.2.3) @@ -14247,7 +14250,7 @@ snapshots: system-architecture@0.1.0: {} - tabbable@6.3.0: {} + tabbable@6.4.0: {} tailwind-merge@3.4.0: {} diff --git a/site/CLAUDE.md b/site/CLAUDE.md index be79088f..6a39b229 100644 --- a/site/CLAUDE.md +++ b/site/CLAUDE.md @@ -546,7 +546,7 @@ vi.mock('@/types/docs', async () => { - **[React Compiler](https://react.dev/learn/react-compiler)**: Enabled via `babel-plugin-react-compiler` targeting React 19 - **[Tailwind v4](https://tailwindcss.com)**: CSS utility classes via `@tailwindcss/vite` - **[Nanostores 1.0.1](https://github.com/nanostores/nanostores)**: Cross-island state -- **[Base UI 1.0.0-beta.4](https://base-ui.com)**: Headless accessible components +- **[Base UI 1.2.0](https://base-ui.com)**: Headless accessible components - **[Pagefind 1.4.0](https://pagefind.app)**: Static search with build-time indexing - **[Shiki 3.13.0](https://shiki.style)**: Syntax highlighting - **[Vitest 3.2.4](https://vitest.dev)**: Testing framework diff --git a/site/package.json b/site/package.json index 1413639a..08ec9e46 100644 --- a/site/package.json +++ b/site/package.json @@ -20,7 +20,7 @@ "@astrojs/react": "^4.4.0", "@astrojs/rss": "^4.0.12", "@astrojs/sitemap": "^3.6.0", - "@base-ui-components/react": "1.0.0-beta.4", + "@base-ui/react": "^1.2.0", "@mux/mux-node": "^12.8.1", "@mux/mux-uploader-react": "^1.4.1", "@nanostores/react": "^1.0.0", diff --git a/site/src/components/ImageRadioGroup.tsx b/site/src/components/ImageRadioGroup.tsx index 9c030782..45c5d5e2 100644 --- a/site/src/components/ImageRadioGroup.tsx +++ b/site/src/components/ImageRadioGroup.tsx @@ -1,5 +1,5 @@ -import { Radio } from '@base-ui-components/react/radio'; -import { RadioGroup } from '@base-ui-components/react/radio-group'; +import { Radio } from '@base-ui/react/radio'; +import { RadioGroup } from '@base-ui/react/radio-group'; import clsx from 'clsx'; import type { ReactNode } from 'react'; import { twMerge } from 'tailwind-merge'; diff --git a/site/src/components/NavBar/MobileNav.tsx b/site/src/components/NavBar/MobileNav.tsx index 9718f63a..78ed7768 100644 --- a/site/src/components/NavBar/MobileNav.tsx +++ b/site/src/components/NavBar/MobileNav.tsx @@ -1,4 +1,4 @@ -import { Dialog } from '@base-ui-components/react/dialog'; +import { Dialog } from '@base-ui/react/dialog'; import clsx from 'clsx'; import { ArrowUpRight, Menu, X } from 'lucide-react'; import { DISCORD_INVITE_URL, GITHUB_REPO_URL } from '@/consts'; diff --git a/site/src/components/Search/Search.tsx b/site/src/components/Search/Search.tsx index 311792e8..6c58483b 100644 --- a/site/src/components/Search/Search.tsx +++ b/site/src/components/Search/Search.tsx @@ -1,4 +1,4 @@ -import { Dialog } from '@base-ui-components/react/dialog'; +import { Dialog } from '@base-ui/react/dialog'; import { useStore } from '@nanostores/react'; import { useEffect, useRef, useState } from 'react'; import { currentFramework, currentStyle } from '@/stores/preferences'; diff --git a/site/src/components/Select.tsx b/site/src/components/Select.tsx index 9418a4b5..7f8eb6dc 100644 --- a/site/src/components/Select.tsx +++ b/site/src/components/Select.tsx @@ -1,4 +1,4 @@ -import { Select as BaseSelect } from '@base-ui-components/react/select'; +import { Select as BaseSelect } from '@base-ui/react/select'; import clsx from 'clsx'; import { Check, ChevronDown } from 'lucide-react'; import { twMerge } from 'tailwind-merge'; @@ -31,7 +31,7 @@ export function Select({ ({ - + {options.map((option) => (