## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Chore / dependency tooling update.
## What is the current behavior?
The repo is pinned to pnpm 10.24.0. Closes
https://linear.app/supabase/issue/FE-3673/migrate-the-repo-to-use-pnpm-v11.
## What is the new behavior?
The repo is pinned to pnpm 11.13.1, pnpm v11 workspace settings are
migrated to `allowBuilds`, and the Studio Dockerfile installs pnpm
11.13.1.
## Additional context
Validated with `CI=true mise exec node@22 -- pnpm install
--frozen-lockfile`, `mise exec node@22 -- pnpm run typecheck`, and `mise
exec node@22 -- pnpm run lint`; full Prettier check still fails on
existing generated docs/router files outside this migration.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Updated tooling requirements (pnpm **11.13.1**, Node **>=22.13**) and
aligned container build tooling accordingly.
* Adjusted package manager behavior (scoped registry override, update
notifications disabled) and workspace build/engine validation settings.
* **Maintenance**
* Updated `clean` scripts across apps/packages to remove only
build/cache artifacts (no longer delete installed dependencies).
* Reduced Turbo `clean` task output to **errors-only** for cleaner logs.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
A11y fix for keyboard focus (esp. Safari), plus a lint rule to keep it
from regressing.
## What is the current behavior?
`Button` already defaults an explicit `tabIndex={0}` (#40458). Other
interactive primitives (Checkbox, bare triggers, etc.) still skip Tab
focus in Safari unless macOS Keyboard navigation is on. Raw `<button>`
call sites have no guardrail.
## What is the new behavior?
- Same explicit `tabIndex` default baked into Checkbox, Accordion
Trigger, Collapsible Trigger, Dropdown Menu / Popover / Dialog / Sheet /
Alert Dialog triggers, Table Head Sort, Command reset, sidebar actions,
and shadcn Button
- `supabase/require-explicit-tabindex` ESLint rule, ratcheted in Studio
(82 existing violations)
- Design-system accessibility docs list which primitives bake this in
Resolves [DEPR-621](https://linear.app/supabase/issue/DEPR-621)
## Additional context
### To test
Use **Safari** with macOS Keyboard navigation **off** (the default).
Chrome once for a sanity pass.
**Storage → Files bucket (list view) — Checkbox**
1. Open an empty folder (or one with only folders). Header “select all”
Checkbox is disabled and skipped by Tab — expected (`columnFiles.length
=== 0`).
2. Upload a file (e.g. an image). Header Checkbox enables.
3. Tab to it and toggle with Space. Row Checkboxes should also be
Tab-reachable.
**Storage → Analytics bucket → bucket details — Accordion Trigger**
On an Analytics bucket with no tables yet, Tab to the “Create your first
table via PyIceberg” Accordion Triggers and open/close with Enter/Space.
**Elsewhere (light smoke)**
- Bare Dropdown / Popover / Collapsible triggers still Tab + activate
- `*Trigger asChild><Button>` (Sheets, Dialogs, menus) still one Tab
stop; open/close fine
- Disabled controls stay out of the Tab order
### Later
Chip-away of the 82 raw Studio buttons (and remove exceptions from
rule). Prefer migrating those to `Button` from `ui` later.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Accessibility Improvements**
* Improved keyboard focus behavior across common interactive controls
(buttons, dialog/popover/dropdown/sheet triggers,
accordions/collapsibles, checkboxes, and sidebar actions).
* Disabled controls now default to `tabIndex={-1}`, while enabled
controls default to `tabIndex={0}`.
* Added explicit `tabIndex` handling for command reset and table sort
header controls.
* **New Features**
* Added a shared `getExplicitTabIndex` utility used by UI components to
standardize focus behavior.
* **Documentation**
* Updated accessibility guidance to clarify which components include
built-in focus/tabIndex handling and which require manual setup.
* **Developer Experience**
* Added an ESLint rule to enforce explicit `tabIndex` on raw button-like
elements, with corresponding baseline updates.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
UI polish / bug fix for the shared Calendar range selection and Logs
date picker.
## What is the current behavior?
- Selected date ranges use opaque `brand-400` / `brand-500` fills that
read too loud in light mode, with black text that is hard to read on
darker endpoints.
- Start/end days are squared off on the connecting edge without
intentional outer rounding.
- Outside days in a selected range are dimmed with `opacity-50`, which
can tint the range wash incorrectly when a range starts in the prior
month.
- The large-range warning in `LogsDatePicker` is a full-bleed yellow
banner that feels too heavy for the popover.
- Time inputs show a clock icon that adds visual noise.
## What is the new behavior?
- Range middle uses a softer `brand-200` wash; start/end stay on
stronger brand fills with readable foreground text.
- Start days round on the left (`rounded-l-md`), end days on the right
(`rounded-r-md`); day hover keeps `rounded-md`.
- Selected outside days and “today” no longer fight the range wash
colours.
- Large-range warning is quiet inline `text-warning` copy that wraps to
the calendar column width.
- Clock icon removed from `TimeSplitInput`.
| Before | After |
| --- | --- |
| <img width="1096" height="1076" alt="CleanShot 2026-07-16 at 17 59
21@2x"
src="https://github.com/user-attachments/assets/eac38022-ed92-4dbe-9932-55f7bf0af934"
/> | <img width="988" height="1064" alt="CleanShot 2026-07-16 at 17 59
34@2x"
src="https://github.com/user-attachments/assets/3dce30dd-9fd8-4da4-82b3-5663250a4ddc"
/> |
## Additional context
Shared `Calendar` changes apply anywhere range mode is used, not only
logs.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **Style**
- Refined the date-picker popover layout for start/end controls with
better fit and max-width handling.
- Updated calendar day and range visuals (selection, outside states,
rounding, and hover behavior) to reduce “ghost” styling and improve
consistency.
- Restyled the large-range warning to improve spacing and alignment.
- Simplified the time-splitting input UI by removing the leading clock
icon.
- Adjusted the “Copy range” button feedback color for copied/pasted
states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Bug fix
## What is the current behavior?
The "Join us on Discord" buttons are broken in two places:
- **Studio support sidebar** (`HelpPanel`): on light mode the button
background is not white, so the intended white button with purple icon
and text is broken.
- **www `/support` page** (shared `secondary` button variant): the text
disappears on hover, and the Discord icon is never rendered (always
invisible). Both issues occur on light and dark mode.
## What is the new behavior?
- **Studio support sidebar**: force a white background on all colour
schemes via `bg-white hover:bg-white/90`, matching the existing pattern
in `DiscordCTACard`. The purple icon and text now render correctly on
light mode.
- **Shared `secondary` button variant** (`packages/ui`):
- The icon container used `text-border-muted`, which blended into the
`bg-foreground` button, so the icon was invisible. Changed to
`text-background` to match the button's text colour.
- The hover state used `text-border-stronger`, which had no contrast
against the background, so text disappeared on hover. Changed to
`text-background/80`.
- Removed the ineffective `fill="var(--background-default)"` from
`IconDiscord` on the `/support` page — the SVG path uses `currentColor`,
so the fill prop had no effect.
These `secondary` variant fixes apply globally, so other secondary
buttons benefit too.
| Before | After |
| --- | --- |
| <img width="868" height="642" alt="CleanShot 2026-07-07 at 15 39
42@2x"
src="https://github.com/user-attachments/assets/6897b6ba-311e-43c7-bb5a-7b70017a54cc"
/> | <img width="906" height="610" alt="CleanShot 2026-07-07 at 16 21
31@2x"
src="https://github.com/user-attachments/assets/16104cf0-8ed1-4857-8467-532c1f7fdb5f"
/> |
| <img width="636" height="620" alt="CleanShot 2026-07-07 at 15 24
53@2x"
src="https://github.com/user-attachments/assets/75f55f6c-eaa7-45ee-94fe-eac513126eff"
/> | <img width="656" height="404" alt="CleanShot 2026-07-07 at 16 24
23@2x"
src="https://github.com/user-attachments/assets/35649b23-fcdd-42fd-8140-e4aaf394667e"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Summary by CodeRabbit
* **Style**
* Refreshed secondary button styling for a more consistent look,
including updated hover and loading text/icon colors.
* Improved the “Join us on Discord” button’s background and hover
appearance.
* Simplified the Discord card’s icon rendering to rely on the default
icon styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Bug fix
## What is the current behavior?
After the colour system migration, `Badge` success and warning variants
use semantic `text-brand` / `text-warning` (and soft `border-brand` /
`border-warning` tokens). In light mode those fills sit around mid–high
lightness, so the badges look flat and the text is hard to read.
Call sites that never migrated — e.g. Compute badges (`SMALL`) and table
constraint tokens (`PRIMARY`) — still use the darker scale tokens and
look fine.
## What is the new behavior?
Success and warning badges again use the darker scale tokens, matching
those working call sites:
- success: `text-brand-600` + `border-brand-500`
- warning: `text-warning-600` + `border-warning-500`
| Before | After |
| --- | --- |
| <img width="791" height="288" alt="Tables Database Chisel Toolshed
Supabase"
src="https://github.com/user-attachments/assets/99659555-bf78-42d7-af93-415cdc8e858c"
/> | <img width="791" height="288" alt="82859"
src="https://github.com/user-attachments/assets/368d4a8e-d7cf-4bf6-b896-89f29eca982d"
/> |
## To test
On the staging preview in **light mode**:
- Any `Badge variant="success"` — e.g. “New”, “Enabled”, “Healthy”,
branch badges
- Any `Badge variant="warning"` — e.g. beta / warning status badges
- Compare with Compute size badges and Database → Tables → Columns →
Constraints (`PRIMARY`) — contrast should now feel similar
Spot-check **dark mode** to confirm badges still look correct.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated warning and success badges with refined text and border colors
for improved visual consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Bug fix + small shared component
## What is the current behavior?
After the recent colour system changes, several UI elements lost
contrast in light mode:
- `InfoIcon` with a background appeared as a flat grey circle (glyph
fill matched the background)
- Several buttons forced `text-white`, which no longer contrasts
correctly against the updated brand fills
- Selected / completed check badges were inconsistent between call sites
## What is the new behavior?
- `InfoIcon` uses `text-background` for the glyph fill so the "i" is
visible against the grey circle
- www primary buttons drop hardcoded `text-white` and use standard
`Button` colours
- New shared `SuccessCheck` in `ui` for selected state and completion
progress (green circle; white check in light mode, black check in dark
mode)
- Documented in the design system with selected + progress examples
Note on `InfoIcon`:
[#47933](https://github.com/supabase/supabase/pull/47933) landed a
related fix using `text-background-200` (`--card`). This PR keeps
`text-background` instead, to match `CheckIcon` / `EyeOffIcon` in the
same file and avoid the legacy alias.
| Before | After |
| --- | --- |
| <img width="688" height="268" alt="CleanShot 2026-07-10 at 11 30
25@2x"
src="https://github.com/user-attachments/assets/c0276b0c-1023-46c8-805c-35a22def1353"
/> | <img width="664" height="278" alt="CleanShot 2026-07-10 at 11 29
43@2x"
src="https://github.com/user-attachments/assets/3508cf37-1b48-4fb7-a939-83522feb44f1"
/> |
| <img width="468" height="550" alt="CleanShot 2026-07-10 at 11 31
04@2x"
src="https://github.com/user-attachments/assets/acd42273-15ce-4fb2-9d0c-5a43ac23073c"
/> | <img width="460" height="540" alt="CleanShot 2026-07-10 at 11 32
50@2x"
src="https://github.com/user-attachments/assets/f66fb4bc-81f7-4df1-95f5-63980c4e8537"
/> |
## To test
Use the staging preview link from this PR and check the following in
**light mode** (and spot-check dark mode):
**www**
- Visit `/404` — "Head back" button should have readable text (not
white-on-green)
- Visit `/company` — "Join the team" button in the Team section
- Visit a product page with a hero CTA (e.g. `/database`, `/realtime`) —
primary "Start for free" button
**studio**
- Database → Replication → deploy a read replica — footer `InfoIcon`
next to the pricing line should show a visible "i" inside the grey
circle
- `/redeem` — select an org; green `SuccessCheck` should match
light/dark contrast (white check / black check)
- Settings → API → service role key row — red "secret" tag text should
be readable
**design system**
- `/docs/components/success-check` — demo, selected-state, and progress
examples
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Class name was bodged on `InfoIcon`. It was
`text-background-surface-200`, think after recent update it should be
`text-background-200`.
| Before | After |
|--------|--------|
| <img width="371" height="67" alt="Screenshot 2026-07-14 at 16 46 42"
src="https://github.com/user-attachments/assets/813ef5c8-98d1-4889-99b3-8bd885a48139"
/> | <img width="366" height="64" alt="Screenshot 2026-07-14 at 16 47
53"
src="https://github.com/user-attachments/assets/e76c120a-70c8-451a-a7a9-48814978cfd3"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated the Info icon’s background-visible styling to use the correct
background color for improved visual consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Part of some minor improvements to the AI Assistant - this one's about
adding some keyboard shortcuts
## Changes involved
- Added keyboard shortcut for "New chat"
<img width="212" height="96" alt="image"
src="https://github.com/user-attachments/assets/e9c3bd63-adbc-4b05-8c52-1baed67e365a"
/>
- Also added a small animation for the "How can I assist you?" text for
visual indication when moving between chats that might not have a
conversation yet
- Added keyboard shortcut for "Permission settings"
<img width="236" height="86" alt="image"
src="https://github.com/user-attachments/assets/337da009-5979-4910-9292-73cc4d7f7cce"
/>
- Show keyboard shortcut for "Close Assistant"
<img width="165" height="88" alt="image"
src="https://github.com/user-attachments/assets/b45a4f5a-8e12-45f1-8fdb-a18c0deedb02"
/>
- Fix `ExpandingTextArea` height calculation logic issue
- If you open and close the Assistant panel a number of times, the
height of the input field isn't consistent, so this fixes that
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Summary by CodeRabbit
- **New Features**
- Added keyboard shortcuts for starting a new AI Assistant chat and
opening permission settings.
- Header actions now display shortcut hints and support keyboard access.
- **Improvements**
- Enhanced accessibility with labels for chat edit controls (save,
cancel, edit, delete).
- Chat onboarding now remounts when switching active chats.
- Improved chat popover alignment.
- Escape now blurs the message input; textarea resizing is more reliable
during content/layout changes.
- **Bug Fixes**
- Updated onboarding loading behavior based on the lints loading state.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What
Fixes misaligned day cells in the PITR calendar widget for the first
week of the month.
## Why
The PITR calendar draws a \`border\` on each day cell via
\`classNames.day\`. The day \`<td>\` has no explicit width, so
\`box-sizing: border-box\` doesn't apply and the 1px borders add to its
size (36px → 38px), while the weekday header cells stay pinned at
\`w-9\` (36px). Bordered day cells therefore drift right of their
headers, which is most visible in the first partial week where
unbordered leading cells sit flush next to the wider bordered ones.
## How
Pin each day cell to a fixed \`w-9 box-border\` so the border is drawn
inside the 36px box, and let the day button fill the cell (\`w-full\`).
Column pitch now matches the weekday headers regardless of border state.
Class-only change, no logic touched.
Closes FE-3886
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Improved calendar day cell sizing and layout for more consistent
rendering.
* Ensured day buttons use full-width styling where applicable, while
preserving existing hover, border, background, and corner behavior.
* **Documentation**
* Added documentation for “Calendar with disabled days,” including a new
interactive preview.
* **New Features**
* Introduced a calendar example demonstrating disabled-day behavior with
mid-week month start and restricted date selection.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Upgrades the monorepo to TypeScript 7.0.2, released 2026-07-08. `tsc` is
now the native Go compiler
([announcement](https://devblogs.microsoft.com/typescript/announcing-typescript-7-0/))
— full turbo typecheck drops from ~56s to ~19s locally.
TS 7.0 ships **without a programmatic API** (it lands in 7.1), so this
uses Microsoft's recommended side-by-side setup: the `typescript` name
resolves to `@typescript/typescript6` (the 6.0 API republished) for API
consumers — typescript-eslint and Next.js build typechecking — while
`@typescript/native` (the real `typescript@7.0.2`) owns the `tsc` bin
that typecheck scripts run. Exactly one version of each is in the
lockfile; nothing imports the native package as a library. When 7.1 +
tool support lands we can collapse back to a single `typescript` dep in
the catalog.
**Changed:**
- `pnpm-workspace.yaml`: catalog aliases for `typescript` /
`@typescript/native`
- 17 package.json files: `@typescript/native` added beside each
`typescript` dep so every package's `tsc` is the native binary
- `apps/studio/tsconfig.json`: exclude `dist/` (gitignored build output)
from typechecking
**Fixed** (real type errors TS 6 under-reported):
- `packages/ui-patterns` CodeBlock: `borderLeft: null` → `undefined`
(`CSSProperties` doesn't accept null)
- `apps/www` CodeBlock: removed a JSX `@ts-ignore` comment that tsgo
doesn't honor and fixed what it masked (untyped `.js` theme objects,
possibly-undefined highlighter children)
⚠️ **Merge timing:** the new packages are inside pnpm's 3-day
`minimumReleaseAge` window until ~July 11. Installs from the committed
lockfile are unaffected (resolution is skipped), but anything that
forces a re-resolution before then will fail — hold off merging until
the window passes.
Note for editors: the compat package has no `lib/tsserver.js`, so VS
Code's "Use Workspace Version" won't work — use the bundled TS or the
TypeScript Native Preview extension.
## To test
- `pnpm install && pnpm typecheck` — all 15 tasks green, and
`./node_modules/.bin/tsc --version` prints 7.0.2
- `pnpm lint --filter=studio` — typescript-eslint still parses (resolves
the 6.0 API)
- `pnpm build --filter=design-system` (or any Next app) — Next's
tsconfig validation and build typecheck still work
- CodeBlock rendering on www (syntax highlighting, line highlights
with/without border) — the two fixes are behavior-neutral but worth an
eyeball
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Improvements / New Features**
* Enhanced TypeScript tooling support across the workspace for smoother
development builds and checks.
* **Bug Fixes**
* Code blocks render more reliably when content is empty or missing.
* Highlighted code line styling applies more consistently.
* **Maintenance**
* Studio TypeScript builds now avoid including generated output (such as
`dist`) during compilation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## Context
More action button should be flushed to the right here
<img width="294" height="156" alt="image"
src="https://github.com/user-attachments/assets/65017960-3edb-4268-bb0e-1e2c26937d4b"
/>
## Changes involved
- Adjust `Menu.Item` in `packages/ui` to use a `div` instead of a `span`
- Was otherwise causing HTML validation issues as we were trying to nest
a `div` within a `span`
- Having a `div` is a bit more flexible as well since `Menu.Item`
expects `children` to be of any type (e.g a react node)
<img width="279" height="149" alt="image"
src="https://github.com/user-attachments/assets/12730cef-b077-4ef4-93c9-c21def939888"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized the Observability menu component to use named exports,
ensuring consistent usage across the app.
* Updated the mobile observability menu registration to reference the
correct exported component.
* **Style**
* Refined Observability menu item layout, spacing, truncation, and
dropdown sizing for a cleaner presentation.
* Enhanced menu item rendering to allow custom `className` styling and
full-width content layout.
* **Accessibility**
* Added an aria-label to the “more actions” button for improved screen
reader support.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Adjusts light theme for better contrast on foreground, muted-foreground
and tertiary-foreground text
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Retuned the light theme’s surface chroma and updated light, muted, and
tertiary foreground levels for improved readability.
* Updated the brand link color saturation to better align with the
revised theme.
* Refreshed code block token colors for both light and dark themes.
* **Documentation**
* Updated the “Edit this page on GitHub” link styling to use updated
token-based text colors for default and hover states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Adjusts surface value for light theme
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined the light theme’s color tuning (including a small adjustment
to chroma) and retuned the canvas surface tone.
* Updated code block light-theme styling so string literal token colors
are now `#c46a0a` (applied consistently across the design system, docs,
learning, and UI library).
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The buttons on the organization home page that allow to switch between
list and grid views are not accessible.
## Solution
Add screen readers only text to these buttons.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Summary of changes
* **Bug Fixes / Improvements**
* Improved accessibility for project view toggle controls and the
clear-search action.
* Added an explicit accessible label to the clear button.
* Added screen-reader text and tooltips to better communicate grid vs.
list view.
* **Other**
* Improved error handling robustness when updating report snippet
visibility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Now that we migrated all usages of the deprecated `Tabs` component, we
don't need the `_Shadcn_` suffix anymore.
## Solution
Remove `_Shadcn_` suffix from `ui` tabs components. That's all this PR
does, no visual nor functional changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Standardized tab components across the app so pages and dialogs now
use the same consistent tab UI.
* Improved tab-based views in design, docs, studio, learn, and website
experiences for a more uniform interface.
* **Chores**
* Updated shared UI exports to expose tab components directly,
simplifying future usage across the product.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Now that `docs` is the only place where we use the deprecated `ui/Tabs`,
we can move this component and the related HOC from `ui-patterns` in
`docs`
## Solution
- Move `ui/Tabs`, `ui-patterns/ComplexTabs/withQueryParams` and
`ui-patterns/ComplexTabs/withSticky` to `docs`
- Refactor `ui-patterns/ComplexTabs/withQueryParams` and
`ui-patterns/ComplexTabs/withSticky` HOCs as hooks to make them easier
to understand
- Refactor `Tabs` accordingly
No visual nor functional changes.
## How to test
On
https://docs-git-chore-refactor-docs-tabs-supabase.vercel.app/docs/guides/auth/passwords
(Tabs are driven by URL and the flow tabs should have sticky headers
even though there's a CSS bug already reported)
- check that by default, the first tab in each tabs is active
- change the tabs in different groups and validate it works
- refresh the page and check that previously selected tabs are active
(URL based selection)
- In a new tab, visit
https://docs-git-chore-refactor-docs-tabs-supabase.vercel.app/docs/guides/auth/passwords
again and check that previously selected tabs are active (LocalStorage
based selection)
Do the same on
https://docs-git-chore-refactor-docs-tabs-supabase.vercel.app/docs/guides/database/database-advisors
(This one is driven by URL but does not have sticky tab headers)
Do the same on
https://docs-git-chore-refactor-docs-tabs-supabase.vercel.app/docs/guides/deployment/terraform/reference
(this one is not driven by URL nor has sticky tab headers)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Docs tabs now persist and restore the active tab via URL query
parameters.
* Added optional “sticky” tab behavior that keeps the active panel in
view.
* Enhanced keyboard interaction for selecting tabs.
* **Bug Fixes**
* Improved active-tab initialization and synchronization when the URL
query changes.
* **Chores**
* Refreshed the tabs UI implementation and styling to improve
consistency and remove deprecated tab exports from shared UI packages.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES/NO
## What kind of change does this PR introduce?
Bug fix, feature, docs update, ...
## What is the current behavior?
Please link any relevant issues here.
## What is the new behavior?
Feel free to include screenshots if it includes visual changes.
## Additional context
Add any other context or screenshots.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Refreshed theming across the UI to use modern color expressions and
shared theme variables (including OKLCH-based gradients), improving
consistency for charts, code blocks, overlays, icons, and decorative
backgrounds.
* **Bug Fixes**
* Improved light/dark color and gradient consistency across axis/grid
styling, reference lines, buttons/badges, sidebar accents, loaders, and
other visual components.
* **Documentation**
* Updated styling/theming guidance to align with the revised semantic
token system and the updated theme variable usage patterns.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
## Problem
- We still use/maintain the legacy theming even though we moved to
Shadcn
- We have two themes list with similar code
## Solution
- Migrate some components to `cva` and `cn` instead of `styleHandler`
- Remove redundant `themes` in favor of `singleThemes`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Standardized theme selection across the app so theme menus
consistently offer the same light/dark/system options, including
dropdowns, navigation menus, and command menus.
* **Refactor**
* Refreshed styling for multiple shared UI components (menus, tabs, side
panels, loading indicators, icons, and modal dialogs) to improve
consistency while preserving visual behavior.
* **Chores**
* Improved the UI patterns CI “validate exports” check for clearer
failure output when exports change unexpectedly.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
UI polish.
## What is the current behavior?
Dropdown sub-menu triggers use symmetric padding and a heavier chevron.
## What is the new behavior?
Tighter right padding and a smaller, muted chevron.
| Before | After |
| --- | --- |
| <img width="1170" height="672" alt="CleanShot 2026-06-26 at 17 07
18@2x-4BDA3F92-78B4-45F4-B31E-897FF1FE537E"
src="https://github.com/user-attachments/assets/ade505c7-f4b0-4046-a728-c49ee93009d4"
/> | <img width="1168" height="672" alt="CleanShot 2026-06-26 at 17 06
33@2x-9A8992B6-C389-4698-BE19-7AEE3FB12A83"
src="https://github.com/user-attachments/assets/c1c9ba73-e059-45a1-82f3-5c268f060e2f"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved dropdown submenu trigger spacing and alignment for a cleaner,
more consistent menu layout.
* Updated the trailing chevron icon’s positioning and sizing to keep it
consistently aligned at the far right across states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
## Problem
There's still more unused code in the repository which slows down
everything:
- checkouts
- tooling
- probably builds (not sure how good turbopack is at handling this)
## Solution
- remove old unused code
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Cleaned up several UI building blocks and related styling, including
typography, menus, buttons, loading states, side panels, form layout,
input adornments, spinner, theme context, and mobile detection.
* Removed some previously available UI helpers and variants from the
public component set.
* **Style**
* Simplified or removed multiple CSS modules and visual rules across the
design system.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Closes DOCS-488
<img width="1266" height="353" alt="Screenshot 2026-06-26 at 11 02
57 AM"
src="https://github.com/user-attachments/assets/67b5d47b-249e-4e53-9230-2bbcb7f037b7"
/>
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## Problem
We have helpful documentation that delves into each observability
metric, but it is not easily findable in the moment it is needed while
viewing the dashboards.
## Solution
Solution includes:
- Add a docs link in Studio in every relevant place with the
`DocsButton` component
- Add aria-hidden on the `DocsButton` icon
- An added `constants.ts` to see all of the docs links in one place
- A contextual aria-label for the docs so that screenreader users know
where they're going
| Page | Docs link |
|------|-----------|
| Overview | `/guides/telemetry/reports` |
| Query Performance / Query Insights |
`/guides/platform/performance#examining-query-performance` |
| API Gateway | `/guides/telemetry/reports#api-gateway` |
| Database | `/guides/telemetry/reports#database` |
| Data API | `/guides/telemetry/reports#postgrest` |
| Auth | `/guides/telemetry/reports#auth` |
| Edge Functions | `/guides/telemetry/reports#edge-functions` |
| Storage | `/guides/telemetry/reports#storage` |
| Realtime | `/guides/realtime/reports` |
| Custom reports | `/guides/telemetry/reports#using-reports` |
Query Performance and Query Insights already had the button in their
custom headers. They now use the shared constants.
## Tophatting
1. Go to a project `/observability`.
2. Click into each of the panels and see a **Docs** link in the top
right.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added direct documentation links across observability report pages,
making it easier to open relevant help content from each view.
* Added clearer, page-specific labels for observability headers and docs
links.
* **Bug Fixes**
* Improved accessibility for icon buttons so icons are hidden from
assistive technologies while button labels remain clear.
* Adjusted report navigation layouts to keep controls aligned with the
new docs buttons.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Every inputs and textarea have been migrated to the new shadcn
components. This `Input` is no longer needed
## Solution
- Delete it
- Clean up the `defaultTheme` accordingly
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Breaking Changes**
* Removed the built-in Input component from the UI library, including
its attached TextArea export.
* Removed input styling support from the default theme (standard/error
variants and related icon/action/textarea spacing).
* Cleared the Input module styles, so prior textarea action UI styling
is no longer available.
* Removed the Reports filtering UI in Studio (including the popover
component and the associated report-filter hook), which may affect
report filtering screens.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `alternative` variant for `<Button>` has been deprecated but is
still used in a few places.
## Solution
- Migrate usages to the recommended `primary` variant
- Delete the `alternative` variant
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated several buttons across forms, logs, recent queries, and
release headers to use the primary visual style.
* Button styling is now more consistent throughout the app, with a
cleaner default emphasis for key actions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
**Stack 1/6** of the TanStack Start migration (#46424), split into
reviewable, independently-mergeable PRs.
> [!IMPORTANT]
> **Next stays the default and only active framework after this PR.**
This wires up the Vite/TanStack-Start build pipeline behind the
`STUDIO_FRAMEWORK` flag, but there are no TanStack routes yet — so the
TanStack build isn't functional or tested until later PRs in the stack.
Nothing about the Next build, dev, or deploy changes behaviourally here.
## What's in this PR
- **Dispatch:** `dev`/`build`/`start` now go through
`scripts/dispatch.js`, which runs the Next variant unless
`STUDIO_FRAMEWORK=tanstack`. The original commands are preserved as
`dev:next`/`build:next`/`start:next`.
- **Build pipeline:** `vite.config.ts`, `serve.js`, `smoke-server.mjs`,
vite/tanstack deps, `turbo.jsonc`.
- **`tsconfig.json`:** `jsx: react-jsx`, `moduleResolution: Bundler`,
`target: ES2022`. Because `include` is `**/*.ts(x)`, this re-typechecks
the whole app, so the companion adaptations below land with it.
- **Shared adaptations (companions to the tsconfig change):**
`BufferSource` casts, `packages/ui` unused-`React` import removals, etc.
- **Routing/middleware plumbing:** `next.config.ts` +
`redirects.shared.ts` (redirect rules now shared with `vercel.ts`),
`proxy.ts`/`start.ts` middleware + `hosted-api-allowlist.ts`.
## Verification
Run locally off `master`: frozen install ✓, `studio` typecheck ✓, **Next
build ✓** (compiles + generates all routes), lint ratchet ✓ ("some rules
improved"), prettier ✓.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a hosted API endpoint allowlist to return 404 for non-supported
`/api/*` routes.
* Introduced a TanStack route-migration checklist and expanded TanStack
Start routing support.
* **Improvements**
* Enhanced deployment refresh/detection by tightening cookie handling
for “latest deployment” updates.
* Centralized redirect/maintenance-mode rules for consistent platform vs
self-hosted behavior.
* Improved production serving with a dedicated static + proxy server and
a post-build smoke test.
* **Dependencies**
* Updated TanStack-related packages and React Table/query tooling
versions.
* **Documentation / Chores**
* Updated formatting and tooling config; added shared build environment
parsing utilities.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Closes DOCS-974
<img width="891" height="328" alt="Screenshot 2026-06-22 at 3 11 13 PM"
src="https://github.com/user-attachments/assets/d7b49d56-cf77-4c1d-a933-7cbeab3168c2"
/>
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## Problem
From Linear:
Accordion usage in the docs is inconsistent and can render with double
lines instead of single lines.
The current docs contribution guidance appears to recommend wrapping
accordions with an extra div, which seems to be the cause of the extra
divider in some pages.
## Solution
This PR:
- Removes all wrapping `divs` to AccordionItems that adds an extra
border
- For a11y, adds a cursor pointer and a slight bg color change on hover
to make the clickable area more obvious
- For a11y, adds reduce-motion option for animation and `aria-hidden` on
the chevron
**Note:** It is good for a11y to have more than one hover-state
indicator. For example, color-change and an underline.
## Tophatting
To review changes on the preview environment:
1. Go to `/docs/guides/platform/backups` and
`/docs/guides/platform/migrating-to-supabase/auth0#frequently-asked-questions-faq`.
2. Expand accordion.
3. See nothing visually odd such as strange spacing or double borders.
**Note:** To be exhaustive in your review, view all affected URLs and
scan the docs for `border-b` to see if there are any stragglers.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Enhanced accordion components with improved hover state styling for
better visual feedback.
* **Refactor**
* Simplified accordion markup across documentation pages for cleaner,
more consistent layout and improved component nesting structure.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
We now use the Shadcn breadcrumb everywhere but we still have the old
breadcrumb code.
## Solution
- Remove the old breadcrumb code
- Fix import paths where needed
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Consolidated UI component imports across the codebase to use unified
package entrypoints.
* Removed legacy breadcrumb component implementation in favor of
standardized components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
All inputs don't have the same style when focused
## Solution
Consolidate focus states across inputs
## How to test
Checkout the design system form examples:
https://design-system-git-gildasgarcia-depr-354-consoli-0188d7-supabase.vercel.app/design-system/docs/ui-patterns/forms
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined focus-visible ring/outline and ring-offset tokens across
buttons, multi-select, radio groups, checkbox, select, and switch for a
more consistent accessible experience.
* Updated focus-state styling details within the shared Button and
related controls (including open-state outline behavior).
* **Refactor**
* Updated icon upload preview triggers in form examples to use the
shared Button component while preserving existing upload behavior and
visuals.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.
## Solution
- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code
## How to test
As this is just prop renaming, if it builds it's ok
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## Problem
On pages that needs to check conditions for which data is loaded
asynchronously, the navigation links in the sidebar appear disabled for
a split second:
<img width="1394" height="1636" alt="image"
src="https://github.com/user-attachments/assets/0681966d-676d-4c8c-8bd4-852dcf93ddb7"
/>
## Solution
Check whether the required data is loading and override the styles so
that the links are still disabled to avoid errors but appear as normal.
## How to test
- Open the project setting page
- Check the styles of the sidebar items carefully while it load (might
require to refresh a few times to be sure)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Release Notes
* **New Features**
* Navigation buttons, menu items, and settings menus now display loading
states while project data is being fetched, providing visual feedback
and preventing interaction during data loading operations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
There's certain areas in the dashboard where we're calling
`useTablesQuery` without a schema filter, in which case the dashboard
then fires a query against the project's database to fetch _all_ tables
across _all_ schemas - this could easily be a heavy query if there's a
large number of relations in the project's database.
Am hence opting to either add a schema filter if appropriate, or
otherwise opt to use the infinite loading behaviour
## Changes involved
- Add schema filter to `useTablesQuery` in database triggers and
publications
- Use infinite loading for tables in Cmd K for "Run query on table" and
"Search database tables"
## To test
- [x] Verify that database triggers + publications still function as
expected
- [x] Verify that CMD K "Run query on table" and "Search database
tables" still function as expected (including search)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Implemented debounced infinite-scrolling table search in the command
menu and SQL editor command flow.
* Added a schema selector dropdown to publications management for easier
navigation.
* **Improvements**
* Removed the “Schema” column from the publications tables UI.
* Updated search guidance and table-picker status (counts/loading)
during infinite browsing.
* Trigger table listings now follow the selected schema context.
* Refined command menu list height and improved the database-tables
placeholder text.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
We lost the button focus state design while migrating to tailwind v4
See https://supabase.com/design-system/docs/components/button and move
to each buttons with the _Tab_ key.
## Solution
Restore it.
## How to test
- Open
https://design-system-git-fix-button-focus-state-supabase.vercel.app/design-system/docs/components/button
- Move to each buttons with the _Tab_ key.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated Button component styling for improved layout, typography, and
transitions.
* Refined focus state and outline styling for better visual consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
When multiple toasts stack up, Sonner compresses background toasts. The
text content in these collapsed toasts was overflowing past the boundary
and leaking into the page layout. This adds
`data-[expanded=false]:overflow-hidden` to clip the overflowing text.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated toast notification styling to better handle content overflow
behavior when toasts are in a collapsed state.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
- Noticing our code we have many patterns of calling localstorage and
handling those errors
- We should add those in a single well tested file
- Handle those errors in the singleton which makes it easier for us to
debug customer issues. Logger is outputing local storage warnings for
feature we expose
- Side effect of this is random crashes on studio when local storage
isn't available or handled correctly
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Improved browser storage handling across the app for more reliable
persistence and graceful behavior in restricted or non-browser
environments (settings, previews, charts, tabs, sign-in/session flows,
integrations, and UI state).
* **New Features**
* Introduced a safe storage layer to standardize and harden
local/session persistence.
* **Tests**
* Added comprehensive tests covering the new safe storage behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Because we have controller inputs and zod validation on numbers, many of
them cannot be cleared correctly as deleting their value resets it to
`0`.
## Solution
Update the `Input` component to allow those editions by always storing
and displaying the user entered value
## How to test
- Open the webhook page and add/edit one
- Clear its timeout value and observe that it is not reset to `0`
- Same for:
- Database network restrictions
- API settings max rows
- Disk size modal
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized numeric form input handling across examples, settings,
and modals — inputs now rely on form bindings and schema coercion for
consistent parsing and simplified behavior.
* **Chores**
* Added form resolver utilities and a user-event testing library to
development dependencies.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Bug fix.
## What is the current behavior?
On pages where the table has horizontal overflow (e.g. Database Tables
with its 7 columns), `ShadowScrollArea` unconditionally applies
`!bg-surface-200` to `td:last-child` on row hover. Since `TableCell` has
`transition-colors`, this gives the last cell an explicit animated
background change — making it visually distinct from every other cell,
which simply inherit the row's hover bg transparently.
This manifests as the last cell appearing to have its own independent
hover state, separate from the row hover.
## What is the new behavior?
The `!bg-surface-200` override on `td:last-child` is moved inside the
`stickyLastColumn` block, since that's the only case where an explicit
background is actually needed (sticky cells require a solid bg to avoid
showing scrolled content behind them). Non-sticky tables no longer get
the spurious cell-level hover.
Also reverts the MoreVertical dropdown trigger in `TableList` back to
`type="default"` (undoes the workaround from #46247).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed hover styling behavior in horizontally scrollable tables to
apply only when appropriate.
* **Style**
* Updated the visual appearance of the row action dropdown button.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46251?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
## What kind of change does this PR introduce?
Feature, bug fix, and docs update. Addresses the AlertDialog async
action behaviour discussed in Slack and follow-up PR feedback.
## What is the current behavior?
`AlertDialogAction` delegates directly to Radix, so confirm actions
close the dialog immediately on click. Async mutation flows have to use
`asChild` with `event.preventDefault()` and a custom loading button to
keep the dialog open while work is in flight.
## What is the new behavior?
- `AlertDialogAction` now accepts async handlers and a controlled
`loading` prop. Promise-returning actions keep the dialog open, show the
existing Button loading state, disable cancel/dismissal while pending,
close on success, and stay open on rejection.
- Existing workaround usages in Studio have been migrated to the direct
action API (see 'To test' callsite list below)
- design-system docs now include async action examples and
`AlertDialogBody` guidance for inline feedback
https://github.com/user-attachments/assets/1af66410-e9f9-4231-9c6d-fe650bd717a4
## Additional context
- [ ] Once #45572 is rebased onto this change, `ResetTemplateDialog`
should use `AlertDialogAction loading={isResettingTemplate}` with a
promise-returning reset handler instead of a plain loading `Button` in
`AlertDialogFooter`.
## To test
- [x] On Studio API Keys settings, use a project with no publishable or
secret API keys, click the “Create API keys” banner action, and confirm
the Alert Dialog stays open with loading until the default publishable
and secret keys are created.
- [x] Delete a JIT database access rule and confirm the Alert Dialog
stays open with loading until deletion succeeds, and stays open with
inline feedback if it fails.
- [x] With temporary access disabled and existing rules configured,
enable temporary access and confirm the “This will activate existing
rules” Alert Dialog stays open with loading until the configuration
update succeeds, and stays open with inline feedback if it fails.
- [x] Disable external replication and confirm the Alert Dialog stays
open with loading until the mutation succeeds.
- [x] Enable Index Advisor and confirm the Alert Dialog stays open with
loading until the mutation succeeds, and stays open with inline feedback
if it fails.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Alert dialogs support async actions with built-in loading, dismissal
blocking while pending, and preserved dialog on error.
* Two interactive examples demonstrating async success and error flows.
* **Improvements**
* Dialogs now surface inline error messages and consistent
loading/confirm behavior across flows (create keys, replication, JIT DB
access, index advisor).
* Minor UI refinements for action controls.
* **Documentation**
* Docs updated with async-action guidance and inline-error
recommendations.
* **Tests**
* New test suite validating async dialog behaviors.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45960)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
## Problem
The `_Shadcn_` suffix isn't needed anymore on `Command` components
## Solution
- Remove the `_Shadcn_` suffix
- Simplify UI package exports
- Apply prettier
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Simplified command component imports and exports across the UI library
by removing internal naming aliases and adopting direct component
references. Updated the public UI package barrel export to use wildcard
re-exports for cleaner API surface.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46153?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Bug fix. Follow-up to DEPR-551, #45302, #45535, #45618, and stacked on
#46049.
## What is the current behaviour?
Warning and destructive Alert variants do not explicitly own their
foreground text colour. In muted parent contexts, nested Admonition
content can inherit lighter text styling.
## What is the new behaviour?
Warning and destructive Alert variants now include `text-foreground`,
just like the default counterpart.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated styling for alert components with destructive and warning
variants.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46050?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `_Shadcn_` suffix isn't needed anymore on `HoverCard` components
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized hover-card component usage across the apps and design
system for consistent behavior and markup.
* No user-facing changes — hover previews, tooltips, snippet/template
previews, and code hover panels retain the same appearance and
interactions.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45987)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `_Shadcn_` suffix isn't needed anymore on breadcrumb components
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized breadcrumb component exports across the codebase by
removing internal aliasing and using direct component exports. No UI,
behavior, or public API changes; end-user experience unchanged.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45984)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `_Shadcn_` suffix isn't needed anymore on `Select` components
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Updated internal component architecture to standardize and simplify
the codebase. These changes improve code maintainability and consistency
across the application without affecting existing functionality or user
experience.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Most changes are related to either types or `useRef` usages (it now
requires an initial value).
- also updated `vaul` to its latest version and haven't noticed any
change ([design-system
demo](https://design-system-git-react-19-supabase.vercel.app/design-system/docs/components/drawer))
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Upgraded workspace to React 19.
* **Bug Fixes**
* Improved null-safety and ref handling across editors, UI components,
shortcuts, and markdown/image rendering to reduce runtime errors.
* Safer event/timeout/interval cleanup and more robust command/context
handling.
* **Chores**
* Bumped vaul dependency versions.
* **Documentation**
* Type and TypeScript accuracy improvements for clearer developer
feedback.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45886)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Ivan Vasilov
