├── .eslintrc.json ├── .gitignore ├── .idea ├── .gitignore ├── free-nextjs-admin-dashboard.iml ├── modules.xml ├── prettier.xml └── vcs.xml ├── LICENSE ├── README.md ├── banner.png ├── eslint.config.mjs ├── jsvectormap.d.ts ├── next.config.ts ├── package-lock.json ├── package.json ├── postcss.config.js ├── prettier.config.js ├── public └── images │ ├── brand │ ├── brand-01.svg │ ├── brand-02.svg │ ├── brand-03.svg │ ├── brand-04.svg │ ├── brand-05.svg │ ├── brand-06.svg │ ├── brand-07.svg │ ├── brand-08.svg │ ├── brand-09.svg │ ├── brand-10.svg │ ├── brand-11.svg │ ├── brand-12.svg │ ├── brand-13.svg │ ├── brand-14.svg │ └── brand-15.svg │ ├── cards │ ├── card-01.jpg │ ├── card-01.png │ ├── card-02.jpg │ ├── card-02.png │ ├── card-03.jpg │ └── card-03.png │ ├── carousel │ ├── carousel-01.png │ ├── carousel-02.png │ ├── carousel-03.png │ └── carousel-04.png │ ├── chat │ └── chat.jpg │ ├── country │ ├── country-01.svg │ ├── country-02.svg │ ├── country-03.svg │ ├── country-04.svg │ ├── country-05.svg │ ├── country-06.svg │ ├── country-07.svg │ └── country-08.svg │ ├── error │ ├── 404-dark.svg │ ├── 404.svg │ ├── 500-dark.svg │ ├── 500.svg │ ├── 503-dark.svg │ ├── 503.svg │ ├── maintenance-dark.svg │ ├── maintenance.svg │ ├── success-dark.svg │ └── success.svg │ ├── favicon.ico │ ├── grid-image │ ├── image-01.png │ ├── image-02.png │ ├── image-03.png │ ├── image-04.png │ ├── image-05.png │ └── image-06.png │ ├── icons │ ├── file-image-dark.svg │ ├── file-image.svg │ ├── file-pdf-dark.svg │ ├── file-pdf.svg │ ├── file-video-dark.svg │ └── file-video.svg │ ├── logo │ ├── auth-logo.svg │ ├── logo-dark.svg │ ├── logo-icon.svg │ └── logo.svg │ ├── product │ ├── product-01.jpg │ ├── product-02.jpg │ ├── product-03.jpg │ ├── product-04.jpg │ └── product-05.jpg │ ├── shape │ └── grid-01.svg │ ├── task │ ├── google-drive.svg │ ├── pdf.svg │ ├── task.jpg │ └── task.png │ ├── user │ ├── owner.jpg │ ├── user-01.jpg │ ├── user-02.jpg │ ├── user-03.jpg │ ├── user-04.jpg │ ├── user-05.jpg │ ├── user-06.jpg │ ├── user-07.jpg │ ├── user-08.jpg │ ├── user-09.jpg │ ├── user-10.jpg │ ├── user-11.jpg │ ├── user-12.jpg │ ├── user-13.jpg │ ├── user-14.jpg │ ├── user-15.jpg │ ├── user-16.jpg │ ├── user-17.jpg │ ├── user-18.jpg │ ├── user-19.jpg │ ├── user-20.jpg │ ├── user-21.jpg │ ├── user-22.jpg │ ├── user-23.jpg │ ├── user-24.jpg │ ├── user-25.jpg │ ├── user-26.jpg │ ├── user-27.jpg │ ├── user-28.jpg │ ├── user-29.jpg │ ├── user-30.jpg │ ├── user-31.jpg │ ├── user-32.jpg │ ├── user-33.jpg │ ├── user-34.jpg │ ├── user-35.jpg │ ├── user-36.jpg │ └── user-37.jpg │ └── video-thumb │ ├── thumb-16.png │ └── youtube-icon-84.svg ├── src ├── app │ ├── (admin) │ │ ├── (others-pages) │ │ │ ├── (chart) │ │ │ │ ├── bar-chart │ │ │ │ │ └── page.tsx │ │ │ │ └── line-chart │ │ │ │ │ └── page.tsx │ │ │ ├── (forms) │ │ │ │ └── form-elements │ │ │ │ │ └── page.tsx │ │ │ ├── (tables) │ │ │ │ └── basic-tables │ │ │ │ │ └── page.tsx │ │ │ ├── blank │ │ │ │ └── page.tsx │ │ │ ├── calendar │ │ │ │ └── page.tsx │ │ │ └── profile │ │ │ │ └── page.tsx │ │ ├── (ui-elements) │ │ │ ├── alerts │ │ │ │ └── page.tsx │ │ │ ├── avatars │ │ │ │ └── page.tsx │ │ │ ├── badge │ │ │ │ └── page.tsx │ │ │ ├── buttons │ │ │ │ └── page.tsx │ │ │ ├── images │ │ │ │ └── page.tsx │ │ │ ├── modals │ │ │ │ └── page.tsx │ │ │ └── videos │ │ │ │ └── page.tsx │ │ ├── layout.tsx │ │ └── page.tsx │ ├── (full-width-pages) │ │ ├── (auth) │ │ │ ├── layout.tsx │ │ │ ├── signin │ │ │ │ └── page.tsx │ │ │ └── signup │ │ │ │ └── page.tsx │ │ ├── (error-pages) │ │ │ └── error-404 │ │ │ │ └── page.tsx │ │ └── layout.tsx │ ├── favicon.ico │ ├── globals.css │ ├── layout.tsx │ └── not-found.tsx ├── components │ ├── auth │ │ ├── SignInForm.tsx │ │ └── SignUpForm.tsx │ ├── calendar │ │ └── Calendar.tsx │ ├── charts │ │ ├── bar │ │ │ └── BarChartOne.tsx │ │ └── line │ │ │ └── LineChartOne.tsx │ ├── common │ │ ├── ChartTab.tsx │ │ ├── ComponentCard.tsx │ │ ├── GridShape.tsx │ │ ├── PageBreadCrumb.tsx │ │ ├── ThemeToggleButton.tsx │ │ └── ThemeTogglerTwo.tsx │ ├── ecommerce │ │ ├── CountryMap.tsx │ │ ├── DemographicCard.tsx │ │ ├── EcommerceMetrics.tsx │ │ ├── MonthlySalesChart.tsx │ │ ├── MonthlyTarget.tsx │ │ ├── RecentOrders.tsx │ │ └── StatisticsChart.tsx │ ├── example │ │ └── ModalExample │ │ │ ├── DefaultModal.tsx │ │ │ ├── FormInModal.tsx │ │ │ ├── FullScreenModal.tsx │ │ │ ├── ModalBasedAlerts.tsx │ │ │ └── VerticallyCenteredModal.tsx │ ├── form │ │ ├── Form.tsx │ │ ├── Label.tsx │ │ ├── MultiSelect.tsx │ │ ├── Select.tsx │ │ ├── date-picker.tsx │ │ ├── form-elements │ │ │ ├── CheckboxComponents.tsx │ │ │ ├── DefaultInputs.tsx │ │ │ ├── DropZone.tsx │ │ │ ├── FileInputExample.tsx │ │ │ ├── InputGroup.tsx │ │ │ ├── InputStates.tsx │ │ │ ├── RadioButtons.tsx │ │ │ ├── SelectInputs.tsx │ │ │ ├── TextAreaInput.tsx │ │ │ └── ToggleSwitch.tsx │ │ ├── group-input │ │ │ └── PhoneInput.tsx │ │ ├── input │ │ │ ├── Checkbox.tsx │ │ │ ├── FileInput.tsx │ │ │ ├── InputField.tsx │ │ │ ├── Radio.tsx │ │ │ ├── RadioSm.tsx │ │ │ └── TextArea.tsx │ │ └── switch │ │ │ └── Switch.tsx │ ├── header │ │ ├── NotificationDropdown.tsx │ │ └── UserDropdown.tsx │ ├── tables │ │ ├── BasicTableOne.tsx │ │ └── Pagination.tsx │ ├── ui │ │ ├── alert │ │ │ └── Alert.tsx │ │ ├── avatar │ │ │ ├── Avatar.tsx │ │ │ └── AvatarText.tsx │ │ ├── badge │ │ │ └── Badge.tsx │ │ ├── button │ │ │ └── Button.tsx │ │ ├── dropdown │ │ │ ├── Dropdown.tsx │ │ │ └── DropdownItem.tsx │ │ ├── images │ │ │ ├── ResponsiveImage.tsx │ │ │ ├── ThreeColumnImageGrid.tsx │ │ │ └── TwoColumnImageGrid.tsx │ │ ├── modal │ │ │ └── index.tsx │ │ ├── table │ │ │ └── index.tsx │ │ └── video │ │ │ ├── VideosExample.tsx │ │ │ └── YouTubeEmbed.tsx │ ├── user-profile │ │ ├── UserAddressCard.tsx │ │ ├── UserInfoCard.tsx │ │ └── UserMetaCard.tsx │ └── videos │ │ ├── FourIsToThree.tsx │ │ ├── OneIsToOne.tsx │ │ ├── SixteenIsToNine.tsx │ │ └── TwentyOneIsToNine.tsx ├── context │ ├── SidebarContext.tsx │ └── ThemeContext.tsx ├── hooks │ ├── useGoBack.ts │ └── useModal.ts ├── icons │ ├── alert.svg │ ├── angle-down.svg │ ├── angle-left.svg │ ├── angle-right.svg │ ├── angle-up.svg │ ├── arrow-down.svg │ ├── arrow-right.svg │ ├── arrow-up.svg │ ├── audio.svg │ ├── bell.svg │ ├── bolt.svg │ ├── box-cube.svg │ ├── box-line.svg │ ├── box.svg │ ├── calendar.svg │ ├── calender-line.svg │ ├── chat.svg │ ├── check-circle.svg │ ├── check-line.svg │ ├── chevron-down.svg │ ├── chevron-left.svg │ ├── chevron-up.svg │ ├── close-line.svg │ ├── close.svg │ ├── copy.svg │ ├── docs.svg │ ├── dollar-line.svg │ ├── download.svg │ ├── envelope.svg │ ├── eye-close.svg │ ├── eye.svg │ ├── file.svg │ ├── folder.svg │ ├── grid.svg │ ├── group.svg │ ├── horizontal-dots.svg │ ├── index.tsx │ ├── info-hexa.svg │ ├── info.svg │ ├── list.svg │ ├── lock.svg │ ├── mail-line.svg │ ├── more-dot.svg │ ├── page.svg │ ├── paper-plane.svg │ ├── pencil.svg │ ├── pie-chart.svg │ ├── plug-in.svg │ ├── plus.svg │ ├── shooting-star.svg │ ├── table.svg │ ├── task-icon.svg │ ├── task.svg │ ├── time.svg │ ├── trash.svg │ ├── user-circle.svg │ ├── user-line.svg │ └── videos.svg ├── layout │ ├── AppHeader.tsx │ ├── AppSidebar.tsx │ ├── Backdrop.tsx │ └── SidebarWidget.tsx └── svg.d.ts └── tsconfig.json /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "next/core-web-vitals" 3 | } 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /.idea 5 | /node_modules 6 | /.pnp 7 | .pnp.js 8 | .yarn/install-state.gz 9 | 10 | # testing 11 | /coverage 12 | 13 | # next.js 14 | /.next/ 15 | /out/ 16 | 17 | # production 18 | /build 19 | 20 | # misc 21 | .DS_Store 22 | *.pem 23 | 24 | # debug 25 | npm-debug.log* 26 | yarn-debug.log* 27 | yarn-error.log* 28 | 29 | # local env files 30 | .env*.local 31 | 32 | # vercel 33 | .vercel 34 | 35 | # typescript 36 | *.tsbuildinfo 37 | next-env.d.ts 38 | -------------------------------------------------------------------------------- /.idea/.gitignore: -------------------------------------------------------------------------------- 1 | # Default ignored files 2 | /shelf/ 3 | /workspace.xml 4 | # Editor-based HTTP Client requests 5 | /httpRequests/ 6 | -------------------------------------------------------------------------------- /.idea/free-nextjs-admin-dashboard.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/prettier.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 TailAdmin 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/banner.png -------------------------------------------------------------------------------- /eslint.config.mjs: -------------------------------------------------------------------------------- 1 | import { dirname } from "path"; 2 | import { fileURLToPath } from "url"; 3 | import { FlatCompat } from "@eslint/eslintrc"; 4 | 5 | const __filename = fileURLToPath(import.meta.url); 6 | const __dirname = dirname(__filename); 7 | 8 | const compat = new FlatCompat({ 9 | baseDirectory: __dirname, 10 | }); 11 | 12 | const eslintConfig = [ 13 | ...compat.extends("next/core-web-vitals", "next/typescript"), 14 | ]; 15 | 16 | export default eslintConfig; 17 | -------------------------------------------------------------------------------- /jsvectormap.d.ts: -------------------------------------------------------------------------------- 1 | declare module 'jsvectormap' { 2 | const jsVectorMap: any; 3 | export default jsVectorMap; 4 | } 5 | -------------------------------------------------------------------------------- /next.config.ts: -------------------------------------------------------------------------------- 1 | import type { NextConfig } from "next"; 2 | 3 | const nextConfig: NextConfig = { 4 | /* config options here */ 5 | webpack(config) { 6 | config.module.rules.push({ 7 | test: /\.svg$/, 8 | use: ["@svgr/webpack"], 9 | }); 10 | return config; 11 | }, 12 | }; 13 | 14 | export default nextConfig; 15 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "free-nextjs-admin-dashboard", 3 | "version": "2.0.2", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev", 7 | "build": "next build", 8 | "start": "next start", 9 | "lint": "next lint" 10 | }, 11 | "dependencies": { 12 | "@fullcalendar/core": "^6.1.15", 13 | "@fullcalendar/daygrid": "^6.1.15", 14 | "@fullcalendar/interaction": "^6.1.15", 15 | "@fullcalendar/list": "^6.1.15", 16 | "@fullcalendar/react": "^6.1.15", 17 | "@fullcalendar/timegrid": "^6.1.15", 18 | "@react-jvectormap/core": "^1.0.4", 19 | "@react-jvectormap/world": "^1.1.2", 20 | "@tailwindcss/forms": "^0.5.9", 21 | "@tailwindcss/postcss": "^4.0.9", 22 | "apexcharts": "^4.3.0", 23 | "autoprefixer": "^10.4.20", 24 | "flatpickr": "^4.6.13", 25 | "next": "15.2.3", 26 | "react": "^19.0.0", 27 | "react-apexcharts": "^1.7.0", 28 | "react-dnd": "^16.0.1", 29 | "react-dnd-html5-backend": "^16.0.1", 30 | "react-dom": "^19.0.0", 31 | "react-dropzone": "^14.3.5", 32 | "swiper": "^11.2.0", 33 | "tailwind-merge": "^2.6.0" 34 | }, 35 | "devDependencies": { 36 | "@eslint/eslintrc": "^3", 37 | "@svgr/webpack": "^8.1.0", 38 | "@types/node": "^20", 39 | "@types/react": "^19", 40 | "@types/react-dom": "^19", 41 | "@types/react-transition-group": "^4.4.12", 42 | "eslint": "^9", 43 | "eslint-config-next": "15.1.3", 44 | "postcss": "^8", 45 | "tailwindcss": "^4.0.0", 46 | "typescript": "^5" 47 | }, 48 | "overrides": { 49 | "@react-jvectormap/core": { 50 | "react": "^16.8.0 || ^17 || ^18 || ^19", 51 | "react-dom": "^16.8.0 || ^17 || ^18 || ^19" 52 | }, 53 | "@react-jvectormap/world": { 54 | "react": "^16.8.0 || ^17 || ^18 || ^19", 55 | "react-dom": "^16.8.0 || ^17 || ^18 || ^19" 56 | } 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: ['prettier-plugin-tailwindcss'], 3 | } -------------------------------------------------------------------------------- /public/images/brand/brand-01.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/brand/brand-02.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /public/images/brand/brand-03.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/images/brand/brand-05.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/brand/brand-06.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/images/brand/brand-07.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/images/brand/brand-09.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/images/brand/brand-10.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/brand/brand-11.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/images/brand/brand-12.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/images/brand/brand-13.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/images/brand/brand-14.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/brand/brand-15.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/images/cards/card-01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-01.jpg -------------------------------------------------------------------------------- /public/images/cards/card-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-01.png -------------------------------------------------------------------------------- /public/images/cards/card-02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-02.jpg -------------------------------------------------------------------------------- /public/images/cards/card-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-02.png -------------------------------------------------------------------------------- /public/images/cards/card-03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-03.jpg -------------------------------------------------------------------------------- /public/images/cards/card-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/cards/card-03.png -------------------------------------------------------------------------------- /public/images/carousel/carousel-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/carousel/carousel-01.png -------------------------------------------------------------------------------- /public/images/carousel/carousel-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/carousel/carousel-02.png -------------------------------------------------------------------------------- /public/images/carousel/carousel-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/carousel/carousel-03.png -------------------------------------------------------------------------------- /public/images/carousel/carousel-04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/carousel/carousel-04.png -------------------------------------------------------------------------------- /public/images/chat/chat.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/chat/chat.jpg -------------------------------------------------------------------------------- /public/images/country/country-01.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /public/images/country/country-02.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /public/images/country/country-03.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /public/images/country/country-05.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /public/images/country/country-06.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /public/images/country/country-07.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /public/images/country/country-08.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /public/images/error/404-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /public/images/error/404.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /public/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/favicon.ico -------------------------------------------------------------------------------- /public/images/grid-image/image-01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-01.png -------------------------------------------------------------------------------- /public/images/grid-image/image-02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-02.png -------------------------------------------------------------------------------- /public/images/grid-image/image-03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-03.png -------------------------------------------------------------------------------- /public/images/grid-image/image-04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-04.png -------------------------------------------------------------------------------- /public/images/grid-image/image-05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-05.png -------------------------------------------------------------------------------- /public/images/grid-image/image-06.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/grid-image/image-06.png -------------------------------------------------------------------------------- /public/images/icons/file-image-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/images/icons/file-image.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/images/icons/file-video-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/icons/file-video.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /public/images/product/product-01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/product/product-01.jpg -------------------------------------------------------------------------------- /public/images/product/product-02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/product/product-02.jpg -------------------------------------------------------------------------------- /public/images/product/product-03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/product/product-03.jpg -------------------------------------------------------------------------------- /public/images/product/product-04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/product/product-04.jpg -------------------------------------------------------------------------------- /public/images/product/product-05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/product/product-05.jpg -------------------------------------------------------------------------------- /public/images/task/pdf.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /public/images/task/task.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/task/task.jpg -------------------------------------------------------------------------------- /public/images/task/task.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/task/task.png -------------------------------------------------------------------------------- /public/images/user/owner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/owner.jpg -------------------------------------------------------------------------------- /public/images/user/user-01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-01.jpg -------------------------------------------------------------------------------- /public/images/user/user-02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-02.jpg -------------------------------------------------------------------------------- /public/images/user/user-03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-03.jpg -------------------------------------------------------------------------------- /public/images/user/user-04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-04.jpg -------------------------------------------------------------------------------- /public/images/user/user-05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-05.jpg -------------------------------------------------------------------------------- /public/images/user/user-06.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-06.jpg -------------------------------------------------------------------------------- /public/images/user/user-07.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-07.jpg -------------------------------------------------------------------------------- /public/images/user/user-08.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-08.jpg -------------------------------------------------------------------------------- /public/images/user/user-09.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-09.jpg -------------------------------------------------------------------------------- /public/images/user/user-10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-10.jpg -------------------------------------------------------------------------------- /public/images/user/user-11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-11.jpg -------------------------------------------------------------------------------- /public/images/user/user-12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-12.jpg -------------------------------------------------------------------------------- /public/images/user/user-13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-13.jpg -------------------------------------------------------------------------------- /public/images/user/user-14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-14.jpg -------------------------------------------------------------------------------- /public/images/user/user-15.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-15.jpg -------------------------------------------------------------------------------- /public/images/user/user-16.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-16.jpg -------------------------------------------------------------------------------- /public/images/user/user-17.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-17.jpg -------------------------------------------------------------------------------- /public/images/user/user-18.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-18.jpg -------------------------------------------------------------------------------- /public/images/user/user-19.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-19.jpg -------------------------------------------------------------------------------- /public/images/user/user-20.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-20.jpg -------------------------------------------------------------------------------- /public/images/user/user-21.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-21.jpg -------------------------------------------------------------------------------- /public/images/user/user-22.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-22.jpg -------------------------------------------------------------------------------- /public/images/user/user-23.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-23.jpg -------------------------------------------------------------------------------- /public/images/user/user-24.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-24.jpg -------------------------------------------------------------------------------- /public/images/user/user-25.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-25.jpg -------------------------------------------------------------------------------- /public/images/user/user-26.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-26.jpg -------------------------------------------------------------------------------- /public/images/user/user-27.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-27.jpg -------------------------------------------------------------------------------- /public/images/user/user-28.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-28.jpg -------------------------------------------------------------------------------- /public/images/user/user-29.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-29.jpg -------------------------------------------------------------------------------- /public/images/user/user-30.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-30.jpg -------------------------------------------------------------------------------- /public/images/user/user-31.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-31.jpg -------------------------------------------------------------------------------- /public/images/user/user-32.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-32.jpg -------------------------------------------------------------------------------- /public/images/user/user-33.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-33.jpg -------------------------------------------------------------------------------- /public/images/user/user-34.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-34.jpg -------------------------------------------------------------------------------- /public/images/user/user-35.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-35.jpg -------------------------------------------------------------------------------- /public/images/user/user-36.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-36.jpg -------------------------------------------------------------------------------- /public/images/user/user-37.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/user/user-37.jpg -------------------------------------------------------------------------------- /public/images/video-thumb/thumb-16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/public/images/video-thumb/thumb-16.png -------------------------------------------------------------------------------- /public/images/video-thumb/youtube-icon-84.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/(chart)/bar-chart/page.tsx: -------------------------------------------------------------------------------- 1 | import BarChartOne from "@/components/charts/bar/BarChartOne"; 2 | import ComponentCard from "@/components/common/ComponentCard"; 3 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 4 | import { Metadata } from "next"; 5 | import React from "react"; 6 | 7 | export const metadata: Metadata = { 8 | title: "Next.js Bar Chart | TailAdmin - Next.js Dashboard Template", 9 | description: 10 | "This is Next.js Bar Chart page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 11 | }; 12 | 13 | export default function page() { 14 | return ( 15 |
16 | 17 |
18 | 19 | 20 | 21 |
22 |
23 | ); 24 | } 25 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/(chart)/line-chart/page.tsx: -------------------------------------------------------------------------------- 1 | import LineChartOne from "@/components/charts/line/LineChartOne"; 2 | import ComponentCard from "@/components/common/ComponentCard"; 3 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 4 | import { Metadata } from "next"; 5 | import React from "react"; 6 | 7 | export const metadata: Metadata = { 8 | title: "Next.js Line Chart | TailAdmin - Next.js Dashboard Template", 9 | description: 10 | "This is Next.js Line Chart page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 11 | }; 12 | export default function LineChart() { 13 | return ( 14 |
15 | 16 |
17 | 18 | 19 | 20 |
21 |
22 | ); 23 | } 24 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/(forms)/form-elements/page.tsx: -------------------------------------------------------------------------------- 1 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 2 | import CheckboxComponents from "@/components/form/form-elements/CheckboxComponents"; 3 | import DefaultInputs from "@/components/form/form-elements/DefaultInputs"; 4 | import DropzoneComponent from "@/components/form/form-elements/DropZone"; 5 | import FileInputExample from "@/components/form/form-elements/FileInputExample"; 6 | import InputGroup from "@/components/form/form-elements/InputGroup"; 7 | import InputStates from "@/components/form/form-elements/InputStates"; 8 | import RadioButtons from "@/components/form/form-elements/RadioButtons"; 9 | import SelectInputs from "@/components/form/form-elements/SelectInputs"; 10 | import TextAreaInput from "@/components/form/form-elements/TextAreaInput"; 11 | import ToggleSwitch from "@/components/form/form-elements/ToggleSwitch"; 12 | import { Metadata } from "next"; 13 | import React from "react"; 14 | 15 | export const metadata: Metadata = { 16 | title: "Next.js Form Elements | TailAdmin - Next.js Dashboard Template", 17 | description: 18 | "This is Next.js Form Elements page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 19 | }; 20 | 21 | export default function FormElements() { 22 | return ( 23 |
24 | 25 |
26 |
27 | 28 | 29 | 30 | 31 |
32 |
33 | 34 | 35 | 36 | 37 | 38 | 39 |
40 |
41 |
42 | ); 43 | } 44 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/(tables)/basic-tables/page.tsx: -------------------------------------------------------------------------------- 1 | import ComponentCard from "@/components/common/ComponentCard"; 2 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 3 | import BasicTableOne from "@/components/tables/BasicTableOne"; 4 | import { Metadata } from "next"; 5 | import React from "react"; 6 | 7 | export const metadata: Metadata = { 8 | title: "Next.js Basic Table | TailAdmin - Next.js Dashboard Template", 9 | description: 10 | "This is Next.js Basic Table page for TailAdmin Tailwind CSS Admin Dashboard Template", 11 | // other metadata 12 | }; 13 | 14 | export default function BasicTables() { 15 | return ( 16 |
17 | 18 |
19 | 20 | 21 | 22 |
23 |
24 | ); 25 | } 26 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/blank/page.tsx: -------------------------------------------------------------------------------- 1 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 2 | import { Metadata } from "next"; 3 | import React from "react"; 4 | 5 | export const metadata: Metadata = { 6 | title: "Next.js Blank Page | TailAdmin - Next.js Dashboard Template", 7 | description: "This is Next.js Blank Page TailAdmin Dashboard Template", 8 | }; 9 | 10 | export default function BlankPage() { 11 | return ( 12 |
13 | 14 |
15 |
16 |

17 | Card Title Here 18 |

19 |

20 | Start putting content on grids or panels, you can also use different 21 | combinations of grids.Please check out the dashboard and other pages 22 |

23 |
24 |
25 |
26 | ); 27 | } 28 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/calendar/page.tsx: -------------------------------------------------------------------------------- 1 | import Calendar from "@/components/calendar/Calendar"; 2 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 3 | import { Metadata } from "next"; 4 | import React from "react"; 5 | 6 | export const metadata: Metadata = { 7 | title: "Next.js Calender | TailAdmin - Next.js Dashboard Template", 8 | description: 9 | "This is Next.js Calender page for TailAdmin Tailwind CSS Admin Dashboard Template", 10 | // other metadata 11 | }; 12 | export default function page() { 13 | return ( 14 |
15 | 16 | 17 |
18 | ); 19 | } 20 | -------------------------------------------------------------------------------- /src/app/(admin)/(others-pages)/profile/page.tsx: -------------------------------------------------------------------------------- 1 | import UserAddressCard from "@/components/user-profile/UserAddressCard"; 2 | import UserInfoCard from "@/components/user-profile/UserInfoCard"; 3 | import UserMetaCard from "@/components/user-profile/UserMetaCard"; 4 | import { Metadata } from "next"; 5 | import React from "react"; 6 | 7 | export const metadata: Metadata = { 8 | title: "Next.js Profile | TailAdmin - Next.js Dashboard Template", 9 | description: 10 | "This is Next.js Profile page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 11 | }; 12 | 13 | export default function Profile() { 14 | return ( 15 |
16 |
17 |

18 | Profile 19 |

20 |
21 | 22 | 23 | 24 |
25 |
26 |
27 | ); 28 | } 29 | -------------------------------------------------------------------------------- /src/app/(admin)/(ui-elements)/images/page.tsx: -------------------------------------------------------------------------------- 1 | import ComponentCard from "@/components/common/ComponentCard"; 2 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 3 | import ResponsiveImage from "@/components/ui/images/ResponsiveImage"; 4 | import ThreeColumnImageGrid from "@/components/ui/images/ThreeColumnImageGrid"; 5 | import TwoColumnImageGrid from "@/components/ui/images/TwoColumnImageGrid"; 6 | import { Metadata } from "next"; 7 | import React from "react"; 8 | 9 | export const metadata: Metadata = { 10 | title: "Next.js Images | TailAdmin - Next.js Dashboard Template", 11 | description: 12 | "This is Next.js Images page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 13 | // other metadata 14 | }; 15 | 16 | export default function Images() { 17 | return ( 18 |
19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
32 | ); 33 | } 34 | -------------------------------------------------------------------------------- /src/app/(admin)/(ui-elements)/modals/page.tsx: -------------------------------------------------------------------------------- 1 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 2 | import DefaultModal from "@/components/example/ModalExample/DefaultModal"; 3 | import FormInModal from "@/components/example/ModalExample/FormInModal"; 4 | import FullScreenModal from "@/components/example/ModalExample/FullScreenModal"; 5 | import ModalBasedAlerts from "@/components/example/ModalExample/ModalBasedAlerts"; 6 | import VerticallyCenteredModal from "@/components/example/ModalExample/VerticallyCenteredModal"; 7 | import { Metadata } from "next"; 8 | import React from "react"; 9 | 10 | export const metadata: Metadata = { 11 | title: "Next.js Modals | TailAdmin - Next.js Dashboard Template", 12 | description: 13 | "This is Next.js Modals page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 14 | // other metadata 15 | }; 16 | 17 | export default function Modals() { 18 | return ( 19 |
20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 |
28 |
29 | ); 30 | } 31 | -------------------------------------------------------------------------------- /src/app/(admin)/(ui-elements)/videos/page.tsx: -------------------------------------------------------------------------------- 1 | import PageBreadcrumb from "@/components/common/PageBreadCrumb"; 2 | import VideosExample from "@/components/ui/video/VideosExample"; 3 | import { Metadata } from "next"; 4 | import React from "react"; 5 | 6 | export const metadata: Metadata = { 7 | title: "Next.js Videos | TailAdmin - Next.js Dashboard Template", 8 | description: 9 | "This is Next.js Videos page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 10 | }; 11 | 12 | export default function VideoPage() { 13 | return ( 14 |
15 | 16 | 17 | 18 |
19 | ); 20 | } 21 | -------------------------------------------------------------------------------- /src/app/(admin)/layout.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | 3 | import { useSidebar } from "@/context/SidebarContext"; 4 | import AppHeader from "@/layout/AppHeader"; 5 | import AppSidebar from "@/layout/AppSidebar"; 6 | import Backdrop from "@/layout/Backdrop"; 7 | import React from "react"; 8 | 9 | export default function AdminLayout({ 10 | children, 11 | }: { 12 | children: React.ReactNode; 13 | }) { 14 | const { isExpanded, isHovered, isMobileOpen } = useSidebar(); 15 | 16 | // Dynamic class for main content margin based on sidebar state 17 | const mainContentMargin = isMobileOpen 18 | ? "ml-0" 19 | : isExpanded || isHovered 20 | ? "lg:ml-[290px]" 21 | : "lg:ml-[90px]"; 22 | 23 | return ( 24 |
25 | {/* Sidebar and Backdrop */} 26 | 27 | 28 | {/* Main Content Area */} 29 |
32 | {/* Header */} 33 | 34 | {/* Page Content */} 35 |
{children}
36 |
37 |
38 | ); 39 | } 40 | -------------------------------------------------------------------------------- /src/app/(admin)/page.tsx: -------------------------------------------------------------------------------- 1 | import type { Metadata } from "next"; 2 | import { EcommerceMetrics } from "@/components/ecommerce/EcommerceMetrics"; 3 | import React from "react"; 4 | import MonthlyTarget from "@/components/ecommerce/MonthlyTarget"; 5 | import MonthlySalesChart from "@/components/ecommerce/MonthlySalesChart"; 6 | import StatisticsChart from "@/components/ecommerce/StatisticsChart"; 7 | import RecentOrders from "@/components/ecommerce/RecentOrders"; 8 | import DemographicCard from "@/components/ecommerce/DemographicCard"; 9 | 10 | export const metadata: Metadata = { 11 | title: 12 | "Next.js E-commerce Dashboard | TailAdmin - Next.js Dashboard Template", 13 | description: "This is Next.js Home for TailAdmin Dashboard Template", 14 | }; 15 | 16 | export default function Ecommerce() { 17 | return ( 18 |
19 |
20 | 21 | 22 | 23 |
24 | 25 |
26 | 27 |
28 | 29 |
30 | 31 |
32 | 33 |
34 | 35 |
36 | 37 |
38 | 39 |
40 |
41 | ); 42 | } 43 | -------------------------------------------------------------------------------- /src/app/(full-width-pages)/(auth)/layout.tsx: -------------------------------------------------------------------------------- 1 | import GridShape from "@/components/common/GridShape"; 2 | import ThemeTogglerTwo from "@/components/common/ThemeTogglerTwo"; 3 | 4 | import { ThemeProvider } from "@/context/ThemeContext"; 5 | import Image from "next/image"; 6 | import Link from "next/link"; 7 | import React from "react"; 8 | 9 | export default function AuthLayout({ 10 | children, 11 | }: { 12 | children: React.ReactNode; 13 | }) { 14 | return ( 15 |
16 | 17 |
18 | {children} 19 |
20 |
21 | {/* */} 22 | 23 |
24 | 25 | Logo 31 | 32 |

33 | Free and Open-Source Tailwind CSS Admin Dashboard Template 34 |

35 |
36 |
37 |
38 |
39 | 40 |
41 |
42 | 43 |
44 | ); 45 | } 46 | -------------------------------------------------------------------------------- /src/app/(full-width-pages)/(auth)/signin/page.tsx: -------------------------------------------------------------------------------- 1 | import SignInForm from "@/components/auth/SignInForm"; 2 | import { Metadata } from "next"; 3 | 4 | export const metadata: Metadata = { 5 | title: "Next.js SignIn Page | TailAdmin - Next.js Dashboard Template", 6 | description: "This is Next.js Signin Page TailAdmin Dashboard Template", 7 | }; 8 | 9 | export default function SignIn() { 10 | return ; 11 | } 12 | -------------------------------------------------------------------------------- /src/app/(full-width-pages)/(auth)/signup/page.tsx: -------------------------------------------------------------------------------- 1 | import SignUpForm from "@/components/auth/SignUpForm"; 2 | import { Metadata } from "next"; 3 | 4 | export const metadata: Metadata = { 5 | title: "Next.js SignUp Page | TailAdmin - Next.js Dashboard Template", 6 | description: "This is Next.js SignUp Page TailAdmin Dashboard Template", 7 | // other metadata 8 | }; 9 | 10 | export default function SignUp() { 11 | return ; 12 | } 13 | -------------------------------------------------------------------------------- /src/app/(full-width-pages)/(error-pages)/error-404/page.tsx: -------------------------------------------------------------------------------- 1 | import GridShape from "@/components/common/GridShape"; 2 | import { Metadata } from "next"; 3 | import Image from "next/image"; 4 | import Link from "next/link"; 5 | import React from "react"; 6 | 7 | export const metadata: Metadata = { 8 | title: "Next.js Error 404 | TailAdmin - Next.js Dashboard Template", 9 | description: 10 | "This is Next.js Error 404 page for TailAdmin - Next.js Tailwind CSS Admin Dashboard Template", 11 | }; 12 | 13 | export default function Error404() { 14 | return ( 15 |
16 | 17 |
18 |

19 | ERROR 20 |

21 | 22 | 404 29 | 404 36 | 37 |

38 | We can’t seem to find the page you are looking for! 39 |

40 | 41 | 45 | Back to Home Page 46 | 47 |
48 | {/* */} 49 |

50 | © {new Date().getFullYear()} - TailAdmin 51 |

52 |
53 | ); 54 | } 55 | -------------------------------------------------------------------------------- /src/app/(full-width-pages)/layout.tsx: -------------------------------------------------------------------------------- 1 | export default function FullWidthPageLayout({ 2 | children, 3 | }: { 4 | children: React.ReactNode; 5 | }) { 6 | return
{children}
; 7 | } 8 | -------------------------------------------------------------------------------- /src/app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TailAdmin/free-nextjs-admin-dashboard/934d05cab5892f6e2d4fea974e186ddd1d0813fc/src/app/favicon.ico -------------------------------------------------------------------------------- /src/app/layout.tsx: -------------------------------------------------------------------------------- 1 | import { Outfit } from 'next/font/google'; 2 | import './globals.css'; 3 | 4 | import { SidebarProvider } from '@/context/SidebarContext'; 5 | import { ThemeProvider } from '@/context/ThemeContext'; 6 | 7 | const outfit = Outfit({ 8 | subsets: ["latin"], 9 | }); 10 | 11 | export default function RootLayout({ 12 | children, 13 | }: Readonly<{ 14 | children: React.ReactNode; 15 | }>) { 16 | return ( 17 | 18 | 19 | 20 | {children} 21 | 22 | 23 | 24 | ); 25 | } 26 | -------------------------------------------------------------------------------- /src/app/not-found.tsx: -------------------------------------------------------------------------------- 1 | import GridShape from "@/components/common/GridShape"; 2 | import Image from "next/image"; 3 | import Link from "next/link"; 4 | import React from "react"; 5 | 6 | export default function NotFound() { 7 | return ( 8 |
9 | 10 |
11 |

12 | ERROR 13 |

14 | 15 | 404 22 | 404 29 | 30 |

31 | We can’t seem to find the page you are looking for! 32 |

33 | 34 | 38 | Back to Home Page 39 | 40 |
41 | {/* */} 42 |

43 | © {new Date().getFullYear()} - TailAdmin 44 |

45 |
46 | ); 47 | } 48 | -------------------------------------------------------------------------------- /src/components/common/ChartTab.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | 3 | const ChartTab: React.FC = () => { 4 | const [selected, setSelected] = useState< 5 | "optionOne" | "optionTwo" | "optionThree" 6 | >("optionOne"); 7 | 8 | const getButtonClass = (option: "optionOne" | "optionTwo" | "optionThree") => 9 | selected === option 10 | ? "shadow-theme-xs text-gray-900 dark:text-white bg-white dark:bg-gray-800" 11 | : "text-gray-500 dark:text-gray-400"; 12 | 13 | return ( 14 |
15 | 23 | 24 | 32 | 33 | 41 |
42 | ); 43 | }; 44 | 45 | export default ChartTab; 46 | -------------------------------------------------------------------------------- /src/components/common/ComponentCard.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | interface ComponentCardProps { 4 | title: string; 5 | children: React.ReactNode; 6 | className?: string; // Additional custom classes for styling 7 | desc?: string; // Description text 8 | } 9 | 10 | const ComponentCard: React.FC = ({ 11 | title, 12 | children, 13 | className = "", 14 | desc = "", 15 | }) => { 16 | return ( 17 |
20 | {/* Card Header */} 21 |
22 |

23 | {title} 24 |

25 | {desc && ( 26 |

27 | {desc} 28 |

29 | )} 30 |
31 | 32 | {/* Card Body */} 33 |
34 |
{children}
35 |
36 |
37 | ); 38 | }; 39 | 40 | export default ComponentCard; 41 | -------------------------------------------------------------------------------- /src/components/common/GridShape.tsx: -------------------------------------------------------------------------------- 1 | import Image from "next/image"; 2 | import React from "react"; 3 | 4 | export default function GridShape() { 5 | return ( 6 | <> 7 |
8 | grid 14 |
15 |
16 | grid 22 |
23 | 24 | ); 25 | } 26 | -------------------------------------------------------------------------------- /src/components/common/PageBreadCrumb.tsx: -------------------------------------------------------------------------------- 1 | import Link from "next/link"; 2 | import React from "react"; 3 | 4 | interface BreadcrumbProps { 5 | pageTitle: string; 6 | } 7 | 8 | const PageBreadcrumb: React.FC = ({ pageTitle }) => { 9 | return ( 10 |
11 |

15 | {pageTitle} 16 |

17 | 48 |
49 | ); 50 | }; 51 | 52 | export default PageBreadcrumb; 53 | -------------------------------------------------------------------------------- /src/components/ecommerce/EcommerceMetrics.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import Badge from "../ui/badge/Badge"; 4 | import { ArrowDownIcon, ArrowUpIcon, BoxIconLine, GroupIcon } from "@/icons"; 5 | 6 | export const EcommerceMetrics = () => { 7 | return ( 8 |
9 | {/* */} 10 |
11 |
12 | 13 |
14 | 15 |
16 |
17 | 18 | Customers 19 | 20 |

21 | 3,782 22 |

23 |
24 | 25 | 26 | 11.01% 27 | 28 |
29 |
30 | {/* */} 31 | 32 | {/* */} 33 |
34 |
35 | 36 |
37 |
38 |
39 | 40 | Orders 41 | 42 |

43 | 5,359 44 |

45 |
46 | 47 | 48 | 49 | 9.05% 50 | 51 |
52 |
53 | {/* */} 54 |
55 | ); 56 | }; 57 | -------------------------------------------------------------------------------- /src/components/example/ModalExample/DefaultModal.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | 5 | import { Modal } from "../../ui/modal"; 6 | import Button from "../../ui/button/Button"; 7 | import { useModal } from "@/hooks/useModal"; 8 | 9 | export default function DefaultModal() { 10 | const { isOpen, openModal, closeModal } = useModal(); 11 | const handleSave = () => { 12 | // Handle save logic here 13 | console.log("Saving changes..."); 14 | closeModal(); 15 | }; 16 | return ( 17 |
18 | 19 | 22 | 27 |

28 | Modal Heading 29 |

30 |

31 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 32 | Pellentesque euismod est quis mauris lacinia pharetra. Sed a ligula 33 | ac odio condimentum aliquet a nec nulla. Aliquam bibendum ex sit 34 | amet ipsum rutrum feugiat ultrices enim quam. 35 |

36 |

37 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 38 | Pellentesque euismod est quis mauris lacinia pharetra. Sed a ligula 39 | ac odio. 40 |

41 |
42 | 45 | 48 |
49 | 50 | 51 |
52 | ); 53 | } 54 | -------------------------------------------------------------------------------- /src/components/example/ModalExample/VerticallyCenteredModal.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Button from "../../ui/button/Button"; 5 | import { Modal } from "../../ui/modal"; 6 | import { useModal } from "@/hooks/useModal"; 7 | 8 | export default function VerticallyCenteredModal() { 9 | const { isOpen, openModal, closeModal } = useModal(); 10 | const handleSave = () => { 11 | // Handle save logic here 12 | console.log("Saving changes..."); 13 | closeModal(); 14 | }; 15 | return ( 16 | 17 | 20 | 26 |
27 |

28 | All Done! Success Confirmed 29 |

30 |

31 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 32 | Pellentesque euismod est quis mauris lacinia pharetra. 33 |

34 | 35 |
36 | 39 | 42 |
43 |
44 | 45 | 46 | ); 47 | } 48 | -------------------------------------------------------------------------------- /src/components/form/Form.tsx: -------------------------------------------------------------------------------- 1 | import React, { FC, ReactNode, FormEvent } from "react"; 2 | 3 | interface FormProps { 4 | onSubmit: (event: FormEvent) => void; 5 | children: ReactNode; 6 | className?: string; 7 | } 8 | 9 | const Form: FC = ({ onSubmit, children, className }) => { 10 | return ( 11 |
{ 13 | event.preventDefault(); // Prevent default form submission 14 | onSubmit(event); 15 | }} 16 | className={` ${className}`} // Default spacing between form fields 17 | > 18 | {children} 19 |
20 | ); 21 | }; 22 | 23 | export default Form; 24 | -------------------------------------------------------------------------------- /src/components/form/Label.tsx: -------------------------------------------------------------------------------- 1 | import React, { FC, ReactNode } from "react"; 2 | import { twMerge } from "tailwind-merge"; 3 | 4 | interface LabelProps { 5 | htmlFor?: string; 6 | children: ReactNode; 7 | className?: string; 8 | } 9 | 10 | const Label: FC = ({ htmlFor, children, className }) => { 11 | return ( 12 | 24 | ); 25 | }; 26 | 27 | export default Label; 28 | -------------------------------------------------------------------------------- /src/components/form/Select.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | 3 | interface Option { 4 | value: string; 5 | label: string; 6 | } 7 | 8 | interface SelectProps { 9 | options: Option[]; 10 | placeholder?: string; 11 | onChange: (value: string) => void; 12 | className?: string; 13 | defaultValue?: string; 14 | } 15 | 16 | const Select: React.FC = ({ 17 | options, 18 | placeholder = "Select an option", 19 | onChange, 20 | className = "", 21 | defaultValue = "", 22 | }) => { 23 | // Manage the selected value 24 | const [selectedValue, setSelectedValue] = useState(defaultValue); 25 | 26 | const handleChange = (e: React.ChangeEvent) => { 27 | const value = e.target.value; 28 | setSelectedValue(value); 29 | onChange(value); // Trigger parent handler 30 | }; 31 | 32 | return ( 33 | 61 | ); 62 | }; 63 | 64 | export default Select; 65 | -------------------------------------------------------------------------------- /src/components/form/date-picker.tsx: -------------------------------------------------------------------------------- 1 | import { useEffect } from 'react'; 2 | import flatpickr from 'flatpickr'; 3 | import 'flatpickr/dist/flatpickr.css'; 4 | import Label from './Label'; 5 | import { CalenderIcon } from '../../icons'; 6 | import Hook = flatpickr.Options.Hook; 7 | import DateOption = flatpickr.Options.DateOption; 8 | 9 | type PropsType = { 10 | id: string; 11 | mode?: "single" | "multiple" | "range" | "time"; 12 | onChange?: Hook | Hook[]; 13 | defaultDate?: DateOption; 14 | label?: string; 15 | placeholder?: string; 16 | }; 17 | 18 | export default function DatePicker({ 19 | id, 20 | mode, 21 | onChange, 22 | label, 23 | defaultDate, 24 | placeholder, 25 | }: PropsType) { 26 | useEffect(() => { 27 | const flatPickr = flatpickr(`#${id}`, { 28 | mode: mode || "single", 29 | static: true, 30 | monthSelectorType: "static", 31 | dateFormat: "Y-m-d", 32 | defaultDate, 33 | onChange, 34 | }); 35 | 36 | return () => { 37 | if (!Array.isArray(flatPickr)) { 38 | flatPickr.destroy(); 39 | } 40 | }; 41 | }, [mode, onChange, id, defaultDate]); 42 | 43 | return ( 44 |
45 | {label && } 46 | 47 |
48 | 53 | 54 | 55 | 56 | 57 |
58 |
59 | ); 60 | } 61 | -------------------------------------------------------------------------------- /src/components/form/form-elements/CheckboxComponents.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React, { useState } from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Checkbox from "../input/Checkbox"; 5 | 6 | export default function CheckboxComponents() { 7 | const [isChecked, setIsChecked] = useState(false); 8 | const [isCheckedTwo, setIsCheckedTwo] = useState(true); 9 | const [isCheckedDisabled, setIsCheckedDisabled] = useState(false); 10 | return ( 11 | 12 |
13 |
14 | 15 | 16 | Default 17 | 18 |
19 |
20 | 25 |
26 |
27 | 33 |
34 |
35 | 36 | ); 37 | } 38 | -------------------------------------------------------------------------------- /src/components/form/form-elements/FileInputExample.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import FileInput from "../input/FileInput"; 5 | import Label from "../Label"; 6 | 7 | export default function FileInputExample() { 8 | const handleFileChange = (event: React.ChangeEvent) => { 9 | const file = event.target.files?.[0]; 10 | if (file) { 11 | console.log("Selected file:", file.name); 12 | } 13 | }; 14 | 15 | return ( 16 | 17 |
18 | 19 | 20 |
21 | 22 | ); 23 | } 24 | -------------------------------------------------------------------------------- /src/components/form/form-elements/InputGroup.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Label from "../Label"; 5 | import Input from "../input/InputField"; 6 | import { EnvelopeIcon } from "../../../icons"; 7 | import PhoneInput from "../group-input/PhoneInput"; 8 | 9 | export default function InputGroup() { 10 | const countries = [ 11 | { code: "US", label: "+1" }, 12 | { code: "GB", label: "+44" }, 13 | { code: "CA", label: "+1" }, 14 | { code: "AU", label: "+61" }, 15 | ]; 16 | const handlePhoneNumberChange = (phoneNumber: string) => { 17 | console.log("Updated phone number:", phoneNumber); 18 | }; 19 | return ( 20 | 21 |
22 |
23 | 24 |
25 | 30 | 31 | 32 | 33 |
34 |
35 |
36 | 37 | 43 |
{" "} 44 |
45 | 46 | 52 |
53 |
54 | 55 | ); 56 | } 57 | -------------------------------------------------------------------------------- /src/components/form/form-elements/InputStates.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React, { useState } from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Input from "../input/InputField"; 5 | import Label from "../Label"; 6 | 7 | export default function InputStates() { 8 | const [email, setEmail] = useState(""); 9 | const [error, setError] = useState(false); 10 | 11 | // Simulate a validation check 12 | const validateEmail = (value: string) => { 13 | const isValidEmail = 14 | /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(value); 15 | setError(!isValidEmail); 16 | return isValidEmail; 17 | }; 18 | 19 | const handleEmailChange = (e: React.ChangeEvent) => { 20 | const value = e.target.value; 21 | setEmail(value); 22 | validateEmail(value); 23 | }; 24 | return ( 25 | 29 |
30 | {/* Error Input */} 31 |
32 | 33 | 41 |
42 | 43 | {/* Success Input */} 44 |
45 | 46 | 54 |
55 | 56 | {/* Disabled Input */} 57 |
58 | 59 | 66 |
67 |
68 | 69 | ); 70 | } 71 | -------------------------------------------------------------------------------- /src/components/form/form-elements/RadioButtons.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React, { useState } from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Radio from "../input/Radio"; 5 | 6 | export default function RadioButtons() { 7 | const [selectedValue, setSelectedValue] = useState("option2"); 8 | 9 | const handleRadioChange = (value: string) => { 10 | setSelectedValue(value); 11 | }; 12 | return ( 13 | 14 |
15 | 23 | 31 | 40 |
41 | 42 | ); 43 | } 44 | -------------------------------------------------------------------------------- /src/components/form/form-elements/SelectInputs.tsx: -------------------------------------------------------------------------------- 1 | "use client"; 2 | import React, { useState } from "react"; 3 | import ComponentCard from "../../common/ComponentCard"; 4 | import Label from "../Label"; 5 | import Select from "../Select"; 6 | import MultiSelect from "../MultiSelect"; 7 | import { ChevronDownIcon } from "@/icons"; 8 | 9 | export default function SelectInputs() { 10 | const options = [ 11 | { value: "marketing", label: "Marketing" }, 12 | { value: "template", label: "Template" }, 13 | { value: "development", label: "Development" }, 14 | ]; 15 | 16 | const [selectedValues, setSelectedValues] = useState([]); 17 | 18 | const handleSelectChange = (value: string) => { 19 | console.log("Selected value:", value); 20 | }; 21 | 22 | const multiOptions = [ 23 | { value: "1", text: "Option 1", selected: false }, 24 | { value: "2", text: "Option 2", selected: false }, 25 | { value: "3", text: "Option 3", selected: false }, 26 | { value: "4", text: "Option 4", selected: false }, 27 | { value: "5", text: "Option 5", selected: false }, 28 | ]; 29 | 30 | return ( 31 | 32 |
33 |
34 | 35 |
36 |