## What kind of change does this PR introduce?
Refactor. Follow-up to #49871.
## What is the current behavior?
Branded (green) text still uses the `text-brand` classname while the
colour comes from `--primary`.
## What is the new behavior?
**Rename-only:** `text-brand` → `text-primary` across callsites and
docs. Leftover `bg-brand` / `border-brand` alias to `brand-default`. No
intentional colour changes in this PR.
This better matches how we treat our green in other components and
props, like `variant="primary"` for green buttons.
## To test
On light mode: smoke-test that branded text still looks like #49871
(readable green, not the bright fill).
-
[Homepage](https://zone-www-dot-com-git-dnywh-depr-316-text-brand-de2380-supabase.vercel.app/):
“Scale to millions” uses `text-primary`
- [Docs
homepage](https://docs-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/docs):
branded links like “More on self-hosting” are still readable
- [Typography
docs](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/typography):
documents `text-primary`
- [Colour
usage](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/color-usage):
`text-primary` is visibly darker than `bg-brand-default` _on light mode_
- [Studio auth
providers](https://studio-staging-git-dnywh-depr-316-text-brand-to-60fa6c-supabase.vercel.app/dashboard/project/_/auth/providers):
enabled provider badge text readable; status dot stays bright green
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated branded text, link hover states, icons, badges, indicators,
and highlighted content across the Design System, Docs, Studio, Learn,
UI Library, and marketing experiences to use the primary theme color.
* Updated syntax highlighting and table-of-contents styling for
consistent primary-color presentation.
* Refined brand color fallback behavior for bright fills and borders.
* **Documentation**
* Updated color-usage and typography guidance to recommend the primary
text utility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Studio UI consistency refactor.
## What is the current behaviour?
Several Studio comboboxes still build their triggers from `Button` and
supply their own double-chevron icon. This duplicates trigger styling
and allows these controls to drift from selects and other comboboxes.
## What is the new behaviour?
- Migrates the PITR timezone, AWS region, and account timezone controls
to `ComboboxTrigger`
- Migrates the shared `SchemaSelector` and `FunctionSelector`, updating
their Studio callsites together
- Preserves the globe icon in both timezone controls
- Exposes the correct combobox role and open state through the shared
trigger
- Tightens the tiny schema selector end padding so its chevron aligns
with adjacent controls
- Leaves organisation and project context switchers unchanged
| Before | After |
| --- | --- |
| <img width="504" height="490" alt="CleanShot 2026-09-09 at 13 56
56@2x"
src="https://github.com/user-attachments/assets/117a9169-88bf-4f9e-8302-9df9b911a307"
/> | <img width="496" height="512" alt="CleanShot 2026-09-09 at 11 31
26@2x"
src="https://github.com/user-attachments/assets/bc98cded-2723-4d20-9d8c-49630ea018af"
/> |
| <img width="1250" height="394" alt="CleanShot 2026-09-09 at 13 58
34@2x"
src="https://github.com/user-attachments/assets/9106f924-88fd-40d4-88e3-8d0ddbb61d12"
/> | <img width="1246" height="376" alt="CleanShot 2026-09-09 at 13 58
09@2x"
src="https://github.com/user-attachments/assets/7894a254-f6f9-40bb-a312-9f1a5079f096"
/> |
## To test
On the [Studio
preview](https://studio-staging-git-dnywh-choremigrate-combobox-680102-supabase.vercel.app):
1. Open **Database > Tables** and use the schema selector above the
table. It should use a single down chevron, open normally, and update
the selected schema.
2. Open **Authentication > Hooks > Add hook**, then select **Postgres**
as the hook type. The **Postgres schema** and **Postgres function**
selectors should use a single down chevron and continue to open and
select normally.
The PITR, AWS region, and account timezone callsites require the
relevant plan, integration, or feature flag. When available, their
triggers should use the same single down chevron, and both timezone
controls should retain the globe icon.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **UI Improvements**
* Standardized timezone, AWS region, database backup, function, and
schema selectors with a consistent combobox interface.
* Added clear visual feedback for open and closed selector states.
* Preserved contextual icons and labels, including globe icons for
timezone selections.
* Improved accessibility with appropriate combobox semantics, accessible
names, and state information.
* Timezone settings are now available without an optional feature flag.
* **Tests**
* Updated end-to-end coverage for the standardized combobox controls.
* Added coverage confirming schema selectors expose the selected schema
as an accessible name.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## What kind of change does this PR introduce?
Bug fix.
## What is the current behavior?
A command dropdown cannot be scrolled by touch when it sits inside a
dialog or sheet.
Radix wraps a modal dialog's overlay in a scroll lock that cancels wheel
and touch events whose target is not inside the sheet. A dropdown
portals to the body, so it falls outside that boundary and its scroll
events get cancelled.
Callers have been rediscovering this one at a time and fixing only half
of it. `MultiSelectorList` stops wheel events reaching the document, and
`SchemaSelector` and `FunctionSelector` expose a `stopScrollPropagation`
prop that does the same. None of them handle touch, so the desktop
symptom is fixed everywhere and the mobile one is fixed nowhere.
## What is the new behavior?
`CommandList` keeps wheel and touch events off the document itself. That
covers every command dropdown in the monorepo, in an overlay or not,
with no call-site changes. A caller's own `onWheel` or `onTouchMove`
still runs.
The workarounds this replaces are removed: the handler in
`MultiSelectorList`, and the `stopScrollPropagation` prop on
`SchemaSelector` and `FunctionSelector` along with its four call sites.
One behavior change worth naming: overscrolling past the end of a
dropdown no longer scrolls the page behind it. That is what a dropdown
should do, and it is what the four `stopScrollPropagation` call sites
were already opting into.
#50072 depends on this. It swaps two selects for comboboxes, and Radix
Select brings its own scroll lock, so without this the swap would
regress touch scrolling.
## To test
- On the deploy preview, [open a project's Connect
sheet](https://studio-staging-git-dnywh-fix-multi-select-scrol-63608b-supabase.vercel.app/dashboard/project/_)
and pick the MCP tab.
- Narrow the window to phone width and switch on touch emulation in
devtools.
- Open the features dropdown and drag the list. It should scroll, and
the sheet behind it should stay put.
- Repeat with a mouse wheel to confirm desktop scrolling still works.
- [Open Authentication >
Hooks](https://studio-staging-git-dnywh-fix-multi-select-scrol-63608b-supabase.vercel.app/dashboard/project/_/auth/hooks)
> Create hook, open the schema picker, and confirm it still scrolls by
wheel now that `stopScrollPropagation` is gone.
- [Open the SQL
editor](https://studio-staging-git-dnywh-fix-multi-select-scrol-63608b-supabase.vercel.app/dashboard/project/_/sql/new)'s
schema picker on a page with no overlay and confirm the list scrolls
normally.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **Bug Fixes**
- Improved wheel and touch scrolling behavior in command lists,
selectors, and multi-select menus.
- Reduced unwanted scroll-lock interference when using selectors inside
overlays such as dialogs and sheets.
- Preserved support for supplied scroll event callbacks.
- **Accessibility**
- Added clearer accessible labels to the Connect and mobile navigation
menu buttons.
- Updated the Connect button text behavior for icon-only and standard
presentations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## What kind of change does this PR introduce?
Bug fix. Resolves
[FE-4192](https://linear.app/supabase/issue/FE-4192/org-and-project-selectors-sometimes-dont-register-selections).
## What is the current behavior?
Navigation actions sometimes nest links inside command or dropdown menu
items. Closing the menu during selection can prevent the nested link
navigation from registering.
## What is the new behavior?
- Adds a documented Studio CommandItemLink composition that wraps
command items with their navigation link.
- Migrates all Studio command-item links, including organisation,
project, function, database, branch, and integration actions.
- Uses the dropdown menu asChild composition for both
infrastructure-diagram Manage replica actions.
- Preserves native link behaviour and leaves disabled command items
non-navigable.
## To test
- [ ] [Organisation and project
selectors](https://studio-staging-git-dnywh-fe-4192-selector-links-supabase.vercel.app/dashboard/org):
open the organisation selector and try an organisation, All
Organizations, and New organization. Open a project, then use the
project selector to switch projects and open New project. Confirm every
action navigates on the first click.
- [ ] [Branch
selector](https://studio-staging-git-dnywh-fe-4192-selector-links-supabase.vercel.app/dashboard/project/_):
in a project with branching enabled, open the branch selector. Switch
branches and select Manage branches. Confirm both navigate on the first
click.
- [ ] [Database
selector](https://studio-staging-git-dnywh-fe-4192-selector-links-supabase.vercel.app/dashboard/project/_/observability/query-performance):
open the Source selector. Switch between the primary database and a read
replica if available, then select Create a new read replica. Confirm
selections apply and the footer action navigates on the first click.
- [ ] [Function
selector](https://studio-staging-git-dnywh-fe-4192-selector-links-supabase.vercel.app/dashboard/project/_/auth/hooks):
select Add a new hook, choose a hook, select Postgres, then open the
Postgres function selector and select New function. Confirm it navigates
on the first click.
- [ ] [Infrastructure
diagram](https://studio-staging-git-dnywh-fe-4192-selector-links-supabase.vercel.app/dashboard/project/_/settings/infrastructure):
for a project with a read replica, select Manage replica from both
diagram variants. Confirm the replica settings open on the first click.
- [ ] On any navigational row above, modifier-click and confirm native
link behaviour is preserved.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added consistent link navigation across organization, project, branch,
function, replica, and integration menus.
* Added project-specific destinations to organization and project
selectors.
* Preserved disabled-item behavior while improving accessible
command-menu link semantics.
* **Bug Fixes**
* Improved navigation and menu-closing behavior for command items and
dropdown actions.
* **Tests**
* Added coverage for link destinations, accessibility roles, disabled
states, and route preservation.
<!-- 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
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 -->
## Problem
We have multiple Popover components
## Solution
- [x] migrate Popover usages to Shadcn components
- Migrated JSON and text editor in the `TableEditor` (inline row
edition)
- Migrated the template popover in the logs explorer templates page
- [x] remove `_Shadcn_` suffix from Popover components (renaming +
prettier)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Unified popover implementation across the app and design system;
dropdowns, calendars, menus and tooltips now use a consistent popover
API with no visual or interaction changes.
* **Chores**
* Minor prop typing update for the logs date-picker to align with the
consolidated popover content type.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45980)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.
---------
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
* Bump the deps, refactor deprecated code.
* Migrate keepPreviousData usage.
* Migrate all uses of InfiniteQuery.
* Fix refetchInterval in queries.
* Migrate all use of isLoading to isPending in mutations.
* Fix accessing location in claim-project.
* Fix a bug in duplicate query keys.
* Migrate all queries to use isPending.
* Revert "Fix accessing location in claim-project."
This reverts commit 2a07df64b5.
* Revert the rss.xml file to master.
* Replace all usage of useProjectContext with useSelectedProjectQuery
* Replace all usage of useSelectedProject with useSelectedProjectQuery
* Replace all usage of useProjectByRef with useProjectByRefQuery
* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery
* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks
* Deprecate ProjecContext
* Add crons option in the database menu.
* Add react-hook-form to the studio package.json.
* Refactor the functionSelector to be used by other features.
* Add the bulk of the functionality for the cron UI. Some of the code is copy-pasted from functions feature, needs to be cleaned before merging.
* Tons of changes, the Create Cron sheet works now.
* Added some more functionality for the cronjob feature.
* Convert the Cron table to a listing with cards.
* Add click-to-copy in the Auth Hooks feature.
* Remove extra prop.
* Fix type errors.
* Fix some random issues. Fix the tests.
* Fix the tests.
* Add a style for disabled radio button item.
* Make the default SQL snippet. Handle the case pg_net is not installed.
* Fix the heading and save button when creating a new cron job.
* Change the name of the custom label in the schedule dropdown.
* Minor fixes.
* Rename all mentions of cronjobs to cron jobs.
* Always show the cron jobs link.
* Rename the link from crons to cron-jobs.
* Fix the disabled state for the stacked radio group.
* More minor fixes.
* More small fixes.
* Fix the tests.
* Minor UI tweaks
* More minor tweaks
* Add padding bottom
* Add feature flag for the cron ui.
* Fix the SQL function option.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Danny White
