primitives
react-spectrum

primitives | react-spectrum | |
---|---|---|
29 | 11 | |
16,385 | 13,415 | |
1.5% | 1.6% | |
9.3 | 9.8 | |
8 days ago | 6 days ago | |
TypeScript | TypeScript | |
MIT License | Apache License 2.0 |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
primitives
- Explaining Scoped Context in React with example
-
Hacky Way to Customize Shadcn’s Tooltip Arrows
While this approach works, I’m sure there are UI libraries that allow for easier and more flexible tooltip styling. However, it feels rewarding to have found a workaround for this. If you're interested in exploring other options, you might want to check out this discussion.
-
Headless UI alternatives: Radix Primitives, React Aria, Ark UI
Radix Primitives is a library of unstyled React components built by the team behind Radix UI, a UI library with fully styled and customizable components. According to its website, the Node.js, Vercel, and Supabase teams all use Radix Primitives. The library has 14.8K stars on GitHub.
- Radix Primitives: an open-source UI component library
-
React: Build your own composable, headless components
Fast forward to a week ago, I cloned the Reach UI and Radix UI codebase and started exploring. Large codebases are always difficult to comprehend. With some digging around and reverse engineering, I was able to create the first component listed in the Reach UI docs, the Accordion.
- Show HN: Radix Themes – A beautiful, open-source React component library
- 5 React Libraries to Level Up your Projects in 2023
-
I'm building Radix Svelte, an unstyled UI component library with a focus on accessibility.
Other things that led me to choose this path were: Most libraries that are ports, official or not, use the original name (e.g. Svelte Material UI); Radix UI's license is fairly permissive (https://github.com/radix-ui/primitives/blob/main/LICENSE), which is why I also don't think it matters that it's a company behind it. Same as why I don't see an issue with the name Preact, for example.
-
I made a tool for converting between different media formats (without uploading to a server)
For a react project I recommend https://radix-ui.com, it's got pretty good defaults
-
List of free Tailwind UI component resources
radix-ui.com
react-spectrum
-
Ultimate UI and Development Resource Guide for 2024 🚀
8. React Spectrum Adobe’s design system, offering accessible components for building consistent, adaptive, and delightful user experiences. React Spectrum:
-
Headless UI alternatives: Radix Primitives, React Aria, Ark UI
React Aria is a library of unstyled components that Adobe released under their collection of React UI tools called React Spectrum. Adobe does not have a repository dedicated to React Aria, but the React Spectrum repository has 12K GitHub stars at the time of writing. Its npm package, react-aria-components, also currently receives 260K weekly downloads.
-
Ask HN: What alternatives to Adobe products are you switching to?
https://github.com/adobe/react-spectrum
And Spectrum 2 is expected later this year.
-
Building Accessible React Components with React Aria
For more information and to get started, check out the React Aria documentation and the React Spectrum GitHub repository.
- Adobe React Spectrum Libraries
-
Accessibility and Headless UI Libraries - Adobe, Radix, Tailwind, MUI
Adobe - React ARIA
-
Trying to find some more UI component libraries. I am big fan of Chakra UI but want to try something new. Any suggestions?
As no one metioned it, here goes Adobe spectrum react
-
React Aria Components
This was an intentional choice. Repositioning when an outer element scrolls is pretty janky in some cases because scroll events don’t fire at 60fps. Also it’s not possible at all in other cases, like if the trigger goes completely out of view. We used to close the popover in this case but this caused usability problems. The new behavior of preventing scroll actually matches native platforms like macOS and helps with these issues. I get that it’s a little opinionated but it was thoroughly considered, not just done out of laziness. More details in this answer: https://github.com/adobe/react-spectrum/discussions/3802#dis...
- Are there any open-source software projects taking accessibility into account?
-
State of JavaScript 2021 is out
It’s not perfect though. The only reason I’m not using preact is that my front-end library of choice, react-aria, does not work 100% with preact, though it sounds like it might now be close (unsure).
https://react-spectrum.adobe.com/react-aria/index.html
https://github.com/adobe/react-spectrum/issues/781
What are some alternatives?
shadcn/ui - A set of beautifully-designed, accessible, and customizable components to help you build your component library. Open Source.
panda - 🐼 Universal, Type-Safe, CSS-in-JS Framework for Product Teams ⚡️
dub - Open-source link attribution platform. Loved by modern marketing teams like Twilio, Perplexity, Vercel, and Huberman Labs.
zag - Finite state machines for building accessible design systems and UI components. Works with modern frameworks, and even just Vanilla JS
glow-mui3 - A React Component Kit Library 📦 Adapted From Material Design 3
sveltekit-package-template - A barebones project that provides the essentials for writing highly-optimized, reusable packages in Svelte.
jest-is-a-rude-needy-clown-and-eats-lot-of-memory - Benchmark of memory requirements for different JS test frameworks after running into some issues with Jest memory requirements causing OOM with about ~450 tests (50 suites).
component-template - A base for building shareable Svelte components
axe-storybook-testing - Command line interface for testing Storybook stories for accessibility.
chakra-ui - Chakra UI is a component system for building products with speed ⚡️
ark - Build your design system with React, Svelte, Vue, and Solid. Powered by State Machines
