Gathering detailed insights and metrics for tw-elements-react
Gathering detailed insights and metrics for tw-elements-react
Installations
npm install tw-elements-reactDeveloper Guide
BETA
Typescript
Yes
Module System
ESM
Node Version
20.12.2
NPM Version
10.5.0
Releases
Unable to fetch releases
Download Statistics
Total Downloads
274,592
Last Day
388
Last Week
2,383
Last Month
9,744
Last Year
144,181
Maintainers
1
Package Meta Information
Latest Version
1.0.0-alpha-end
Package Id
tw-elements-react@1.0.0-alpha-end
Unpacked Size
1.11 MB
Size
249.63 kB
File Count
231
NPM Version
10.5.0
Node Version
20.12.2
Published on
Jun 03, 2024
Total Downloads
Cumulative downloads
Total Downloads
274,592
Last Day
27.2%
388
Compared to previous day
Last Week
21.6%
2,383
Compared to previous week
Last Month
2.6%
9,744
Compared to previous month
Last Year
11%
144,181
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
9
Dev Dependencies
23
@types/fs-extra@types/node@types/react@types/react-dom@types/shelljs@typescript-eslint/eslint-plugin@typescript-eslint/parser@vitejs/plugin-reactautoprefixerclsxcross-enveslinteslint-plugin-react-hookseslint-plugin-react-refreshfs-extrapostcsssassshelljstailwindcsstypescriptvitevite-plugin-dtsvite-plugin-externalize-deps
TW Elements React 
TW Elements React is a huge collection of free, interactive React components for Tailwind CSS.
|
|
Table of Contents
License
TWE React Alpha licensing information is available at the license file
Coming soon
Check out the upcoming features - watch our social profiles to get early access!
|
|
|
| Drag & drop builder | Templates | Design blocks |
Components
A collection of stunning components made with attention to the smallest details. Forms, cards, buttons, and hundreds of others – in TW Elements React you will find all the essential elements necessary for every project.
|
|
|
| Datepicker (coming soon) | Dropdown (coming soon) | Modal |
|
|
|
| Charts (coming soon) | Tooltips (coming soon) | Carousel (coming soon) |
|
|
|
| Accordion | Tabs | Stepper (coming soon) |
|
|
|
| Timepicker (coming soon) | Footer | Navbar (coming soon) |
|
|
|
| Alerts (coming soon) | Avatar | Badges |
|
|
|
| Button group | Buttons | Cards |
|
|
|
| Chips (coming soon) | Collapse | Gallery (coming soon) |
|
|
|
| Jumbotron (coming soon) | Link | List group |
|
|
|
| Notifications (coming soon) | Paragraphs | Placeholders |
|
|
|
| Popover (coming soon) | Progress | Rating |
|
|
|
| Scroll to top | Social buttons | Spinners |
|
|
|
| Timeline | Toast (coming soon) | Tooltip (coming soon) |
|
|
|
| Video (coming soon) | Video carousel (coming soon) | Checkbox |
|
|
|
| File input | Input group (coming soon) | Login form |
|
|
|
| Radio | Range | Registration form |
|
|
|
| Search | Select (coming soon) | Switch |
|
|
|
| Textarea (coming soon) | Tables | Ripple |
|
|
|
| Animations (coming soon) | Masks | Shadows |
Installation
NPM
-
Before starting the project make sure to install Node.js (LTS) version 14+, 16+ and TailwindCSS.
-
Run the following command to install the package via NPM:
npm i git+https://oauth2:ACCESS_TOKEN@git.mdbootstrap.com/mdb/twe-react/prd/twe-react-pro-essential
- Add the TW Elements React css file to your main js/tsx file
1import "tw-elements-react/dist/css/tw-elements-react.min.css";
- TW Elements is a plugin and should be included inside the tailwind.config.js file. It is also recommended to extend the content array with a js file that loads dynamic component classes:
1module.exports = { 2 content: [ 3 "./index.html", 4 "./src/**/*.{js,ts,jsx,tsx}", 5 "./node_modules/tw-elements-react/dist/js/**/*.js", 6 ], 7 theme: { 8 extend: {}, 9 }, 10 darkMode: "class", 11 plugins: [require("tw-elements-react/dist/plugin.cjs")], 12};
- Components will work after importing the package:
1import { TECollapse } from "tw-elements-react";
No vulnerabilities found.
No security vulnerabilities found.