feat(Checkbox): add new component #77
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
commit: |
- CheckboxRoot: group context provider with tri-state support - CheckboxIndicator: works standalone (v-model) or in group context - Renders as button by default, supports renderless mode - Full a11y: role, aria-checked (true/false/mixed), aria-disabled, tabindex - 35 tests covering standalone, group, SSR modes
- Rename CheckboxRoot → CheckboxGroup (group context provider) - New CheckboxRoot handles registration + item context - CheckboxIndicator now purely presentational - Export as Checkbox.Group, Checkbox.Root, Checkbox.Indicator
- Add keyboard interaction (Space to toggle) and click handler - Add aria-label from label prop for accessible name - Add role="group" to CheckboxGroup attrs - Fix slot return type: any → unknown - Fix context mode: use static key 'v0:checkbox:root' - Fix data-disabled: '' → true for consistency
- Use Readonly<Ref<boolean>> for context types - Add defineEmits alongside defineModel - Change slot return types to match Root/Item convention - Add keyboard interaction tests (Space, Enter, disabled) - Add component docs with basic, group, and select-all examples
Reorganize checkbox documentation from providers to new forms category.
johnleider
force-pushed
the
feat/checkbox
branch
from
492f81e to
f112f78
Compare
Import was referencing non-existent #v0/composables/useGroup path, causing typecheck to fail. Also adds test for Indicator context error. Fixes knip config to ignore tsx binary used by generate:web-types script.
…ers element Root now renders as button via Atom with ARIA attrs and click/keydown handlers. Indicator simplified to visual span with visibility toggle (no layout shift). Group now renders div with role="group" and aria-multiselectable.
- Simplify basic.vue and group.vue to use data-state CSS selectors - Remove select-all.vue example (removed from docs) - Add Checkbox to shiki-api-transformer whitelist for hover popovers - Reorder component nav: primitives, providers, disclosure, forms, semantic - Update accessibility section to reflect Root handles ARIA
johnleider
changed the title
- Add CheckboxHiddenInput component for native form submission - Auto-render hidden input when `name` prop is provided on Root - Add `name` and `form` props to CheckboxRoot context - Fix class pass-through by using inheritAttrs: false with useAttrs() - Add 12 tests covering auto-render, explicit usage, and group mode
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
In development