# @devopness/ui-react > Devopness Design System React Components - Painless essential DevOps to everyone Latest version **2.211.0** (published 2026-10-14) · Apache-2.0 license · 0 weekly downloads ## Install ```sh npm install @devopness/ui-react pnpm add @devopness/ui-react yarn add @devopness/ui-react bun add @devopness/ui-react ``` ## Health **Score 75/100 (B)** — status: active. Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; high quality score. Warnings: low downloads. ## Facts | | | |---|---| | Version | 2.211.0 | | Published | 2026-10-14 | | First published | 2024-10-07 | | Weekly downloads | 0 | | License | Apache-2.0 | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 18 | | Unpacked size | 3.5 MB | | Known vulnerabilities | 0 | | Install scripts | no | | Provenance | attested (GitHub Actions) | | GitHub stars | 572 | | Author | Devopness | | Maintainers | diego.queiroz, devopness-labs | | Keywords | Cloud Engineering, Cloud Infrastructure Management, Cloud Platform Engineering, Configuration Management, Deploy, Deployment, DevOps, Devopness, Platform Engineering, Server Management, Zero Downtime Deploy | ## Links - npm: https://www.npmjs.com/package/@devopness/ui-react - Repository: https://github.com/devopness/devopness - Homepage: https://github.com/devopness/devopness#readme - Issues: https://github.com/devopness/devopness/issues - npm.io page: https://npm.io/package/@devopness/ui-react ## Dependencies (18) - [ldrs](https://npm.io/package/ldrs.md) ^1.1.9 - [lodash](https://npm.io/package/lodash.md) ^4.18.1 - [react-dnd](https://npm.io/package/react-dnd.md) 16.0.1 - [classnames](https://npm.io/package/classnames.md) ^2.5.1 - [react-icons](https://npm.io/package/react-icons.md) ^5.7.0 - [react-select](https://npm.io/package/react-select.md) ^5.10.2 - [@mui/material](https://npm.io/package/@mui/material.md) 9.5.0 - [framer-motion](https://npm.io/package/framer-motion.md) ^14.0.0 - [react-spinners](https://npm.io/package/react-spinners.md) ^0.17.1 - [path-browserify](https://npm.io/package/path-browserify.md) ^1.0.1 - [@radix-ui/themes](https://npm.io/package/@radix-ui/themes.md) ^3.3.0 - [styled-components](https://npm.io/package/styled-components.md) ^6.5.3 - [@mui/icons-material](https://npm.io/package/@mui/icons-material.md) 9.5.0 - [@radix-ui/react-slot](https://npm.io/package/@radix-ui/react-slot.md) ^1.4.0 - [@mui/styled-engine-sc](https://npm.io/package/@mui/styled-engine-sc.md) 9.5.0 - [@tanstack/react-table](https://npm.io/package/@tanstack/react-table.md) ^8.21.3 - [material-ui-popup-state](https://npm.io/package/material-ui-popup-state.md) ^5.3.7 - [react-dnd-html5-backend](https://npm.io/package/react-dnd-html5-backend.md) 16.0.1 ## Alternatives - [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads - [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads - [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads - [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads - [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads ## Recent versions - 2.211.0 (latest) — 2026-10-14 - 2.210.0 — 2026-10-12 - 2.209.4 — 2026-10-09 - 2.209.2 — 2026-10-05 - 2.209.1 — 2026-10-05 - 2.209.0 — 2026-10-02 - 2.208.1 — 2026-09-28 - 2.208.0 — 2026-09-18 - 2.207.3 — 2026-09-15 - 2.207.2 — 2026-09-14 - 2.207.1 — 2026-09-14 - 2.207.0 — 2026-09-11 - 2.206.1 — 2026-09-09 - 2.206.0 — 2026-09-09 - 2.205.0 — 2026-09-09 - … 93 more at https://npm.io/package/@devopness/ui-react/versions ## README # Devopness UI - React The official Devopness UI components for React ## Usage ### Install/Upgrade Use your favourite package manager to install Devopness UI as a dependency of your project: ```bash # Using npm npm install @devopness/ui-react # Using yarn yarn add @devopness/ui-react ``` ## ✍️ Contributing Improvements and contributions are highly encouraged! 🙏👊 See the [contributing guide](../../../CONTRIBUTING.md) for details on how to participate. All communication and contributions to Devopness projects are subject to the [Devopness Code of Conduct](../../../CODE_OF_CONDUCT.md). Not yet ready to contribute but do like the project? Support Devopness with a ⭐! ## Dependencies This component library uses: - ⚛️ [React](https://react.dev/) — JavaScript library for user interfaces - 📖 [Storybook](https://storybook.js.org/) — Frontend workshop for UI development - 💅 [Styled Components](https://styled-components.com/) - CSS-in-JS library for styling components - ⚡ [Vite](https://vite.dev/) — The build tool for the web - 📦 [SWC (Speedy Web Compiler)](https://swc.rs/) — Rust based compiler used to speed up Vite dev server - 🧪 [Vitest](https://vitest.dev/) — Vite-native testing framework - 🐙 [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) - A light-weight solution for testing React components As well as a few others tools configured: - [TypeScript](https://www.typescriptlang.org/) for static type checking - [ESLint](https://eslint.org/) for code linting - [Prettier](https://prettier.io) for code formatting ## Development & Testing Installing on `Linux` or `macOS` systems. #### 1. Navigate to the project directory ```shell cd packages/ui/react/ ``` #### 2. Install missing dependencies This command will install all modules listed as dependencies in [package.json](package.json). ``` npm install ``` #### 3. Build UI package ``` npm run build ``` #### 4. Run tests ``` npm run test ``` #### 5. Run storybook ``` npm run storybook ``` --- _Source: https://npm.io/package/@devopness/ui-react · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._