Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/oku-ui/primitives
Vue Radix UI Primitives 1:1 . Components, icons, colors, and templates for building high-quality, accessible UI. Free and open-source.
https://github.com/oku-ui/primitives
accessibility component-library nuxt oku oku-ui radix-ui ui ui-components ui-kit vue vue-radix
Last synced: 5 days ago
JSON representation
Vue Radix UI Primitives 1:1 . Components, icons, colors, and templates for building high-quality, accessible UI. Free and open-source.
- Host: GitHub
- URL: https://github.com/oku-ui/primitives
- Owner: oku-ui
- License: mit
- Created: 2023-04-26T13:58:11.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-08T15:40:21.000Z (13 days ago)
- Last Synced: 2025-01-09T01:35:03.281Z (12 days ago)
- Topics: accessibility, component-library, nuxt, oku, oku-ui, radix-ui, ui, ui-components, ui-kit, vue, vue-radix
- Language: Vue
- Homepage: https://primitives.oku-ui.com
- Size: 13.1 MB
- Stars: 869
- Watchers: 6
- Forks: 37
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- Changelog: changelog.config.ts
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
---
# Oku Primitives
**An open-source UI component library for building high-quality, accessible design systems and web apps.**
Oku Primitives is a low-level UI component library with a focus on accessibility, customization and developer experience. You can use these components either as the base layer of your design system or adopt them incrementally.
Website: [Oku Website](https://oku-ui.com)
---
# Contributing
Please read our [contributing guide](https://github.com/oku-ui/primitives/blob/master/CONTRIBUTING.md)
# TODO
## Components
Enter the component you want most in the components, leave the emojis and follow.
**Developers can work on unclaimed components**
### Components
### Components
| Component | Status | 🔗 Hook v1 | 👀 Visual Check | 📄 Docs | 📝 Note |
| ------------------------------------------------------------------------------------------------ | ------------ | ---------- | --------------- | ------- | ------------------------------ |
| [Accordion](https://vue-primitives.netlify.app/?path=/story/components-accordion--single) | ✅ Completed | ✅ | ✅ | | |
| [AlertDialog](https://vue-primitives.netlify.app/?path=/story/components-alertdialog--styled) | ✅ Completed | ✅ | | | |
| [AspectRatio](https://vue-primitives.netlify.app/?path=/story/components-aspectratio--styled) | ✅ Completed | ✅ | | | |
| [Avatar](https://vue-primitives.netlify.app/?path=/story/components-avatar--styled) | ✅ Completed | ✅ | | | 🔨 PR from Radix |
| [Checkbox](https://vue-primitives.netlify.app/?path=/story/components-checkbox--styled) | ✅ Completed | ✅ | | | 🔧 Needs input |
| [Collapsible](https://vue-primitives.netlify.app/?path=/story/components-collapsible--styled) | ✅ Completed | ✅ | ✅ | | |
| [Context Menu](https://vue-primitives.netlify.app/?path=/story/components-contextmenu--styled) | ✅ Completed | ✅ | | | |
| [Dialog](https://vue-primitives.netlify.app/?path=/story/components-dialog--styled) | ✅ Completed | ✅ | | | |
| [DropdownMenu](https://vue-primitives.netlify.app/?path=/story/components-dropdownmenu--styled) | ✅ Completed | ✅ | | | |
| Form | ❌ Not Started | ❌ | | | |
| [HoverCard](https://vue-primitives.netlify.app/?path=/story/components-hovercard--chromatic) | ✅ Completed | ✅ | | | 🔧 Needs polygon; fix close |
| [Label](https://vue-primitives.netlify.app/?path=/story/components-label--styled) | ✅ Completed | ✅ | | | |
| [Menubar](https://vue-primitives.netlify.app/?path=/story/components-menubar--styled) | ✅ Completed | ✅ | | | |
| NavigationMenu | 🚧 In Progress | 🚧 | | | |
| [Popover](https://vue-primitives.netlify.app/?path=/story/components-popover--styled) | ✅ Completed | ✅ | | | |
| [Progress](https://vue-primitives.netlify.app/?path=/story/components-progress--styled) | ✅ Completed | ✅ | | | ✅ |
| [RadioGroup](https://vue-primitives.netlify.app/?path=/story/components-radiogroup--styled) | ✅ Completed | ✅ | | | 🔧 Needs input |
| [ScrollArea](https://vue-primitives.netlify.app/?path=/story/components-scrollarea--basic) | ✅ Completed | ✅ | | | |
| Select | 🚧 In Progress | 🚧 | | | |
| [Separator](https://vue-primitives.netlify.app/?path=/story/components-separator--styled) | ✅ Completed | ✅ | | | |
| [Slider](https://vue-primitives.netlify.app/?path=/story/components-slider--styled) | ✅ Completed | ✅ | ✅ | | |
| [Switch](https://vue-primitives.netlify.app/?path=/story/components-switch--styled) | ✅ Completed | ✅ | | | 🔧 Needs input |
| [Tabs](https://vue-primitives.netlify.app/?path=/story/components-tabs--styled) | ✅ Completed | ✅ | ✅ | | |
| [Toast](https://vue-primitives.netlify.app/?path=/story/components-toast--styled) | ✅ Completed | ✅ | | | |
| [ToggleGroup](https://vue-primitives.netlify.app/?path=/story/components-togglegroup--single) | ✅ Completed | ✅ | ✅ | | |
| [Toggle](https://vue-primitives.netlify.app/?path=/story/components-toggle--styled) | ✅ Completed | ✅ | ✅ | | |
| [Toolbar](https://vue-primitives.netlify.app/?path=/story/components-toolbar--styled) | ✅ Completed | ✅ | | | 🔧 Focus on MouseDown |
| [Tooltip](https://vue-primitives.netlify.app/?path=/story/components-tooltip--styled) | ✅ Completed | ✅ | | | |
---
### Utilities
| Utility | Status | 🔗 Hook v1 | 👀 Visual Check | 📄 Docs | 📝 Note |
| ---------------------------------------------------------------------------------------------------- | ------------ | ---------- | --------------- | ------- | ----------------------------------- |
| [Collection](https://vue-primitives.netlify.app/?path=/story/utilities-rovingfocusgroup--basic) | 🚧 Partial | ✅ | | | 🔧 Needs array items |
| [DismissableLayer](https://vue-primitives.netlify.app/?path=/story/utilities-dismissablelayer--basic) | 🚧 Partial | ✅ | | | 🔧 Dismissable like Solid.js |
| [FocusScope](https://vue-primitives.netlify.app/?path=/story/utilities-focusscope--basic) | ✅ Completed | ✅ | | | |
| [Menu](https://vue-primitives.netlify.app/?path=/story/utilities-menu--styled) | ✅ Completed | ✅ | | | |
| [Popper](https://vue-primitives.netlify.app/?path=/story/utilities-popper--styled) | ✅ Completed | ✅ | | | 🔧 Needs Arrow |
| [Portal](https://vue-primitives.netlify.app/?path=/story/utilities-portal--base) | ✅ Completed | ❌ | | | 🔧 Dismissable like Solid.js |
| [Presence](https://vue-primitives.netlify.app/?path=/story/utilities-presence--basic) | ✅ Completed | ✅ | | | |
| Primitives | ✅ Completed | ❌ | | | |
| [RovingFocusGroup](https://vue-primitives.netlify.app/?path=/story/utilities-rovingfocusgroup--basic) | ✅ Completed | ✅ | ✅ | | |
| Slot | ✅ Completed | ❌ | | | 🔧 Remove VDom |
| [VisuallyHidden](https://vue-primitives.netlify.app/?path=/story/utilities-visuallyhidden--basic) | ✅ Completed | ❌ | | | |
## Community
- [Discord](https://chat.oku-ui.com) - To get involved with the Oku community, ask questions and share tips.
- [Twitter](https://twitter.com/oku_ui) - To receive updates, announcements, blog posts, and general Oku tips.
## Sponsors
## Thanks
Thanks to [@radix_ui](https://github.com/radix-ui/primitives) for the inspiration and the great work they've done with [Radix Primitives](https://radix-ui.com). We proceed through the initial stages of many codes by looking at them.
Thanks to Johnson Chu [@johnsoncodehk](https://github.com/johnsoncodehk). Supported me with many issues that I was stuck in Typescript.
Thanks to Daniel Roe [@danielroe](https://github.com/danielroe). Nuxt has helped me in many areas so far.
Thanks to Kevin Deng [@sxzz](https://github.com/sxzz). Helped me a lot with the issues I was stuck in Vue. and [Vue Macros](https://vue-macros.sxzz.moe) is a great project.
## Credits
- [Daniel Roe](https://github.com/danielroe)
- [Johnson Chu](https://github.com/johnsoncodehk)
- [Skirtle](https://github.com/skirtles-code)
- [Jacek Karczmarczyk](https://github.com/jacekkarczmarczyk)
- [Headless UI](https://headlessui.com)
- [Destyler](https://destyler.org)
- [Radix Vue](https://github.com/unovue/radix-vue)
- [Element Plus](https://github.com/element-plus/element-plus)
---
## License
Licensed under the MIT License, Copyright © 2023-present [productdevbook](https://twitter.com/productdevbook).
See [LICENSE](./LICENSE) for more information.