{"_id":"@seerr-team/react-tailwindcss-datepicker","_rev":"3-2131aee81ed8d62568d4eac2d67cdb60","name":"@seerr-team/react-tailwindcss-datepicker","dist-tags":{"latest":"1.3.4"},"versions":{"1.3.4":{"name":"@seerr-team/react-tailwindcss-datepicker","version":"1.3.4","keywords":["react-tailwindcss-datepicker","react-datepicker","tailwind-datepicker","datepicker","date-picker","daterangepicker","react-daterangepicker","date-range","date-range-picker","tailwind-daterange-picker"],"author":{"name":"onesine"},"license":"MIT","_id":"@seerr-team/react-tailwindcss-datepicker@1.3.4","maintainers":[{"name":"seerr-team","email":"team@seerr.dev"}],"homepage":"https://github.com/seerr-team/react-tailwindcss-datepicker#readme","bugs":{"url":"https://github.com/seerr-team/react-tailwindcss-datepicker/issues"},"dist":{"shasum":"564b3403771860e7f6f707a14bf6191997d5789a","tarball":"https://registry.npmjs.org/@seerr-team/react-tailwindcss-datepicker/-/react-tailwindcss-datepicker-1.3.4.tgz","fileCount":41,"integrity":"sha512-KZrnl6WL1lvUnAG4RZIkReJ+E0vSpOtMEuatobMqiWAa5Y+Z3d0ZcOOJWHoeRNtF19sIzzBkuLyhFNFlNtXg3A==","signatures":[{"sig":"MEUCIQDlulUFbiFIt5AkZJ2ZlApOcP1sg4XiZz+N9wuFkh7p9AIgbQKel9vNWShxF2opCJ9Oa3sECVyMFJuN/JpoOLKb2Wc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":594900},"main":"dist/index.cjs.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"c2e71ce336f60c93d75f8a995eae498687ac77dd","scripts":{"dev":"next dev -p 8888","pub":"npm run build && npm publish","lint":"eslint .","pret":"prettier -c .","build":"npm run pret && npm run lint && npm run clean && rollup -c","clean":"rm -rf dist","watch":"rollup -c -w","format":"prettier --write './**/*.{js,jsx,ts,tsx,css,md,json}' --config ./.prettierrc","lint:fix":"eslint --fix .","pret:fix":"prettier -w ."},"_npmUser":{"name":"seerr-team","email":"team@seerr.dev"},"repository":{"url":"git+https://github.com/seerr-team/react-tailwindcss-datepicker.git","type":"git"},"_npmVersion":"10.9.4","description":"A modern React Datepicker using Tailwind CSS 3","directories":{},"_nodeVersion":"22.21.1","_hasShrinkwrap":false,"devDependencies":{"next":"^13.1.1","dayjs":"^1.11.7","react":"^18.2.0","tslib":"^2.4.0","eslint":"^8.29.0","rollup":"^2.77.2","postcss":"^8.4.19","prettier":"^2.8.0","react-dom":"^18.2.0","typescript":"^4.8.4","tailwindcss":"^3.2.4","@types/react":"^18.0.21","autoprefixer":"^10.4.13","@tailwindcss/forms":"^0.5.3","eslint-config-next":"^13.1.1","eslint-plugin-react":"^7.31.11","eslint-plugin-import":"^2.26.0","eslint-config-prettier":"^8.5.0","eslint-plugin-prettier":"^4.2.1","@rollup/plugin-commonjs":"^22.0.1","@rollup/plugin-typescript":"^9.0.2","@typescript-eslint/parser":"^5.45.0","eslint-plugin-react-hooks":"^4.6.0","@rollup/plugin-node-resolve":"^13.3.0","@typescript-eslint/eslint-plugin":"^5.45.0"},"peerDependencies":{"dayjs":"^1.11.6","react":"^17.0.2 || ^18.2.0"},"_npmOperationalInternal":{"tmp":"tmp/react-tailwindcss-datepicker_1.3.4_1769292329917_0.21399738846297756","host":"s3://npm-registry-packages-npm-production"}}},"time":{"created":"2026-01-24T22:05:29.851Z","modified":"2026-01-25T17:06:38.929Z","1.3.4":"2026-01-24T22:05:30.208Z"},"bugs":{"url":"https://github.com/seerr-team/react-tailwindcss-datepicker/issues"},"author":{"name":"onesine"},"license":"MIT","homepage":"https://github.com/seerr-team/react-tailwindcss-datepicker#readme","keywords":["react-tailwindcss-datepicker","react-datepicker","tailwind-datepicker","datepicker","date-picker","daterangepicker","react-daterangepicker","date-range","date-range-picker","tailwind-daterange-picker"],"repository":{"url":"git+https://github.com/seerr-team/react-tailwindcss-datepicker.git","type":"git"},"description":"A modern React Datepicker using Tailwind CSS 3","maintainers":[{"email":"hello@fallenbagel.com","name":"fallen.bagel"},{"email":"tho.gauthier@outlook.fr","name":"gauthier-th"}],"readme":"# React Tailwindcss Datepicker\n\n<p align=\"center\">\n    <a href=\"https://react-tailwindcss-datepicker.vercel.app/\" target=\"_blank\">\n      <img alt=\"React Tailwindcss Datepicker\" width=\"100\" style=\"border-radius: 100%;\" src=\"https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/calendar_logo.svg?raw=true\">\n    </a><br><br>\n    A modern date range picker component for React using Tailwind 3 and dayjs. Alternative to Litepie Datepicker which uses Vuejs.\n</p>\n\n<div align=\"center\">\n    \n[![npm version](https://img.shields.io/npm/v/react-tailwindcss-datepicker?style=flat-square)](https://www.npmjs.com/package/react-tailwindcss-datepicker)\n[![npm downloads](https://img.shields.io/npm/dt/react-tailwindcss-datepicker?style=flat-square)](https://www.npmjs.com/package/react-tailwindcss-datepicker)\n    \n</div>\n\n## Contents\n* [Features](#features)\n* [Documentation](#documentation)\n* [Installation](#installation)\n* [Simple Usage](#simple-usage)\n* [Theming Options](#theming-options)\n* [Playground](#playground)\n* [Contributing](#contributing)\n\n##  Features\n- ✅ Theming options\n- ✅ Dark mode\n- ✅ Single Date\n- ✅ Single date use Range\n- ✅ Shortcuts\n- ✅ TypeScript support\n- ✅ Localization(i18n)\n- ✅ Date formatting\n- ✅ Disable specific dates\n- ✅ Minimum Date and Maximum Date\n- ⬜ Custom shortcuts\n\n## Documentation\n\nGo to [full documentation](https://react-tailwindcss-datepicker.vercel.app/)\n\n## Installation\n\n⚠️ React Tailwindcss Datepicker uses Tailwind CSS 3 (with the [@tailwindcss/forms](https://github.com/tailwindlabs/tailwindcss-forms) plugin) & [Dayjs](https://day.js.org/en/) under the hood to work.\n\n### Install via npm\n\n```\n$ npm install react-tailwindcss-datepicker \n```\n\n### Install via yarn\n\n```\n$ yarn add react-tailwindcss-datepicker \n```\n\nMake sure you have installed the peer dependencies as well with the below versions.\n```\n\"dayjs\": \"^1.11.6\",\n\"react\": \"^17.0.2 || ^18.2.0\"\n```\n\n## Simple Usage\n\n#### Tailwindcss Configuration\nAdd the datepicker to your tailwind configuration using this code\n\n```javascript\n// in your tailwind.config.js\nmodule.exports = {\n    // ...\n    content: [\"./src/**/*.{js,jsx,ts,tsx}\", \"./node_modules/react-tailwindcss-datepicker/dist/index.esm.js\"],\n    // ...\n}\n```\n\nThen use react-tailwindcss-select in your app:\n\n```jsx\nimport React, {useState} from \"react\";\nimport Datepicker from \"react-tailwindcss-datepicker\";\n\nconst App = () => {\n    const [value, setValue] = useState({\n        startDate: new Date(),\n        endDate: new Date().setMonth(11)\n    });\n    \n    const handleValueChange = (newValue) => {\n        console.log(\"newValue:\", newValue);\n        setValue(newValue);\n    }\n    \n    return (\n        <div>\n            <Datepicker\n                value={value}\n                onChange={handleValueChange}\n            />\n        </div>\n    );\n};\n\nexport default App;\n```\n\n## Theming options\n\n**Light Mode**\n\n![Light Mode](https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/Screen_Shot_2022-08-04_at_17.04.09_light.png?raw=true)\n\n**Dark Mode**\n\n![Dark Mode](https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/Screen_Shot_2022-08-04_at_17.04.09_dark.png?raw=true)\n\n**Supported themes**\n![Theme supported](https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/Screen_Shot_2022-08-04_at_17.04.09_theme.png?raw=true)\n\n**Teal themes example**\n![Theme supported](https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/Screen_Shot_2022-08-04_at_17.04.09_teal.png?raw=true)\n\nYou can find the demo at [here](https://react-tailwindcss-datepicker.vercel.app/demo)\n\n> **Info**\n>\n> 👉 To discover the other possibilities offered by this library, you can consult the [full documentation](https://react-tailwindcss-datepicker.vercel.app/).\n\n\n## PlayGround\n\nClone the `master` branch and run commands:\n\n```sh\n# Using npm\nnpm install && npm dev\n\n# Using yarn\nyarn install && yarn dev\n\n```\n\nOpen a browser and navigate to `http://localhost:8888`\n\n## Contributing\n\nSee [CONTRIBUTING.md](https://github.com/onesine/react-tailwindcss-datepicker/blob/master/CONTRIBUTING.md)\n\n## Official Documentation repo\n[https://github.com/onesine/react-tailwindcss-datepicker-doc](https://github.com/onesine/react-tailwindcss-datepicker-doc)\n\n## Thanks to\n- [Litepie Datepicker](https://litepie.com/)\n- [Vue Tailwind Datepicker](https://vue-tailwind-datepicker.com/)\n- [React](https://reactjs.org/)\n- [Tailwind CSS](https://tailwindcss.com/)\n- [dayjs](https://day.js.org/)\n\nI thank you in advance for your contribution to this project.\n\n## License\n[MIT](LICENSE) Licensed. Copyright (c) Lewhe Onesine 2022.\n","readmeFilename":"README.md"}