diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index b359e94e0..000000000 --- a/.eslintignore +++ /dev/null @@ -1,2 +0,0 @@ -storybook-static -cypress.config.ts \ No newline at end of file diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml deleted file mode 100644 index 1ea10939a..000000000 --- a/.github/FUNDING.yml +++ /dev/null @@ -1,3 +0,0 @@ -# These are supported funding model platforms - -github: [rluders, tulup-conner] diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md deleted file mode 100644 index d9dac3677..000000000 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ /dev/null @@ -1,27 +0,0 @@ ---- -name: Bug report -about: Report a bug in Flowbite React ---- - -- [ ] I have searched the [Issues](https://github.com/themesberg/flowbite-react/issues) to see if this bug has already been reported -- [ ] I have tested the latest version - -## Steps to reproduce - -1. Go to '...' -2. Click on '....' -3. Scroll down to '....' - -## Current behavior - -Describe what is currently happening and why it's a problem. - -## Expected behavior - -Describe what you expected to happen. - -## Context - -What are you trying to accomplish? Does this only happen on a specific browser, screen size, or operating system? - -If possible, provide a live example URL, screenshot, video, or a repository with the minimal reproduction of the issue. diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md deleted file mode 100644 index e2a20a2e3..000000000 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -name: Feature request -about: Suggest an idea for Flowbite React ---- - -- [ ] I have searched the [Issues](https://github.com/themesberg/flowbite-react/issues) to see if this bug has already been reported -- [ ] I have tested the latest version - -## Summary - -Describe how it should work, and provide examples of the solution, which might include screenshots or code snippets. - -## Context - -What are you trying to accomplish? How is your use case affected by not having this feature? diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md deleted file mode 100644 index 899a97634..000000000 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ /dev/null @@ -1,7 +0,0 @@ -- [ ] I have followed the [Your First Code Contribution section of the Contributing guide](https://github.com/themesberg/flowbite-react/blob/main/CONTRIBUTING.md#your-first-code-contribution) - -Summarize the changes made and the motivation behind them. - -Reference related issues using `#` followed by the issue number. - -If there are breaking API changes - like adding or removing props, or changing the structure of the theme - describe them, and provide steps to update existing code. diff --git a/.github/assets/flowbite-react-github.png b/.github/assets/flowbite-react-github.png deleted file mode 100644 index c31341282..000000000 Binary files a/.github/assets/flowbite-react-github.png and /dev/null differ diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml deleted file mode 100644 index 052ebe4d1..000000000 --- a/.github/workflows/ci.yml +++ /dev/null @@ -1,56 +0,0 @@ -name: CI - -on: - pull_request: - branches: - - main - -concurrency: ${{ github.ref }} - -jobs: - build: - runs-on: ubuntu-latest - steps: - - name: 📥 Check out the code - uses: actions/checkout@v3 - with: - fetch-depth: 2 - - - name: 💿 Setup NodeJS 20 - uses: actions/setup-node@v3 - with: - node-version: 20 - - - name: ⏳ Setup Cache - uses: actions/cache@v3 - with: - path: '**/node_modules' - key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-modules- - - - name: 🏭 Install packages - run: yarn install - - - name: 🕵 Lint the code - run: yarn lint - - - name: 💅 Run Prettier - run: yarn prettier - - - name: 🔬 Run unit tests - run: yarn test:coverage - - - name: 📊 Upload coverage to Codecov - uses: codecov/codecov-action@v3 - with: - fail_ci_if_error: true - files: coverage/coverage-final.json - token: ${{ secrets.CODECOV_TOKEN }} - verbose: true - - - name: 🧰 Build Library - run: yarn build:lib - - - name: 🧰 Build NextJS - run: yarn build diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml deleted file mode 100644 index b0ecd8483..000000000 --- a/.github/workflows/storybook.yml +++ /dev/null @@ -1,21 +0,0 @@ -name: Deploy Storybook - -on: - push: - branches: - - main - -jobs: - deploy: - runs-on: ubuntu-latest - steps: - - name: 📥 Checkout - uses: actions/checkout@v2.3.1 - - - name: 🚀 Merge main -> storybook - uses: devmasx/merge-branch@1.4.0 - with: - type: now - from_branch: main - target_branch: storybook - github_token: ${{ github.token }} diff --git a/.gitignore b/.gitignore deleted file mode 100644 index 386ee0621..000000000 --- a/.gitignore +++ /dev/null @@ -1,16 +0,0 @@ -.next -.vercel -build -coverage -cypress/screenshots -cypress/videos -lib -node_modules -storybook-static -.DS_Store -npm-debug.log* -tsconfig.tsbuildinfo -yarn-debug.log* -yarn-error.log* -dist -.contentlayer \ No newline at end of file diff --git a/.idea/.gitignore b/.idea/.gitignore deleted file mode 100644 index 13566b81b..000000000 --- a/.idea/.gitignore +++ /dev/null @@ -1,8 +0,0 @@ -# Default ignored files -/shelf/ -/workspace.xml -# Editor-based HTTP Client requests -/httpRequests/ -# Datasource local storage ignored files -/dataSources/ -/dataSources.local.xml diff --git a/.npmignore b/.npmignore deleted file mode 100644 index 0e74707b2..000000000 --- a/.npmignore +++ /dev/null @@ -1,22 +0,0 @@ -.github -.vercel -.vscode -build -pages -public -storybook-static -styles -.gitignore -.prettierrc -CNAME -CODE_OF_CONDUCT.md -codecov.yaml -cypress.json -LICENSE -next-env.d.ts -next.config.mjs -node_modules -README.md -tsconfig.json -tsconfig.tsbuildinfo -vite.config.ts \ No newline at end of file diff --git a/.prettierignore b/.prettierignore deleted file mode 100644 index 2928ece4b..000000000 --- a/.prettierignore +++ /dev/null @@ -1,19 +0,0 @@ -# Changelog is autogenerate, doesn't make sense to prettier it. -CHANGELOG.md - -# Ignore the same files from .gitignore as well -.next -.vercel -build -coverage -cypress/screenshots -cypress/videos -lib -node_modules -storybook-static -.DS_Store -npm-debug.log* -tsconfig.tsbuildinfo -yarn-debug.log* -yarn-error.log* -.contentlayer \ No newline at end of file diff --git a/.prettierrc b/.prettierrc deleted file mode 100644 index 25b2b2f47..000000000 --- a/.prettierrc +++ /dev/null @@ -1,6 +0,0 @@ -{ - "plugins": ["prettier-plugin-tailwindcss"], - "printWidth": 120, - "singleQuote": true, - "trailingComma": "all" -} diff --git a/.storybook/inter.woff2 b/.storybook/inter.woff2 deleted file mode 100644 index 980853fec..000000000 Binary files a/.storybook/inter.woff2 and /dev/null differ diff --git a/.storybook/main.ts b/.storybook/main.ts deleted file mode 100644 index 72d42b0c5..000000000 --- a/.storybook/main.ts +++ /dev/null @@ -1,30 +0,0 @@ -import type { StorybookConfig } from '@storybook/nextjs'; -import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin'; - -const config: StorybookConfig = { - stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], - addons: [ - '@storybook/addon-links', - '@storybook/addon-essentials', - '@storybook/addon-interactions', - { - name: '@storybook/addon-styling', - options: { - postCss: true, - }, - }, - ], - framework: { - name: '@storybook/nextjs', - options: {}, - }, - docs: { - autodocs: 'tag', - }, - webpackFinal: (config) => { - config.resolve!.plugins = [new TsconfigPathsPlugin()]; - return config; - }, -}; - -export default config; diff --git a/.storybook/preview.ts b/.storybook/preview.ts deleted file mode 100644 index 14646bac3..000000000 --- a/.storybook/preview.ts +++ /dev/null @@ -1,16 +0,0 @@ -import type { Preview } from '@storybook/react'; -import './style.css'; - -const preview: Preview = { - parameters: { - actions: { argTypesRegex: '^on[A-Z].*' }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, - }, - }, -}; - -export default preview; diff --git a/.storybook/style.css b/.storybook/style.css deleted file mode 100644 index 63b75a58b..000000000 --- a/.storybook/style.css +++ /dev/null @@ -1,16 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; - -@layer base { - @font-face { - font-family: 'Inter'; - src: url(inter.woff2) format('woff2'); - font-weight: 100 200 300 400 500 600 700 800 900; - font-display: swap; - } - - html { - font-family: 'Inter', sans-serif; - } -} diff --git a/.vscode/settings.json b/.vscode/settings.json deleted file mode 100644 index f08d92a02..000000000 --- a/.vscode/settings.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "editor.codeActionsOnSave": { - "source.fixAll": "explicit" - }, - "editor.defaultFormatter": "esbenp.prettier-vscode", - "editor.formatOnPaste": false, - "editor.formatOnSave": true, - "editor.tabSize": 2, - "eslint.enable": true, - "eslint.format.enable": true, - "files.exclude": { - ".next/": true, - ".vercel/": true, - "build/": true, - "coverage/": true, - "lib/": true, - "node_modules": true, - "storybook-static/": true, - "tsconfig.tsbuildinfo": true, - "yarn-error.log": true, - "yarn.lock": true - }, - "javascript.updateImportsOnFileMove.enabled": "always", - "typescript.enablePromptUseWorkspaceTsdk": true, - "typescript.tsdk": "node_modules/typescript/lib", - "typescript.updateImportsOnFileMove.enabled": "always" -} diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index dca06b33c..000000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,943 +0,0 @@ -# Changelog - -All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. - -### [0.7.3](https://github.com/themesberg/flowbite-react/compare/v0.7.2...v0.7.3) (2024-03-12) - - -### Features - -* **component:** default to `type="text"` on `` ([#1206](https://github.com/themesberg/flowbite-react/issues/1206)) ([fbd57c8](https://github.com/themesberg/flowbite-react/commit/fbd57c85906d31b47911910330b51656c546f2e1)) -* Popover component ([#1237](https://github.com/themesberg/flowbite-react/issues/1237)) ([dc48f2e](https://github.com/themesberg/flowbite-react/commit/dc48f2ee3edac79aae9399c22385b81f4cb683fa)), closes [#916](https://github.com/themesberg/flowbite-react/issues/916) [#878](https://github.com/themesberg/flowbite-react/issues/878) -* **table:** Wrap table components with forwardRef ([#1239](https://github.com/themesberg/flowbite-react/issues/1239)) ([4a26a50](https://github.com/themesberg/flowbite-react/commit/4a26a504a9589415735251e4076a9e15d4ee9dce)) - - -### Bug Fixes - -* **alert:** blue color on alert is cyan ([#1282](https://github.com/themesberg/flowbite-react/issues/1282)) ([c52184e](https://github.com/themesberg/flowbite-react/commit/c52184e7bb706b9393f6ae93fbd73162547d8b98)) -* **badge:** blue color on badge is cyan ([#1227](https://github.com/themesberg/flowbite-react/issues/1227)) ([ee3749f](https://github.com/themesberg/flowbite-react/commit/ee3749f4173d99b15bcbd6a312ddc5da69ba6fcf)) -* **button:** Button ring on focus ([#1238](https://github.com/themesberg/flowbite-react/issues/1238)) ([406ebe5](https://github.com/themesberg/flowbite-react/commit/406ebe53228871cc0ef89282919e314414e7ad94)) -* **button:** Fixed Typescript error when using Next.js Link in the button `as` prop ([#1244](https://github.com/themesberg/flowbite-react/issues/1244)) ([a6698d4](https://github.com/themesberg/flowbite-react/commit/a6698d48474595f2ee05a3f817ecbdb322aa7807)), closes [#1002](https://github.com/themesberg/flowbite-react/issues/1002) [#1107](https://github.com/themesberg/flowbite-react/issues/1107) -* **ButtonGroup:** dynamic generated button with group wasn't styled properly ([#1273](https://github.com/themesberg/flowbite-react/issues/1273)) ([d0dc810](https://github.com/themesberg/flowbite-react/commit/d0dc81073eb14f5620c70e4f4bd6e9216a7b1272)), closes [#1269](https://github.com/themesberg/flowbite-react/issues/1269) [#1269](https://github.com/themesberg/flowbite-react/issues/1269) -* homepage - use Link for internal links ([#1246](https://github.com/themesberg/flowbite-react/issues/1246)) ([4fd01e5](https://github.com/themesberg/flowbite-react/commit/4fd01e5a5631c30ea65f90fd23856eae8014ccad)) -* **modal:** modal overflowing bottom in chrome on ios ([#1270](https://github.com/themesberg/flowbite-react/issues/1270)) ([3671ced](https://github.com/themesberg/flowbite-react/commit/3671ced4564a5aa7d823d8c09756bb455d2969c1)) -* **navbar:** on Mobile Screen Navbar remains open even page is changed ([#1247](https://github.com/themesberg/flowbite-react/issues/1247)) ([ce25791](https://github.com/themesberg/flowbite-react/commit/ce257913c9ee3c6d52b6acf829d5b4688f0a6fc4)) -* **storybook:** fix the `argTypes.weekStart.mapping` on `Datepicker.stories.tsx` ([#1254](https://github.com/themesberg/flowbite-react/issues/1254)) ([79f6316](https://github.com/themesberg/flowbite-react/commit/79f631634c528a4b06b80a027a463d82c72697eb)), closes [#1167](https://github.com/themesberg/flowbite-react/issues/1167) -* **toggleswitch component:** added forwardRef to ToggleSwitch component ([#1198](https://github.com/themesberg/flowbite-react/issues/1198)) ([8e0b658](https://github.com/themesberg/flowbite-react/commit/8e0b658625cc29d729ce8ea19ee8afb6893c7f73)), closes [#1078](https://github.com/themesberg/flowbite-react/issues/1078) -* typo in fileInput.dropzone.tsx ([#1291](https://github.com/themesberg/flowbite-react/issues/1291)) ([2c2fa52](https://github.com/themesberg/flowbite-react/commit/2c2fa52b5c2e76f3e2e73309c14d453753c0fe7b)) - -### [0.7.2](https://github.com/themesberg/flowbite-react/compare/v0.7.1...v0.7.2) (2023-12-12) - - -### Bug Fixes - -* absolute to relative import ([#1183](https://github.com/themesberg/flowbite-react/issues/1183)) ([3f0bebb](https://github.com/themesberg/flowbite-react/commit/3f0bebbdc863552a5d31c080c1d129a450870cc0)) - -### [0.7.1](https://github.com/themesberg/flowbite-react/compare/v0.7.0...v0.7.1) (2023-12-12) - - -### ⚠ BREAKING CHANGES - -* **datepicker:** As the WeekStart enum changed order to be aligned with Javascript Date object, now -you have to change your weekStart attribute to be -1, so for Monday you should put 1, instead of 2. -But it wasn't working before as the values were incorrectly rendered in the first place. - -### Features - -* **list component:** develop new horizontal state of list component ([#1178](https://github.com/themesberg/flowbite-react/issues/1178)) ([1fbe6ca](https://github.com/themesberg/flowbite-react/commit/1fbe6ca69346b090f9007e0ae904213977ad6d6e)) -* **list.stories.tsx:** add horizontal stories ([#1180](https://github.com/themesberg/flowbite-react/issues/1180)) ([7db683d](https://github.com/themesberg/flowbite-react/commit/7db683d939d08a465df6fbb1dc7cbfc5b7396bf4)) - - -### Bug Fixes - -* add empty space to `` ring in dark mode ([#1160](https://github.com/themesberg/flowbite-react/issues/1160)) ([d0ccfde](https://github.com/themesberg/flowbite-react/commit/d0ccfde319642a9c62fcff8c04470e744d7ab7a7)) -* **component:** fix `` console warning ([#1172](https://github.com/themesberg/flowbite-react/issues/1172)) ([bdd7cdf](https://github.com/themesberg/flowbite-react/commit/bdd7cdfadd33ce39408cf50cbc42b199e7469457)) -* **datepicker:** fix the inconsistent weekday labels ([#1173](https://github.com/themesberg/flowbite-react/issues/1173)) ([770ab9d](https://github.com/themesberg/flowbite-react/commit/770ab9db7fde1aca8c68a1c0e196841a3510039f)), closes [#1044](https://github.com/themesberg/flowbite-react/issues/1044) -* **footer>theme.ts:** adding margin to right in footer links ([#1153](https://github.com/themesberg/flowbite-react/issues/1153)) ([7c1275e](https://github.com/themesberg/flowbite-react/commit/7c1275e255f8dcbefcd73a7acec21b17e043273f)), closes [#1085](https://github.com/themesberg/flowbite-react/issues/1085) -* **pagination:** updating lastPage variable correctly for table layout ([#1151](https://github.com/themesberg/flowbite-react/issues/1151)) ([2259bf5](https://github.com/themesberg/flowbite-react/commit/2259bf55c720495ae72bb055f2fca8c3633e006c)), closes [#1150](https://github.com/themesberg/flowbite-react/issues/1150) - -## [0.7.0](https://github.com/themesberg/flowbite-react/compare/v0.6.4...v0.7.0) (2023-11-24) - - -### Features - -* `ThemeModeScript` - avoid page flicker on reload on SSR application (NextJS, Remix) ([#1056](https://github.com/themesberg/flowbite-react/issues/1056)) ([4f0399b](https://github.com/themesberg/flowbite-react/commit/4f0399b50b23ec24ded67681f3290a8fbf653920)) -* **progress:** add missing colors for Progress component ([#1129](https://github.com/themesberg/flowbite-react/issues/1129)) ([f8853af](https://github.com/themesberg/flowbite-react/commit/f8853afb1cf404a0a07e446890bea92aa9ce22fb)) - - -### Bug Fixes - -* **button/theme.ts:** add the missing dark modifier for Button bg color ([#1047](https://github.com/themesberg/flowbite-react/issues/1047)) ([0050aef](https://github.com/themesberg/flowbite-react/commit/0050aef25e93bd38bd517b5da54344099f7eb4bf)), closes [#1045](https://github.com/themesberg/flowbite-react/issues/1045) -* docs dropdown - incorrect code preview ([#1059](https://github.com/themesberg/flowbite-react/issues/1059)) ([624932a](https://github.com/themesberg/flowbite-react/commit/624932a8ca34c74dba068415c6ccdbd695c77100)) -* docs forms toggle switch - incorrect code preview ([#1061](https://github.com/themesberg/flowbite-react/issues/1061)) ([5733b12](https://github.com/themesberg/flowbite-react/commit/5733b12796ae75cfd9ae29200c2a710e2405d199)) -* docs navbar - incorrect code preview ([#1062](https://github.com/themesberg/flowbite-react/issues/1062)) ([8c5bd0b](https://github.com/themesberg/flowbite-react/commit/8c5bd0bdceb466a4ac8b36b96e6a91b9c1fce83a)) -* docs/getting started/contributing - invalid "bug tracker" url ([#1073](https://github.com/themesberg/flowbite-react/issues/1073)) ([c357c4f](https://github.com/themesberg/flowbite-react/commit/c357c4f0d9d83c8f4b728f24a026eaed19c97a4a)) -* dropdown theme - granular control ([#1066](https://github.com/themesberg/flowbite-react/issues/1066)) ([cac6148](https://github.com/themesberg/flowbite-react/commit/cac614889e27ee95313dbe5a8af807eca6976649)) -* homepage dark mode `Floating Label` - missing svg ([#1074](https://github.com/themesberg/flowbite-react/issues/1074)) ([df71241](https://github.com/themesberg/flowbite-react/commit/df71241cc26fca900014fd163370bb680bc4e3d6)) -* layout overflow ([#1054](https://github.com/themesberg/flowbite-react/issues/1054)) ([7c5f136](https://github.com/themesberg/flowbite-react/commit/7c5f136035f20050fb14f97627b65fb86046873a)) -* listItem disabled property ([#1126](https://github.com/themesberg/flowbite-react/issues/1126)) ([0f274d6](https://github.com/themesberg/flowbite-react/commit/0f274d6318b7693ae79bb8ced2483e82085c9ed4)) -* remove alias import ([#1058](https://github.com/themesberg/flowbite-react/issues/1058)) ([bb60b18](https://github.com/themesberg/flowbite-react/commit/bb60b183b60e63f38eab7c711c0c775cd0739c55)) - -### [0.6.4](https://github.com/themesberg/flowbite-react/compare/v0.6.3...v0.6.4) (2023-10-03) - - -### Features - -* Blockquote Component ([#997](https://github.com/themesberg/flowbite-react/issues/997)) ([9b91c29](https://github.com/themesberg/flowbite-react/commit/9b91c299dbf4ea22dc3b1617633cdb837552776d)) -* checkbox colors ([#1032](https://github.com/themesberg/flowbite-react/issues/1032)) ([8ae697e](https://github.com/themesberg/flowbite-react/commit/8ae697ea50f8c35da4c3f746f8e2fa19bb78b249)) - - -### Bug Fixes - -* fix getWeekDays function ([#1040](https://github.com/themesberg/flowbite-react/issues/1040)) ([8822223](https://github.com/themesberg/flowbite-react/commit/8822223eb7417f34dbbe18d561858591cfaf420f)) - -### [0.6.3](https://github.com/themesberg/flowbite-react/compare/v0.6.2...v0.6.3) (2023-09-30) - - -### Bug Fixes - -* Button color blue theme ([#1024](https://github.com/themesberg/flowbite-react/issues/1024)) ([11d8510](https://github.com/themesberg/flowbite-react/commit/11d8510875c0285e7634185ae05555ef64da3dcd)) -* Floating Label theme import ([#1023](https://github.com/themesberg/flowbite-react/issues/1023)) ([160c24e](https://github.com/themesberg/flowbite-react/commit/160c24e0004b0c430a60493620c1dec4cdbdfedc)) - -### [0.6.2](https://github.com/themesberg/flowbite-react/compare/v0.6.1...v0.6.2) (2023-09-29) - - -### Features - -* adds floating label ([#955](https://github.com/themesberg/flowbite-react/issues/955)) ([3fc7b88](https://github.com/themesberg/flowbite-react/commit/3fc7b88d8633977b4e1d5c9eadcb4ed25116d86f)) -* **component:** toggleSwitch add sizing prop (sm|md|lg) ([#1009](https://github.com/themesberg/flowbite-react/issues/1009)) ([c3bf704](https://github.com/themesberg/flowbite-react/commit/c3bf704dd9775390a5efac638d84192b588fcbbd)) - - -### Bug Fixes - -* docs - avatar - render properly code example ([#1006](https://github.com/themesberg/flowbite-react/issues/1006)) ([48ce786](https://github.com/themesberg/flowbite-react/commit/48ce7863fcbc7d98b29c80b1c95c7f99a377ab95)) -* documentation regressions ([#1021](https://github.com/themesberg/flowbite-react/issues/1021)) ([dbfb019](https://github.com/themesberg/flowbite-react/commit/dbfb01958e47b04de08b9c88a259bc54f0eb1b36)) -* homepage - missing dark mode section functionality ([#989](https://github.com/themesberg/flowbite-react/issues/989)) ([63e04e2](https://github.com/themesberg/flowbite-react/commit/63e04e2ae52248adc86ead5298f11161af563cc9)) -* issue [#846](https://github.com/themesberg/flowbite-react/issues/846) - docs dropdown - `custom trigger` section not render… ([#1005](https://github.com/themesberg/flowbite-react/issues/1005)) ([409c01c](https://github.com/themesberg/flowbite-react/commit/409c01c9a5831b444702c252cd6086c7caaddfe8)) -* **toggleswitch:** disable + checked state and deprecated html event replacement ([#987](https://github.com/themesberg/flowbite-react/issues/987)) ([ce55df1](https://github.com/themesberg/flowbite-react/commit/ce55df1fc4b7a4c20a12957b052d8f359e8234a7)), closes [#986](https://github.com/themesberg/flowbite-react/issues/986) - -### [0.6.1](https://github.com/themesberg/flowbite-react/compare/v0.6.0...v0.6.1) (2023-09-23) - - -### Bug Fixes - -* `CodePreview` - show explicit false props ([#985](https://github.com/themesberg/flowbite-react/issues/985)) ([b1357c6](https://github.com/themesberg/flowbite-react/commit/b1357c6e44607fb1383393ec54ad37bd98712879)) -* **button:** allow height of buttons stretch ([#906](https://github.com/themesberg/flowbite-react/issues/906)) ([10b54e3](https://github.com/themesberg/flowbite-react/commit/10b54e345b355201405bf948eae943b5cca94354)) -* **button:** fix error Button cannot be used as a JSX component ([#974](https://github.com/themesberg/flowbite-react/issues/974)) ([b621601](https://github.com/themesberg/flowbite-react/commit/b62160116b26180023f15ed07804e9a48600180b)), closes [#962](https://github.com/themesberg/flowbite-react/issues/962) -* **component:** add custom theme to the carousel's default left and r… ([#910](https://github.com/themesberg/flowbite-react/issues/910)) ([ddff0e5](https://github.com/themesberg/flowbite-react/commit/ddff0e5e4353dbbeaba0312a317fe40e777b79f9)) -* **datepicker.tsx:** fix theme and add onSelectedDate callback ([#970](https://github.com/themesberg/flowbite-react/issues/970)) ([fe9f63f](https://github.com/themesberg/flowbite-react/commit/fe9f63f0cdb04f5ed64baa9ff8755182ef6c8fce)), closes [#968](https://github.com/themesberg/flowbite-react/issues/968) [#964](https://github.com/themesberg/flowbite-react/issues/964) -* **datepicker:** button type ([#984](https://github.com/themesberg/flowbite-react/issues/984)) ([496ed1e](https://github.com/themesberg/flowbite-react/commit/496ed1e9e066edae1eec021d0f7a042a82467c55)) -* **datepiker:** incorrect names of days of the week in the datepicker ([#963](https://github.com/themesberg/flowbite-react/issues/963)) ([e09a22a](https://github.com/themesberg/flowbite-react/commit/e09a22a4dc28aecefe7e09a2b6ac78a775083a9b)), closes [#960](https://github.com/themesberg/flowbite-react/issues/960) -* **labels:** default dark color of the input labels should be white ([#978](https://github.com/themesberg/flowbite-react/issues/978)) ([3d1d62e](https://github.com/themesberg/flowbite-react/commit/3d1d62eb80fa9475e0db70f05e8670bd8a6a9c9b)) -* scroll to section blocking above content ([#983](https://github.com/themesberg/flowbite-react/issues/983)) ([5a9589b](https://github.com/themesberg/flowbite-react/commit/5a9589bd39dd39cfddc149ae509c1caa98a4ee24)) -* **tabs:** added tabs container div style and theme ([#929](https://github.com/themesberg/flowbite-react/issues/929)) ([c0e9d66](https://github.com/themesberg/flowbite-react/commit/c0e9d66b88c259ef7cebfb67b44705aee7491fbc)), closes [#924](https://github.com/themesberg/flowbite-react/issues/924) -* **textarea:** default font size should be `text-sm` ([#958](https://github.com/themesberg/flowbite-react/issues/958)) ([ecf271a](https://github.com/themesberg/flowbite-react/commit/ecf271a8dcb64c7c25e24ad1cfb7c33b8ea3d3bd)) - -### [0.6.0](https://github.com/themesberg/flowbite-react/compare/v0.5.0...v0.6.0) (2023-09-09) - -### Features - -* add `` component ([#949](https://github.com/themesberg/flowbite-react/issues/949)) ([ce05949](https://github.com/themesberg/flowbite-react/commit/ce059497cc8512db841fae4fdda82857c3b92911)) -* add `` component ([#835](https://github.com/themesberg/flowbite-react/issues/835)) ([ff12d41](https://github.com/themesberg/flowbite-react/commit/ff12d41e7f940ac2033f38df7951d1352933c3a0)), closes [#626](https://github.com/themesberg/flowbite-react/issues/626) -* **component:** new pauseOnHover prop to , provide quick information with chance to pause ([#918](https://github.com/themesberg/flowbite-react/issues/918)) ([f69e1a4](https://github.com/themesberg/flowbite-react/commit/f69e1a4e13047a552e31281fb9faadd956e899d8)) -* **sidebar:** add custom chevron icon to collapse ([#891](https://github.com/themesberg/flowbite-react/issues/891)) ([d92c2cc](https://github.com/themesberg/flowbite-react/commit/d92c2cc690dd8f6886e35de84e6c1e3b93ef96ee)) - - -### Bug Fixes - -* **button.tsx:** Adding back displayName ([#890](https://github.com/themesberg/flowbite-react/issues/890)) ([8e24575](https://github.com/themesberg/flowbite-react/commit/8e245754b5057eb0b7cd27d95814f695c708a3de)) -* **button.tsx:** Button `as` prop internal logic + TS props ([#885](https://github.com/themesberg/flowbite-react/issues/885)) ([942735e](https://github.com/themesberg/flowbite-react/commit/942735e7dcd2ceea00927a0420c9e92a6998926c)), closes [#865](https://github.com/themesberg/flowbite-react/issues/865) -* **pagination:** center selected page ([#931](https://github.com/themesberg/flowbite-react/issues/931)) ([cc1292d](https://github.com/themesberg/flowbite-react/commit/cc1292d1dc4aeb39b3e91b1243944121f456f49f)), closes [#908](https://github.com/themesberg/flowbite-react/issues/908) -* **select.tsx/badge.tsx:** With icon classes preference ([#877](https://github.com/themesberg/flowbite-react/issues/877)) ([ebe605e](https://github.com/themesberg/flowbite-react/commit/ebe605edd2a541ab542a45c51d776a3dd92b9c00)), closes [#869](https://github.com/themesberg/flowbite-react/issues/869) - -## [0.5.0](https://github.com/themesberg/flowbite-react/compare/v0.4.11...v0.5.0) (2023-07-21) - - -### ⚠ BREAKING CHANGES - -* **toast.tsx:** Removing "removed" theme support - -### Features - -* **card:** support custom renderImage functions for Card ([#730](https://github.com/themesberg/flowbite-react/issues/730)) ([594f187](https://github.com/themesberg/flowbite-react/commit/594f1870d7fc964521e8e9b56c1e64f39124248e)), closes [#706](https://github.com/themesberg/flowbite-react/issues/706) -* **modal.tsx:** Modal Accessibility ([#858](https://github.com/themesberg/flowbite-react/issues/858)) ([2b4a3ec](https://github.com/themesberg/flowbite-react/commit/2b4a3ec8b1243bde08a1211d5c48126f68fedf4a)), closes [#647](https://github.com/themesberg/flowbite-react/issues/647) [#701](https://github.com/themesberg/flowbite-react/issues/701) -* **toast.tsx:** Stateless Toast ([#860](https://github.com/themesberg/flowbite-react/issues/860)) ([bd4ad89](https://github.com/themesberg/flowbite-react/commit/bd4ad890c23c1c4446a2d8962ad3f694cc3dbb7a)), closes [#848](https://github.com/themesberg/flowbite-react/issues/848) - - -### Bug Fixes - -* **button.tsx:** Relative Spinner size ([#868](https://github.com/themesberg/flowbite-react/issues/868)) ([3662d5e](https://github.com/themesberg/flowbite-react/commit/3662d5ec0f6318773524ddb8c2a55702574d1963)), closes [#850](https://github.com/themesberg/flowbite-react/issues/850) -* **modal.mdx:** fix spelling in modal documentation ([#862](https://github.com/themesberg/flowbite-react/issues/862)) ([380aa63](https://github.com/themesberg/flowbite-react/commit/380aa63752050858062cc61bd91bc4f6b691671c)) -* **pagination theme file:** added enabled attribute for pagination ba… ([#856](https://github.com/themesberg/flowbite-react/issues/856)) ([ecc3f6e](https://github.com/themesberg/flowbite-react/commit/ecc3f6ef0156533f2eeb337aad913e0a8182b58d)), closes [#849](https://github.com/themesberg/flowbite-react/issues/849) - -### [0.4.11](https://github.com/themesberg/flowbite-react/compare/v0.4.10...v0.4.11) (2023-07-10) - - -### Features - -* **dropdown.tsx:** Dropdown Accessibility ([#840](https://github.com/themesberg/flowbite-react/issues/840)) ([65b13e7](https://github.com/themesberg/flowbite-react/commit/65b13e7dd5def51076348bd9e06b6505419167cd)), closes [#648](https://github.com/themesberg/flowbite-react/issues/648) [#793](https://github.com/themesberg/flowbite-react/issues/793) - - -### Bug Fixes - -* **dropdown:** fix build ([2c0f9e5](https://github.com/themesberg/flowbite-react/commit/2c0f9e55b2210a4b4b28237fa25193580521e7f9)) -* **modal:** backdrop height ([#839](https://github.com/themesberg/flowbite-react/issues/839)) ([e6e1b83](https://github.com/themesberg/flowbite-react/commit/e6e1b834ccd87b32f685c8e1c4f268f75274e1a7)) - -### [0.4.10](https://github.com/themesberg/flowbite-react/compare/v0.4.9...v0.4.10) (2023-07-03) - - -### Features - -* **button.tsx:** Added as prop to button component ([#826](https://github.com/themesberg/flowbite-react/issues/826)) ([6384882](https://github.com/themesberg/flowbite-react/commit/6384882b754465aac2829dc9e634b0c30efce621)), closes [#655](https://github.com/themesberg/flowbite-react/issues/655) -* **carousel:** adds onSlideChange property ([#833](https://github.com/themesberg/flowbite-react/issues/833)) ([c80fb37](https://github.com/themesberg/flowbite-react/commit/c80fb37ca59d1a7ceff3fef978bea934baf43c46)) -* **components/darkthemetoggle:** supports custom icons ([1d615c0](https://github.com/themesberg/flowbite-react/commit/1d615c0bfbef4fdc48d9f19c18c069a15c74e228)) -* **components/sidebar:** theme access to list item element ([d7262ba](https://github.com/themesberg/flowbite-react/commit/d7262bab7c97c6e215431ff7d6ca6711e23570de)) -* **dropdown:** adding custom trigger ([#834](https://github.com/themesberg/flowbite-react/issues/834)) ([70c7aec](https://github.com/themesberg/flowbite-react/commit/70c7aec813f208c179a74b6b49343faf18369964)), closes [#624](https://github.com/themesberg/flowbite-react/issues/624) - - -### Bug Fixes - -* **button.tsx:** Disable Button hover state when button is disabled ([#830](https://github.com/themesberg/flowbite-react/issues/830)) ([2b45084](https://github.com/themesberg/flowbite-react/commit/2b45084a82851d7e96e21cf75a2c8a1d1fa94e10)), closes [#827](https://github.com/themesberg/flowbite-react/issues/827) -* **components/navbar:** fix theme interface ([bc280fc](https://github.com/themesberg/flowbite-react/commit/bc280fc4fc380ec61aa67b57090a1d8bed43a488)) -* **textinput.tsx:** TextInput padding when having right/left icons ([#832](https://github.com/themesberg/flowbite-react/issues/832)) ([d616e66](https://github.com/themesberg/flowbite-react/commit/d616e66e894bd80d5c95965047ea5c67ba45df91)), closes [#828](https://github.com/themesberg/flowbite-react/issues/828) - -### [0.4.9](https://github.com/themesberg/flowbite-react/compare/v0.4.7...v0.4.9) (2023-06-22) - - -### Features - -* replace `classnames` by `tailwind-merge` ([#816](https://github.com/themesberg/flowbite-react/issues/816)) ([7461173](https://github.com/themesberg/flowbite-react/commit/7461173ddb2afae9f66b9a4475b4333adef1e163)) - - -### Bug Fixes - -* **paginationbutton.tsx:** button now has type button ([#811](https://github.com/themesberg/flowbite-react/issues/811)) ([470c359](https://github.com/themesberg/flowbite-react/commit/470c3594c26706fff17a4e9932850e51d6e3e4a5)), closes [#809](https://github.com/themesberg/flowbite-react/issues/809) -* **src/components/navbar:** change default `` icon ([#819](https://github.com/themesberg/flowbite-react/issues/819)) ([6bc0de9](https://github.com/themesberg/flowbite-react/commit/6bc0de946c093863eab6386c26efc38779cb48fe)), closes [#818](https://github.com/themesberg/flowbite-react/issues/818) [/stackoverflow.com/questions/72146352/vitest-defineconfig-test-does-not-exist-in-type-userconfigexport/73106019#73106019](https://github.com/themesberg//stackoverflow.com/questions/72146352/vitest-defineconfig-test-does-not-exist-in-type-userconfigexport/73106019/issues/73106019) - -### [0.4.8](https://github.com/themesberg/flowbite-react/compare/v0.4.7...v0.4.8) (2023-06-22) - - -### Features - -* replace `classnames` by `tailwind-merge` ([#816](https://github.com/themesberg/flowbite-react/issues/816)) ([7461173](https://github.com/themesberg/flowbite-react/commit/7461173ddb2afae9f66b9a4475b4333adef1e163)) - - -### Bug Fixes - -* **paginationbutton.tsx:** button now has type button ([#811](https://github.com/themesberg/flowbite-react/issues/811)) ([470c359](https://github.com/themesberg/flowbite-react/commit/470c3594c26706fff17a4e9932850e51d6e3e4a5)), closes [#809](https://github.com/themesberg/flowbite-react/issues/809) - -### [0.4.7](https://github.com/themesberg/flowbite-react/compare/v0.4.4...v0.4.7) (2023-06-01) - - -### Features - -* **pagination.tsx:** next and previous buttons should disable when on 1 and last page respectively ([#731](https://github.com/themesberg/flowbite-react/issues/731)) ([8e8531b](https://github.com/themesberg/flowbite-react/commit/8e8531b2a1dfefcf7c9871dfa8fd441337baae6e)), closes [#726](https://github.com/themesberg/flowbite-react/issues/726) [#726](https://github.com/themesberg/flowbite-react/issues/726) - - -### Bug Fixes - -* **button.tsx:** make prop theme work ([#746](https://github.com/themesberg/flowbite-react/issues/746)) ([1b07a76](https://github.com/themesberg/flowbite-react/commit/1b07a760e5b1394c036ae212403f49d2a631d4fb)) -* **component:** fix Label component disabled property not applying theme styles ([#763](https://github.com/themesberg/flowbite-react/issues/763)) ([8d6d79e](https://github.com/themesberg/flowbite-react/commit/8d6d79ef92ff4b3482151c5428ea3b4aa0b7e637)), closes [#762](https://github.com/themesberg/flowbite-react/issues/762) -* **dropdown:** add type button in dropdown ([#757](https://github.com/themesberg/flowbite-react/issues/757)) ([974c126](https://github.com/themesberg/flowbite-react/commit/974c126e7e72833e2fde1bb9a631e4fcea6aa7af)), closes [#756](https://github.com/themesberg/flowbite-react/issues/756) -* **dropdown:** fix dropdown menu items container width ([#714](https://github.com/themesberg/flowbite-react/issues/714)) ([d13c77c](https://github.com/themesberg/flowbite-react/commit/d13c77c68960ed97828b5f9592fdb6d870a8a74d)), closes [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) -* making ToggleSwitch color prop as keyof FlowbiteColors ([#741](https://github.com/themesberg/flowbite-react/issues/741)) ([e3e2112](https://github.com/themesberg/flowbite-react/commit/e3e21126a4e38576c347f2815fb4ee51f1b1266b)) -* **modal:** fixed a bug that disallowed users to set the position of a modal ([#766](https://github.com/themesberg/flowbite-react/issues/766)) ([5200ecd](https://github.com/themesberg/flowbite-react/commit/5200ecd9df760012eedb05cbe51359db2c60c8d1)), closes [#760](https://github.com/themesberg/flowbite-react/issues/760) -* **Modal:** modal scrollbar overflow style issue fixed ([#769](https://github.com/themesberg/flowbite-react/issues/769)) ([746098d](https://github.com/themesberg/flowbite-react/commit/746098d26dd3da47982e43e7e6d27044dde4a05a)) -* **modal:** overflow bug fix ([#718](https://github.com/themesberg/flowbite-react/issues/718)) ([9e4e43a](https://github.com/themesberg/flowbite-react/commit/9e4e43abe17c7ea0d24b891003f41d11241f546f)), closes [#537](https://github.com/themesberg/flowbite-react/issues/537) -* pagination button not being highlighted correctly ([#725](https://github.com/themesberg/flowbite-react/issues/725)) ([53c1280](https://github.com/themesberg/flowbite-react/commit/53c1280f7b93c91413f0fb9fc2992e184591c6b3)) -* **src/components/*:** replace `tsconfig.json` `paths` by relative paths ([6efd448](https://github.com/themesberg/flowbite-react/commit/6efd448ddfa647e52c3bb0927285006ba06cffc8)), closes [#772](https://github.com/themesberg/flowbite-react/issues/772) -* **theme:** typo in bottom-center ([#717](https://github.com/themesberg/flowbite-react/issues/717)) ([89d58dc](https://github.com/themesberg/flowbite-react/commit/89d58dc03727d150e73ec753748eb98640bc84a3)) -* **tsconfig.lib:** compile to react-jsx for npm ([389dd1d](https://github.com/themesberg/flowbite-react/commit/389dd1d414feb7f96c28cfd8fb6b00efc55355a9)) - -### [0.4.6](https://github.com/themesberg/flowbite-react/compare/v0.4.6-beta.1...v0.4.6) (2023-05-26) - -### [0.4.5](https://github.com/themesberg/flowbite-react/compare/v0.4.4...v0.4.5) (2023-05-26) - -### Features - -- **pagination.tsx:** next and previous buttons should disable when on 1 and last page respectively ([#731](https://github.com/themesberg/flowbite-react/issues/731)) ([8e8531b](https://github.com/themesberg/flowbite-react/commit/8e8531b2a1dfefcf7c9871dfa8fd441337baae6e)), closes [#726](https://github.com/themesberg/flowbite-react/issues/726) [#726](https://github.com/themesberg/flowbite-react/issues/726) - -### Bug Fixes - -- **button.tsx:** make prop theme work ([#746](https://github.com/themesberg/flowbite-react/issues/746)) ([1b07a76](https://github.com/themesberg/flowbite-react/commit/1b07a760e5b1394c036ae212403f49d2a631d4fb)) -- **component:** fix Label component disabled property not applying theme styles ([#763](https://github.com/themesberg/flowbite-react/issues/763)) ([8d6d79e](https://github.com/themesberg/flowbite-react/commit/8d6d79ef92ff4b3482151c5428ea3b4aa0b7e637)), closes [#762](https://github.com/themesberg/flowbite-react/issues/762) -- **dropdown:** add type button in dropdown ([#757](https://github.com/themesberg/flowbite-react/issues/757)) ([974c126](https://github.com/themesberg/flowbite-react/commit/974c126e7e72833e2fde1bb9a631e4fcea6aa7af)), closes [#756](https://github.com/themesberg/flowbite-react/issues/756) -- **dropdown:** fix dropdown menu items container width ([#714](https://github.com/themesberg/flowbite-react/issues/714)) ([d13c77c](https://github.com/themesberg/flowbite-react/commit/d13c77c68960ed97828b5f9592fdb6d870a8a74d)), closes [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) [#575](https://github.com/themesberg/flowbite-react/issues/575) -- making ToggleSwitch color prop as keyof FlowbiteColors ([#741](https://github.com/themesberg/flowbite-react/issues/741)) ([e3e2112](https://github.com/themesberg/flowbite-react/commit/e3e21126a4e38576c347f2815fb4ee51f1b1266b)) -- **Modal:** modal scrollbar overflow style issue fixed ([#769](https://github.com/themesberg/flowbite-react/issues/769)) ([746098d](https://github.com/themesberg/flowbite-react/commit/746098d26dd3da47982e43e7e6d27044dde4a05a)) -- **modal:** overflow bug fix ([#718](https://github.com/themesberg/flowbite-react/issues/718)) ([9e4e43a](https://github.com/themesberg/flowbite-react/commit/9e4e43abe17c7ea0d24b891003f41d11241f546f)), closes [#537](https://github.com/themesberg/flowbite-react/issues/537) -- pagination button not being highlighted correctly ([#725](https://github.com/themesberg/flowbite-react/issues/725)) ([53c1280](https://github.com/themesberg/flowbite-react/commit/53c1280f7b93c91413f0fb9fc2992e184591c6b3)) -- **theme:** typo in bottom-center ([#717](https://github.com/themesberg/flowbite-react/issues/717)) ([89d58dc](https://github.com/themesberg/flowbite-react/commit/89d58dc03727d150e73ec753748eb98640bc84a3)) - -### [0.4.4](https://github.com/themesberg/flowbite-react/compare/v0.4.1...v0.4.4) (2023-04-24) - -### Features - -- **/src/components/avatar:** allow custom sizes for `placeholderInitials` ([#659](https://github.com/themesberg/flowbite-react/issues/659)) ([#660](https://github.com/themesberg/flowbite-react/issues/660)) ([525b90d](https://github.com/themesberg/flowbite-react/commit/525b90dfd374f38e1c0a8527fcb92eabc849c186)) -- **/src/components/progress:** fix unclear label usage ([#468](https://github.com/themesberg/flowbite-react/issues/468)) ([#547](https://github.com/themesberg/flowbite-react/issues/547)) ([f9cad02](https://github.com/themesberg/flowbite-react/commit/f9cad02d6d9b0f699c420167ccb0e373913ef1ce)) -- **sidebar:** Allow to customize the Sidebar component with 'as' ([#703](https://github.com/themesberg/flowbite-react/issues/703)) ([54fc3c2](https://github.com/themesberg/flowbite-react/commit/54fc3c2046f45698542bb14fb95af467eafffa99)) -- **Toast:** add onClick prop to Toast.Toggle ([#607](https://github.com/themesberg/flowbite-react/issues/607)) ([#666](https://github.com/themesberg/flowbite-react/issues/666)) ([9be39d0](https://github.com/themesberg/flowbite-react/commit/9be39d0f4c2f8da9bdd54003d9a6f2d983d16345)) - -### Bug Fixes - -- **/lib/components/table:** prevent scrollbars around ``s ([#608](https://github.com/themesberg/flowbite-react/issues/608)) ([6f1869b](https://github.com/themesberg/flowbite-react/commit/6f1869bac86c1dcbda622413a197f67536803f53)) -- **/src/lib/components/\*:** add `displayName` to Forms components ([#656](https://github.com/themesberg/flowbite-react/issues/656)) ([329cb5a](https://github.com/themesberg/flowbite-react/commit/329cb5ad6383244f38e11cac57050dc684d6c3c5)), closes [#641](https://github.com/themesberg/flowbite-react/issues/641) -- **/src/lib/components/\*:** allow `theme={}` to contain partials ([#649](https://github.com/themesberg/flowbite-react/issues/649)) ([863a789](https://github.com/themesberg/flowbite-react/commit/863a789ed169cbfcbe05d5de7e9021a074872063)), closes [#646](https://github.com/themesberg/flowbite-react/issues/646) -- **/src/lib/components/Flowbite:** fix `window is not defined` in `next.js` ([#652](https://github.com/themesberg/flowbite-react/issues/652)) ([8fd9ddc](https://github.com/themesberg/flowbite-react/commit/8fd9ddcc5fcd8d5926c0e871dd25493d5d2c255f)) -- **/src/theme:** fix `` vertical positioning ([#658](https://github.com/themesberg/flowbite-react/issues/658)) ([5fec3ca](https://github.com/themesberg/flowbite-react/commit/5fec3ca0710b1883a4de622453c896346c8ab8c0)), closes [#601](https://github.com/themesberg/flowbite-react/issues/601) -- added aria-label to solve Buttons do not have an accessible name… ([#711](https://github.com/themesberg/flowbite-react/issues/711)) ([65b0aef](https://github.com/themesberg/flowbite-react/commit/65b0aef13143d5efc0bb00bd2ab221573ec4c2ef)) -- **button:** fixes outline button ([#654](https://github.com/themesberg/flowbite-react/issues/654)) ([eab6bbb](https://github.com/themesberg/flowbite-react/commit/eab6bbb6f78b46fb298e75344442b75f028d5cff)) -- **component/models:** prevent scrolling of body when modal is shown ([#700](https://github.com/themesberg/flowbite-react/issues/700)) ([ab6e96a](https://github.com/themesberg/flowbite-react/commit/ab6e96a58bc5b39b0b80cdc898c634f9fbab7462)), closes [#604](https://github.com/themesberg/flowbite-react/issues/604) -- **component/progressbar:** fix progressbar showing label when progress == 0 ([#698](https://github.com/themesberg/flowbite-react/issues/698)) ([1fa7542](https://github.com/themesberg/flowbite-react/commit/1fa7542c687fc164f1cdbd6362fd35ac978942f1)), closes [#668](https://github.com/themesberg/flowbite-react/issues/668) -- **components/accordion:** allow opened panel to be closed [#684](https://github.com/themesberg/flowbite-react/issues/684) - add accordion tests ([#705](https://github.com/themesberg/flowbite-react/issues/705)) ([7de751e](https://github.com/themesberg/flowbite-react/commit/7de751e4a80b144edd7f3fdc7eaa4ca2ea655dad)), closes [#618](https://github.com/themesberg/flowbite-react/issues/618) -- group list styling ([#668](https://github.com/themesberg/flowbite-react/issues/668)) ([a4f39f5](https://github.com/themesberg/flowbite-react/commit/a4f39f5608a46f6c0d4661fa383e70583ab7d592)) -- **lib/components/buttons:** Add `target` to `Button` props to open a link in new tab ([#631](https://github.com/themesberg/flowbite-react/issues/631)) ([ed74d13](https://github.com/themesberg/flowbite-react/commit/ed74d1361d03fd01f5eac2b3ca8faa382718afba)) -- **sidebar:** adds missing className ([#657](https://github.com/themesberg/flowbite-react/issues/657)) ([12fce11](https://github.com/themesberg/flowbite-react/commit/12fce11aad6bb0d2ca5058ce9fffee629038e542)) -- **tabs:** remove tab auto focus ([#712](https://github.com/themesberg/flowbite-react/issues/712)) ([6942943](https://github.com/themesberg/flowbite-react/commit/6942943639025a7310606af7fa6c2ffa68755d84)), closes [#612](https://github.com/themesberg/flowbite-react/issues/612) [#612](https://github.com/themesberg/flowbite-react/issues/612) - -### [0.4.3](https://github.com/themesberg/flowbite-react/compare/v0.4.2...v0.4.3) (2023-04-05) - -### Features - -- **Toast:** add onClick prop to Toast.Toggle ([#607](https://github.com/themesberg/flowbite-react/issues/607)) ([#666](https://github.com/themesberg/flowbite-react/issues/666)) ([9be39d0](https://github.com/themesberg/flowbite-react/commit/9be39d0f4c2f8da9bdd54003d9a6f2d983d16345)) - -### [0.4.2](https://github.com/themesberg/flowbite-react/compare/v0.4.1...v0.4.2) (2023-03-08) - -### Features - -- **/src/components/avatar:** allow custom sizes for `placeholderInitials` ([#659](https://github.com/themesberg/flowbite-react/issues/659)) ([#660](https://github.com/themesberg/flowbite-react/issues/660)) ([525b90d](https://github.com/themesberg/flowbite-react/commit/525b90dfd374f38e1c0a8527fcb92eabc849c186)) -- **/src/components/progress:** fix unclear label usage ([#468](https://github.com/themesberg/flowbite-react/issues/468)) ([#547](https://github.com/themesberg/flowbite-react/issues/547)) ([f9cad02](https://github.com/themesberg/flowbite-react/commit/f9cad02d6d9b0f699c420167ccb0e373913ef1ce)) - -### Bug Fixes - -- **/src/lib/components/\*:** add `displayName` to Forms components ([#656](https://github.com/themesberg/flowbite-react/issues/656)) ([329cb5a](https://github.com/themesberg/flowbite-react/commit/329cb5ad6383244f38e11cac57050dc684d6c3c5)), closes [#641](https://github.com/themesberg/flowbite-react/issues/641) -- **/src/lib/components/\*:** allow `theme={}` to contain partials ([#649](https://github.com/themesberg/flowbite-react/issues/649)) ([863a789](https://github.com/themesberg/flowbite-react/commit/863a789ed169cbfcbe05d5de7e9021a074872063)), closes [#646](https://github.com/themesberg/flowbite-react/issues/646) -- **/src/lib/components/Flowbite:** fix `window is not defined` in `next.js` ([#652](https://github.com/themesberg/flowbite-react/issues/652)) ([8fd9ddc](https://github.com/themesberg/flowbite-react/commit/8fd9ddcc5fcd8d5926c0e871dd25493d5d2c255f)) -- **/src/theme:** fix `` vertical positioning ([#658](https://github.com/themesberg/flowbite-react/issues/658)) ([5fec3ca](https://github.com/themesberg/flowbite-react/commit/5fec3ca0710b1883a4de622453c896346c8ab8c0)), closes [#601](https://github.com/themesberg/flowbite-react/issues/601) -- **button:** fixes outline button ([#654](https://github.com/themesberg/flowbite-react/issues/654)) ([eab6bbb](https://github.com/themesberg/flowbite-react/commit/eab6bbb6f78b46fb298e75344442b75f028d5cff)) -- **lib/components/buttons:** Add `target` to `Button` props to open a link in new tab ([#631](https://github.com/themesberg/flowbite-react/issues/631)) ([ed74d13](https://github.com/themesberg/flowbite-react/commit/ed74d1361d03fd01f5eac2b3ca8faa382718afba)) -- **sidebar:** adds missing className ([#657](https://github.com/themesberg/flowbite-react/issues/657)) ([12fce11](https://github.com/themesberg/flowbite-react/commit/12fce11aad6bb0d2ca5058ce9fffee629038e542)) - -### [0.4.1](https://github.com/themesberg/flowbite-react/compare/v0.3.8...v0.4.1) (2023-03-03) - -### ⚠ BREAKING CHANGES - -- **/lib/components/flowbite:** ThemeProps no longer includes usePreferences -- **theme:** Like in #500, this version permanently changes the `FlowbiteTheme` for numerous - components. - -The philosophy is that themes will more clearly reflect the component's structure. - -For example, an `` can contain any number of `` or `` -sections. The theme used to look like: - -```js -accordion: { - base: "..", - content: "..", - flush: "..", - title: "..", -} -``` - -And now, the theme for an `` looks like: - -``` -js -accordion: { - root: { - base: "..", - flush: "..", - }, - content: "..", - title: "..", -} -``` - -So now the options in the theme which apply to the `` itself will always be found under -`root`. Likewise, `` can be themed via the `content` subsection. - -This ultimately will apply to all components. - -- ci(eslint): remove `prettier` plugins for `eslint` - -Instead, use `prettier-plugin-tailwindcss`, which is sufficient. - -- refactor(/lib/\*): use `yarn prettier` with `prettier-plugin-tailwindcss` - -- fix(/lib/components/\*.spec): resolve test errors caused by migrating theme - -- feat(/lib/components/\*): add `theme={}` attribute to components that need it - -### Features - -- **/lib/components/flowbite:** remove `usePreferences` ([#582](https://github.com/themesberg/flowbite-react/issues/582)) ([77cbc27](https://github.com/themesberg/flowbite-react/commit/77cbc27aa5d42bcff1bdd54c3b5c35e37ff039a0)), closes [#581](https://github.com/themesberg/flowbite-react/issues/581) [#565](https://github.com/themesberg/flowbite-react/issues/565) [#581](https://github.com/themesberg/flowbite-react/issues/581) [#565](https://github.com/themesberg/flowbite-react/issues/565) -- **/lib/components/timeline:** change `` to a `
` ([#603](https://github.com/themesberg/flowbite-react/issues/603)) ([720c8ef](https://github.com/themesberg/flowbite-react/commit/720c8ef6c707837372dddf33e9e4a73d42caea1e)), closes [#602](https://github.com/themesberg/flowbite-react/issues/602) -- **/lib/theme:** add Tailwind CSS colors to ``s ([#586](https://github.com/themesberg/flowbite-react/issues/586)) ([05bde49](https://github.com/themesberg/flowbite-react/commit/05bde49a7fe27e456b7e3da631424705beeaabb8)), closes [#473](https://github.com/themesberg/flowbite-react/issues/473) [#473](https://github.com/themesberg/flowbite-react/issues/473) [#473](https://github.com/themesberg/flowbite-react/issues/473) -- **/lib/theme:** add Tailwind CSS colors to ``s ([#617](https://github.com/themesberg/flowbite-react/issues/617)) ([f00628f](https://github.com/themesberg/flowbite-react/commit/f00628f95059f7e4e18bbe069ceb5573471dc36d)) -- **/lib/theme:** add Tailwind CSS colors to ` -
- ); -} -``` - -### Next steps - -#### Next.js - -If you're using Next.js, you can follow the [Next.js install guide](https://flowbite.com/docs/guides/next-js/), which includes a [Next.js starter project](https://github.com/tulupinc/flowbite-next-starter) with Flowbite React already set up. - -#### Dark mode - -If you want to add a dark mode switcher to your app, you can follow the [dark mode guide](https://flowbite.com/docs/customize/dark-mode/). - -#### Customization - -If you want to customize Flowbite React component, you can follow the [theme guide](https://flowbite.com/docs/customize/theming/). - -#### Contributing - -If you want to contribute to Flowbite React, you can follow the [contributing guide](https://github.com/themesberg/flowbite-react/blob/main/CONTRIBUTING.md). - -## Components - -**Please note that some components in the vanilla Flowbite library are not yet available in Flowbite React.** - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
AccordionAlertAvatar
- - React Accordion - - - - React Alert - - - - React Avatar - -
BannerBadgeBreadcrumb
- - React Banner - - - - React Badge - - - - React Breadcrumb - -
ButtonButton groupCard
- - React Button - - - - React Button group - - - - React Card - -
CarouselDatepickerDropdown
- - React Carousel - - - - React Datepicker - - - - React Dropdown - -
FooterFormsList group
- - React Footer - - - - React Forms - - - - React List group - -
ModalNavbarPagination
- - React Modal - - - - React Navbar - - - - React Pagination - -
Progress barRatingSidebar
- - React Progress bar - - - - React Rating - - - - React Sidebar - -
SpinnerTableTabs
- - React Spinner - - - - React Table - - - - React Tabs - -
TooltipTimelineToast
- - React Tooltip - - - - React Timeline - - - - React Toast - -
Sticky Banner
- - React Banner - -
- -## Community - -If you need help or just want to discuss about the library join the community on Github: - -⌨️ [Discuss about Flowbite on GitHub](https://github.com/themesberg/flowbite/discussions) - -For casual chatting with others using the library: - -💬 [Join the Flowbite Discord Server](https://discord.gg/4eeurUVvTy) - -## Contributing - -Thank you for your interest in helping! Visit our [guide on contributing](https://github.com/themesberg/flowbite-react/blob/main/CONTRIBUTING.md) to get started. - -## Figma - -If you need the Figma files for the components you can check out our website for more information: - -🎨 [Get access to the Figma design files](https://flowbite.com/figma/) - -## Copyright and license - -The Flowbite name and logos are trademarks of Bergside Srl. - -📝 [Read about the licensing terms](https://flowbite.com/docs/getting-started/license/) -📀 [Brand guideline and trademark usage agreement](https://flowbite.com/brand/) diff --git a/app/docs/[[...slug]]/page.tsx b/app/docs/[[...slug]]/page.tsx deleted file mode 100644 index e438de167..000000000 --- a/app/docs/[[...slug]]/page.tsx +++ /dev/null @@ -1,265 +0,0 @@ -import { allDocs, type Doc } from 'contentlayer/generated'; -import type { Metadata } from 'next'; -import Image from 'next/image'; -import Link from 'next/link'; -import { notFound } from 'next/navigation'; -import Markdown from 'react-markdown'; -import { CarbonAds } from '~/components/carbon-ads'; -import { Mdx } from '~/components/mdx'; -import { DOCS_SIDEBAR } from '~/data/docs-sidebar'; -import { Footer } from '~/src'; - -interface Props { - params: { - slug: string[]; - }; -} - -function getDoc({ params }: Props) { - const slug = params.slug?.join('/') || ''; - - return allDocs.find((doc) => doc.url === slug); -} - -export function generateMetadata({ params }: Props): Metadata { - const doc = getDoc({ params }); - - if (!doc) return {}; - - return { - title: doc.title, - description: doc.description, - openGraph: { - type: 'article', - title: doc.title, - description: doc.description, - images: 'https://flowbite.s3.amazonaws.com/github/flowbite-react.png', - }, - twitter: { - card: 'summary_large_image', - title: doc.title, - description: doc.description, - images: ['https://flowbite.s3.amazonaws.com/github/flowbite-react.png'], - }, - }; -} - -export function generateStaticParams() { - return allDocs.map((doc) => ({ slug: doc.url.split('/') })); -} - -export default function DocPage({ params }: Props) { - const doc = getDoc({ params }); - - if (!doc) notFound(); - - return ( -
-
-
- - - -
- - - -
- -
- ); -} - -interface ContentLayoutProps { - title: string; - description: string; - children: React.ReactNode; -} - -function ContentLayout({ title, description, children }: ContentLayoutProps) { - return ( -
-
-

- {title} -

-

{description}

-
-
- {children} -
-
- ); -} - -function DocsPager({ doc }: { doc: Doc }) { - const DOCS_SIDEBAR_ITEMS = DOCS_SIDEBAR.flatMap((section) => section.items); - const currentDocIndex = DOCS_SIDEBAR_ITEMS.findIndex((item) => item.href === `/${doc._raw.flattenedPath}`); - const prevDoc = DOCS_SIDEBAR_ITEMS[currentDocIndex - 1]; - const nextDoc = DOCS_SIDEBAR_ITEMS[currentDocIndex + 1]; - - return ( - - ); -} - -function DocFooter() { - return ( -
-
-
-
- - - Flowbite React - -

- Flowbite is an ecosystem built on top of Tailwind CSS including a component library, block sections, a - Figma design system and other resources. -

-

- Code licensed{' '} - - MIT - - , docs{' '} - - CC BY 3.0 - -

-
-
-
- - - - GitHub - - - Flowbite - - - Tailwind CSS - - - Figma - - -
-
- - - - Discord - - - Github Discussions - - -
-
- - - - License - - - Brand guideline - - -
-
-
- -
- -
-
-
- ); -} - -function ToC({ doc }: { doc: Doc }) { - return ( -
-
-
-

- On this page -

- -
-
-
- ); -} diff --git a/app/docs/layout.tsx b/app/docs/layout.tsx deleted file mode 100644 index 1fd965024..000000000 --- a/app/docs/layout.tsx +++ /dev/null @@ -1,216 +0,0 @@ -'use client'; - -import Image from 'next/image'; -import Link from 'next/link'; -import { usePathname } from 'next/navigation'; -import type { PropsWithChildren } from 'react'; -import { useEffect, useState } from 'react'; -import { HiMenuAlt1, HiX } from 'react-icons/hi'; -import { twMerge } from 'tailwind-merge'; -import { Banner } from '~/components/banner'; -import { DocSearchInput } from '~/components/docsearch-input'; -import { NavbarIcons, NavbarLinks } from '~/components/navbar'; -import { DOCS_SIDEBAR, type DocsSidebarItem } from '~/data/docs-sidebar'; -import { Accordion, Badge, Navbar, Sidebar } from '~/src'; -import { isClient } from '~/src/helpers/is-client'; - -import '~/styles/docs.css'; - -interface DocsLayoutState { - isCollapsed: boolean; - setCollapsed: (collapsed: boolean) => void; -} - -export default function DocsLayout({ children }: PropsWithChildren) { - const [isCollapsed, setCollapsed] = useState(true); - - const state: DocsLayoutState = { - isCollapsed, - setCollapsed, - }; - - return ( -
-
- - -
- -
{children}
-
-
-
- ); -} - -function DocsNavbar({ isCollapsed, setCollapsed }: DocsLayoutState) { - return ( - -
- {isCollapsed ? ( - - ) : ( - - )} - - Flowbite React - - - - Flowbite React - -
- -
-
-
- - -
-
- ); -} - -function DocsSidebar({ isCollapsed, setCollapsed }: DocsLayoutState) { - const pathname = usePathname(); - - // collapse sidebar on small screens when navigating to a new page - useEffect(() => { - if (isClient() && window.innerWidth < 768) { - setCollapsed(true); - } - }, [pathname, setCollapsed]); - - return ( - <> -
- - - {DOCS_SIDEBAR.map((section) => ( - - {section.items.map((item) => ( - - ))} - - ))} - - -
- {!isCollapsed && ( - // eslint-disable-next-line jsx-a11y/no-static-element-interactions -
setCollapsed(true)} - onKeyUp={(key) => key.code === 'Escape' && setCollapsed(true)} - className="fixed inset-0 z-40 bg-gray-900/50 dark:bg-gray-900/60 lg:hidden" - /> - )} - - ); -} - -function SidebarSection({ title, href, children }: PropsWithChildren<{ title: string; href: string }>) { - const pathname = usePathname(); - - return ( - - - - {title} - - - {children} - - - - ); -} - -function SidebarItem({ title, href, isNew, isExternal }: DocsSidebarItem) { - return ( - - {isNew ? {title} : title} - - ); -} - -function SidebarLink({ children, href, isExternal }: PropsWithChildren<{ href: string; isExternal?: boolean }>) { - const pathname = usePathname(); - - return ( - *]:px-0', - pathname === href - ? 'text-primary-700 hover:text-primary-700 dark:text-primary-500' - : 'text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white', - )} - > - {children} - - ); -} - -function NewBadge({ children }: PropsWithChildren) { - return ( - - {children} - - New - - - ); -} diff --git a/app/layout.tsx b/app/layout.tsx deleted file mode 100644 index fccffdca4..000000000 --- a/app/layout.tsx +++ /dev/null @@ -1,74 +0,0 @@ -import { Inter as InterFont } from 'next/font/google'; -import type { Metadata, NextPage, Viewport } from 'next/types'; -import type { FC, PropsWithChildren } from 'react'; -import { ThemeModeScript } from '~/src'; - -import '~/styles/globals.css'; - -const interFont = InterFont({ - subsets: ['latin'], - variable: '--font-inter', -}); - -export const metadata: Metadata = { - description: - 'Flowbite React is an open-source UI component library built with React components, Tailwind CSS utility classes and based on the Flowbite design system and components.', - icons: { - icon: [ - { url: '/favicon-32x32.png', type: 'image/png', sizes: '32x32' }, - { url: '/favicon-16x16.png', type: 'image/png', sizes: '16x16' }, - ], - shortcut: '/favicon.ico', - apple: [{ url: '/apple-touch-icon.png', sizes: '180x180' }], - }, - manifest: '/site.webmanifest', - other: { - charSet: 'utf-8', - lang: 'en', - }, - title: 'Flowbite React - UI Component Library', - openGraph: { - description: - 'Flowbite React is an open-source UI component library built with React components, Tailwind CSS utility classes and based on the Flowbite design system and components.', - images: 'https://flowbite.s3.amazonaws.com/github/flowbite-react.png', - title: 'Flowbite React - UI Component Library', - }, - twitter: { - card: 'summary_large_image', - title: 'Flowbite React - UI component library', - description: - 'Flowbite React is an open-source UI component library built with React components, Tailwind CSS utility classes and based on the Flowbite design system and components.', - creator: '@zoltanszogyenyi', - images: ['https://flowbite.s3.amazonaws.com/github/flowbite-react.png'], - }, -}; - -export const viewport: Viewport = { - width: 'device-width', - initialScale: 1, - maximumScale: 1, - themeColor: [ - { media: '(prefers-color-scheme: light)', color: '#ffffff' }, - { media: '(prefers-color-scheme: dark)', color: '#1f2937' }, - ], -}; - -const RootLayout: NextPage = ({ children }) => { - return ( - - - - - - {children} - - - - ); -}; - -const FathomScript: FC = () => { - return - - -``` - -## Setup Tailwind CSS - -1. Install `tailwindcss` and its peer dependencies: - -```bash -npm i -D tailwindcss postcss -``` - -2. Generate `tailwind.config.js` file: - -```bash -npx tailwindcss init -``` - -3. Create `.postcssrc` file and enable the tailwindcss plugin: - -```json -{ - "plugins": { - "tailwindcss": {} - } -} -``` - -4. Add the paths to all of your template files in your `tailwind.config.js` file: - -```js {3} -/** @type {import('tailwindcss').Config} */ -module.exports = { - content: ['./src/**/*.{html,js,ts,jsx,tsx}'], - theme: { - extend: {}, - }, - plugins: [], -}; -``` - -5. Create a `./src/index.css` file and add the `@tailwind` directives for each of Tailwind's layers: - -```css -@tailwind base; -@tailwind components; -@tailwind utilities; -``` - -6. Update `src/index.html` to include `src/index.css` file in the `head`: - -```html {6} - - - - - My Parcel App - - - -
- - - -``` - -## Install Flowbite React - -1. Run the following command to install `flowbite-react`: - -```bash -npm i flowbite-react -``` - -2. Add the Flowbite plugin to `tailwind.config.js` and include content from `flowbite-react`: - -```js {5,9} -/** @type {import('tailwindcss').Config} */ -export default { - content: [ - // ... - 'node_modules/flowbite-react/lib/esm/**/*.js', - ], - plugins: [ - // ... - require('flowbite/plugin'), - ], -}; -``` - -## Try it out - -Now that you have successfully installed Flowbite React you can start using the components from the library. - -```tsx -import { Button } from 'flowbite-react'; - -export function App() { - return ; -} -``` diff --git a/content/docs/guides/redwood-js.mdx b/content/docs/guides/redwood-js.mdx deleted file mode 100644 index d1fcb134d..000000000 --- a/content/docs/guides/redwood-js.mdx +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: Use with RedwoodJS - Flowbite React -description: Learn how to install Flowbite React for your RedwoodJS project and start developing modern full-stack web applications ---- - -## Create project - -1. Run the following command to create a new RedwoodJS project using the CLI: - -```bash -yarn create redwood-app -``` - -2. Create a new homepage using the CLI: - -```bash -yarn redwood generate page home / -``` - -## Setup Tailwind CSS - -Install `tailwindcss` using the CLI: - -```bash -yarn rw setup ui tailwindcss -``` - -## Install Flowbite React - -1. Run the following command to install `flowbite-react`: - -```bash -yarn add flowbite-react -``` - -2. Add the Flowbite plugin to `tailwind.config.js` and include content from `flowbite-react`: - -```js {5,9} -/** @type {import('tailwindcss').Config} */ -export default { - content: [ - // ... - '../node_modules/flowbite-react/lib/esm/**/*.js', - ], - plugins: [ - // ... - require('flowbite/plugin'), - ], -}; -``` - -## Try it out - -Now that you have successfully installed Flowbite React you can start using the components from the library. - -```tsx -import { Button } from 'flowbite-react'; - -export default function HomePage() { - return ; -} -``` diff --git a/content/docs/guides/remix.mdx b/content/docs/guides/remix.mdx deleted file mode 100644 index d0b093e87..000000000 --- a/content/docs/guides/remix.mdx +++ /dev/null @@ -1,97 +0,0 @@ ---- -title: Use with Remix - Flowbite React -description: Learn how to install Flowbite React for your Remix project to leverage quicker page loads with a full-stack web framework built by Shopify ---- - -## Create project - -Run the following command to create a new Remix project: - -```bash -npx create-remix@latest -``` - -## Setup Tailwind CSS - -1. Install `tailwindcss` and its peer dependencies: - -```bash -npm i -D tailwindcss -``` - -2. Generate `tailwind.config.ts` file: - -```bash -npx tailwindcss init --ts -``` - -3. Add the paths to all of your template files in your `tailwind.config.ts` file: - -```ts {4} -import type { Config } from 'tailwindcss'; - -export default { - content: ['./app/**/*.{js,jsx,ts,tsx}'], - theme: { - extend: {}, - }, - plugins: [], -} satisfies Config; -``` - -4. Create a `./app/tailwind.css` file and add the `@tailwind` directives for each of Tailwind's layers: - -```css -@tailwind base; -@tailwind components; -@tailwind utilities; -``` - -5. Import the newly-created `./app/tailwind.css` file in your `./app/root.tsx` file: - -```tsx {1,5} -import stylesheet from '~/tailwind.css'; - -export const links: LinksFunction = () => [ - // ... - { rel: 'stylesheet', href: stylesheet }, -]; -``` - -## Install Flowbite React - -1. Run the following command to install `flowbite-react`: - -```bash -npm i flowbite-react -``` - -2. Add the Flowbite plugin to `tailwind.config.ts` and include content from `flowbite-react`: - -```ts {1,7,11} -import flowbite from 'flowbite/plugin'; -import type { Config } from 'tailwindcss'; - -export default { - content: [ - // ... - 'node_modules/flowbite-react/lib/esm/**/*.js', - ], - plugins: [ - // ... - flowbite, - ], -} satisfies Config; -``` - -## Try it out - -Now that you have successfully installed Flowbite React you can start using the components from the library. - -```tsx -import { Button } from 'flowbite-react'; - -export default function Index() { - return ; -} -``` diff --git a/content/docs/guides/vite.mdx b/content/docs/guides/vite.mdx deleted file mode 100644 index 44e733d17..000000000 --- a/content/docs/guides/vite.mdx +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: Use with Vite - Flowbite React -description: Learn how to install Flowbite React for your Vite project and start developing modern web applications with interactive components ---- - -## Create project - -Run the following command to create a new Vite project using React and Typescript: - -```bash -npm create vite@latest -- --template react-ts -``` - -## Setup Tailwind CSS - -1. Install `tailwindcss` and its peer dependencies: - -```bash -npm i -D tailwindcss postcss autoprefixer -``` - -2. Generate `tailwind.config.js` and `postcss.config.js` files: - -```bash -npx tailwindcss init -p -``` - -3. Add the paths to all of your template files in your `tailwind.config.js` file: - -```js {3} -/** @type {import('tailwindcss').Config} */ -module.exports = { - content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'], - theme: { - extend: {}, - }, - plugins: [], -}; -``` - -4. Add the `@tailwind` directives for each of Tailwind's layers to your `./src/index.css` file: - -```css -@tailwind base; -@tailwind components; -@tailwind utilities; -``` - -## Install Flowbite React - -1. Run the following command to install `flowbite-react`: - -```bash -npm i flowbite-react -``` - -2. Add the Flowbite plugin to `tailwind.config.js` and include content from `flowbite-react`: - -```js {5,9} -/** @type {import('tailwindcss').Config} */ -export default { - content: [ - // ... - 'node_modules/flowbite-react/lib/esm/**/*.js', - ], - plugins: [ - // ... - require('flowbite/plugin'), - ], -}; -``` - -## Try it out - -Now that you have successfully installed Flowbite React you can start using the components from the library. - -```tsx -import { Button } from 'flowbite-react'; - -export default function App() { - return ; -} -``` diff --git a/content/docs/typography/blockquote.mdx b/content/docs/typography/blockquote.mdx deleted file mode 100644 index 20b9f93e4..000000000 --- a/content/docs/typography/blockquote.mdx +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: React Blockquote - Flowbite -description: The blockquote component can be used to quote text content from an external source that can be used for testimonials, reviews, and quotes inside an article ---- - -Get started with a collection of blockquote components when quoting external sources such as quotes inside an article, user reviews, and testimonials based on multiple examples of layouts, styles, and contexts. - -The main `
` component can be used together with the `` tag or attribute to also mention the source of the quote content. - -To start using the component make sure that you have imported it from Flowbite React: - -```jsx -import { Blockquote } from 'flowbite-react'; -``` - -## Default blockquote - -Use this example to quote an external source inside a `
` component. - - - -## Solid background - -This example can be used as an alternative style to the default one by applying a solid background color. - - - -## Blockquote icon - -Use this example to show an icon above the blockquote text content. - - - -## Paragraph context - -Use this example to show a `
` component between multiple paragraph elements. - - - -## User testimonial - -This example can be used for user testimonials by mentioning the author and occupation of the author. - - - -## User Review - -Use this example to show a user review with rating stars and the name and occupation of the author. - - - -## Alignment - -Choose from the following examples the blockquote text alignment from starting from left, center to right based on the utility classes from Tailwind CSS. - -### Left - -The default alignment of the blockquote text content is the left side of the document. - - - -### Center - -Use the text-center class from Tailwind CSS to align the text content inside the blockquote to the center. - - - -### Right - -Use the text-right utility class from Tailwind CSS to align the blockquote text content to the right side of the page. - - - -## Sizes - -Choose from one of the multiple sizes for the default blockquote component based on the surrounding elements and sizes. - -### Small - -Use the text-lg font size class from Tailwind CSS to apply the small size for the blockquote component. - - - -### Medium - -Use the text-xl utility class to set the default size for the blockquote element. - - - -### Large - -The text-2xl class can be used to set a large size for the blockquote component. - - - -## Theme - -To learn more about how to customize the appearance of components, please see the [Theme docs](/docs/customize/theme). - - - -## References - -- [Flowbite Blockquote](https://flowbite.com/docs/typography/blockquote/) diff --git a/content/docs/typography/list.mdx b/content/docs/typography/list.mdx deleted file mode 100644 index 88dd2d226..000000000 --- a/content/docs/typography/list.mdx +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: React Lists - Flowbite -description: Use the list component to show an unordered or ordered list of items based on multiple styles, layouts, and variants built with Tailwind CSS and Flowbite ---- - -Get started with a collection of list components built with Tailwind CSS for ordered and unordered lists with bullets, numbers, or icons and other styles and layouts to show a list of items inside an article or throughout your web page. - -Start using the list component by first importing it from Flowbite React: - -```jsx -import { List } from 'flowbite-react'; -``` - -## Default list - -Use this example to create a default unordered list of items using the `List` component with `List.Item` child components inside of it. - - - -## Nested - -Use this example to nested another list of items inside the parent list element. - - - -## Unstyled - -Use the `unstyled` prop to disable the list style bullets or numbers. - - - -## Ordered list - -Use the `ordered` prop tag to create an ordered list of items with numbers. - - - -## Horizontal list - -Use this example to create a horizontally aligned list of items. - - - -## Theme - -To learn more about how to customize the appearance of components, please see the [Theme docs](/docs/customize/theme). - - - -## References - -- [Flowbite List](https://flowbite.com/docs/typography/list/) diff --git a/contentlayer.config.js b/contentlayer.config.js deleted file mode 100644 index 4bda6f763..000000000 --- a/contentlayer.config.js +++ /dev/null @@ -1,39 +0,0 @@ -import { defineDocumentType, makeSource } from 'contentlayer/source-files'; -import toc from 'markdown-toc'; -import rehypeAutolinkHeadings from 'rehype-autolink-headings'; -import rehypePrismPlus from 'rehype-prism-plus'; -import rehypeSlug from 'rehype-slug'; - -export const Doc = defineDocumentType(() => ({ - name: 'Doc', - filePathPattern: `docs/**/*.mdx`, - contentType: 'mdx', - fields: { - title: { - type: 'string', - required: true, - }, - description: { - type: 'string', - required: true, - }, - }, - computedFields: { - url: { - type: 'string', - resolve: (doc) => doc._raw.flattenedPath.split('/').slice(1).join('/'), - }, - toc: { - type: 'markdown', - resolve: (doc) => toc(doc.body.raw).content, - }, - }, -})); - -export default makeSource({ - contentDirPath: 'content', - documentTypes: [Doc], - mdx: { - rehypePlugins: [rehypeSlug, rehypeAutolinkHeadings, rehypePrismPlus], - }, -}); diff --git a/cypress.config.ts b/cypress.config.ts deleted file mode 100644 index d1f1e5d0b..000000000 --- a/cypress.config.ts +++ /dev/null @@ -1,11 +0,0 @@ -/* eslint-disable @typescript-eslint/no-unused-vars */ -/* eslint-disable @typescript-eslint/no-empty-function */ -import { defineConfig } from 'cypress'; - -export default defineConfig({ - fixturesFolder: false, - e2e: { - setupNodeEvents(_on, _config) {}, - baseUrl: 'http://localhost:3000', - }, -}); diff --git a/cypress/e2e/docs/pages/CarouselPage.cy.ts b/cypress/e2e/docs/pages/CarouselPage.cy.ts deleted file mode 100644 index beb50be51..000000000 --- a/cypress/e2e/docs/pages/CarouselPage.cy.ts +++ /dev/null @@ -1,86 +0,0 @@ -describe('Docs / Carousel', () => { - beforeEach(() => { - cy.visit('/carousel'); - cy.injectAxe(); - }); - - describe('The page', () => { - it("shouldn't have any detectable a11y violations", () => { - cy.checkA11y(); - }); - }); - - describe('Default', () => { - beforeEach(() => { - cy.get('[data-testid=carousel').first().as('carousel'); - cy.get('@carousel').find('[data-testid=carousel-item]').as('items'); - cy.get('@carousel').find('[data-testid=carousel-indicator]').as('indicators'); - }); - - it('should render first slide on page load', () => { - cy.get('@items').first().should('have.attr', 'data-active', 'true'); - cy.get('@carousel').find('[data-active="true"]').should('have.length', 1); - }); - - it('should navigate forward via right control', () => { - cy.get('@carousel').find('[data-testid=carousel-right-control]').click(); - cy.get('@items').eq(1).should('have.attr', 'data-active', 'true'); - }); - - it('should navigate backward via left control', () => { - cy.get('@carousel').find('[data-testid=carousel-left-control]').click(); - cy.get('@items').eq(4).should('have.attr', 'data-active', 'true'); - }); - - it('should navigate slides via buttons', () => { - cy.get('@indicators').eq(3).click(); - cy.get('@items').eq(3).should('have.attr', 'data-active', 'true'); - }); - - it('should change slide every 3 s', () => { - cy.wait(3000).get('@items').eq(1).should('have.attr', 'data-active', 'true'); - }); - }); - - describe('Sliding interval', () => { - it('should change slide every 5 s', () => { - cy.get('[data-testid=carousel]').eq(1).find('[data-testid=carousel-item]').as('items'); - cy.wait(5000).get('@items').eq(1).should('have.attr', 'data-active', 'true'); - }); - }); - - describe('Static', () => { - it('should not automatically change slides', () => { - cy.get('[data-testid=carousel]').eq(2).find('[data-testid=carousel-item]').as('items'); - cy.wait(3000).get('@items').first().should('have.attr', 'data-active', 'true'); - }); - }); - - describe('Custom controls', () => { - it('should display custom controls rather than defaults', () => { - cy.get('[data-testid=carousel]').eq(3).as('carousel'); - cy.get('@carousel').find('[data-testid=carousel-left-control]').contains('left'); - cy.get('@carousel').find('[data-testid=carousel-right-control]').contains('right'); - }); - }); - - describe('Indicators', () => { - it('should display two carousels, where the second has no indicators', () => { - cy.get('[data-testid=carousel]').eq(4).find('[data-testid=carousel-indicator]').should('have.length', 5); - cy.get('[data-testid=carousel]').eq(5).find('[data-testid=carousel-indicator]').should('not.exist'); - }); - }); - - describe('Slide as anything', () => { - it('should display a carousel with itemes containing just text (no images)', () => { - cy.get('[data-testid=carousel]') - .eq(6) - .find('[data-testid=carousel-item]') - .each((item, i) => { - cy.wrap(item).contains(`Slide ${i + 1}`); - }); - }); - }); -}); - -export {}; diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts deleted file mode 100644 index 46bfe99c3..000000000 --- a/cypress/support/e2e.ts +++ /dev/null @@ -1 +0,0 @@ -import 'cypress-axe'; diff --git a/cypress/tsconfig.json b/cypress/tsconfig.json deleted file mode 100644 index 136a93b13..000000000 --- a/cypress/tsconfig.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": "../tsconfig.json", - "compilerOptions": { - "types": ["cypress", "cypress-axe", "node"] - }, - "include": ["**/*.ts"] -} diff --git a/data/components.tsx b/data/components.tsx deleted file mode 100644 index 4965bed62..000000000 --- a/data/components.tsx +++ /dev/null @@ -1,416 +0,0 @@ -interface Component { - name: string; - image: string; - imageDark: string; - link: string; - classes: string; -} - -export const COMPONENTS_DATA: Component[] = [ - { - name: 'Alerts', - image: '/images/components/alerts.svg', - imageDark: '/images/components/alerts-dark.svg', - link: `/docs/components/alert`, - classes: 'w-56', - }, - { - name: 'Accordion', - image: '/images/components/accordion.svg', - imageDark: '/images/components/accordion-dark.svg', - link: `/docs/components/accordion`, - classes: 'w-56', - }, - { - name: 'Avatar', - image: '/images/components/avatar.svg', - imageDark: '/images/components/avatar-dark.svg', - link: `/docs/components/avatar`, - classes: 'w-40', - }, - { - name: 'Badges', - image: '/images/components/badges.svg', - imageDark: '/images/components/badges-dark.svg', - link: `/docs/components/badge`, - classes: 'w-28', - }, - { - name: 'Breadcrumbs', - image: '/images/components/breadcrumbs.svg', - imageDark: '/images/components/breadcrumbs-dark.svg', - link: `/docs/components/breadcrumb`, - classes: 'w-64', - }, - { - name: 'Buttons', - image: '/images/components/buttons.svg', - imageDark: '/images/components/buttons-dark.svg', - link: `/docs/components/button`, - classes: 'w-24', - }, - { - name: 'Button group', - image: '/images/components/button-group.svg', - imageDark: '/images/components/button-group-dark.svg', - link: `/docs/components/button-group`, - classes: 'w-56', - }, - { - name: 'Cards', - image: '/images/components/cards.svg', - imageDark: '/images/components/cards-dark.svg', - link: `/docs/components/card`, - classes: 'w-36', - }, - { - name: 'Carousel', - image: '/images/components/carousel.svg', - imageDark: '/images/components/carousel-dark.svg', - link: `/docs/components/carousel`, - classes: 'w-48', - }, - { - name: 'Datepicker', - image: '/images/components/datepicker.svg', - imageDark: '/images/components/datepicker-dark.svg', - link: `/docs/components/datepicker`, - classes: 'w-28', - }, - { - name: 'Dropdown', - image: '/images/components/dropdown.svg', - imageDark: '/images/components/dropdown-dark.svg', - link: `/docs/components/dropdown`, - classes: 'w-28', - }, - { - name: 'Forms', - image: '/images/components/forms.svg', - imageDark: '/images/components/forms-dark.svg', - link: `/docs/components/forms`, - classes: 'w-40', - }, - { - name: 'List group', - image: '/images/components/list-group.svg', - imageDark: '/images/components/list-group-dark.svg', - link: `/docs/components/list-group`, - classes: 'w-36', - }, - // { - // name: 'Typography', - // image: '/images/components/typography.svg', - // imageDark: '/images/components/typography-dark.svg', - // link: `/docs/components/typography`, - // classes: 'w-36' - // }, - { - name: 'Modal', - image: '/images/components/modal.svg', - imageDark: '/images/components/modal-dark.svg', - link: `/docs/components/modal`, - classes: 'w-48', - }, - { - name: 'Tabs', - image: '/images/components/tabs.svg', - imageDark: '/images/components/tabs-dark.svg', - link: `/docs/components/tabs`, - classes: 'w-64', - }, - { - name: 'Navbar', - image: '/images/components/navbar.svg', - imageDark: '/images/components/navbar-dark.svg', - link: `/docs/components/navbar`, - classes: 'w-56', - }, - { - name: 'Footer', - image: '/images/components/footer.svg', - imageDark: '/images/components/footer-dark.svg', - link: `/docs/components/footer`, - classes: 'w-56', - }, - { - name: 'Sidebar', - image: '/images/components/sidebar.svg', - imageDark: '/images/components/sidebar-dark.svg', - link: `/docs/components/sidebar`, - classes: 'w-16', - }, - { - name: 'Pagination', - image: '/images/components/pagination.svg', - imageDark: '/images/components/pagination-dark.svg', - link: `/docs/components/pagination`, - classes: 'w-48', - }, - // { - // name: 'Speed Dial', - // image: '/images/components/dial.svg', - // imageDark: '/images/components/dial-dark.svg', - // link: `/docs/components/speed-dial`, - // classes: 'w-72' - // }, - { - name: 'Rating', - image: '/images/components/rating.svg', - imageDark: '/images/components/rating-dark.svg', - link: `/docs/components/rating`, - classes: 'w-48', - }, - { - name: 'Timeline', - image: '/images/components/timeline.svg', - imageDark: '/images/components/timeline-dark.svg', - link: `/docs/components/timeline`, - classes: 'w-24', - }, - { - name: 'Progress bar', - image: '/images/components/progress.svg', - imageDark: '/images/components/progress-dark.svg', - link: `/docs/components/progress`, - classes: 'w-48', - }, - { - name: 'Table', - image: '/images/components/table.svg', - imageDark: '/images/components/table-dark.svg', - link: `/docs/components/table`, - classes: 'w-48', - }, - { - name: 'Spinner', - image: '/images/components/spinner.svg', - imageDark: '/images/components/spinner-dark.svg', - link: `/docs/components/spinner`, - classes: 'w-32', - }, - { - name: 'Toast', - image: '/images/components/toast.svg', - imageDark: '/images/components/toast-dark.svg', - link: `/docs/components/toast`, - classes: 'w-48', - }, - { - name: 'Tooltips', - image: '/images/components/tooltips.svg', - imageDark: '/images/components/tooltips-dark.svg', - link: `/docs/components/tooltip`, - classes: 'w-24', - }, - // { - // name: 'Input Field', - // image: '/images/components/input-field.svg', - // imageDark: '/images/components/input-field-dark.svg', - // link: `/docs/forms/input-field`, - // classes: 'w-40' - // }, - { - name: 'File Input', - image: '/images/components/file-input.svg', - imageDark: '/images/components/file-input-dark.svg', - link: `/docs/forms/file-input`, - classes: 'w-48', - }, - // { - // name: 'Search Input', - // image: '/images/components/search-input.svg', - // imageDark: '/images/components/search-input-dark.svg', - // link: `/docs/forms/search-input`, - // classes: 'w-56' - // }, - // { - // name: 'Select', - // image: '/images/components/select.svg', - // imageDark: '/images/components/select-dark.svg', - // link: `/docs/forms/select`, - // classes: 'w-56' - // }, - // { - // name: 'Textarea', - // image: '/images/components/textarea.svg', - // imageDark: '/images/components/textarea-dark.svg', - // link: `/docs/forms/textarea`, - // classes: 'w-56' - // }, - // { - // name: 'Checkbox', - // image: '/images/components/checkbox.svg', - // imageDark: '/images/components/checkbox.svg', - // link: `/docs/forms/checkbox`, - // classes: 'w-40' - // }, - // { - // name: 'Radio', - // image: '/images/components/radio.svg', - // imageDark: '/images/components/radio-dark.svg', - // link: `/docs/forms/radio`, - // classes: 'w-36' - // }, - // { - // name: 'Toggle', - // image: '/images/components/toggle.svg', - // imageDark: '/images/components/toggle-dark.svg', - // link: `/docs/forms/toggle`, - // classes: 'w-40' - // }, - // { - // name: 'Range Slider', - // image: '/images/components/range-slider.svg', - // imageDark: '/images/components/range-slider-dark.svg', - // link: `/docs/forms/range`, - // classes: 'w-56' - // }, - { - name: 'Floating Label', - image: '/images/components/floating-label.svg', - imageDark: '/images/components/floating-label-dark.svg', - link: `/docs/forms/floating-label`, - classes: 'w-40', - }, - // { - // name: 'Mega menu', - // image: '/images/components/mega-menu.svg', - // imageDark: '/images/components/mega-menu-dark.svg', - // link: `/docs/components/mega-menu`, - // classes: 'w-40' - // }, - // { - // name: 'Skeleton', - // image: '/images/components/skeleton.svg', - // imageDark: '/images/components/skeleton-dark.svg', - // link: `/docs/components/skeleton`, - // classes: 'w-40' - // }, - { - name: 'KBD (Keyboard)', - image: '/images/components/keyboard.svg', - imageDark: '/images/components/keyboard-dark.svg', - link: `/docs/components/kbd`, - classes: 'w-40', - }, - // { - // name: 'Drawer (offcanvas)', - // image: '/images/components/drawer.svg', - // imageDark: '/images/components/drawer-dark.svg', - // link: `/docs/components/drawer`, - // classes: 'w-56' - // }, - // { - // name: 'Popover', - // image: '/images/components/popover.svg', - // imageDark: '/images/components/popover-dark.svg', - // link: `/docs/components/popover`, - // classes: 'w-56' - // }, - // { - // name: 'Video', - // image: '/images/components/video.svg', - // imageDark: '/images/components/video-dark.svg', - // link: `/docs/components/video`, - // classes: 'w-64' - // }, - // { - // name: 'Heading', - // image: '/images/components/heading.svg', - // imageDark: '/images/components/heading-dark.svg', - // link: `/docs/typography/headings`, - // classes: 'w-72' - // }, - // { - // name: 'Paragraph', - // image: '/images/components/paragraph.svg', - // imageDark: '/images/components/paragraph-dark.svg', - // link: `/docs/typography/paragraphs`, - // classes: 'w-64' - // }, - { - name: 'Blockquote', - image: '/images/components/blockquote.svg', - imageDark: '/images/components/blockquote-dark.svg', - link: `/docs/typography/blockquote`, - classes: 'w-64', - }, - // { - // name: 'Image', - // image: '/images/components/image.svg', - // imageDark: '/images/components/image-dark.svg', - // link: `/docs/typography/images`, - // classes: 'w-64' - // }, - { - name: 'List', - image: '/images/components/list.svg', - imageDark: '/images/components/list-dark.svg', - link: `/docs/typography/list`, - classes: 'w-64', - }, - // { - // name: 'Link', - // image: '/images/components/link.svg', - // imageDark: '/images/components/link-dark.svg', - // link: `/docs/typography/links`, - // classes: 'w-64' - // }, - // { - // name: 'Text', - // image: '/images/components/text.svg', - // imageDark: '/images/components/text-dark.svg', - // link: `/docs/typography/text`, - // classes: 'w-64' - // }, - // { - // name: 'Horizontal line (HR)', - // image: '/images/components/hr.svg', - // imageDark: '/images/components/hr-dark.svg', - // link: `/docs/typography/hr`, - // classes: 'w-64' - // }, - // { - // name: 'Stepper', - // image: '/images/components/stepper.svg', - // imageDark: '/images/components/stepper-dark.svg', - // link: `/docs/components/stepper`, - // classes: 'w-64' - // }, - // { - // name: 'Indicators', - // image: '/images/components/indicators.svg', - // imageDark: '/images/components/indicators-dark.svg', - // link: `/docs/components/indicators`, - // classes: 'w-64' - // }, - // { - // name: 'Bottom Navigation', - // image: '/images/components/bottom-bar.svg', - // imageDark: '/images/components/bottom-bar-dark.svg', - // link: `/docs/components/bottom-navigation`, - // classes: 'w-64' - // }, - { - name: 'Sticky Banner', - image: '/images/components/banner.svg', - imageDark: '/images/components/banner-dark.svg', - link: `/docs/components/banner`, - classes: 'w-64', - }, - // { - // name: 'Gallery (Masonry)', - // image: '/images/components/gallery.svg', - // imageDark: '/images/components/gallery-dark.svg', - // link: `/docs/components/gallery`, - // classes: 'w-64' - // }, - // { - // name: 'Jumbotron', - // image: '/images/components/jumbotron.svg', - // imageDark: '/images/components/jumbotron-dark.svg', - // link: `/docs/components/jumbotron`, - // classes: 'w-64' - // } -]; diff --git a/data/docs-sidebar.ts b/data/docs-sidebar.ts deleted file mode 100644 index 5079d89b0..000000000 --- a/data/docs-sidebar.ts +++ /dev/null @@ -1,102 +0,0 @@ -export interface DocsSidebarSection { - title: string; - href: string; - items: DocsSidebarItem[]; -} - -export interface DocsSidebarItem { - title: string; - href: string; - isNew?: boolean; - isExternal?: boolean; -} - -export const DOCS_SIDEBAR: DocsSidebarSection[] = [ - { - title: 'getting started', - href: '/getting-started/', - items: [ - { title: 'Introduction', href: '/docs/getting-started/introduction' }, - { title: 'Quickstart', href: '/docs/getting-started/quickstart' }, - { title: 'Server Components', href: '/docs/getting-started/server-components', isNew: true }, - { title: 'TypeScript', href: '/docs/getting-started/typescript' }, - { title: 'License', href: '/docs/getting-started/license' }, - { title: 'Changelog', href: 'https://github.com/themesberg/flowbite-react/releases', isExternal: true }, - { title: 'Contributing', href: '/docs/getting-started/contributing' }, - ], - }, - { - title: 'integration guides', - href: '/guides/', - items: [ - { title: 'Next.js', href: '/docs/guides/next-js', isNew: true }, - { title: 'Vite', href: '/docs/guides/vite', isNew: true }, - { title: 'Remix', href: '/docs/guides/remix', isNew: true }, - { title: 'Astro', href: '/docs/guides/astro', isNew: true }, - { title: 'Gatsby', href: '/docs/guides/gatsby', isNew: true }, - { title: 'Laravel', href: '/docs/guides/laravel', isNew: true }, - { title: 'Parcel', href: '/docs/guides/parcel', isNew: true }, - { title: 'Create React App', href: '/docs/guides/create-react-app', isNew: true }, - { title: 'RedwoodJS', href: '/docs/guides/redwood-js', isNew: true }, - ], - }, - { - title: 'customize', - href: '/customize/', - items: [ - { title: 'Theme', href: '/docs/customize/theme' }, - { title: 'Dark mode', href: '/docs/customize/dark-mode' }, - ], - }, - { - title: 'components', - href: '/components/', - items: [ - { title: 'Accordion', href: '/docs/components/accordion' }, - { title: 'Alert', href: '/docs/components/alert' }, - { title: 'Avatar', href: '/docs/components/avatar' }, - { title: 'Badge', href: '/docs/components/badge' }, - { title: 'Banner', href: '/docs/components/banner', isNew: true }, - { title: 'Breadcrumb', href: '/docs/components/breadcrumb' }, - { title: 'Button', href: '/docs/components/button' }, - { title: 'Button group', href: '/docs/components/button-group' }, - { title: 'Card', href: '/docs/components/card' }, - { title: 'Carousel', href: '/docs/components/carousel' }, - { title: 'Datepicker', href: '/docs/components/datepicker', isNew: true }, - { title: 'Dropdown', href: '/docs/components/dropdown' }, - { title: 'Footer', href: '/docs/components/footer' }, - { title: 'Forms', href: '/docs/components/forms' }, - { title: 'KBD', href: '/docs/components/kbd', isNew: true }, - { title: 'List group', href: '/docs/components/list-group' }, - { title: 'Modal', href: '/docs/components/modal' }, - { title: 'Navbar', href: '/docs/components/navbar' }, - { title: 'Pagination', href: '/docs/components/pagination' }, - { title: 'Popover', href: '/docs/components/popover' }, - { title: 'Progress bar', href: '/docs/components/progress' }, - { title: 'Rating', href: '/docs/components/rating' }, - { title: 'Sidebar', href: '/docs/components/sidebar' }, - { title: 'Spinner', href: '/docs/components/spinner' }, - { title: 'Table', href: '/docs/components/table' }, - { title: 'Tabs', href: '/docs/components/tabs' }, - { title: 'Timeline', href: '/docs/components/timeline' }, - { title: 'Toast', href: '/docs/components/toast' }, - { title: 'Tooltip', href: '/docs/components/tooltip' }, - ], - }, - { - title: 'forms', - href: '/forms/', - items: [ - { title: 'File Input', href: '/docs/forms/file-input' }, - { title: 'Floating Label', href: '/docs/forms/floating-label', isNew: true }, - ], - }, - { - title: 'typography', - href: '/typography/', - items: [ - { title: 'Blockquote', href: '/docs/typography/blockquote', isNew: true }, - { title: 'List', href: '/docs/typography/list', isNew: true }, - ], - }, -]; diff --git a/examples/accordion/accordion.collapseAll.tsx b/examples/accordion/accordion.collapseAll.tsx deleted file mode 100644 index d828f0594..000000000 --- a/examples/accordion/accordion.collapseAll.tsx +++ /dev/null @@ -1,249 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Accordion, AccordionContent, AccordionPanel, AccordionTitle } from '~/src'; - -const code = ` -'use client'; - -import { Accordion } from 'flowbite-react'; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} -`; - -const codeRSC = ` -import { Accordion, AccordionContent, AccordionPanel, AccordionTitle } from 'flowbite-react'; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} -`; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} - -export const collapseAll: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'accordion/accordion.collapseAll.tsx', - component: , -}; diff --git a/examples/accordion/accordion.root.tsx b/examples/accordion/accordion.root.tsx deleted file mode 100644 index 06db403b9..000000000 --- a/examples/accordion/accordion.root.tsx +++ /dev/null @@ -1,249 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Accordion, AccordionContent, AccordionPanel, AccordionTitle } from '~/src'; - -const code = ` -'use client'; - -import { Accordion } from 'flowbite-react'; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} -`; - -const codeRSC = ` -import { Accordion, AccordionContent, AccordionPanel, AccordionTitle } from 'flowbite-react'; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} -`; - -function Component() { - return ( - - - What is Flowbite? - -

- Flowbite is an open-source library of interactive components built on top of Tailwind CSS including buttons, - dropdowns, modals, navbars, and more. -

-

- Check out this guide to learn how to  - - get started  - - and start developing websites even faster with components on top of Tailwind CSS. -

-
-
- - Is there a Figma file available? - -

- Flowbite is first conceptualized and designed using the Figma software so everything you see in the library - has a design equivalent in our Figma file. -

-

- Check out the - - Figma design system - - based on the utility classes from Tailwind CSS and components from Flowbite. -

-
-
- - What are the differences between Flowbite and Tailwind UI? - -

- The main difference is that the core components from Flowbite are open source under the MIT license, whereas - Tailwind UI is a paid product. Another difference is that Flowbite relies on smaller and standalone - components, whereas Tailwind UI offers sections of pages. -

-

- However, we actually recommend using both Flowbite, Flowbite Pro, and even Tailwind UI as there is no - technical reason stopping you from using the best of two worlds. -

-

Learn more about these technologies:

- -
-
-
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'accordion/accordion.root.tsx', - component: , -}; diff --git a/examples/accordion/index.ts b/examples/accordion/index.ts deleted file mode 100644 index e74c82119..000000000 --- a/examples/accordion/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { collapseAll } from './accordion.collapseAll'; -export { root } from './accordion.root'; diff --git a/examples/alert/alert.additionalContent.tsx b/examples/alert/alert.additionalContent.tsx deleted file mode 100644 index d8807f34e..000000000 --- a/examples/alert/alert.additionalContent.tsx +++ /dev/null @@ -1,135 +0,0 @@ -import { HiEye, HiInformationCircle } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { HiEye, HiInformationCircle } from 'react-icons/hi'; -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - } color="warning" icon={HiInformationCircle}> - Info alert! Change a few things up and try submitting again. - - ); -} - -function ExampleAdditionalContent() { - return ( - <> -
- More info about this info alert goes here. This example text is going to run a bit longer so that you can see - how spacing within an alert works with this kind of content. -
-
- - -
- - ); -} -`; - -const codeRSC = ` -import { HiEye, HiInformationCircle } from 'react-icons/hi'; -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - } color="warning" icon={HiInformationCircle}> - Info alert! Change a few things up and try submitting again. - - ); -} - -function ExampleAdditionalContent() { - return ( - <> -
- More info about this info alert goes here. This example text is going to run a bit longer so that you can see - how spacing within an alert works with this kind of content. -
-
- - -
- - ); -} -`; - -function Component() { - return ( - } color="warning" icon={HiInformationCircle}> - Info alert! Change a few things up and try submitting again. - - ); -} - -function ExampleAdditionalContent() { - return ( - <> -
- More info about this info alert goes here. This example text is going to run a bit longer so that you can see - how spacing within an alert works with this kind of content. -
-
- - -
- - ); -} - -export const additionalContent: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'alert/alert.additionalContent.tsx', - component: , -}; diff --git a/examples/alert/alert.allOptions.tsx b/examples/alert/alert.allOptions.tsx deleted file mode 100644 index 0720abde5..000000000 --- a/examples/alert/alert.allOptions.tsx +++ /dev/null @@ -1,75 +0,0 @@ -'use client'; - -import { HiEye, HiInformationCircle } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -import { HiEye, HiInformationCircle } from 'react-icons/hi'; -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - } - color="success" - icon={HiInformationCircle} - onDismiss={() => alert('Alert dismissed!')} - rounded - > - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -function Component() { - return ( - } - color="success" - icon={HiInformationCircle} - onDismiss={() => alert('Alert dismissed!')} - rounded - > - Info alert! Change a few things up and try submitting again. - - ); -} - -function ExampleAdditionalContent() { - return ( - <> -
- More info about this info alert goes here. This example text is going to run a bit longer so that you can see - how spacing within an alert works with this kind of content. -
-
- - -
- - ); -} - -export const allOptions: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'alert/alert.allOptions.tsx', - component: , -}; diff --git a/examples/alert/alert.borderAccent.tsx b/examples/alert/alert.borderAccent.tsx deleted file mode 100644 index 3ddfae230..000000000 --- a/examples/alert/alert.borderAccent.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - - Info alert! Change a few things up and try submitting again. - - - ); -} -`; - -const codeRSC = ` -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - - Info alert! Change a few things up and try submitting again. - - - ); -} -`; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} - -export const borderAccent: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'alert/alert.borderAccent.tsx', - component: , -}; diff --git a/examples/alert/alert.dismissible.tsx b/examples/alert/alert.dismissible.tsx deleted file mode 100644 index 8d6b314dc..000000000 --- a/examples/alert/alert.dismissible.tsx +++ /dev/null @@ -1,37 +0,0 @@ -'use client'; - -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - alert('Alert dismissed!')}> - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -function Component() { - return ( - alert('Alert dismissed!')}> - Info alert! Change a few things up and try submitting again. - - ); -} - -export const dismissible: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'alert/alert.dismissible.tsx', - component: , -}; diff --git a/examples/alert/alert.root.tsx b/examples/alert/alert.root.tsx deleted file mode 100644 index 071d2297e..000000000 --- a/examples/alert/alert.root.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -const codeRSC = ` -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'alert/alert.root.tsx', - component: , -}; diff --git a/examples/alert/alert.rounded.tsx b/examples/alert/alert.rounded.tsx deleted file mode 100644 index 943133cba..000000000 --- a/examples/alert/alert.rounded.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -const codeRSC = ` -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} - -export const rounded: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'alert/alert.rounded.tsx', - component: , -}; diff --git a/examples/alert/alert.withIcon.tsx b/examples/alert/alert.withIcon.tsx deleted file mode 100644 index 0380243dd..000000000 --- a/examples/alert/alert.withIcon.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { HiInformationCircle } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Alert } from '~/src'; - -const code = ` -'use client'; - -import { HiInformationCircle } from 'react-icons/hi'; -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -const codeRSC = ` -import { HiInformationCircle } from 'react-icons/hi'; -import { Alert } from 'flowbite-react'; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} -`; - -function Component() { - return ( - - Info alert! Change a few things up and try submitting again. - - ); -} - -export const withIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'alert/alert.withIcon.tsx', - component: , -}; diff --git a/examples/alert/index.ts b/examples/alert/index.ts deleted file mode 100644 index 9fbb23ad2..000000000 --- a/examples/alert/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { additionalContent } from './alert.additionalContent'; -export { allOptions } from './alert.allOptions'; -export { borderAccent } from './alert.borderAccent'; -export { dismissible } from './alert.dismissible'; -export { root } from './alert.root'; -export { rounded } from './alert.rounded'; -export { withIcon } from './alert.withIcon'; diff --git a/examples/avatar/avatar.colors.tsx b/examples/avatar/avatar.colors.tsx deleted file mode 100644 index 74eee4b3a..000000000 --- a/examples/avatar/avatar.colors.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
-
- - - - - -
-
- - - - - -
-
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
-
- - - - - -
-
- - - - - -
-
- ); -} -`; - -function Component() { - return ( -
-
- - - - - -
-
- - - - - -
-
- ); -} - -export const colors: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.colors.tsx', - component: , -}; diff --git a/examples/avatar/avatar.dotIndicator.tsx b/examples/avatar/avatar.dotIndicator.tsx deleted file mode 100644 index 12fa03d2a..000000000 --- a/examples/avatar/avatar.dotIndicator.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - -
- ); -} - -export const dotIndicator: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.dotIndicator.tsx', - component: , -}; diff --git a/examples/avatar/avatar.dropdown.tsx b/examples/avatar/avatar.dropdown.tsx deleted file mode 100644 index 5b55811b1..000000000 --- a/examples/avatar/avatar.dropdown.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar, Dropdown, DropdownDivider, DropdownHeader, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Avatar, Dropdown } from 'flowbite-react'; - -function Component() { - return ( - } - arrowIcon={false} - inline - > - - Bonnie Green - name@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} -`; - -const codeRSC = ` -import { Avatar, Dropdown, DropdownDivider, DropdownHeader, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - } - arrowIcon={false} - inline - > - - Bonnie Green - name@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} -`; - -function Component() { - return ( - } - arrowIcon={false} - inline - > - - Bonnie Green - name@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} - -export const dropdown: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.dropdown.tsx', - component: , -}; diff --git a/examples/avatar/avatar.overrideImage.tsx b/examples/avatar/avatar.overrideImage.tsx deleted file mode 100644 index 766fef2e3..000000000 --- a/examples/avatar/avatar.overrideImage.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import Image from 'next/image'; -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import Image from 'next/image'; -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- ( - - )} - /> - ( - - - - - - )} - /> -
- ); -} -`; - -const codeRSC = ` -import Image from 'next/image'; -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- ( - - )} - /> - ( - - - - - - )} - /> -
- ); -} -`; - -function Component() { - return ( -
- ( - - )} - /> - ( - - - - - - )} - /> -
- ); -} - -export const overrideImage: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.overrideImage.tsx', - component: , -}; diff --git a/examples/avatar/avatar.placeholder.tsx b/examples/avatar/avatar.placeholder.tsx deleted file mode 100644 index 33c7656c5..000000000 --- a/examples/avatar/avatar.placeholder.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const placeholder: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.placeholder.tsx', - component: , -}; diff --git a/examples/avatar/avatar.placeholderInitials.tsx b/examples/avatar/avatar.placeholderInitials.tsx deleted file mode 100644 index 3da8b6b5b..000000000 --- a/examples/avatar/avatar.placeholderInitials.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const placeholderInitials: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.placeholderInitials.tsx', - component: , -}; diff --git a/examples/avatar/avatar.root.tsx b/examples/avatar/avatar.root.tsx deleted file mode 100644 index ebb038305..000000000 --- a/examples/avatar/avatar.root.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.root.tsx', - component: , -}; diff --git a/examples/avatar/avatar.sizes.tsx b/examples/avatar/avatar.sizes.tsx deleted file mode 100644 index 1e01ac960..000000000 --- a/examples/avatar/avatar.sizes.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - -
- ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.sizes.tsx', - component: , -}; diff --git a/examples/avatar/avatar.stackedLayout.tsx b/examples/avatar/avatar.stackedLayout.tsx deleted file mode 100644 index 6ed3f7864..000000000 --- a/examples/avatar/avatar.stackedLayout.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar, AvatarGroup } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Avatar, AvatarGroup } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - - - - - - -
- ); -} - -export const stackedLayout: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.stackedLayout.tsx', - component: , -}; diff --git a/examples/avatar/avatar.withBorder.tsx b/examples/avatar/avatar.withBorder.tsx deleted file mode 100644 index 1cd683199..000000000 --- a/examples/avatar/avatar.withBorder.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const withBorder: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.withBorder.tsx', - component: , -}; diff --git a/examples/avatar/avatar.withText.tsx b/examples/avatar/avatar.withText.tsx deleted file mode 100644 index d365777b2..000000000 --- a/examples/avatar/avatar.withText.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( - -
-
Jese Leos
-
Joined in August 2014
-
-
- ); -} -`; - -const codeRSC = ` -import { Avatar } from 'flowbite-react'; - -function Component() { - return ( - -
-
Jese Leos
-
Joined in August 2014
-
-
- ); -} -`; - -function Component() { - return ( - -
-
Jese Leos
-
Joined in August 2014
-
-
- ); -} - -export const withText: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'avatar/avatar.withText.tsx', - component: , -}; diff --git a/examples/avatar/index.ts b/examples/avatar/index.ts deleted file mode 100644 index 1e871d3fd..000000000 --- a/examples/avatar/index.ts +++ /dev/null @@ -1,11 +0,0 @@ -export { colors } from './avatar.colors'; -export { dotIndicator } from './avatar.dotIndicator'; -export { dropdown } from './avatar.dropdown'; -export { overrideImage } from './avatar.overrideImage'; -export { placeholder } from './avatar.placeholder'; -export { placeholderInitials } from './avatar.placeholderInitials'; -export { root } from './avatar.root'; -export { sizes } from './avatar.sizes'; -export { stackedLayout } from './avatar.stackedLayout'; -export { withBorder } from './avatar.withBorder'; -export { withText } from './avatar.withText'; diff --git a/examples/badge/badge.asLink.tsx b/examples/badge/badge.asLink.tsx deleted file mode 100644 index 69e9ecf9d..000000000 --- a/examples/badge/badge.asLink.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Badge } from '~/src'; - -const code = ` -'use client'; - -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- Default - - Default - -
- ); -} -`; - -const codeRSC = ` -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- Default - - Default - -
- ); -} -`; - -function Component() { - return ( -
- Default - - Default - -
- ); -} - -export const asLink: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'badge/badge.asLink.tsx', - component: , -}; diff --git a/examples/badge/badge.root.tsx b/examples/badge/badge.root.tsx deleted file mode 100644 index 7c780b33e..000000000 --- a/examples/badge/badge.root.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Badge } from '~/src'; - -const code = ` -'use client'; - -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- Default - Dark - Failure - Success - Warning - Indigo - Purple - Pink -
- ); -} -`; - -const codeRSC = ` -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- Default - Dark - Failure - Success - Warning - Indigo - Purple - Pink -
- ); -} -`; - -function Component() { - return ( -
- Default - Dark - Failure - Success - Warning - Indigo - Purple - Pink -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'badge/badge.root.tsx', - component: , -}; diff --git a/examples/badge/badge.sizes.tsx b/examples/badge/badge.sizes.tsx deleted file mode 100644 index a8935aaf5..000000000 --- a/examples/badge/badge.sizes.tsx +++ /dev/null @@ -1,123 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Badge } from '~/src'; - -const code = ` -'use client'; - -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- - Default - - - Dark - - - Failure - - - Success - - - Warning - - - Indigo - - - Purple - - - Pink - -
- ); -} -`; - -const codeRSC = ` -import { Badge } from 'flowbite-react'; - -function Component() { - return ( -
- - Default - - - Dark - - - Failure - - - Success - - - Warning - - - Indigo - - - Purple - - - Pink - -
- ); -} -`; - -function Component() { - return ( -
- - Default - - - Dark - - - Failure - - - Success - - - Warning - - - Indigo - - - Purple - - - Pink - -
- ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'badge/badge.sizes.tsx', - component: , -}; diff --git a/examples/badge/badge.withIcon.tsx b/examples/badge/badge.withIcon.tsx deleted file mode 100644 index 25982ce50..000000000 --- a/examples/badge/badge.withIcon.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { HiCheck, HiClock } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Badge } from '~/src'; - -const code = ` -'use client'; - -import { Badge } from 'flowbite-react'; -import { HiCheck, HiClock } from 'react-icons/hi'; - -function Component() { - return ( -
- 2 minutes ago - - 3 days ago - -
- ); -} -`; - -const codeRSC = ` -import { Badge } from 'flowbite-react'; -import { HiCheck, HiClock } from 'react-icons/hi'; - -function Component() { - return ( -
- 2 minutes ago - - 3 days ago - -
- ); -} -`; - -function Component() { - return ( -
- 2 minutes ago - - 3 days ago - -
- ); -} - -export const withIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'badge/badge.withIcon.tsx', - component: , -}; diff --git a/examples/badge/badge.withIconOnly.tsx b/examples/badge/badge.withIconOnly.tsx deleted file mode 100644 index cfb09dbb1..000000000 --- a/examples/badge/badge.withIconOnly.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { HiCheck } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Badge } from '~/src'; - -const code = ` -'use client'; - -import { Badge } from 'flowbite-react'; -import { HiCheck, HiClock } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -const codeRSC = ` -import { Badge } from 'flowbite-react'; -import { HiCheck, HiClock } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - -
- ); -} - -export const withIconOnly: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'badge/badge.withIconOnly.tsx', - component: , -}; diff --git a/examples/badge/index.ts b/examples/badge/index.ts deleted file mode 100644 index 74812800a..000000000 --- a/examples/badge/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { asLink } from './badge.asLink'; -export { root } from './badge.root'; -export { sizes } from './badge.sizes'; -export { withIcon } from './badge.withIcon'; -export { withIconOnly } from './badge.withIconOnly'; diff --git a/examples/banner/banner.bottomPosition.tsx b/examples/banner/banner.bottomPosition.tsx deleted file mode 100644 index 239b29cac..000000000 --- a/examples/banner/banner.bottomPosition.tsx +++ /dev/null @@ -1,123 +0,0 @@ -import { HiArrowRight, HiX } from 'react-icons/hi'; -import { MdPercent } from 'react-icons/md'; -import { type CodeData } from '~/components/code-demo'; -import { Banner, BannerCollapseButton } from '~/src'; - -const code = ` -'use client'; - -import { Banner } from 'flowbite-react'; -import { HiArrowRight, HiX } from 'react-icons/hi'; -import { MdPercent } from 'react-icons/md'; - -function Component() { - return ( - -
-
-

- - - - - Get 5% commision per sale  - - Become a partner - - - -

-
- - - -
-
- ); -} -`; - -const codeRSC = ` -import { Banner, BannerCollapseButton } from 'flowbite-react'; -import { HiArrowRight, HiX } from 'react-icons/hi'; -import { MdPercent } from 'react-icons/md'; - -function Component() { - return ( - -
-
-

- - - - - Get 5% commision per sale  - - Become a partner - - - -

-
- - - -
-
- ); -} -`; - -function Component() { - return ( - -
-
-

- - - - - Get 5% commision per sale  - - Become a partner - - - -

-
- - - -
-
- ); -} - -export const bottomPosition: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'banner/banner.bottomPosition.tsx', - component: , -}; diff --git a/examples/banner/banner.informational.tsx b/examples/banner/banner.informational.tsx deleted file mode 100644 index cb92b59bb..000000000 --- a/examples/banner/banner.informational.tsx +++ /dev/null @@ -1,141 +0,0 @@ -import { FaBookOpen } from 'react-icons/fa'; -import { HiArrowRight, HiX } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Banner, BannerCollapseButton } from '~/src'; - -const code = ` -'use client'; - -import { Banner } from 'flowbite-react'; -import { FaBookOpen } from 'react-icons/fa'; -import { HiArrowRight, HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
-

Integration is the key

-

- You can integrate Flowbite with many tools to make your work even more efficient and lightning fast based on - Tailwind CSS. -

-
- -
-
- ); -} -`; - -const codeRSC = ` -import { Banner, BannerCollapseButton } from 'flowbite-react'; -import { FaBookOpen } from 'react-icons/fa'; -import { HiArrowRight, HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
-

Integration is the key

-

- You can integrate Flowbite with many tools to make your work even more efficient and lightning fast based on - Tailwind CSS. -

-
- -
-
- ); -} -`; - -function Component() { - return ( - -
-
-

Integration is the key

-

- You can integrate Flowbite with many tools to make your work even more efficient and lightning fast based on - Tailwind CSS. -

-
- -
-
- ); -} - -export const informational: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'banner/banner.informational.tsx', - component: , -}; diff --git a/examples/banner/banner.marketingCTA.tsx b/examples/banner/banner.marketingCTA.tsx deleted file mode 100644 index 9f17cae60..000000000 --- a/examples/banner/banner.marketingCTA.tsx +++ /dev/null @@ -1,120 +0,0 @@ -import { HiX } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Banner, BannerCollapseButton, Button } from '~/src'; - -const code = ` -'use client'; - -import { Banner, Button } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
- - Flowbite Logo - - Flowbite - - -

- Build websites even faster with components on top of Tailwind CSS -

-
-
- - - - -
-
-
- ); -} -`; - -const codeRSC = ` -import { Banner, BannerCollapseButton } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
- - Flowbite Logo - - Flowbite - - -

- Build websites even faster with components on top of Tailwind CSS -

-
-
- - - - -
-
-
- ); -} -`; - -function Component() { - return ( - -
-
- - Flowbite Logo - - Flowbite - - -

- Build websites even faster with components on top of Tailwind CSS -

-
-
- - - - -
-
-
- ); -} - -export const marketingCTA: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'banner/banner.marketingCTA.tsx', - component: , -}; diff --git a/examples/banner/banner.newsletter.tsx b/examples/banner/banner.newsletter.tsx deleted file mode 100644 index 57adf0469..000000000 --- a/examples/banner/banner.newsletter.tsx +++ /dev/null @@ -1,105 +0,0 @@ -import { HiX } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Banner, BannerCollapseButton, Button, Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Banner, Button, Label, TextInput } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
-
- - - - -
- - - -
-
- ); -} -`; - -const codeRSC = ` -import { Banner, BannerCollapseButton, Button, Label, TextInput } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; - -function Component() { - return ( - -
-
-
- - - - -
- - - -
-
- ); -} -`; - -function Component() { - return ( - -
-
-
- - - - -
- - - -
-
- ); -} - -export const newsletter: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'banner/banner.newsletter.tsx', - component: , -}; diff --git a/examples/banner/banner.root.tsx b/examples/banner/banner.root.tsx deleted file mode 100644 index 46315d657..000000000 --- a/examples/banner/banner.root.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import { HiX } from 'react-icons/hi'; -import { MdAnnouncement } from 'react-icons/md'; -import { type CodeData } from '~/components/code-demo'; -import { Banner, BannerCollapseButton } from '~/src'; - -const code = ` -'use client'; - -import { Banner } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; -import { MdAnnouncement } from 'react-icons/md'; - -function Component() { - return ( - -
-
-

- - - New brand identity has been launched for the  - - Flowbite Library - - -

-
- - - -
-
- ); -} -`; - -const codeRSC = ` -import { Banner, BannerCollapseButton } from 'flowbite-react'; -import { HiX } from 'react-icons/hi'; -import { MdAnnouncement } from 'react-icons/md'; - -function Component() { - return ( - -
-
-

- - - New brand identity has been launched for the  - - Flowbite Library - - -

-
- - - -
-
- ); -} -`; - -function Component() { - return ( - -
-
-

- - - New brand identity has been launched for the  - - Flowbite Library - - -

-
- - - -
-
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'banner/banner.root.tsx', - component: , -}; diff --git a/examples/banner/index.ts b/examples/banner/index.ts deleted file mode 100644 index a24b6177a..000000000 --- a/examples/banner/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { bottomPosition } from './banner.bottomPosition'; -export { informational } from './banner.informational'; -export { marketingCTA } from './banner.marketingCTA'; -export { newsletter } from './banner.newsletter'; -export { root } from './banner.root'; diff --git a/examples/blockquote/blockquote.center.tsx b/examples/blockquote/blockquote.center.tsx deleted file mode 100644 index 2f2043c18..000000000 --- a/examples/blockquote/blockquote.center.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const center: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.center.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.icon.tsx b/examples/blockquote/blockquote.icon.tsx deleted file mode 100644 index a950c1e82..000000000 --- a/examples/blockquote/blockquote.icon.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- - "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- - "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- - "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const icon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.icon.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.large.tsx b/examples/blockquote/blockquote.large.tsx deleted file mode 100644 index 1d6c1dd0c..000000000 --- a/examples/blockquote/blockquote.large.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const large: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.large.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.left.tsx b/examples/blockquote/blockquote.left.tsx deleted file mode 100644 index 0f128d08d..000000000 --- a/examples/blockquote/blockquote.left.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const left: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.left.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.medium.tsx b/examples/blockquote/blockquote.medium.tsx deleted file mode 100644 index 30143e654..000000000 --- a/examples/blockquote/blockquote.medium.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const medium: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.medium.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.paragraphContext.tsx b/examples/blockquote/blockquote.paragraphContext.tsx deleted file mode 100644 index 7af8f571a..000000000 --- a/examples/blockquote/blockquote.paragraphContext.tsx +++ /dev/null @@ -1,120 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( - <> -

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- " Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen - to complex dashboard. Perfect choice for your next SaaS application. " -

-
-
-

- Deliver great service experiences fast - without the complexity of traditional ITSM solutions.Accelerate - critical development work, eliminate toil, and deploy changes with ease, with a complete audit trail for every - change. -

- - ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( - <> -

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- " Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen - to complex dashboard. Perfect choice for your next SaaS application. " -

-
-
-

- Deliver great service experiences fast - without the complexity of traditional ITSM solutions.Accelerate - critical development work, eliminate toil, and deploy changes with ease, with a complete audit trail for every - change. -

- - ); -} -`; - -function Component() { - return ( - <> -

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest - data from other software development tools, so your IT support and operations teams have richer contextual - information to rapidly respond to requests, incidents, and changes. -

-
-

- " Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen - to complex dashboard. Perfect choice for your next SaaS application. " -

-
-
-

- Deliver great service experiences fast - without the complexity of traditional ITSM solutions.Accelerate - critical development work, eliminate toil, and deploy changes with ease, with a complete audit trail for every - change. -

- - ); -} - -export const paragraphContext: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.paragraphContext.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.right.tsx b/examples/blockquote/blockquote.right.tsx deleted file mode 100644 index 178b190d1..000000000 --- a/examples/blockquote/blockquote.right.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const right: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.right.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.root.tsx b/examples/blockquote/blockquote.root.tsx deleted file mode 100644 index d2794a713..000000000 --- a/examples/blockquote/blockquote.root.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.root.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.small.tsx b/examples/blockquote/blockquote.small.tsx deleted file mode 100644 index d5a46feac..000000000 --- a/examples/blockquote/blockquote.small.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} -`; - -function Component() { - return ( -
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- ); -} - -export const small: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.small.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.solidBackground.tsx b/examples/blockquote/blockquote.solidBackground.tsx deleted file mode 100644 index e6943363b..000000000 --- a/examples/blockquote/blockquote.solidBackground.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( - <> -

- Does your user know how to exit out of screens? Can they follow your intended user journey and buy something - from the site you’ve designed? By running a usability test, you’ll be able to see how users will interact with - your design once it’s live. -

-
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- First of all you need to understand how Flowbite works. This library is not another framework. Rather, it is a set - of components based on Tailwind CSS that you can just copy-paste from the documentation. - - ); -} -`; - -const codeRSC = ` -import { Blockquote } from 'flowbite-react'; - -function Component() { - return ( - <> -

- Does your user know how to exit out of screens? Can they follow your intended user journey and buy something - from the site you’ve designed? By running a usability test, you’ll be able to see how users will interact with - your design once it’s live. -

-
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- First of all you need to understand how Flowbite works. This library is not another framework. Rather, it is a set - of components based on Tailwind CSS that you can just copy-paste from the documentation. - - ); -} -`; - -function Component() { - return ( - <> -

- Does your user know how to exit out of screens? Can they follow your intended user journey and buy something - from the site you’ve designed? By running a usability test, you’ll be able to see how users will interact with - your design once it’s live. -

-
- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -
- First of all you need to understand how Flowbite works. This library is not another framework. Rather, it is a set - of components based on Tailwind CSS that you can just copy-paste from the documentation. - - ); -} - -export const solidBackground: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.solidBackground.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.userReview.tsx b/examples/blockquote/blockquote.userReview.tsx deleted file mode 100644 index c189b03ff..000000000 --- a/examples/blockquote/blockquote.userReview.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar, Blockquote, Rating, RatingStar } from '~/src'; - -const code = ` -'use client'; - -import { Avatar, Blockquote, Rating } from 'flowbite-react'; - -function Component() { - return ( -
-
- - - - - - - -
-
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Bonnie Green - CTO at Flowbite -
-
-
- ); -} -`; - -const codeRSC = ` -import { Avatar, Blockquote, Rating, RatingStar } from 'flowbite-react'; - -function Component() { - return ( -
-
- - - - - - - -
-
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Bonnie Green - CTO at Flowbite -
-
-
- ); -} -`; - -function Component() { - return ( -
-
- - - - - - - -
-
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Bonnie Green - CTO at Flowbite -
-
-
- ); -} - -export const userReview: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.userReview.tsx', - component: , -}; diff --git a/examples/blockquote/blockquote.userTestimonial.tsx b/examples/blockquote/blockquote.userTestimonial.tsx deleted file mode 100644 index c11c6698c..000000000 --- a/examples/blockquote/blockquote.userTestimonial.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Avatar, Blockquote } from '~/src'; - -const code = ` -'use client'; - -import { Avatar, Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- -
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Micheal Gough - CEO at Google -
-
-
- ); -} -`; - -const codeRSC = ` -import { Avatar, Blockquote } from 'flowbite-react'; - -function Component() { - return ( -
- -
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Micheal Gough - CEO at Google -
-
-
- ); -} -`; - -function Component() { - return ( -
- -
-

- "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to - complex dashboard. Perfect choice for your next SaaS application." -

-
-
- -
- Micheal Gough - CEO at Google -
-
-
- ); -} - -export const userTestimonial: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'blockquote/blockquote.userTestimonial.tsx', - component: , -}; diff --git a/examples/blockquote/index.ts b/examples/blockquote/index.ts deleted file mode 100644 index d8f30bab3..000000000 --- a/examples/blockquote/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -export { center } from './blockquote.center'; -export { icon } from './blockquote.icon'; -export { large } from './blockquote.large'; -export { left } from './blockquote.left'; -export { medium } from './blockquote.medium'; -export { paragraphContext } from './blockquote.paragraphContext'; -export { right } from './blockquote.right'; -export { root } from './blockquote.root'; -export { small } from './blockquote.small'; -export { solidBackground } from './blockquote.solidBackground'; -export { userReview } from './blockquote.userReview'; -export { userTestimonial } from './blockquote.userTestimonial'; diff --git a/examples/breadcrumb/breadcrumb.backgroundColor.tsx b/examples/breadcrumb/breadcrumb.backgroundColor.tsx deleted file mode 100644 index bec2581a9..000000000 --- a/examples/breadcrumb/breadcrumb.backgroundColor.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { HiHome } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Breadcrumb, BreadcrumbItem } from '~/src'; - -const code = ` -'use client'; - -import { Breadcrumb } from 'flowbite-react'; -import { HiHome } from 'react-icons/hi'; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} -`; - -const codeRSC = ` -import { Breadcrumb, BreadcrumbItem } from 'flowbite-react'; -import { HiHome } from 'react-icons/hi'; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} -`; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} - -export const backgroundColor: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'breadcrumb/breadcrumb.backgroundColor.tsx', - component: , -}; diff --git a/examples/breadcrumb/breadcrumb.root.tsx b/examples/breadcrumb/breadcrumb.root.tsx deleted file mode 100644 index 5a854ae1c..000000000 --- a/examples/breadcrumb/breadcrumb.root.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { HiHome } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Breadcrumb, BreadcrumbItem } from '~/src'; - -const code = ` -'use client'; - -import { Breadcrumb } from 'flowbite-react'; -import { HiHome } from 'react-icons/hi'; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} -`; - -const codeRSC = ` -import { Breadcrumb, BreadcrumbItem } from 'flowbite-react'; -import { HiHome } from 'react-icons/hi'; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} -`; - -function Component() { - return ( - - - Home - - Projects - Flowbite React - - ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'breadcrumb/breadcrumb.root.tsx', - component: , -}; diff --git a/examples/breadcrumb/index.ts b/examples/breadcrumb/index.ts deleted file mode 100644 index e75678875..000000000 --- a/examples/breadcrumb/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { backgroundColor } from './breadcrumb.backgroundColor'; -export { root } from './breadcrumb.root'; diff --git a/examples/button/button.disabled.tsx b/examples/button/button.disabled.tsx deleted file mode 100644 index 9696f57ea..000000000 --- a/examples/button/button.disabled.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const disabled: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.disabled.tsx', - component: , -}; diff --git a/examples/button/button.gradientDuo.tsx b/examples/button/button.gradientDuo.tsx deleted file mode 100644 index 245169784..000000000 --- a/examples/button/button.gradientDuo.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - -
- ); -} - -export const gradientDuo: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.gradientDuo.tsx', - component: , -}; diff --git a/examples/button/button.gradientMono.tsx b/examples/button/button.gradientMono.tsx deleted file mode 100644 index ee93df912..000000000 --- a/examples/button/button.gradientMono.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - -
- ); -} - -export const gradientMono: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.gradientMono.tsx', - component: , -}; diff --git a/examples/button/button.iconOnly.tsx b/examples/button/button.iconOnly.tsx deleted file mode 100644 index e99e8f62d..000000000 --- a/examples/button/button.iconOnly.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import { HiOutlineArrowRight } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import { HiOutlineArrowRight } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; -import { HiOutlineArrowRight } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - -
- ); -} - -export const iconOnly: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.iconOnly.tsx', - component: , -}; diff --git a/examples/button/button.loading.tsx b/examples/button/button.loading.tsx deleted file mode 100644 index f89acb615..000000000 --- a/examples/button/button.loading.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - -
- ); -} - -export const loading: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.loading.tsx', - component: , -}; diff --git a/examples/button/button.loadingSpinner.tsx b/examples/button/button.loadingSpinner.tsx deleted file mode 100644 index e4965f01e..000000000 --- a/examples/button/button.loadingSpinner.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { AiOutlineLoading } from 'react-icons/ai'; -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import { AiOutlineLoading } from 'react-icons/ai'; - -function Component() { - return ( - - ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; -import { AiOutlineLoading } from 'react-icons/ai'; - -function Component() { - return ( - - ); -} -`; - -function Component() { - return ( - - ); -} - -export const loadingSpinner: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.loadingSpinner.tsx', - component: , -}; diff --git a/examples/button/button.outline.tsx b/examples/button/button.outline.tsx deleted file mode 100644 index ec24a020a..000000000 --- a/examples/button/button.outline.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - -
- ); -} - -export const outline: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.outline.tsx', - component: , -}; diff --git a/examples/button/button.pill.tsx b/examples/button/button.pill.tsx deleted file mode 100644 index 1de77221c..000000000 --- a/examples/button/button.pill.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} - -export const pill: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.pill.tsx', - component: , -}; diff --git a/examples/button/button.polymorph.tsx b/examples/button/button.polymorph.tsx deleted file mode 100644 index ea99ef348..000000000 --- a/examples/button/button.polymorph.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import Link from 'next/link'; -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import Link from 'next/link'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; -import Link from 'next/link'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const polymorph: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.polymorph.tsx', - component: , -}; diff --git a/examples/button/button.root.tsx b/examples/button/button.root.tsx deleted file mode 100644 index e6191c501..000000000 --- a/examples/button/button.root.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.root.tsx', - component: , -}; diff --git a/examples/button/button.sizes.tsx b/examples/button/button.sizes.tsx deleted file mode 100644 index e11f82dc1..000000000 --- a/examples/button/button.sizes.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - -
- ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.sizes.tsx', - component: , -}; diff --git a/examples/button/button.withIcon.tsx b/examples/button/button.withIcon.tsx deleted file mode 100644 index 0910f5477..000000000 --- a/examples/button/button.withIcon.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import { HiOutlineArrowRight, HiShoppingCart } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import { HiOutlineArrowRight, HiShoppingCart } from 'react-icons/hi'; - -function Component() { - return ( -
- - -
- ); -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; -import { HiOutlineArrowRight, HiShoppingCart } from 'react-icons/hi'; - -function Component() { - return ( -
- - -
- ); -} -`; - -function Component() { - return ( -
- - -
- ); -} - -export const withIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.withIcon.tsx', - component: , -}; diff --git a/examples/button/button.withLabel.tsx b/examples/button/button.withLabel.tsx deleted file mode 100644 index 4b3fb043b..000000000 --- a/examples/button/button.withLabel.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Button } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const withLabel: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'button/button.withLabel.tsx', - component: , -}; diff --git a/examples/button/index.ts b/examples/button/index.ts deleted file mode 100644 index b5860b708..000000000 --- a/examples/button/index.ts +++ /dev/null @@ -1,13 +0,0 @@ -export { disabled } from './button.disabled'; -export { gradientDuo } from './button.gradientDuo'; -export { gradientMono } from './button.gradientMono'; -export { iconOnly } from './button.iconOnly'; -export { loading } from './button.loading'; -export { loadingSpinner } from './button.loadingSpinner'; -export { outline } from './button.outline'; -export { pill } from './button.pill'; -export { polymorph } from './button.polymorph'; -export { root } from './button.root'; -export { sizes } from './button.sizes'; -export { withIcon } from './button.withIcon'; -export { withLabel } from './button.withLabel'; diff --git a/examples/buttonGroup/buttonGroup.colorOptions.tsx b/examples/buttonGroup/buttonGroup.colorOptions.tsx deleted file mode 100644 index 3d38b0178..000000000 --- a/examples/buttonGroup/buttonGroup.colorOptions.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, ButtonGroup } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button, ButtonGroup } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} - -export const colorOptions: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'buttonGroup/buttonGroup.colorOptions.tsx', - component: , -}; diff --git a/examples/buttonGroup/buttonGroup.outline.tsx b/examples/buttonGroup/buttonGroup.outline.tsx deleted file mode 100644 index 2255d2ace..000000000 --- a/examples/buttonGroup/buttonGroup.outline.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, ButtonGroup } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button, ButtonGroup } from 'flowbite-react'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} - -export const outline: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'buttonGroup/buttonGroup.outline.tsx', - component: , -}; diff --git a/examples/buttonGroup/buttonGroup.outlineWithIcons.tsx b/examples/buttonGroup/buttonGroup.outlineWithIcons.tsx deleted file mode 100644 index 5ddb3ab39..000000000 --- a/examples/buttonGroup/buttonGroup.outlineWithIcons.tsx +++ /dev/null @@ -1,180 +0,0 @@ -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Button, ButtonGroup } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -const codeRSC = ` -import { Button, ButtonGroup } from 'flowbite-react'; -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - - - - - - - - - - - - -
- ); -} - -export const outlineWithIcons: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'buttonGroup/buttonGroup.outlineWithIcons.tsx', - component: , -}; diff --git a/examples/buttonGroup/buttonGroup.root.tsx b/examples/buttonGroup/buttonGroup.root.tsx deleted file mode 100644 index 604476aaf..000000000 --- a/examples/buttonGroup/buttonGroup.root.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, ButtonGroup } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; - -function Component() { - return ( - - - - - - ); -} -`; - -const codeRSC = ` -import { Button, ButtonGroup } from 'flowbite-react'; - -function Component() { - return ( - - - - - - ); -} -`; - -function Component() { - return ( - - - - - - ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'buttonGroup/buttonGroup.root.tsx', - component: , -}; diff --git a/examples/buttonGroup/buttonGroup.withIcons.tsx b/examples/buttonGroup/buttonGroup.withIcons.tsx deleted file mode 100644 index 6de8060ec..000000000 --- a/examples/buttonGroup/buttonGroup.withIcons.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Button, ButtonGroup } from '~/src'; - -const code = ` -'use client'; - -import { Button } from 'flowbite-react'; -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; - -function Component() { - return ( - - - - - - ); -} -`; - -const codeRSC = ` -import { Button, ButtonGroup } from 'flowbite-react'; -import { HiAdjustments, HiCloudDownload, HiUserCircle } from 'react-icons/hi'; - -function Component() { - return ( - - - - - - ); -} -`; - -function Component() { - return ( - - - - - - ); -} - -export const withIcons: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'buttonGroup/buttonGroup.withIcons.tsx', - component: , -}; diff --git a/examples/buttonGroup/index.ts b/examples/buttonGroup/index.ts deleted file mode 100644 index 275e7078b..000000000 --- a/examples/buttonGroup/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { colorOptions } from './buttonGroup.colorOptions'; -export { outline } from './buttonGroup.outline'; -export { outlineWithIcons } from './buttonGroup.outlineWithIcons'; -export { root } from './buttonGroup.root'; -export { withIcons } from './buttonGroup.withIcons'; diff --git a/examples/card/card.CTA.tsx b/examples/card/card.CTA.tsx deleted file mode 100644 index 42a6deb42..000000000 --- a/examples/card/card.CTA.tsx +++ /dev/null @@ -1,213 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
Work fast from anywhere
-

- Stay up to date and move work forward with Flowbite on iOS & Android. Download the app today. -

- -
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
Work fast from anywhere
-

- Stay up to date and move work forward with Flowbite on iOS & Android. Download the app today. -

- -
- ); -} -`; - -function Component() { - return ( - -
Work fast from anywhere
-

- Stay up to date and move work forward with Flowbite on iOS & Android. Download the app today. -

- -
- ); -} - -export const CTA: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.CTA.tsx', - component: , -}; diff --git a/examples/card/card.CTAButton.tsx b/examples/card/card.CTAButton.tsx deleted file mode 100644 index 1df5ae27f..000000000 --- a/examples/card/card.CTAButton.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, Card } from '~/src'; - -const code = ` -'use client'; - -import { Button, Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

- -
- ); -} -`; - -const codeRSC = ` -import { Button, Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

- -
- ); -} -`; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

- -
- ); -} - -export const CTAButton: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.CTAButton.tsx', - component: , -}; diff --git a/examples/card/card.crypto.tsx b/examples/card/card.crypto.tsx deleted file mode 100644 index 9e32bb865..000000000 --- a/examples/card/card.crypto.tsx +++ /dev/null @@ -1,306 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -function Component() { - return ( - -
Connect wallet
-

- Connect with one of our available wallet providers or create a new one. -

- - -
- ); -} - -export const crypto: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.crypto.tsx', - component: , -}; diff --git a/examples/card/card.eCommerce.tsx b/examples/card/card.eCommerce.tsx deleted file mode 100644 index 22c4e2a97..000000000 --- a/examples/card/card.eCommerce.tsx +++ /dev/null @@ -1,240 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - - -
- Apple Watch Series 7 GPS, Aluminium Case, Starlight Sport -
-
-
- - - - - - - - - - - - - - - - - 5.0 - -
- -
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - - -
- Apple Watch Series 7 GPS, Aluminium Case, Starlight Sport -
-
-
- - - - - - - - - - - - - - - - - 5.0 - -
- -
- ); -} -`; - -function Component() { - return ( - - -
- Apple Watch Series 7 GPS, Aluminium Case, Starlight Sport -
-
-
- - - - - - - - - - - - - - - - - 5.0 - -
- -
- ); -} - -export const eCommerce: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.eCommerce.tsx', - component: , -}; diff --git a/examples/card/card.horizontal.tsx b/examples/card/card.horizontal.tsx deleted file mode 100644 index 682d0a199..000000000 --- a/examples/card/card.horizontal.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} - -export const horizontal: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.horizontal.tsx', - component: , -}; diff --git a/examples/card/card.pricing.tsx b/examples/card/card.pricing.tsx deleted file mode 100644 index 5b4894fce..000000000 --- a/examples/card/card.pricing.tsx +++ /dev/null @@ -1,414 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
Standard plan
-
- $ - 49 - /month -
-
    -
  • - - - - 2 team members -
  • -
  • - - - - - 20GB Cloud storage - -
  • -
  • - - - - Integration help -
  • -
  • - - - - Sketch Files -
  • -
  • - - - - API Access -
  • -
  • - - - - Complete documentation -
  • -
  • - - - - 24×7 phone & email support -
  • -
- -
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
Standard plan
-
- $ - 49 - /month -
-
    -
  • - - - - 2 team members -
  • -
  • - - - - - 20GB Cloud storage - -
  • -
  • - - - - Integration help -
  • -
  • - - - - Sketch Files -
  • -
  • - - - - API Access -
  • -
  • - - - - Complete documentation -
  • -
  • - - - - 24×7 phone & email support -
  • -
- -
- ); -} -`; - -function Component() { - return ( - -
Standard plan
-
- $ - 49 - /month -
-
    -
  • - - - - 2 team members -
  • -
  • - - - - - 20GB Cloud storage - -
  • -
  • - - - - Integration help -
  • -
  • - - - - Sketch Files -
  • -
  • - - - - API Access -
  • -
  • - - - - Complete documentation -
  • -
  • - - - - 24×7 phone & email support -
  • -
- -
- ); -} - -export const pricing: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.pricing.tsx', - component: , -}; diff --git a/examples/card/card.renderImage.tsx b/examples/card/card.renderImage.tsx deleted file mode 100644 index ebc9e261e..000000000 --- a/examples/card/card.renderImage.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import Image from 'next/image'; -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - image 1} - > -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - image 1} - > -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -function Component() { - return ( - image 1} - > -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} - -export const renderImage: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.renderImage.tsx', - component: , -}; diff --git a/examples/card/card.root.tsx b/examples/card/card.root.tsx deleted file mode 100644 index 73132f709..000000000 --- a/examples/card/card.root.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.root.tsx', - component: , -}; diff --git a/examples/card/card.userProfile.tsx b/examples/card/card.userProfile.tsx deleted file mode 100644 index 32de91f68..000000000 --- a/examples/card/card.userProfile.tsx +++ /dev/null @@ -1,213 +0,0 @@ -import Image from 'next/image'; -import { type CodeData } from '~/components/code-demo'; -import { Card, Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Card, Dropdown } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - - -
- Bonnie image -
Bonnie Green
- Visual Designer - -
-
- ); -} -`; - -const codeRSC = ` -import { Card, Dropdown, DropdownItem } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - - -
- Bonnie image -
Bonnie Green
- Visual Designer - -
-
- ); -} -`; - -function Component() { - return ( - - -
- Bonnie image -
Bonnie Green
- Visual Designer - -
-
- ); -} - -export const userProfile: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.userProfile.tsx', - component: , -}; diff --git a/examples/card/card.withForm.tsx b/examples/card/card.withForm.tsx deleted file mode 100644 index 771dfdbc8..000000000 --- a/examples/card/card.withForm.tsx +++ /dev/null @@ -1,108 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, Card, Checkbox, Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Button, Card, Checkbox, Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( - -
-
-
-
- -
-
-
-
- -
-
- - -
- -
-
- ); -} -`; - -const codeRSC = ` -import { Button, Card, Checkbox, Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( - -
-
-
-
- -
-
-
-
- -
-
- - -
- -
-
- ); -} -`; - -function Component() { - return ( - -
-
-
-
- -
-
-
-
- -
-
- - -
- -
-
- ); -} - -export const withForm: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.withForm.tsx', - component: , -}; diff --git a/examples/card/card.withImage.tsx b/examples/card/card.withImage.tsx deleted file mode 100644 index 9f7d9dc8e..000000000 --- a/examples/card/card.withImage.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} -`; - -function Component() { - return ( - -
- Noteworthy technology acquisitions 2021 -
-

- Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order. -

-
- ); -} - -export const withImage: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.withImage.tsx', - component: , -}; diff --git a/examples/card/card.withList.tsx b/examples/card/card.withList.tsx deleted file mode 100644 index fd4cbc89e..000000000 --- a/examples/card/card.withList.tsx +++ /dev/null @@ -1,366 +0,0 @@ -import Image from 'next/image'; -import { type CodeData } from '~/components/code-demo'; -import { Card } from '~/src'; - -const code = ` -'use client'; - -import { Card } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - -
-
Latest Customers
- - View all - -
-
-
    -
  • -
    -
    - Neil image -
    -
    -

    Neil Sims

    -

    email@windster.com

    -
    -
    $320
    -
    -
  • -
  • -
    -
    - Bonnie image -
    -
    -

    Bonnie Green

    -

    email@windster.com

    -
    -
    - $3467 -
    -
    -
  • -
  • -
    -
    - Michael image -
    -
    -

    Michael Gough

    -

    email@windster.com

    -
    -
    $67
    -
    -
  • -
  • -
    -
    - Lana image -
    -
    -

    Lana Byrd

    -

    email@windster.com

    -
    -
    $367
    -
    -
  • -
  • -
    -
    - Thomas image -
    -
    -

    Thomes Lean

    -

    email@windster.com

    -
    -
    - $2367 -
    -
    -
  • -
-
-
- ); -} -`; - -const codeRSC = ` -import { Card } from 'flowbite-react'; -import Image from 'next/image'; - -function Component() { - return ( - -
-
Latest Customers
- - View all - -
-
-
    -
  • -
    -
    - Neil image -
    -
    -

    Neil Sims

    -

    email@windster.com

    -
    -
    $320
    -
    -
  • -
  • -
    -
    - Bonnie image -
    -
    -

    Bonnie Green

    -

    email@windster.com

    -
    -
    - $3467 -
    -
    -
  • -
  • -
    -
    - Michael image -
    -
    -

    Michael Gough

    -

    email@windster.com

    -
    -
    $67
    -
    -
  • -
  • -
    -
    - Lana image -
    -
    -

    Lana Byrd

    -

    email@windster.com

    -
    -
    $367
    -
    -
  • -
  • -
    -
    - Thomas image -
    -
    -

    Thomes Lean

    -

    email@windster.com

    -
    -
    - $2367 -
    -
    -
  • -
-
-
- ); -} -`; - -function Component() { - return ( - -
-
Latest Customers
- - View all - -
-
-
    -
  • -
    -
    - Neil image -
    -
    -

    Neil Sims

    -

    email@windster.com

    -
    -
    $320
    -
    -
  • -
  • -
    -
    - Bonnie image -
    -
    -

    Bonnie Green

    -

    email@windster.com

    -
    -
    - $3467 -
    -
    -
  • -
  • -
    -
    - Michael image -
    -
    -

    Michael Gough

    -

    email@windster.com

    -
    -
    $67
    -
    -
  • -
  • -
    -
    - Lana image -
    -
    -

    Lana Byrd

    -

    email@windster.com

    -
    -
    $367
    -
    -
  • -
  • -
    -
    - Thomas image -
    -
    -

    Thomes Lean

    -

    email@windster.com

    -
    -
    - $2367 -
    -
    -
  • -
-
-
- ); -} - -export const withList: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'card/card.withList.tsx', - component: , -}; diff --git a/examples/card/index.ts b/examples/card/index.ts deleted file mode 100644 index 3174e8484..000000000 --- a/examples/card/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -export { CTA } from './card.CTA'; -export { CTAButton } from './card.CTAButton'; -export { crypto } from './card.crypto'; -export { eCommerce } from './card.eCommerce'; -export { horizontal } from './card.horizontal'; -export { pricing } from './card.pricing'; -export { renderImage } from './card.renderImage'; -export { root } from './card.root'; -export { userProfile } from './card.userProfile'; -export { withForm } from './card.withForm'; -export { withImage } from './card.withImage'; -export { withList } from './card.withList'; diff --git a/examples/carousel/carousel.controls.tsx b/examples/carousel/carousel.controls.tsx deleted file mode 100644 index 0e0b790fc..000000000 --- a/examples/carousel/carousel.controls.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} - -export const controls: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.controls.tsx', - component: , -}; diff --git a/examples/carousel/carousel.events.tsx b/examples/carousel/carousel.events.tsx deleted file mode 100644 index fe680ef73..000000000 --- a/examples/carousel/carousel.events.tsx +++ /dev/null @@ -1,57 +0,0 @@ -'use client'; - -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- console.log('onSlideChange()', index)}> -
- Slide 1 -
-
- Slide 2 -
-
- Slide 3 -
-
-
- ); -} -`; - -function Component() { - return ( -
- console.log('onSlideChange()', index)}> -
- Slide 1 -
-
- Slide 2 -
-
- Slide 3 -
-
-
- ); -} - -export const events: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'carousel/carousel.events.tsx', - component: , -}; diff --git a/examples/carousel/carousel.indicators.tsx b/examples/carousel/carousel.indicators.tsx deleted file mode 100644 index 8c84bc28c..000000000 --- a/examples/carousel/carousel.indicators.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - - - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - - - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - - - ... - ... - ... - ... - ... - -
- ); -} - -export const indicators: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.indicators.tsx', - component: , -}; diff --git a/examples/carousel/carousel.pauseOnHover.tsx b/examples/carousel/carousel.pauseOnHover.tsx deleted file mode 100644 index 47a12fe27..000000000 --- a/examples/carousel/carousel.pauseOnHover.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} - -export const pauseOnHover: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.pauseOnHover.tsx', - component: , -}; diff --git a/examples/carousel/carousel.root.tsx b/examples/carousel/carousel.root.tsx deleted file mode 100644 index 39457172d..000000000 --- a/examples/carousel/carousel.root.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.root.tsx', - component: , -}; diff --git a/examples/carousel/carousel.slide.tsx b/examples/carousel/carousel.slide.tsx deleted file mode 100644 index b34782b9c..000000000 --- a/examples/carousel/carousel.slide.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} - -export const slide: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.slide.tsx', - component: , -}; diff --git a/examples/carousel/carousel.slideInterval.tsx b/examples/carousel/carousel.slideInterval.tsx deleted file mode 100644 index 5ba697f6e..000000000 --- a/examples/carousel/carousel.slideInterval.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} -`; - -function Component() { - return ( -
- - ... - ... - ... - ... - ... - -
- ); -} - -export const slideInterval: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.slideInterval.tsx', - component: , -}; diff --git a/examples/carousel/carousel.sliderContent.tsx b/examples/carousel/carousel.sliderContent.tsx deleted file mode 100644 index 724f6917a..000000000 --- a/examples/carousel/carousel.sliderContent.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Carousel } from '~/src'; - -const code = ` -'use client'; - -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- -
- Slide 1 -
-
- Slide 2 -
-
- Slide 3 -
-
-
- ); -} -`; - -const codeRSC = ` -import { Carousel } from 'flowbite-react'; - -function Component() { - return ( -
- -
- Slide 1 -
-
- Slide 2 -
-
- Slide 3 -
-
-
- ); -} -`; - -function Component() { - return ( -
- -
- Slide 1 -
-
- Slide 2 -
-
- Slide 3 -
-
-
- ); -} - -export const sliderContent: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'carousel/carousel.sliderContent.tsx', - component: , -}; diff --git a/examples/carousel/index.ts b/examples/carousel/index.ts deleted file mode 100644 index 28b9f8844..000000000 --- a/examples/carousel/index.ts +++ /dev/null @@ -1,8 +0,0 @@ -export { controls } from './carousel.controls'; -export { events } from './carousel.events'; -export { indicators } from './carousel.indicators'; -export { pauseOnHover } from './carousel.pauseOnHover'; -export { root } from './carousel.root'; -export { slide } from './carousel.slide'; -export { slideInterval } from './carousel.slideInterval'; -export { sliderContent } from './carousel.sliderContent'; diff --git a/examples/datepicker/datepicker.autoHide.tsx b/examples/datepicker/datepicker.autoHide.tsx deleted file mode 100644 index 483c04ee6..000000000 --- a/examples/datepicker/datepicker.autoHide.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const autoHide: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.autoHide.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.inline.tsx b/examples/datepicker/datepicker.inline.tsx deleted file mode 100644 index ab55cc97e..000000000 --- a/examples/datepicker/datepicker.inline.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const inline: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.inline.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.localization.tsx b/examples/datepicker/datepicker.localization.tsx deleted file mode 100644 index f7d1a6fb5..000000000 --- a/examples/datepicker/datepicker.localization.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const localization: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.localization.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.range.tsx b/examples/datepicker/datepicker.range.tsx deleted file mode 100644 index 7761b21f1..000000000 --- a/examples/datepicker/datepicker.range.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const range: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.range.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.root.tsx b/examples/datepicker/datepicker.root.tsx deleted file mode 100644 index dac9eec50..000000000 --- a/examples/datepicker/datepicker.root.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ; -} -`; - -function Component() { - return ; -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.root.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.title.tsx b/examples/datepicker/datepicker.title.tsx deleted file mode 100644 index c7530f8b7..000000000 --- a/examples/datepicker/datepicker.title.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return -} -`; - -function Component() { - return ; -} - -export const title: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.title.tsx', - component: , -}; diff --git a/examples/datepicker/datepicker.weekStart.tsx b/examples/datepicker/datepicker.weekStart.tsx deleted file mode 100644 index 8310c2211..000000000 --- a/examples/datepicker/datepicker.weekStart.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Datepicker } from '~/src'; - -const code = ` -'use client'; - -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ( - - ); -} -`; - -const codeRSC = ` -import { Datepicker } from 'flowbite-react'; - -function Component() { - return ( - - ); -} -`; - -function Component() { - return ( - - ); -} - -export const weekStart: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'datepicker/datepicker.weekStart.tsx', - component: , -}; diff --git a/examples/datepicker/index.ts b/examples/datepicker/index.ts deleted file mode 100644 index 0df343f5f..000000000 --- a/examples/datepicker/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { autoHide } from './datepicker.autoHide'; -export { inline } from './datepicker.inline'; -export { localization } from './datepicker.localization'; -export { range } from './datepicker.range'; -export { root } from './datepicker.root'; -export { title } from './datepicker.title'; -export { weekStart } from './datepicker.weekStart'; diff --git a/examples/dropdown/dropdown.customItem.tsx b/examples/dropdown/dropdown.customItem.tsx deleted file mode 100644 index d6fbc7aa0..000000000 --- a/examples/dropdown/dropdown.customItem.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import Link from 'next/link'; -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - - Home - - - External link - - - ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - - - Home - - - External link - - - ); -} -`; - -function Component() { - return ( - - - Home - - - External link - - - ); -} - -export const customItem: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.customItem.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.customTrigger.tsx b/examples/dropdown/dropdown.customTrigger.tsx deleted file mode 100644 index 25ce8328b..000000000 --- a/examples/dropdown/dropdown.customTrigger.tsx +++ /dev/null @@ -1,43 +0,0 @@ -'use client'; - -import { type CodeData } from '~/components/code-demo'; -import { Dropdown } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - My custom trigger}> - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -function Component() { - return ( - My custom trigger}> - Dashboard - Settings - Earnings - Sign out - - ); -} - -export const customTrigger: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'dropdown/dropdown.customTrigger.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.divider.tsx b/examples/dropdown/dropdown.divider.tsx deleted file mode 100644 index 4d6533ba3..000000000 --- a/examples/dropdown/dropdown.divider.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownDivider, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - - Separated link - - ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownDivider, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -function Component() { - return ( - - Dashboard - Settings - Earnings - - Separated link - - ); -} - -export const divider: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.divider.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.events.tsx b/examples/dropdown/dropdown.events.tsx deleted file mode 100644 index 42dc33297..000000000 --- a/examples/dropdown/dropdown.events.tsx +++ /dev/null @@ -1,43 +0,0 @@ -'use client'; - -import { type CodeData } from '~/components/code-demo'; -import { Dropdown } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - alert('Dashboard!')}>Dashboard - alert('Settings!')}>Settings - alert('Earnings!')}>Earnings - alert('Sign out!')}>Sign out - - ); -} -`; - -function Component() { - return ( - - alert('Dashboard!')}>Dashboard - alert('Settings!')}>Settings - alert('Earnings!')}>Earnings - alert('Sign out!')}>Sign out - - ); -} - -export const events: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'dropdown/dropdown.events.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.header.tsx b/examples/dropdown/dropdown.header.tsx deleted file mode 100644 index 5b20c6964..000000000 --- a/examples/dropdown/dropdown.header.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownDivider, DropdownHeader, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - - Bonnie Green - bonnie@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownDivider, DropdownHeader, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -function Component() { - return ( - - - Bonnie Green - bonnie@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} - -export const header: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.header.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.inline.tsx b/examples/dropdown/dropdown.inline.tsx deleted file mode 100644 index 9bfe49dd3..000000000 --- a/examples/dropdown/dropdown.inline.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} - -export const inline: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.inline.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.itemsWithIcon.tsx b/examples/dropdown/dropdown.itemsWithIcon.tsx deleted file mode 100644 index c46d0029b..000000000 --- a/examples/dropdown/dropdown.itemsWithIcon.tsx +++ /dev/null @@ -1,55 +0,0 @@ -'use client'; - -import { HiCog, HiCurrencyDollar, HiLogout, HiViewGrid } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Dropdown } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; -import { HiCog, HiCurrencyDollar, HiLogout, HiViewGrid } from 'react-icons/hi'; - -function Component() { - return ( - - - Bonnie Green - bonnie@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} -`; - -function Component() { - return ( - - - Bonnie Green - bonnie@flowbite.com - - Dashboard - Settings - Earnings - - Sign out - - ); -} - -export const itemsWithIcon: CodeData = { - type: 'single', - code: { - fileName: 'client', - language: 'tsx', - code, - }, - githubSlug: 'dropdown/dropdown.itemsWithIcon.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.placement.tsx b/examples/dropdown/dropdown.placement.tsx deleted file mode 100644 index d63326602..000000000 --- a/examples/dropdown/dropdown.placement.tsx +++ /dev/null @@ -1,159 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} -`; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} - -export const placement: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.placement.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.root.tsx b/examples/dropdown/dropdown.root.tsx deleted file mode 100644 index 9a2d52b58..000000000 --- a/examples/dropdown/dropdown.root.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} -`; - -function Component() { - return ( - - Dashboard - Settings - Earnings - Sign out - - ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.root.tsx', - component: , -}; diff --git a/examples/dropdown/dropdown.sizes.tsx b/examples/dropdown/dropdown.sizes.tsx deleted file mode 100644 index ff5461a5b..000000000 --- a/examples/dropdown/dropdown.sizes.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Dropdown, DropdownItem } from '~/src'; - -const code = ` -'use client'; - -import { Dropdown } from 'flowbite-react'; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} -`; - -const codeRSC = ` -import { Dropdown, DropdownItem } from 'flowbite-react'; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} -`; - -function Component() { - return ( -
- - Dashboard - Settings - Earnings - Sign out - - - Dashboard - Settings - Earnings - Sign out - -
- ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'dropdown/dropdown.sizes.tsx', - component: , -}; diff --git a/examples/dropdown/index.ts b/examples/dropdown/index.ts deleted file mode 100644 index 7b1d9e14b..000000000 --- a/examples/dropdown/index.ts +++ /dev/null @@ -1,10 +0,0 @@ -export { customItem } from './dropdown.customItem'; -export { customTrigger } from './dropdown.customTrigger'; -export { divider } from './dropdown.divider'; -export { events } from './dropdown.events'; -export { header } from './dropdown.header'; -export { inline } from './dropdown.inline'; -export { itemsWithIcon } from './dropdown.itemsWithIcon'; -export { placement } from './dropdown.placement'; -export { root } from './dropdown.root'; -export { sizes } from './dropdown.sizes'; diff --git a/examples/fileInput/fileInput.dropzone.tsx b/examples/fileInput/fileInput.dropzone.tsx deleted file mode 100644 index d0b706bf7..000000000 --- a/examples/fileInput/fileInput.dropzone.tsx +++ /dev/null @@ -1,133 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
- -
- ); -} -`; - -const codeRSC = ` - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
- -
- ); -} -`; - -function Component() { - return ( -
- -
- ); -} - -export const dropzone: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'fileInput/fileInput.dropzone.tsx', - component: , -}; diff --git a/examples/fileInput/fileInput.helper.tsx b/examples/fileInput/fileInput.helper.tsx deleted file mode 100644 index 9d2b3140c..000000000 --- a/examples/fileInput/fileInput.helper.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const helper: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'fileInput/fileInput.helper.tsx', - component: , -}; diff --git a/examples/fileInput/fileInput.multiple.tsx b/examples/fileInput/fileInput.multiple.tsx deleted file mode 100644 index 8a4d0c739..000000000 --- a/examples/fileInput/fileInput.multiple.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const multiple: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'fileInput/fileInput.multiple.tsx', - component: , -}; diff --git a/examples/fileInput/fileInput.root.tsx b/examples/fileInput/fileInput.root.tsx deleted file mode 100644 index 26d5c6111..000000000 --- a/examples/fileInput/fileInput.root.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -function Component() { - - import { FileInput, Label } from 'flowbite-react'; - - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'fileInput/fileInput.root.tsx', - component: , -}; diff --git a/examples/fileInput/fileInput.sizes.tsx b/examples/fileInput/fileInput.sizes.tsx deleted file mode 100644 index 1c5d8ea63..000000000 --- a/examples/fileInput/fileInput.sizes.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -const codeRSC = ` - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'fileInput/fileInput.sizes.tsx', - component: , -}; diff --git a/examples/fileInput/index.ts b/examples/fileInput/index.ts deleted file mode 100644 index 359c86e94..000000000 --- a/examples/fileInput/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { dropzone } from './fileInput.dropzone'; -export { helper } from './fileInput.helper'; -export { multiple } from './fileInput.multiple'; -export { root } from './fileInput.root'; -export { sizes } from './fileInput.sizes'; diff --git a/examples/floatingLabel/floatingLabel.disabled.tsx b/examples/floatingLabel/floatingLabel.disabled.tsx deleted file mode 100644 index 0c0da0613..000000000 --- a/examples/floatingLabel/floatingLabel.disabled.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FloatingLabel } from '~/src'; - -const code = ` -'use client'; - -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( -
- - - -
- ); -} -`; - -const codeRSC = ` -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( -
- - - -
- ); -} -`; - -function Component() { - return ( -
- - - -
- ); -} - -export const disabled: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'floatingLabel/floatingLabel.disabled.tsx', - component: , -}; diff --git a/examples/floatingLabel/floatingLabel.helperText.tsx b/examples/floatingLabel/floatingLabel.helperText.tsx deleted file mode 100644 index 081b6e67f..000000000 --- a/examples/floatingLabel/floatingLabel.helperText.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FloatingLabel } from '~/src'; - -const code = ` -'use client'; - -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - - ); -} -`; - -const codeRSC = ` -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - - ); -} -`; - -function Component() { - return ( - - ); -} - -export const helperText: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'floatingLabel/floatingLabel.helperText.tsx', - component: , -}; diff --git a/examples/floatingLabel/floatingLabel.root.tsx b/examples/floatingLabel/floatingLabel.root.tsx deleted file mode 100644 index f636269ba..000000000 --- a/examples/floatingLabel/floatingLabel.root.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FloatingLabel } from '~/src'; - -const code = ` -'use client'; - -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( -
- - - -
- ); -} -`; - -const codeRSC = ` -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( -
- - - -
- ); -} -`; - -function Component() { - return ( -
- - - -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'floatingLabel/floatingLabel.root.tsx', - component: , -}; diff --git a/examples/floatingLabel/floatingLabel.sizes.tsx b/examples/floatingLabel/floatingLabel.sizes.tsx deleted file mode 100644 index 3aad99464..000000000 --- a/examples/floatingLabel/floatingLabel.sizes.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FloatingLabel } from '~/src'; - -const code = ` -'use client'; - -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} -`; - -const codeRSC = ` -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} -`; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} - -export const sizes: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'floatingLabel/floatingLabel.sizes.tsx', - component: , -}; diff --git a/examples/floatingLabel/floatingLabel.validation.tsx b/examples/floatingLabel/floatingLabel.validation.tsx deleted file mode 100644 index e3fc30097..000000000 --- a/examples/floatingLabel/floatingLabel.validation.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FloatingLabel } from '~/src'; - -const code = ` -'use client'; - -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} -`; - -const codeRSC = ` -import { FloatingLabel } from 'flowbite-react'; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} -`; - -function Component() { - return ( - <> -
- - - -
-
- - - -
- - ); -} - -export const validation: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'floatingLabel/floatingLabel.validation.tsx', - component: , -}; diff --git a/examples/floatingLabel/index.ts b/examples/floatingLabel/index.ts deleted file mode 100644 index a101f5b36..000000000 --- a/examples/floatingLabel/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { disabled } from './floatingLabel.disabled'; -export { helperText } from './floatingLabel.helperText'; -export { root } from './floatingLabel.root'; -export { sizes } from './floatingLabel.sizes'; -export { validation } from './floatingLabel.validation'; diff --git a/examples/footer/footer.root.tsx b/examples/footer/footer.root.tsx deleted file mode 100644 index c43d989eb..000000000 --- a/examples/footer/footer.root.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Footer, FooterCopyright, FooterLink, FooterLinkGroup } from '~/src'; - -const code = ` -'use client'; - -import { Footer } from 'flowbite-react'; - -function Component() { - return ( -
- - - About - Privacy Policy - Licensing - Contact - -
- ); -} -`; - -const codeRSC = ` -import { Footer, FooterCopyright, FooterLink, FooterLinkGroup } from 'flowbite-react'; - -function Component() { - return ( -
- - - About - Privacy Policy - Licensing - Contact - -
- ); -} -`; - -function Component() { - return ( -
- - - About - Privacy Policy - Licensing - Contact - -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'footer/footer.root.tsx', - component: , -}; diff --git a/examples/footer/footer.sitemapLinks.tsx b/examples/footer/footer.sitemapLinks.tsx deleted file mode 100644 index f0e46cffc..000000000 --- a/examples/footer/footer.sitemapLinks.tsx +++ /dev/null @@ -1,201 +0,0 @@ -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; -import { type CodeData } from '~/components/code-demo'; -import { Footer, FooterCopyright, FooterIcon, FooterLink, FooterLinkGroup, FooterTitle } from '~/src'; - -const code = ` -'use client'; - -import { Footer } from 'flowbite-react'; -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; - -function Component() { - return ( -
-
-
-
- - - About - Careers - Brand Center - Blog - -
-
- - - Discord Server - Twitter - Facebook - Contact Us - -
-
- - - Privacy Policy - Licensing - Terms & Conditions - -
-
- - - iOS - Android - Windows - MacOS - -
-
-
- -
- - - - - -
-
-
-
- ); -} -`; - -const codeRSC = ` -import { Footer, FooterCopyright, FooterIcon, FooterLink, FooterLinkGroup, FooterTitle } from 'flowbite-react'; -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; - -function Component() { - return ( -
-
-
-
- - - About - Careers - Brand Center - Blog - -
-
- - - Discord Server - Twitter - Facebook - Contact Us - -
-
- - - Privacy Policy - Licensing - Terms & Conditions - -
-
- - - iOS - Android - Windows - MacOS - -
-
-
- -
- - - - - -
-
-
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- - - About - Careers - Brand Center - Blog - -
-
- - - Discord Server - Twitter - Facebook - Contact Us - -
-
- - - Privacy Policy - Licensing - Terms & Conditions - -
-
- - - iOS - Android - Windows - MacOS - -
-
-
- -
- - - - - -
-
-
-
- ); -} - -export const sitemapLinks: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'footer/footer.sitemapLinks.tsx', - component: , -}; diff --git a/examples/footer/footer.socialMediaIcons.tsx b/examples/footer/footer.socialMediaIcons.tsx deleted file mode 100644 index 5e8746c5d..000000000 --- a/examples/footer/footer.socialMediaIcons.tsx +++ /dev/null @@ -1,210 +0,0 @@ -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; -import { type CodeData } from '~/components/code-demo'; -import { - Footer, - FooterBrand, - FooterCopyright, - FooterDivider, - FooterIcon, - FooterLink, - FooterLinkGroup, - FooterTitle, -} from '~/src'; - -const code = ` -'use client'; - -import { Footer } from 'flowbite-react'; -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; - -function Component() { - return ( -
-
-
-
- -
-
-
- - - Flowbite - Tailwind CSS - -
-
- - - Github - Discord - -
-
- - - Privacy Policy - Terms & Conditions - -
-
-
- -
- -
- - - - - -
-
-
-
- ); -} -`; - -const codeRSC = ` -import { - Footer, - FooterBrand, - FooterCopyright, - FooterDivider, - FooterIcon, - FooterLink, - FooterLinkGroup, - FooterTitle, -} from 'flowbite-react'; -import { BsDribbble, BsFacebook, BsGithub, BsInstagram, BsTwitter } from 'react-icons/bs'; - -function Component() { - return ( -
-
-
-
- -
-
-
- - - Flowbite - Tailwind CSS - -
-
- - - Github - Discord - -
-
- - - Privacy Policy - Terms & Conditions - -
-
-
- -
- -
- - - - - -
-
-
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
- - - Flowbite - Tailwind CSS - -
-
- - - Github - Discord - -
-
- - - Privacy Policy - Terms & Conditions - -
-
-
- -
- -
- - - - - -
-
-
-
- ); -} - -export const socialMediaIcons: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'footer/footer.socialMediaIcons.tsx', - component: , -}; diff --git a/examples/footer/footer.withLogo.tsx b/examples/footer/footer.withLogo.tsx deleted file mode 100644 index b0f62097f..000000000 --- a/examples/footer/footer.withLogo.tsx +++ /dev/null @@ -1,105 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Footer, FooterBrand, FooterCopyright, FooterDivider, FooterLink, FooterLinkGroup } from '~/src'; - -const code = ` -'use client'; - -import { Footer } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- - - About - Privacy Policy - Licensing - Contact - -
- - -
-
- ); -} -`; - -const codeRSC = ` -import { Footer, FooterBrand, FooterCopyright, FooterDivider, FooterLink, FooterLinkGroup } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- - - About - Privacy Policy - Licensing - Contact - -
- - -
-
- ); -} -`; - -function Component() { - return ( -
-
-
- - - About - Privacy Policy - Licensing - Contact - -
- - -
-
- ); -} - -export const withLogo: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'footer/footer.withLogo.tsx', - component: , -}; diff --git a/examples/footer/index.ts b/examples/footer/index.ts deleted file mode 100644 index a3d1bd88f..000000000 --- a/examples/footer/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export { root } from './footer.root'; -export { sitemapLinks } from './footer.sitemapLinks'; -export { socialMediaIcons } from './footer.socialMediaIcons'; -export { withLogo } from './footer.withLogo'; diff --git a/examples/forms/forms.checkbox.tsx b/examples/forms/forms.checkbox.tsx deleted file mode 100644 index 92c67b439..000000000 --- a/examples/forms/forms.checkbox.tsx +++ /dev/null @@ -1,162 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Checkbox, Label } from '~/src'; - -const code = ` -'use client'; - -import { Checkbox, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
- - -
-
- - -
-
- - -
-
-
- -
-
- -
- - For orders shipped from Flowbite from € 25 in books or  - € 29 on other categories - -
-
-
-
- - -
-
- ); -} -`; - -const codeRSC = ` -import { Checkbox, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
- - -
-
- - -
-
- - -
-
-
- -
-
- -
- - For orders shipped from Flowbite from € 25 in books or  - € 29 on other categories - -
-
-
-
- - -
-
- ); -} -`; - -function Component() { - return ( -
-
- - -
-
- - -
-
- - -
-
-
- -
-
- -
- - For orders shipped from Flowbite from € 25 in books or  - € 29 on other categories - -
-
-
-
- - -
-
- ); -} - -export const checkbox: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.checkbox.tsx', - component: , -}; diff --git a/examples/forms/forms.disabledInputs.tsx b/examples/forms/forms.disabledInputs.tsx deleted file mode 100644 index d66be4837..000000000 --- a/examples/forms/forms.disabledInputs.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
- - - - -
- ); -} -`; - -function Component() { - return ( -
- - - - -
- ); -} - -export const disabledInputs: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.disabledInputs.tsx', - component: , -}; diff --git a/examples/forms/forms.fileInput.tsx b/examples/forms/forms.fileInput.tsx deleted file mode 100644 index 8f0d1e44c..000000000 --- a/examples/forms/forms.fileInput.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { FileInput, Label } from '~/src'; - -const code = ` -'use client'; - -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { FileInput, Label } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const fileInput: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.fileInput.tsx', - component: , -}; diff --git a/examples/forms/forms.helperText.tsx b/examples/forms/forms.helperText.tsx deleted file mode 100644 index de36d9912..000000000 --- a/examples/forms/forms.helperText.tsx +++ /dev/null @@ -1,105 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- - We’ll never share your details. Read our - - Privacy Policy - - . - - } - /> -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- - We’ll never share your details. Read our - - Privacy Policy - - . - - } - /> -
- ); -} -`; - -function Component() { - return ( -
-
-
- - We’ll never share your details. Read our - - Privacy Policy - - . - - } - /> -
- ); -} - -export const helperText: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.helperText.tsx', - component: , -}; diff --git a/examples/forms/forms.inputAddon.tsx b/examples/forms/forms.inputAddon.tsx deleted file mode 100644 index 1093a74f1..000000000 --- a/examples/forms/forms.inputAddon.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const inputAddon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputAddon.tsx', - component: , -}; diff --git a/examples/forms/forms.inputColors.tsx b/examples/forms/forms.inputColors.tsx deleted file mode 100644 index 60a076fc4..000000000 --- a/examples/forms/forms.inputColors.tsx +++ /dev/null @@ -1,141 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} - -export const inputColors: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputColors.tsx', - component: , -}; diff --git a/examples/forms/forms.inputLeftIcon.tsx b/examples/forms/forms.inputLeftIcon.tsx deleted file mode 100644 index dc3bd67cb..000000000 --- a/examples/forms/forms.inputLeftIcon.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { HiMail } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const inputLeftIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputLeftIcon.tsx', - component: , -}; diff --git a/examples/forms/forms.inputLeftRightIcon.tsx b/examples/forms/forms.inputLeftRightIcon.tsx deleted file mode 100644 index 52ac6318f..000000000 --- a/examples/forms/forms.inputLeftRightIcon.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { HiMail } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const inputLeftRightIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputLeftRightIcon.tsx', - component: , -}; diff --git a/examples/forms/forms.inputRightIcon.tsx b/examples/forms/forms.inputRightIcon.tsx deleted file mode 100644 index 14b4ce36f..000000000 --- a/examples/forms/forms.inputRightIcon.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { HiMail } from 'react-icons/hi'; -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; -import { HiMail } from 'react-icons/hi'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const inputRightIcon: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputRightIcon.tsx', - component: , -}; diff --git a/examples/forms/forms.inputSizing.tsx b/examples/forms/forms.inputSizing.tsx deleted file mode 100644 index 0172593e3..000000000 --- a/examples/forms/forms.inputSizing.tsx +++ /dev/null @@ -1,105 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -const codeRSC = ` -import { Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} - -export const inputSizing: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.inputSizing.tsx', - component: , -}; diff --git a/examples/forms/forms.radioButton.tsx b/examples/forms/forms.radioButton.tsx deleted file mode 100644 index 95d43f162..000000000 --- a/examples/forms/forms.radioButton.tsx +++ /dev/null @@ -1,120 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, Radio } from '~/src'; - -const code = ` -'use client'; - -import { Label, Radio } from 'flowbite-react'; - -function Component() { - return ( -
- Choose your favorite country -
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- ); -} -`; - -const codeRSC = ` -import { Label, Radio } from 'flowbite-react'; - -function Component() { - return ( -
- Choose your favorite country -
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- ); -} -`; - -function Component() { - return ( -
- Choose your favorite country -
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- ); -} - -export const radioButton: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.radioButton.tsx', - component: , -}; diff --git a/examples/forms/forms.rangeSlider.tsx b/examples/forms/forms.rangeSlider.tsx deleted file mode 100644 index 137bb8cf4..000000000 --- a/examples/forms/forms.rangeSlider.tsx +++ /dev/null @@ -1,141 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, RangeSlider } from '~/src'; - -const code = ` -'use client'; - -import { Label, RangeSlider } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -const codeRSC = ` -import { Label, RangeSlider } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- ); -} - -export const rangeSlider: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.rangeSlider.tsx', - component: , -}; diff --git a/examples/forms/forms.root.tsx b/examples/forms/forms.root.tsx deleted file mode 100644 index 5dea8c55a..000000000 --- a/examples/forms/forms.root.tsx +++ /dev/null @@ -1,102 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Button, Checkbox, Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Button, Checkbox, Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} -`; - -const codeRSC = ` -import { Button, Checkbox, Label, TextInput } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} - -export const root: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.root.tsx', - component: , -}; diff --git a/examples/forms/forms.select.tsx b/examples/forms/forms.select.tsx deleted file mode 100644 index b71a61305..000000000 --- a/examples/forms/forms.select.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, Select } from '~/src'; - -const code = ` -'use client'; - -import { Label, Select } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -const codeRSC = ` -import { Label, Select } from 'flowbite-react'; - -function Component() { - return ( -
-
-
- -
- ); -} -`; - -function Component() { - return ( -
-
-
- -
- ); -} - -export const select: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.select.tsx', - component: , -}; diff --git a/examples/forms/forms.shadowInputs.tsx b/examples/forms/forms.shadowInputs.tsx deleted file mode 100644 index 8c8af5786..000000000 --- a/examples/forms/forms.shadowInputs.tsx +++ /dev/null @@ -1,138 +0,0 @@ -import Link from 'next/link'; -import { type CodeData } from '~/components/code-demo'; -import { Button, Checkbox, Label, TextInput } from '~/src'; - -const code = ` -'use client'; - -import { Button, Checkbox, Label, TextInput } from 'flowbite-react'; -import Link from 'next/link'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} -`; - -const codeRSC = ` -import { Button, Checkbox, Label, TextInput } from 'flowbite-react'; -import Link from 'next/link'; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} -`; - -function Component() { - return ( -
-
-
-
- -
-
-
-
- -
-
-
-
- -
-
- - -
- -
- ); -} - -export const shadowInputs: CodeData = { - type: 'single', - code: [ - { - fileName: 'client', - language: 'tsx', - code, - }, - { - fileName: 'server', - language: 'tsx', - code: codeRSC, - }, - ], - githubSlug: 'forms/forms.shadowInputs.tsx', - component: , -}; diff --git a/examples/forms/forms.textarea.tsx b/examples/forms/forms.textarea.tsx deleted file mode 100644 index 916d24f7b..000000000 --- a/examples/forms/forms.textarea.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { type CodeData } from '~/components/code-demo'; -import { Label, Textarea } from '~/src'; - -const code = ` -'use client'; - -import { Label, Textarea } from 'flowbite-react'; - -function Component() { - return ( -
-
-
-