mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 18:05:11 +03:00
Danny White
66a748cdd1
## What kind of change does this PR introduce? Bug fix. Follow-up to #49660. ## What is the current behavior? `AccordionTrigger` adds horizontal padding at the shared primitive level. This shifts content at call sites that already own their spacing. In the Studio Advanced settings sections, padding around the whole accordion also constrains the trigger and its hit area instead of letting it fill the row. ## What is the new behavior? The shared trigger no longer adds horizontal padding and its header explicitly fills its container. Both Studio Advanced settings sections now apply their padding inside the full-width trigger and content, keeping the text aligned while extending the focus outline and hit area across the row. The inset focus treatment from #49660 is unchanged. | Before | After | | --- | --- | | <img width="1334" height="286" alt="CleanShot 2026-09-08 at 16 18 57@2x" src="https://github.com/user-attachments/assets/3a057b45-1eb4-4928-ae69-2d636b0c4678" /> | <img width="1302" height="278" alt="CleanShot 2026-09-08 at 16 18 12@2x" src="https://github.com/user-attachments/assets/0454493e-4fbc-4ad2-a9fd-1b9dc1d486dc" /> | ## To test ### Studio replication destination 1. Open the [Studio staging preview](https://studio-staging-git-dnywh-fixaccordion-trigger-width-supabase.vercel.app) and select a project with Pipelines enabled. 2. Go to **Database > Replication**. Under **Destinations**, click **Add destination**. 3. Tab to **Advanced settings** and press Enter to expand it. 4. Confirm the text aligns with the form content, the focus outline spans the full row between the sheet edges, and clicking near the far right of the row toggles it. ### Studio access-token permissions 1. In the [Studio staging preview](https://studio-staging-git-dnywh-fixaccordion-trigger-width-supabase.vercel.app), go to **Account > Access Tokens**. 2. Click **Generate new token** and scroll to **Permissions**. 3. Tab to any permission category, then click near the far right of its row. 4. Confirm the focus outline fills the category row, the label keeps its existing inset, and the full row toggles the category. ### Pricing FAQs 1. Open the [Pricing preview](https://zone-www-dot-com-git-dnywh-fixaccordion-trigger-width-supabase.vercel.app/pricing) and scroll to **Frequently asked questions**. 2. Tab to any question, then click near the far right of its row. 3. Confirm the question has not gained extra horizontal inset and the full row remains interactive. ### Design-system Accordion 1. Open the [design-system Accordion preview](https://design-system-git-dnywh-fixaccordion-trigger-width-supabase.vercel.app/docs/components/accordion). 2. Tab through the three accordion triggers and toggle each one. 3. Confirm each focus outline fills its row, with no extra horizontal padding around the label.