[ { "path": ".github/CODE_OF_CONDUCT.md", "content": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nWe as members, contributors, and leaders pledge to make participation in our\ncommunity a harassment-free experience for everyone, regardless of age, body\nsize, visible or invisible disability, ethnicity, sex characteristics, gender\nidentity and expression, level of experience, education, socio-economic status,\nnationality, personal appearance, race, religion, or sexual identity\nand orientation.\n\nWe pledge to act and interact in ways that contribute to an open, welcoming,\ndiverse, inclusive, and healthy community.\n\n## Our Standards\n\nExamples of behavior that contributes to a positive environment for our\ncommunity include:\n\n* Demonstrating empathy and kindness toward other people\n* Being respectful of differing opinions, viewpoints, and experiences\n* Giving and gracefully accepting constructive feedback\n* Accepting responsibility and apologizing to those affected by our mistakes,\n and learning from the experience\n* Focusing on what is best not just for us as individuals, but for the\n overall community\n\nExamples of unacceptable behavior include:\n\n* The use of sexualized language or imagery, and sexual attention or\n advances of any kind\n* Trolling, insulting or derogatory comments, and personal or political attacks\n* Public or private harassment\n* Publishing others' private information, such as a physical or email\n address, without their explicit permission\n* Other conduct which could reasonably be considered inappropriate in a\n professional setting\n\n## Enforcement Responsibilities\n\nCommunity leaders are responsible for clarifying and enforcing our standards of\nacceptable behavior and will take appropriate and fair corrective action in\nresponse to any behavior that they deem inappropriate, threatening, offensive,\nor harmful.\n\nCommunity leaders have the right and responsibility to remove, edit, or reject\ncomments, commits, code, wiki edits, issues, and other contributions that are\nnot aligned to this Code of Conduct, and will communicate reasons for moderation\ndecisions when appropriate.\n\n## Scope\n\nThis Code of Conduct applies within all community spaces, and also applies when\nan individual is officially representing the community in public spaces.\nExamples of representing our community include using an official e-mail address,\nposting via an official social media account, or acting as an appointed\nrepresentative at an online or offline event.\n\n## Enforcement\n\nInstances of abusive, harassing, or otherwise unacceptable behavior may be\nreported to the community leaders responsible for enforcement at\n.\nAll complaints will be reviewed and investigated promptly and fairly.\n\nAll community leaders are obligated to respect the privacy and security of the\nreporter of any incident.\n\n## Enforcement Guidelines\n\nCommunity leaders will follow these Community Impact Guidelines in determining\nthe consequences for any action they deem in violation of this Code of Conduct:\n\n### 1. Correction\n\n**Community Impact**: Use of inappropriate language or other behavior deemed\nunprofessional or unwelcome in the community.\n\n**Consequence**: A private, written warning from community leaders, providing\nclarity around the nature of the violation and an explanation of why the\nbehavior was inappropriate. A public apology may be requested.\n\n### 2. Warning\n\n**Community Impact**: A violation through a single incident or series\nof actions.\n\n**Consequence**: A warning with consequences for continued behavior. No\ninteraction with the people involved, including unsolicited interaction with\nthose enforcing the Code of Conduct, for a specified period of time. This\nincludes avoiding interactions in community spaces as well as external channels\nlike social media. Violating these terms may lead to a temporary or\npermanent ban.\n\n### 3. Temporary Ban\n\n**Community Impact**: A serious violation of community standards, including\nsustained inappropriate behavior.\n\n**Consequence**: A temporary ban from any sort of interaction or public\ncommunication with the community for a specified period of time. No public or\nprivate interaction with the people involved, including unsolicited interaction\nwith those enforcing the Code of Conduct, is allowed during this period.\nViolating these terms may lead to a permanent ban.\n\n### 4. Permanent Ban\n\n**Community Impact**: Demonstrating a pattern of violation of community\nstandards, including sustained inappropriate behavior, harassment of an\nindividual, or aggression toward or disparagement of classes of individuals.\n\n**Consequence**: A permanent ban from any sort of public interaction within\nthe community.\n\n## Attribution\n\nThis Code of Conduct is adapted from the [Contributor Covenant][homepage],\nversion 2.0, available at\nhttps://www.contributor-covenant.org/version/2/0/code_of_conduct.html.\n\nCommunity Impact Guidelines were inspired by [Mozilla's code of conduct\nenforcement ladder](https://github.com/mozilla/diversity).\n\n[homepage]: https://www.contributor-covenant.org\n\nFor answers to common questions about this code of conduct, see the FAQ at\nhttps://www.contributor-covenant.org/faq. Translations are available at\nhttps://www.contributor-covenant.org/translations.\n" }, { "path": ".github/CONTRIBUTING.md", "content": "# Contributing to Shadcn-Admin\n\nThank you for considering contributing to **shadcn-admin**! Every contribution is valuable, whether it's reporting bugs, suggesting improvements, adding features, or refining README.\n\n## Table of Contents\n\n1. [Getting Started](#getting-started)\n2. [How to Contribute](#how-to-contribute)\n3. [Code Standards](#code-standards)\n4. [Pull Request Guidelines](#pull-request-guidelines)\n5. [Reporting Issues](#reporting-issues)\n6. [Community Guidelines](#community-guidelines)\n\n---\n\n## Getting Started\n\n1. **Fork** the repository.\n2. **Clone** your fork:\n\n ```bash\n git clone https://github.com/your-username/shadcn-admin.git\n ```\n\n3. **Install dependencies:**\n\n ```bash\n pnpm install\n ```\n\n4. **Run the project locally:**\n\n ```bash\n pnpm dev\n ```\n\n5. Create a new branch for your contribution:\n\n ```bash\n git checkout -b feature/your-feature\n ```\n\n---\n\n## How to Contribute\n\n- **Feature Requests:** Open an issue or start a discussion to discuss the feature before implementation.\n- **Bug Fixes:** Provide clear reproduction steps in your issue.\n- **Documentation:** Improvements to the documentation (README) are always appreciated.\n\n> **Note:** Pull Requests adding new features without a prior issue or discussion will **not be accepted**.\n\n---\n\n## Code Standards\n\n- Follow the existing **ESLint** and **Prettier** configurations.\n- Ensure your code is **type-safe** with **TypeScript**.\n- Maintain consistency with the existing code structure.\n\n> **Tips!** Before submitting your changes, run the following commands:\n\n```bash\npnpm lint && pnpm format && pnpm knip && pnpm build\n```\n\n---\n\n## Pull Request Guidelines\n\n- **Follow the [PR Template](./PULL_REQUEST_TEMPLATE.md):**\n - Description\n - Types of changes\n - Checklist\n - Further comments\n - Related Issue\n- Ensure your changes pass **CI checks**.\n- Keep PRs **focused** and **concise**.\n- Reference related issues in your PR description.\n\n---\n\n## Reporting Issues\n\n- Clearly describe the issue.\n- Provide reproduction steps if applicable.\n- Include screenshots or code examples if relevant.\n\n---\n\n## Community Guidelines\n\n- Be respectful and constructive.\n- Follow the [Code of Conduct](./CODE_OF_CONDUCT.md).\n- Stay on topic in discussions.\n\n---\n\nThank you for helping make **shadcn-admin** better! πŸš€\n\nIf you have any questions, feel free to reach out via [Discussions](https://github.com/satnaing/shadcn-admin/discussions).\n" }, { "path": ".github/FUNDING.yml", "content": "github: [satnaing]\nbuy_me_a_coffee: satnaing\n\n# patreon: # Replace with a single Patreon username\n# open_collective: # Replace with a single Open Collective username\n# ko_fi: # Replace with a single Ko-fi username\n# tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel\n# community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry\n# liberapay: # Replace with a single Liberapay username\n# issuehunt: # Replace with a single IssueHunt username\n# lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry\n# polar: # Replace with a single Polar username\n# thanks_dev: # Replace with a single thanks.dev username\n# custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']\n" }, { "path": ".github/ISSUE_TEMPLATE/config.yml", "content": "blank_issues_enabled: false\ncontact_links:\n - name: Shadcn-Admin Discussions\n url: https://github.com/satnaing/shadcn-admin/discussions\n about: Please ask and answer questions here." }, { "path": ".github/ISSUE_TEMPLATE/✨-feature-request.md", "content": "---\nname: \"✨ Feature Request\"\nabout: Suggest an idea for improving Shadcn-Admin\ntitle: \"[Feature Request]: \"\nlabels: enhancement\nassignees: \"\"\n---\n\n**Is your feature request related to a problem? Please describe.**\nA clear and concise description of what the problem is. Ex. I'm always frustrated when [...]\n\n**Describe the solution you'd like**\nA clear and concise description of what you want to happen.\n\n**Describe alternatives you've considered**\nA clear and concise description of any alternative solutions or features you've considered.\n\n**Additional context**\nAdd any other context or screenshots about the feature request here.\n" }, { "path": ".github/ISSUE_TEMPLATE/🐞-bug-report.md", "content": "---\nname: \"\\U0001F41E Bug report\"\nabout: Report a bug or unexpected behavior in Shadcn-Admin\ntitle: \"[BUG]: \"\nlabels: bug\nassignees: \"\"\n---\n\n**Describe the bug**\nA clear and concise description of what the bug is.\n\n**To Reproduce**\nSteps to reproduce the behavior:\n\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'\n4. See error\n\n**Expected behavior**\nA clear and concise description of what you expected to happen.\n\n**Screenshots**\nIf applicable, add screenshots to help explain your problem.\n\n**Additional context**\nAdd any other context about the problem here.\n" }, { "path": ".github/PULL_REQUEST_TEMPLATE.md", "content": "## Description\n\n\n\n## Types of changes\n\n\n\n- [ ] Bug Fix (non-breaking change which fixes an issue)\n- [ ] New Feature (non-breaking change which adds functionality)\n- [ ] Others (any other types not listed above)\n\n## Checklist\n\n\n\n- [ ] I have read the [Contributing Guide](https://github.com/satnaing/shadcn-admin/blob/main/.github/CONTRIBUTING.md)\n\n## Further comments\n\n\n\n## Related Issue\n\n\n\nCloses: #" }, { "path": ".github/workflows/ci.yml", "content": "name: Continuous Integration\n\non:\n push:\n branches:\n - main\n\n pull_request:\n branches:\n - main\n\njobs:\n install-lint-build:\n runs-on: ubuntu-latest\n\n steps:\n - name: Checkout code\n uses: actions/checkout@v4\n\n - name: Setup Node.js\n uses: actions/setup-node@v4\n with:\n node-version: 20\n\n - name: Install pnpm\n run: npm install -g pnpm\n\n - name: Install dependencies\n run: pnpm install --frozen-lockfile\n\n - name: Lint the code\n run: pnpm lint\n\n # - name: Analyze unused files and dependencies\n # run: pnpm knip\n\n - name: Run Prettier check\n run: pnpm format:check\n\n - name: Build the project\n run: pnpm build\n" }, { "path": ".github/workflows/stale.yml", "content": "name: Close inactive issues/PR\n\non:\n schedule:\n - cron: '38 18 * * *'\n\njobs:\n stale:\n\n runs-on: ubuntu-latest\n permissions:\n issues: write\n pull-requests: write\n\n steps:\n - uses: actions/stale@v5\n with:\n repo-token: ${{ secrets.GITHUB_TOKEN }}\n days-before-issue-stale: 120\n days-before-issue-close: 120\n stale-issue-label: \"stale\"\n stale-issue-message: \"This issue is stale because it has been open for 120 days with no activity.\"\n close-issue-message: \"This issue was closed because it has been inactive for 120 days since being marked as stale.\"\n days-before-pr-stale: 120\n days-before-pr-close: 120\n stale-pr-label: \"stale\"\n stale-pr-message: \"This PR is stale because it has been open for 120 days with no activity.\"\n close-pr-message: \"This PR was closed because it has been inactive for 120 days since being marked as stale.\"\n operations-per-run: 0\n" }, { "path": ".gitignore", "content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\nlerna-debug.log*\n\nnode_modules\ndist\ndist-ssr\n*.local\n\n.env\n\n# Editor directories and files\n.vscode/*\n!.vscode/extensions.json\n.idea\n.DS_Store\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n" }, { "path": ".prettierignore", "content": "# Ignore everything\n/*\n\n# Except these files & folders\n!/src\n!index.html\n!package.json\n!tailwind.config.js\n!tsconfig.json\n!tsconfig.node.json\n!vite.config.ts\n!.prettierrc\n!README.md\n!eslint.config.js\n!postcss.config.js\n\n# Ignore auto generated routeTree.gen.ts\n/src/routeTree.gen.ts" }, { "path": ".prettierrc", "content": "{\n \"arrowParens\": \"always\",\n \"semi\": false,\n \"tabWidth\": 2,\n \"printWidth\": 80,\n \"singleQuote\": true,\n \"jsxSingleQuote\": true,\n \"trailingComma\": \"es5\",\n \"bracketSpacing\": true,\n \"endOfLine\": \"lf\",\n \"plugins\": [\n \"@trivago/prettier-plugin-sort-imports\",\n \"prettier-plugin-tailwindcss\"\n ],\n \"tailwindStylesheet\": \"./src/styles/index.css\",\n \"importOrder\": [\n \"^path$\",\n \"^vite$\",\n \"^@vitejs/(.*)$\",\n \"^react$\",\n \"^react-dom/client$\",\n \"^react/(.*)$\",\n \"^globals$\",\n \"^zod$\",\n \"^axios$\",\n \"^date-fns$\",\n \"^react-hook-form$\",\n \"^use-intl$\",\n \"^@radix-ui/(.*)$\",\n \"^@hookform/resolvers/zod$\",\n \"^@tanstack/react-query$\",\n \"^@tanstack/react-router$\",\n \"^@tanstack/react-table$\",\n \"\",\n \"^@/assets/(.*)\",\n \"^@/api/(.*)$\",\n \"^@/stores/(.*)$\",\n \"^@/lib/(.*)$\",\n \"^@/utils/(.*)$\",\n \"^@/constants/(.*)$\",\n \"^@/context/(.*)$\",\n \"^@/hooks/(.*)$\",\n \"^@/components/layouts/(.*)$\",\n \"^@/components/ui/(.*)$\",\n \"^@/components/errors/(.*)$\",\n \"^@/components/(.*)$\",\n \"^@/features/(.*)$\",\n \"^[./]\"\n ]\n}\n" }, { "path": "CHANGELOG.md", "content": "## v2.2.1 (2025-11-06)\n\n### Fix\n\n- **style**: update data attribute class in authenticated layout (#249)\n- prevent navigation to 500 page during development (#240)\n- **style**: apply variant 'destructive' to sign-out buttons (#236)\n- add missing space in profile form (#235)\n\n### Refactor\n\n- enhance tables and update table layout (#234)\n\n## v2.2.0 (2025-10-09)\n\n### Feat\n\n- add analytics tab in dashboard page (#220)\n- add extra AppTitle component for sidebar header (#216)\n- update 2-column sign in page (#213)\n\n### Fix\n\n- update sidebar menu chevron direction in RTL mode (#229)\n- pagination button spacing (#215)\n- upgrade lucide-react to solve antivirus warning (#211)\n\n### Refactor\n\n- move sidebar related components into app-sidebar\n- change SidebarInset component from 'main' to 'div'\n- replace extra main container query with content container query\n- replace inline svg logo with logo component (#214)\n\n## v2.1.0 (2025-08-23)\n\n### Feat\n\n- enhance data table pagination with page numbers (#207)\n- enhance auth flow with sign-out dialogs and redirect functionality (#206)\n\n### Refactor\n\n- reorganize utility files into `lib/` folder (#209)\n- extract data-table components and reorganize structure (#208)\n\n## v2.0.0 (2025-08-16)\n\n### BREAKING CHANGE\n\n- CSS file structure has been reorganized\n\n### Feat\n\n- add search param sync in apps route (#200)\n- improve tables and sync table states with search param (#199)\n- add data table bulk action toolbar (#196)\n- add config drawer and update overall layout (#186)\n- RTL support (#179)\n\n### Fix\n\n- adjust layout styles in search and top nav in dashboard page\n- update spacing and layout styles\n- update faceted icon color\n- improve user table hover & selected styles (#195)\n- add max-width for large screens to improve responsiveness (#194)\n- adjust chat border radius for better responsiveness (#193)\n- update hard-coded or inconsistent colors (#191)\n- use variable for inset layout height calculation\n- faded-bottom overflow issue in inset layout\n- hide unnecessary configs on mobile (#189)\n- adjust file input text vertical alignment (#188)\n\n### Refactor\n\n- enforce consistency and code quality (#198)\n- improve code quality and consistency (#197)\n- update error routes (#192)\n- remove DirSwitch component and its usage in Tasks (#190)\n- standardize using cookie as persist state (#187)\n- separate CSS into modular theme and base styles (#185)\n- replace tabler icons with lucide icons (#183)\n\n## v1.4.2 (2025-07-23)\n\n### Fix\n\n- remove unnecessary transitions in table (#176)\n- overflow background in tables (#175)\n\n## v1.4.1 (2025-06-25)\n\n### Fix\n\n- user list overflow in chat (#160)\n- prevent showing collapsed menu on mobile (#155)\n- white background select dropdown in dark mode (#149)\n\n### Refactor\n\n- update font config guide in fonts.ts (#164)\n\n## v1.4.0 (2025-05-25)\n\n### Feat\n\n- **clerk**: add Clerk for auth and protected route (#146)\n\n### Fix\n\n- add an indicator for nested pages in search (#147)\n- update faded-bottom color with css variable (#139)\n\n## v1.3.0 (2025-04-16)\n\n### Fix\n\n- replace custom otp with input-otp component (#131)\n- disable layout animation on mobile (#130)\n- upgrade react-day-picker and update calendar component (#129)\n\n### Others\n\n- upgrade Tailwind CSS to v4 (#125)\n- upgrade dependencies (#128)\n- configure automatic code-splitting (#127)\n\n## v1.2.0 (2025-04-12)\n\n### Feat\n\n- add loading indicator during page transitions (#119)\n- add light favicons and theme-based switching (#112)\n- add new chat dialog in chats page (#90)\n\n### Fix\n\n- add fallback font for fontFamily (#110)\n- broken focus behavior in add user dialog (#113)\n\n## v1.1.0 (2025-01-30)\n\n### Feat\n\n- allow changing font family in setting\n\n### Fix\n\n- update sidebar color in dark mode for consistent look (#87)\n- use overflow-clip in table paginations (#86)\n- **style**: update global scrollbar style (#82)\n- toolbar filter placeholder typo in user table (#76)\n\n## v1.0.3 (2024-12-28)\n\n### Fix\n\n- add gap between buttons in import task dialog (#70)\n- hide button sort if column cannot be hidden & update filterFn (#69)\n- nav links added in profile dropdown (#68)\n\n### Refactor\n\n- optimize states in users/tasks context (#71)\n\n## v1.0.2 (2024-12-25)\n\n### Fix\n\n- update overall layout due to scroll-lock bug (#66)\n\n### Refactor\n\n- analyze and remove unused files/exports with knip (#67)\n\n## v1.0.1 (2024-12-14)\n\n### Fix\n\n- merge two button components into one (#60)\n- loading all tabler-icon chunks in dev mode (#59)\n- display menu dropdown when sidebar collapsed (#58)\n- update spacing & alignment in dialogs/drawers\n- update border & transition of sticky columns in user table\n- update heading alignment to left in user dialogs\n- add height and scroll area in user mutation dialogs\n- update `/dashboard` route to just `/`\n- **build**: replace require with import in tailwind.config.js\n\n### Refactor\n\n- remove unnecessary layout-backup file\n\n## v1.0.0 (2024-12-09)\n\n### BREAKING CHANGE\n\n- Restructured the entire folder\nhierarchy to adopt a feature-based structure. This\nchange improves code modularity and maintainability\nbut introduces breaking changes.\n\n### Feat\n\n- implement task dialogs\n- implement user invite dialog\n- implement users CRUD\n- implement global command/search\n- implement custom sidebar trigger\n- implement coming-soon page\n\n### Fix\n\n- uncontrolled issue in account setting\n- card layout issue in app integrations page\n- remove form reset logic from useEffect in task import\n- update JSX types due to react 19\n- prevent card stretch in filtered app layout\n- layout wrap issue in tasks page on mobile\n- update user column hover and selected colors\n- add setTimeout in user dialog closing\n- layout shift issue in dropdown modal\n- z-axis overflow issue in header\n- stretch search bar only in mobile\n- language dropdown issue in account setting\n- update overflow contents with scroll area\n\n### Refactor\n\n- update layouts and extract common layout\n- reorganize project to feature-based structure\n\n## v1.0.0-beta.5 (2024-11-11)\n\n### Feat\n\n- add multiple language support (#37)\n\n### Fix\n\n- ensure site syncs with system theme changes (#49)\n- recent sales responsive on ipad view (#40)\n\n## v1.0.0-beta.4 (2024-09-22)\n\n### Feat\n\n- upgrade theme button to theme dropdown (#33)\n- **a11y**: add \"Skip to Main\" button to improve keyboard navigation (#27)\n\n### Fix\n\n- optimize onComplete/onIncomplete invocation (#32)\n- solve asChild attribute issue in custom button (#31)\n- improve custom Button component (#28)\n\n## v1.0.0-beta.3 (2024-08-25)\n\n### Feat\n\n- implement chat page (#21)\n- add 401 error page (#12)\n- implement apps page\n- add otp page\n\n### Fix\n\n- prevent focus zoom on mobile devices (#20)\n- resolve eslint script issue (#18)\n- **a11y**: update default aria-label of each pin-input\n- resolve OTP paste issue in multi-digit pin-input\n- update layouts and solve overflow issues (#11)\n- sync pin inputs programmatically\n\n## v1.0.0-beta.2 (2024-03-18)\n\n### Feat\n\n- implement custom pin-input component (#2)\n\n## v1.0.0-beta.1 (2024-02-08)\n\n### Feat\n\n- update theme-color meta tag when theme is updated\n- add coming soon page in broken pages\n- implement tasks table and page\n- add remaining settings pages\n- add example error page for settings\n- update general error page to be more flexible\n- implement settings layout and settings profile page\n- add error pages\n- add password-input custom component\n- add sign-up page\n- add forgot-password page\n- add box sign in page\n- add email + password sign in page\n- make sidebar responsive and accessible\n- add tailwind prettier plugin\n- make sidebar collapsed state in local storage\n- add check current active nav hook\n- add loader component ui\n- update dropdown nav by default if child is active\n- add main-panel in dashboard\n- **ui**: add dark mode\n- **ui**: implement side nav ui\n\n### Fix\n\n- update incorrect overflow side nav height\n- exclude shadcn components from linting and remove unused props\n- solve text overflow issue when nav text is long\n- replace nav with dropdown in mobile topnav\n- make sidebar scrollable when overflow\n- update nav link keys\n- **ui**: update label style\n\n### Refactor\n\n- move password-input component into custom component dir\n- add custom button component\n- extract redundant codes into layout component\n- update react-router to use new api for routing\n- update main panel layout\n- update major layouts and styling\n- update main panel to be responsive\n- update sidebar collapsed state to false in mobile\n- update sidebar logo and title\n- **ui**: remove unnecessary spacing\n- remove unused files\n" }, { "path": "LICENSE", "content": "MIT License\n\nCopyright (c) 2024 Sat Naing\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n" }, { "path": "README.md", "content": "# Shadcn Admin Dashboard\n\nAdmin Dashboard UI crafted with Shadcn and Vite. Built with responsiveness and accessibility in mind.\n\n![alt text](public/images/shadcn-admin.png)\n\n[![Sponsored by Clerk](https://img.shields.io/badge/Sponsored%20by-Clerk-5b6ee1?logo=clerk)](https://go.clerk.com/GttUAaK)\n\nI've been creating dashboard UIs at work and for my personal projects. I always wanted to make a reusable collection of dashboard UI for future projects; and here it is now. While I've created a few custom components, some of the code is directly adapted from ShadcnUI examples.\n\n> This is not a starter project (template) though. I'll probably make one in the future.\n\n## Features\n\n- Light/dark mode\n- Responsive\n- Accessible\n- With built-in Sidebar component\n- Global search command\n- 10+ pages\n- Extra custom components\n- RTL support\n\n
\nCustomized Components (click to expand)\n\nThis project uses Shadcn UI components, but some have been slightly modified for better RTL (Right-to-Left) support and other improvements. These customized components differ from the original Shadcn UI versions.\n\nIf you want to update components using the Shadcn CLI (e.g., `npx shadcn@latest add `), it's generally safe for non-customized components. For the listed customized ones, you may need to manually merge changes to preserve the project's modifications and avoid overwriting RTL support or other updates.\n\n> If you don't require RTL support, you can safely update the 'RTL Updated Components' via the Shadcn CLI, as these changes are primarily for RTL compatibility. The 'Modified Components' may have other customizations to consider.\n\n### Modified Components\n\n- scroll-area\n- sonner\n- separator\n\n### RTL Updated Components\n\n- alert-dialog\n- calendar\n- command\n- dialog\n- dropdown-menu\n- select\n- table\n- sheet\n- sidebar\n- switch\n\n**Notes:**\n\n- **Modified Components**: These have general updates, potentially including RTL adjustments.\n- **RTL Updated Components**: These have specific changes for RTL language support (e.g., layout, positioning).\n- For implementation details, check the source files in `src/components/ui/`.\n- All other Shadcn UI components in the project are standard and can be safely updated via the CLI.\n\n
\n\n## Tech Stack\n\n**UI:** [ShadcnUI](https://ui.shadcn.com) (TailwindCSS + RadixUI)\n\n**Build Tool:** [Vite](https://vitejs.dev/)\n\n**Routing:** [TanStack Router](https://tanstack.com/router/latest)\n\n**Type Checking:** [TypeScript](https://www.typescriptlang.org/)\n\n**Linting/Formatting:** [ESLint](https://eslint.org/) & [Prettier](https://prettier.io/)\n\n**Icons:** [Lucide Icons](https://lucide.dev/icons/), [Tabler Icons](https://tabler.io/icons) (Brand icons only)\n\n**Auth (partial):** [Clerk](https://go.clerk.com/GttUAaK)\n\n## Run Locally\n\nClone the project\n\n```bash\n git clone https://github.com/satnaing/shadcn-admin.git\n```\n\nGo to the project directory\n\n```bash\n cd shadcn-admin\n```\n\nInstall dependencies\n\n```bash\n pnpm install\n```\n\nStart the server\n\n```bash\n pnpm run dev\n```\n\n## Sponsoring this project ❀️\n\nIf you find this project helpful or use this in your own work, consider [sponsoring me](https://github.com/sponsors/satnaing) to support development and maintenance. You can [buy me a coffee](https://buymeacoffee.com/satnaing) as well. Don’t worry, every penny helps. Thank you! πŸ™\n\nFor questions or sponsorship inquiries, feel free to reach out at [satnaingdev@gmail.com](mailto:satnaingdev@gmail.com).\n\n### Current Sponsor\n\n- [Clerk](https://go.clerk.com/GttUAaK) - authentication and user management for the modern web\n\n## Author\n\nCrafted with 🀍 by [@satnaing](https://github.com/satnaing)\n\n## License\n\nLicensed under the [MIT License](https://choosealicense.com/licenses/mit/)\n" }, { "path": "components.json", "content": "{\n \"$schema\": \"https://ui.shadcn.com/schema.json\",\n \"style\": \"new-york\",\n \"rsc\": false,\n \"tsx\": true,\n \"tailwind\": {\n \"config\": \"\",\n \"css\": \"src/styles/index.css\",\n \"baseColor\": \"slate\",\n \"cssVariables\": true,\n \"prefix\": \"\"\n },\n \"aliases\": {\n \"components\": \"@/components\",\n \"utils\": \"@/lib/utils\",\n \"ui\": \"@/components/ui\",\n \"lib\": \"@/lib\",\n \"hooks\": \"@/hooks\"\n },\n \"iconLibrary\": \"lucide\"\n}\n" }, { "path": "cz.yaml", "content": "---\ncommitizen:\n name: cz_conventional_commits\n tag_format: v$version\n update_changelog_on_bump: true\n version_provider: npm\n version_scheme: semver\n" }, { "path": "eslint.config.js", "content": "import globals from 'globals'\nimport js from '@eslint/js'\nimport pluginQuery from '@tanstack/eslint-plugin-query'\nimport reactHooks from 'eslint-plugin-react-hooks'\nimport reactRefresh from 'eslint-plugin-react-refresh'\nimport { defineConfig } from 'eslint/config'\nimport tseslint from 'typescript-eslint'\n\nexport default defineConfig(\n { ignores: ['dist', 'src/components/ui'] },\n {\n extends: [\n js.configs.recommended,\n ...tseslint.configs.recommended,\n ...pluginQuery.configs['flat/recommended'],\n ],\n files: ['**/*.{ts,tsx}'],\n languageOptions: {\n ecmaVersion: 2020,\n globals: globals.browser,\n },\n plugins: {\n 'react-hooks': reactHooks,\n 'react-refresh': reactRefresh,\n },\n rules: {\n ...reactHooks.configs.recommended.rules,\n 'react-refresh/only-export-components': [\n 'warn',\n { allowConstantExport: true },\n ],\n 'no-console': 'error',\n 'no-unused-vars': 'off',\n '@typescript-eslint/no-unused-vars': [\n 'error',\n {\n args: 'all',\n argsIgnorePattern: '^_',\n caughtErrors: 'all',\n caughtErrorsIgnorePattern: '^_',\n destructuredArrayIgnorePattern: '^_',\n varsIgnorePattern: '^_',\n ignoreRestSiblings: true,\n },\n ],\n // Enforce type-only imports for TypeScript types\n '@typescript-eslint/consistent-type-imports': [\n 'error',\n {\n prefer: 'type-imports',\n fixStyle: 'inline-type-imports',\n disallowTypeAnnotations: false,\n },\n ],\n // Prevent duplicate imports from the same module\n 'no-duplicate-imports': 'error',\n },\n }\n)\n" }, { "path": "index.html", "content": "\n\n \n \n \n \n \n \n \n\n \n Shadcn Admin\n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n\n \n \n\n \n
\n \n \n\n" }, { "path": "knip.config.ts", "content": "import type { KnipConfig } from 'knip';\n\nconst config: KnipConfig = {\n ignore: ['src/components/ui/**', 'src/routeTree.gen.ts'],\n ignoreDependencies: [\"tailwindcss\", \"tw-animate-css\"]\n};\n\nexport default config;" }, { "path": "netlify.toml", "content": "[[redirects]]\n from = \"/*\"\n to = \"/index.html\"\n status = 200" }, { "path": "package.json", "content": "{\n \"name\": \"shadcn-admin\",\n \"private\": false,\n \"version\": \"2.2.1\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"tsc -b && vite build\",\n \"lint\": \"eslint .\",\n \"preview\": \"vite preview\",\n \"format:check\": \"prettier --check .\",\n \"format\": \"prettier --write .\",\n \"knip\": \"knip\"\n },\n \"dependencies\": {\n \"@clerk/clerk-react\": \"^5.58.1\",\n \"@hookform/resolvers\": \"^5.2.2\",\n \"@radix-ui/react-alert-dialog\": \"^1.1.15\",\n \"@radix-ui/react-avatar\": \"^1.1.11\",\n \"@radix-ui/react-checkbox\": \"^1.3.3\",\n \"@radix-ui/react-collapsible\": \"^1.1.12\",\n \"@radix-ui/react-dialog\": \"^1.1.15\",\n \"@radix-ui/react-direction\": \"^1.1.1\",\n \"@radix-ui/react-dropdown-menu\": \"^2.1.16\",\n \"@radix-ui/react-icons\": \"^1.3.2\",\n \"@radix-ui/react-label\": \"^2.1.8\",\n \"@radix-ui/react-popover\": \"^1.1.15\",\n \"@radix-ui/react-radio-group\": \"^1.3.8\",\n \"@radix-ui/react-scroll-area\": \"^1.2.10\",\n \"@radix-ui/react-select\": \"^2.2.6\",\n \"@radix-ui/react-separator\": \"^1.1.8\",\n \"@radix-ui/react-slot\": \"^1.2.4\",\n \"@radix-ui/react-switch\": \"^1.2.6\",\n \"@radix-ui/react-tabs\": \"^1.1.13\",\n \"@radix-ui/react-tooltip\": \"^1.2.8\",\n \"@tailwindcss/vite\": \"^4.1.18\",\n \"@tanstack/react-query\": \"^5.90.12\",\n \"@tanstack/react-router\": \"^1.141.2\",\n \"@tanstack/react-table\": \"^8.21.3\",\n \"axios\": \"^1.13.5\",\n \"class-variance-authority\": \"^0.7.1\",\n \"clsx\": \"^2.1.1\",\n \"cmdk\": \"1.1.1\",\n \"date-fns\": \"^4.1.0\",\n \"input-otp\": \"^1.4.2\",\n \"lucide-react\": \"^0.561.0\",\n \"react\": \"^19.2.3\",\n \"react-day-picker\": \"9.12.0\",\n \"react-dom\": \"^19.2.3\",\n \"react-hook-form\": \"^7.68.0\",\n \"react-top-loading-bar\": \"^3.0.2\",\n \"recharts\": \"^3.6.0\",\n \"sonner\": \"^2.0.7\",\n \"tailwind-merge\": \"^3.4.0\",\n \"tailwindcss\": \"^4.1.18\",\n \"tw-animate-css\": \"^1.4.0\",\n \"zod\": \"^4.2.0\",\n \"zustand\": \"^5.0.9\"\n },\n \"devDependencies\": {\n \"@eslint/js\": \"^9.39.2\",\n \"@faker-js/faker\": \"^10.1.0\",\n \"@tanstack/eslint-plugin-query\": \"^5.91.2\",\n \"@tanstack/react-query-devtools\": \"^5.91.1\",\n \"@tanstack/react-router-devtools\": \"^1.141.2\",\n \"@tanstack/router-plugin\": \"^1.141.2\",\n \"@trivago/prettier-plugin-sort-imports\": \"^6.0.0\",\n \"@types/node\": \"^25.0.2\",\n \"@types/react\": \"^19.2.7\",\n \"@types/react-dom\": \"^19.2.3\",\n \"@vitejs/plugin-react-swc\": \"^4.2.2\",\n \"eslint\": \"^9.39.2\",\n \"eslint-plugin-react-hooks\": \"^7.0.1\",\n \"eslint-plugin-react-refresh\": \"^0.4.25\",\n \"globals\": \"^16.5.0\",\n \"knip\": \"^5.73.4\",\n \"prettier\": \"^3.7.4\",\n \"prettier-plugin-tailwindcss\": \"^0.7.2\",\n \"typescript\": \"~5.9.3\",\n \"typescript-eslint\": \"^8.49.0\",\n \"vite\": \"^7.3.0\"\n }\n}\n" }, { "path": "src/assets/brand-icons/icon-discord.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconDiscord({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Discord\n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-docker.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconDocker({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Docker\n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-facebook.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconFacebook({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Facebook\n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-figma.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconFigma({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Figma\n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-github.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconGithub({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n GitHub\n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-gitlab.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconGitlab({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n GitLab\n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-gmail.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconGmail({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Gmail\n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-medium.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconMedium({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Medium\n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-notion.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconNotion({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Notion\n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-skype.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconSkype({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Skype\n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-slack.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconSlack({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Slack\n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-stripe.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconStripe({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Stripe\n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-telegram.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconTelegram({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Telegram\n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-trello.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconTrello({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Trello\n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-whatsapp.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconWhatsapp({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n WhatsApp\n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/icon-zoom.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconZoom({ className, ...props }: SVGProps) {\n return (\n path]:stroke-current', className)}\n fill='none'\n stroke='currentColor'\n strokeWidth='2'\n strokeLinecap='round'\n strokeLinejoin='round'\n {...props}\n >\n Zoom\n \n \n \n \n )\n}\n" }, { "path": "src/assets/brand-icons/index.ts", "content": "export { IconDiscord } from './icon-discord'\nexport { IconDocker } from './icon-docker'\nexport { IconFacebook } from './icon-facebook'\nexport { IconFigma } from './icon-figma'\nexport { IconGithub } from './icon-github'\nexport { IconGitlab } from './icon-gitlab'\nexport { IconGmail } from './icon-gmail'\nexport { IconMedium } from './icon-medium'\nexport { IconNotion } from './icon-notion'\nexport { IconSkype } from './icon-skype'\nexport { IconSlack } from './icon-slack'\nexport { IconStripe } from './icon-stripe'\nexport { IconTelegram } from './icon-telegram'\nexport { IconTrello } from './icon-trello'\nexport { IconWhatsapp } from './icon-whatsapp'\nexport { IconZoom } from './icon-zoom'\n" }, { "path": "src/assets/clerk-full-logo.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function ClerkFullLogo(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/clerk-logo.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function ClerkLogo({ className, ...props }: SVGProps) {\n return (\n path]:fill-foreground', className)}\n {...props}\n >\n Clerk\n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-dir.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\nimport { type Direction } from '@/context/direction-provider'\n\ntype IconDirProps = SVGProps & {\n dir: Direction\n}\n\nexport function IconDir({ dir, className, ...props }: IconDirProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-layout-compact.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconLayoutCompact(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-layout-default.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconLayoutDefault(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-layout-full.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconLayoutFull(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-sidebar-floating.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconSidebarFloating(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-sidebar-inset.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconSidebarInset(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-sidebar-sidebar.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconSidebarSidebar(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-theme-dark.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconThemeDark(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-theme-light.tsx", "content": "import { type SVGProps } from 'react'\n\nexport function IconThemeLight(props: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/custom/icon-theme-system.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function IconThemeSystem({\n className,\n ...props\n}: SVGProps) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n" }, { "path": "src/assets/logo.tsx", "content": "import { type SVGProps } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport function Logo({ className, ...props }: SVGProps) {\n return (\n