mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 09:25:06 +03:00
fix: FormItemLayout does not apply item id correctly (#49637)
## Problem `<FormItemLayout>` does not apply item id correctly. This can be seen on https://supabase.com/design-system/docs/ui-patterns/forms: open the devtool and check the form items labels. They have no `for` attribute. This makes it harder to correctly test and is an accessibility issue. Axe devtool actually report it ## Solution When inside React Hook Form, `<FormItemLayout>` actually generate an `id` (via `<FormItem>`). However, this `id` is overridden in `<FormLayout>` and read from context by `<FormLabel>`. Ensure we use the generated id unless one was provided. Also updated the paths filters for the CI check so that any changes in either `ui` or `ui-patterns` triggers the studio unit and e2e tests. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved form accessibility by ensuring labels consistently connect to their corresponding input fields. - React-based forms now correctly preserve field-specific identifiers when associating labels with inputs. - Added support for explicitly specifying a label’s input target, improving compatibility with customized form layouts. - Updated Studio forms to use consistent control identifiers and labeling behavior. - **Quality Improvements** - Automated validation now also runs when shared UI components and patterns are updated. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
1 parent
8aade77966
commit
4f92790587
15 files changed
+70
-125
No files matched your search
@@ -44,6 +44,8 @@ jobs:
|
||||
filters: |
|
||||
studio:
|
||||
- 'packages/pg-meta/**'
|
||||
- 'packages/ui/**'
|
||||
- 'packages/ui-patterns/**'
|
||||
- 'apps/studio/**'
|
||||
- 'apps/ui-library/**'
|
||||
- 'apps/design-system/**'
|
||||
|
||||
@@ -8,6 +8,8 @@ on:
|
||||
branches: [master, studio]
|
||||
paths:
|
||||
- 'apps/studio/**'
|
||||
- 'packages/ui/**'
|
||||
- 'packages/ui-patterns/**'
|
||||
- 'pnpm-lock.yaml'
|
||||
pull_request:
|
||||
branches: [master, studio]
|
||||
@@ -44,6 +46,8 @@ jobs:
|
||||
with:
|
||||
filters: |
|
||||
relevant:
|
||||
- 'packages/ui/**'
|
||||
- 'packages/ui-patterns/**'
|
||||
- 'apps/studio/**'
|
||||
- 'pnpm-lock.yaml'
|
||||
- uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
|
||||
|
||||
Reference in new issue
Block a user