chore: Upgrade flowbite-react from 0.10.2 to 0.12.9 (#10572)

Note: For this to work, we swapped to `bundler` for module resolution,
which is recommended by TypeScript community.

This upgrade addresses breaking changes in flowbite-react 0.12.x
including
the removal of compound components in favour of simple component
imports.

Breaking changes addressed:

1. Tailwind CSS configuration
- Changed import from 'flowbite-react/tailwind' to
'flowbite-react/plugin/tailwindcss'
   - Updated plugin API: flowbite.plugin() → flowbite (direct export)
- Replaced flowbite.content() with manual path
'./node_modules/flowbite-react/dist/**/*.js'

2. Component API changes (compound → simple components)
- Accordion: Accordion.Panel → AccordionPanel, Accordion.Title →
AccordionTitle, etc.
   - Tabs: Tabs.Item → TabItem
- Sidebar: Sidebar.Item → SidebarItem, Sidebar.Items → SidebarItems,
etc.
   - Clipboard: Clipboard.WithIcon → ClipboardWithIcon

Additional fixes:
- Adjusted clipboard icon positioning (increased top margin from top-2
to top-4)
to properly align with code block borders as it was misaligned after the
upgrade

All components tested and verified working:
- Accordion, Tabs, Sidebar, Clipboard, Tooltip, Navbar
- Custom theming preserved and functioning correctly
- No obvious regressions during side-by-side testing with online version
This commit is contained in:
Mariusz Klochowicz
2025-10-16 01:59:54 +10:30
committed by GitHub
parent 08f8e886f1
commit 31f8f9980b
10 changed files with 330 additions and 247 deletions

View File

@@ -27,7 +27,7 @@
"asciinema-player": "^3.9.0",
"autoprefixer": "10.4.21",
"fast-xml-parser": "^5.2.5",
"flowbite-react": "^0.10.2",
"flowbite-react": "^0.12.9",
"framer-motion": "^12.23.12",
"highlight.js": "^11.11.1",
"md5": "^2.3.0",

354
website/pnpm-lock.yaml generated
View File

@@ -54,8 +54,8 @@ importers:
specifier: ^5.2.5
version: 5.2.5
flowbite-react:
specifier: ^0.10.2
version: 0.10.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.18(yaml@2.6.0))
specifier: ^0.12.9
version: 0.12.9(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.18(yaml@2.6.0))(typescript@5.9.2)
framer-motion:
specifier: ^12.23.12
version: 12.23.12(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -242,8 +242,8 @@ packages:
'@emnapi/runtime@1.5.0':
resolution: {integrity: sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==}
'@floating-ui/core@1.6.6':
resolution: {integrity: sha512-Vkvsw6EcpMHjvZZdMkSY+djMGFbt7CRssW99Ne8tar2WLnZ/l3dbxeTShbLQj+/s35h+Qb4cmnob+EzwtjrXGQ==}
'@floating-ui/core@1.6.9':
resolution: {integrity: sha512-uMXCuQ3BItDUbAMhIXw7UPXRfAlOAvZzdK9BWpE60MCn+Svt3aLn9jsPTi/WNGlRUu2uI0v5S7JiIUsbsvh3fw==}
'@floating-ui/dom@1.6.12':
resolution: {integrity: sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==}
@@ -254,14 +254,17 @@ packages:
react: '>=16.8.0'
react-dom: '>=16.8.0'
'@floating-ui/react@0.26.21':
resolution: {integrity: sha512-7P5ncDIiYd6RrwpCDbKyFzvabM014QlzlumtDbK3Bck0UueC+Rp8BLS34qcGBcN1pZCTodl4QNnCVmKv4tSxfQ==}
'@floating-ui/react@0.27.3':
resolution: {integrity: sha512-CLHnes3ixIFFKVQDdICjel8muhFLOBdQH7fgtHNPY8UbCNqbeKZ262G7K66lGQOUQWWnYocf7ZbUsLJgGfsLHg==}
peerDependencies:
react: '>=16.8.0'
react-dom: '>=16.8.0'
react: '>=17.0.0'
react-dom: '>=17.0.0'
'@floating-ui/utils@0.2.8':
resolution: {integrity: sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==}
'@floating-ui/utils@0.2.10':
resolution: {integrity: sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==}
'@iarna/toml@2.2.5':
resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
'@img/colour@1.0.0':
resolution: {integrity: sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==}
@@ -528,27 +531,6 @@ packages:
resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
engines: {node: '>=14'}
'@popperjs/core@2.11.8':
resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
'@rollup/plugin-node-resolve@15.3.0':
resolution: {integrity: sha512-9eO5McEICxMzJpDW9OnMYSv4Sta3hmt7VtBFz5zR9273suNOydOyq/FrGeGy+KsTRFm8w0SLVhzig2ILFT63Ag==}
engines: {node: '>=14.0.0'}
peerDependencies:
rollup: ^2.78.0||^3.0.0||^4.0.0
peerDependenciesMeta:
rollup:
optional: true
'@rollup/pluginutils@5.1.3':
resolution: {integrity: sha512-Pnsb6f32CD2W3uCaLZIzDmeFyQ2b8UWMFI7xtwUezpcGBDVDW6y9XgAWIlARiGAo6eNF5FK5aQTr0LFyNyqq5A==}
engines: {node: '>=14.0.0'}
peerDependencies:
rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
peerDependenciesMeta:
rollup:
optional: true
'@swc/helpers@0.5.15':
resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==}
@@ -610,15 +592,26 @@ packages:
'@types/react@18.3.11':
resolution: {integrity: sha512-r6QZ069rFTjrEYgFdOck1gK7FLVsgJE7tTz0pQBczlBNUhBNk0MQH4UbnFSwjpQLMkLzgqvBBa+qGpLje16eTQ==}
'@types/resolve@1.20.2':
resolution: {integrity: sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==}
'@types/unist@2.0.11':
resolution: {integrity: sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==}
'@types/unist@3.0.3':
resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
'@typescript-eslint/types@8.26.0':
resolution: {integrity: sha512-89B1eP3tnpr9A8L6PZlSjBvnJhWXtYfZhECqlBl1D9Lme9mHO6iWlsprBtVenQvY1HMhax1mWOjhtL3fh/u+pA==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
'@typescript-eslint/typescript-estree@8.26.0':
resolution: {integrity: sha512-tiJ1Hvy/V/oMVRTbEOIeemA2XoylimlDQ03CgPPNaHYZbpsc78Hmngnt+WXZfJX1pjQ711V7g0H7cSJThGYfPQ==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
peerDependencies:
typescript: '>=4.8.4 <5.9.0'
'@typescript-eslint/visitor-keys@8.26.0':
resolution: {integrity: sha512-2z8JQJWAzPdDd51dRQ/oqIJxe99/hoLIqmf8RMCAJQtYDc535W/Jt2+RTP4bP0aKeBG1F65yjIZuczOXCmbWwg==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
'@ungap/structured-clone@1.2.0':
resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==}
@@ -760,9 +753,16 @@ packages:
arg@5.0.2:
resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
array-timsort@1.0.3:
resolution: {integrity: sha512-/+3GRL7dDAGEfM6TseQk/U+mi18TU2Ms9I3UlLdUMhz2hbvGNTKdj9xniwXfUqgYhHxRx0+8UnKkvlNwVU+cWQ==}
asciinema-player@3.10.0:
resolution: {integrity: sha512-shoOK6F606nDKZxDVM7JuGSCAyWLePoGRFNlV+FqiP5Sqvyn0BlE7wlbjZyd2X4P1iRhv/HKfVNtnQIxmgphRA==}
ast-types@0.16.1:
resolution: {integrity: sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==}
engines: {node: '>=4'}
astring@1.9.0:
resolution: {integrity: sha512-LElXdjswlqjWrPpJFg1Fx4wpkOCxj1TDHlSV4PlaRxHGWko024xICaa97ZkMfs6DRKlCguiAI+rbXv5GWwXIkg==}
hasBin: true
@@ -853,6 +853,10 @@ packages:
resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
engines: {node: '>= 8.10.0'}
chokidar@4.0.3:
resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
engines: {node: '>= 14.16.0'}
chrome-trace-event@1.0.4:
resolution: {integrity: sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==}
engines: {node: '>=6.0'}
@@ -886,6 +890,13 @@ packages:
resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
engines: {node: '>= 6'}
comment-json@4.2.5:
resolution: {integrity: sha512-bKw/r35jR3HGt5PEPm1ljsQQGyCrR8sFGNiN5L+ykDHdpO8Smxkrkla9Yi6NkQyUrb8V54PGhfMs6NrIwtxtdw==}
engines: {node: '>= 6'}
core-util-is@1.0.3:
resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
cross-spawn@7.0.6:
resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
engines: {node: '>= 8'}
@@ -901,8 +912,8 @@ packages:
csstype@3.1.3:
resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
debounce@2.1.0:
resolution: {integrity: sha512-OkL3+0pPWCqoBc/nhO9u6TIQNTK44fnBnzuVtJAbp13Naxw9R6u21x+8tVTka87AhDZ3htqZ2pSSsZl9fqL2Wg==}
debounce@2.2.0:
resolution: {integrity: sha512-Xks6RUDLZFdz8LIdR6q0MTH44k7FikOmnh5xkSjMig6ch45afc8sjTjRQf3P6ax8dMgcQrYO/AR2RGWURrruqw==}
engines: {node: '>=18'}
debug@4.3.7:
@@ -914,15 +925,24 @@ packages:
supports-color:
optional: true
debug@4.4.3:
resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
engines: {node: '>=6.0'}
peerDependencies:
supports-color: '*'
peerDependenciesMeta:
supports-color:
optional: true
decode-named-character-reference@1.0.2:
resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==}
decode-named-character-reference@1.1.0:
resolution: {integrity: sha512-Wy+JTSbFThEOXQIR2L6mxJvEs+veIzpmqD7ynWxMXGpnk3smkHQOp6forLdHsKpAMW9iJpaBBIxz285t1n1C3w==}
deepmerge@4.3.1:
resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==}
engines: {node: '>=0.10.0'}
deepmerge-ts@7.1.4:
resolution: {integrity: sha512-fxqo6nHGQ9zOVgI4KXqtWXJR/yCLtC7aXIVq+6jc8tHPFUxlFmuUcm2kC4vztQ+LJxQ3gER/XAWearGYQ8niGA==}
engines: {node: '>=16.0.0'}
dequal@2.0.3:
resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
@@ -981,6 +1001,15 @@ packages:
resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
engines: {node: '>=8.0.0'}
eslint-visitor-keys@4.2.1:
resolution: {integrity: sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
esprima@4.0.1:
resolution: {integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==}
engines: {node: '>=4'}
hasBin: true
esrecurse@4.3.0:
resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
engines: {node: '>=4.0'}
@@ -1011,9 +1040,6 @@ packages:
estree-util-visit@2.0.0:
resolution: {integrity: sha512-m5KgiH85xAhhW8Wta0vShLcUvOsh3LLPI2YVwcbio1l7E09NTLL1EyMZFM1OyWowoH0skScNbhOPl4kcBgzTww==}
estree-walker@2.0.2:
resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
estree-walker@3.0.3:
resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
@@ -1055,22 +1081,17 @@ packages:
resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
engines: {node: '>=8'}
flowbite-datepicker@1.3.0:
resolution: {integrity: sha512-CLVqzuoE2vkUvWYK/lJ6GzT0be5dlTbH3uuhVwyB67+PjqJWABm2wv68xhBf5BqjpBxvTSQ3mrmLHpPJ2tvrSQ==}
flowbite-react@0.10.2:
resolution: {integrity: sha512-qkayK6IFmfH7zuuDnHmS0hJxLtL0KpW4vo4i/VQfZ6ZfaNlUsNLQxCGcmXwbZZtUm2WVw8x71aaDOAxftG9tmg==}
flowbite-react@0.12.9:
resolution: {integrity: sha512-8Zm0aOQn1ocTTzDVYARpzUGdBuXg4W2HYLPHXDHKUeNsVePIfYKQiQkh7JbqLbzvlKdYChmQEayljFVbZ1sU5A==}
hasBin: true
peerDependencies:
react: '>=18'
react-dom: '>=18'
tailwindcss: ^3
react: ^18 || ^19
react-dom: ^18 || ^19
tailwindcss: ^3 || ^4
flowbite-typography@1.0.5:
resolution: {integrity: sha512-IqTwOYgGZkXTK/5ngx3A9oQwgOqnRyUKUfIiB+w6xDmiD8z3cKDIgYfFpHIMKbLVfg+QmJIPqEEPrGZbAwVT6g==}
flowbite@2.5.1:
resolution: {integrity: sha512-7jP1jy9c3QP7y+KU9lc8ueMkTyUdMDvRP+lteSWgY5TigSZjf9K1kqZxmqjhbx2gBnFQxMl1GAjVThCa8cEpKA==}
foreground-child@3.3.1:
resolution: {integrity: sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==}
engines: {node: '>=14'}
@@ -1129,6 +1150,10 @@ packages:
resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
engines: {node: '>=8'}
has-own-prop@2.0.0:
resolution: {integrity: sha512-Pq0h+hvsVm6dDEa8x82GnLSYHOzNDt7f0ddFa3FqcQlgzEiptPqL+XrOJNavjOzSYiYWIrgeVYYgGlLmnxwilQ==}
engines: {node: '>=8'}
hasown@2.0.2:
resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
engines: {node: '>= 0.4'}
@@ -1235,9 +1260,6 @@ packages:
is-hexadecimal@2.0.1:
resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==}
is-module@1.0.0:
resolution: {integrity: sha512-51ypPSPCoTEIN9dy5Oy+h4pShgJmPCygKfyRCISBI+JoWT/2oJvK8QPxmwv7b/p239jXrm9M1mlQbyKJ5A152g==}
is-number@7.0.0:
resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
engines: {node: '>=0.12.0'}
@@ -1272,6 +1294,10 @@ packages:
json-schema-traverse@1.0.0:
resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==}
klona@2.0.6:
resolution: {integrity: sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==}
engines: {node: '>= 8'}
lilconfig@3.1.3:
resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
engines: {node: '>=14'}
@@ -1499,10 +1525,6 @@ packages:
resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
engines: {node: '>= 0.6'}
mini-svg-data-uri@1.4.4:
resolution: {integrity: sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==}
hasBin: true
minimatch@9.0.5:
resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
engines: {node: '>=16 || 14 >=14.17'}
@@ -1600,6 +1622,9 @@ packages:
package-json-from-dist@1.0.1:
resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
package-manager-detector@0.2.9:
resolution: {integrity: sha512-+vYvA/Y31l8Zk8dwxHhL3JfTuHPm6tlxM2A3GeQyl7ovYnSp1+mzAxClxaOr0qO1TtPxbQxetI7v5XqKLJZk7Q==}
parse-entities@2.0.0:
resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==}
@@ -1624,10 +1649,6 @@ packages:
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
engines: {node: '>=8.6'}
picomatch@4.0.3:
resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
engines: {node: '>=12'}
pify@2.3.0:
resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
engines: {node: '>=0.10.0'}
@@ -1728,11 +1749,6 @@ packages:
react: '>= 16.8.0 || ^18.0.0'
react-dom: '>= 16.8.0 || ^18.0.0'
react-icons@5.2.1:
resolution: {integrity: sha512-zdbW5GstTzXaVKvGSyTaBalt7HSfuK5ovrzlpyiWHAFXndXTdd/1hdDHI4xBM1Mn7YriT6aqESucFl9kEXzrdw==}
peerDependencies:
react: '*'
react-icons@5.5.0:
resolution: {integrity: sha512-MEFcXdkP3dLo8uumGI5xN3lDFNsRtrjbOEKDLD7yv76v4wpnEq2Lt2qeHaQOr34I/wPN3s3+N08WkQ+CW37Xiw==}
peerDependencies:
@@ -1760,6 +1776,14 @@ packages:
resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
engines: {node: '>=8.10.0'}
readdirp@4.1.2:
resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
engines: {node: '>= 14.18.0'}
recast@0.23.11:
resolution: {integrity: sha512-YTUo+Flmw4ZXiWfQKGcwwc11KnoRAYgzAE2E7mXKCjSviTKShtxBsN6YUUBB2gtaBzKzeKunxhUwNHQuRryhWA==}
engines: {node: '>= 4'}
recma-build-jsx@1.0.0:
resolution: {integrity: sha512-8GtdyqaBcDfva+GUKDr3nev3VpKAhup1+RvkMvUxURHpW7QyIvk9F5wz7Vzo06CEMSilw6uArgRqhpiUcWp8ew==}
@@ -1813,6 +1837,10 @@ packages:
remark-stringify@11.0.0:
resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==}
repeat-string@1.6.1:
resolution: {integrity: sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==}
engines: {node: '>=0.10'}
require-from-string@2.0.2:
resolution: {integrity: sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==}
engines: {node: '>=0.10.0'}
@@ -1971,8 +1999,11 @@ packages:
tabbable@6.2.0:
resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}
tailwind-merge@2.4.0:
resolution: {integrity: sha512-49AwoOQNKdqKPd9CViyH5wJoSKsCDjUlzL8DxuGp3P1FsGY36NJDAa18jLZcaHAUUuTj+JB8IAo8zWgBNvBF7A==}
tailwind-merge@2.6.0:
resolution: {integrity: sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==}
tailwind-merge@3.0.1:
resolution: {integrity: sha512-AvzE8FmSoXC7nC+oU5GlQJbip2UO7tmOhOfQyOmPhrStOGXHU08j8mZEHZ4BmCqY5dWTCo4ClWkNyRNx1wpT0g==}
tailwindcss@3.4.18:
resolution: {integrity: sha512-6A2rnmW5xZMdw11LYjhcI5846rt9pbLSabY5XPxo+XWdxwZaFEn47Go4NzFiHu9sNNmr/kXivP1vStfvMaK1GQ==}
@@ -2014,6 +2045,9 @@ packages:
third-party-capital@1.0.20:
resolution: {integrity: sha512-oB7yIimd8SuGptespDAZnNkzIz+NWaJCu2RMsbs4Wmp9zSDUM8Nhi3s2OOcqYuv3mN4hitXc8DVx+LyUmbUDiA==}
tiny-invariant@1.3.3:
resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
to-regex-range@5.0.1:
resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
engines: {node: '>=8.0'}
@@ -2024,6 +2058,12 @@ packages:
trough@2.2.0:
resolution: {integrity: sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==}
ts-api-utils@2.1.0:
resolution: {integrity: sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==}
engines: {node: '>=18.12'}
peerDependencies:
typescript: '>=4.8.4'
ts-interface-checker@0.1.13:
resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
@@ -2266,14 +2306,14 @@ snapshots:
tslib: 2.8.1
optional: true
'@floating-ui/core@1.6.6':
'@floating-ui/core@1.6.9':
dependencies:
'@floating-ui/utils': 0.2.8
'@floating-ui/utils': 0.2.10
'@floating-ui/dom@1.6.12':
dependencies:
'@floating-ui/core': 1.6.6
'@floating-ui/utils': 0.2.8
'@floating-ui/core': 1.6.9
'@floating-ui/utils': 0.2.10
'@floating-ui/react-dom@2.1.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
dependencies:
@@ -2281,15 +2321,17 @@ snapshots:
react: 18.3.1
react-dom: 18.3.1(react@18.3.1)
'@floating-ui/react@0.26.21(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
'@floating-ui/react@0.27.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
dependencies:
'@floating-ui/react-dom': 2.1.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
'@floating-ui/utils': 0.2.8
'@floating-ui/utils': 0.2.10
react: 18.3.1
react-dom: 18.3.1(react@18.3.1)
tabbable: 6.2.0
'@floating-ui/utils@0.2.8': {}
'@floating-ui/utils@0.2.10': {}
'@iarna/toml@2.2.5': {}
'@img/colour@1.0.0':
optional: true
@@ -2533,22 +2575,6 @@ snapshots:
'@pkgjs/parseargs@0.11.0':
optional: true
'@popperjs/core@2.11.8': {}
'@rollup/plugin-node-resolve@15.3.0':
dependencies:
'@rollup/pluginutils': 5.1.3
'@types/resolve': 1.20.2
deepmerge: 4.3.1
is-module: 1.0.0
resolve: 1.22.10
'@rollup/pluginutils@5.1.3':
dependencies:
'@types/estree': 1.0.8
estree-walker: 2.0.2
picomatch: 4.0.3
'@swc/helpers@0.5.15':
dependencies:
tslib: 2.8.1
@@ -2621,12 +2647,31 @@ snapshots:
'@types/prop-types': 15.7.13
csstype: 3.1.3
'@types/resolve@1.20.2': {}
'@types/unist@2.0.11': {}
'@types/unist@3.0.3': {}
'@typescript-eslint/types@8.26.0': {}
'@typescript-eslint/typescript-estree@8.26.0(typescript@5.9.2)':
dependencies:
'@typescript-eslint/types': 8.26.0
'@typescript-eslint/visitor-keys': 8.26.0
debug: 4.4.3
fast-glob: 3.3.3
is-glob: 4.0.3
minimatch: 9.0.5
semver: 7.7.3
ts-api-utils: 2.1.0(typescript@5.9.2)
typescript: 5.9.2
transitivePeerDependencies:
- supports-color
'@typescript-eslint/visitor-keys@8.26.0':
dependencies:
'@typescript-eslint/types': 8.26.0
eslint-visitor-keys: 4.2.1
'@ungap/structured-clone@1.2.0': {}
'@ungap/structured-clone@1.3.0': {}
@@ -2814,11 +2859,17 @@ snapshots:
arg@5.0.2: {}
array-timsort@1.0.3: {}
asciinema-player@3.10.0:
dependencies:
'@babel/runtime': 7.27.0
solid-js: 1.9.5
ast-types@0.16.1:
dependencies:
tslib: 2.8.1
astring@1.9.0: {}
autoprefixer@10.4.21(postcss@8.5.6):
@@ -2905,6 +2956,10 @@ snapshots:
optionalDependencies:
fsevents: 2.3.3
chokidar@4.0.3:
dependencies:
readdirp: 4.1.2
chrome-trace-event@1.0.4:
optional: true
@@ -2929,6 +2984,16 @@ snapshots:
commander@4.1.1: {}
comment-json@4.2.5:
dependencies:
array-timsort: 1.0.3
core-util-is: 1.0.3
esprima: 4.0.1
has-own-prop: 2.0.0
repeat-string: 1.6.1
core-util-is@1.0.3: {}
cross-spawn@7.0.6:
dependencies:
path-key: 3.1.1
@@ -2941,12 +3006,16 @@ snapshots:
csstype@3.1.3: {}
debounce@2.1.0: {}
debounce@2.2.0: {}
debug@4.3.7:
dependencies:
ms: 2.1.3
debug@4.4.3:
dependencies:
ms: 2.1.3
decode-named-character-reference@1.0.2:
dependencies:
character-entities: 2.0.2
@@ -2955,7 +3024,7 @@ snapshots:
dependencies:
character-entities: 2.0.2
deepmerge@4.3.1: {}
deepmerge-ts@7.1.4: {}
dequal@2.0.3: {}
@@ -3014,6 +3083,10 @@ snapshots:
estraverse: 4.3.0
optional: true
eslint-visitor-keys@4.2.1: {}
esprima@4.0.1: {}
esrecurse@4.3.0:
dependencies:
estraverse: 5.3.0
@@ -3054,8 +3127,6 @@ snapshots:
'@types/estree-jsx': 1.0.5
'@types/unist': 3.0.3
estree-walker@2.0.2: {}
estree-walker@3.0.3:
dependencies:
'@types/estree': 1.0.8
@@ -3106,27 +3177,28 @@ snapshots:
dependencies:
to-regex-range: 5.0.1
flowbite-datepicker@1.3.0:
flowbite-react@0.12.9(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.18(yaml@2.6.0))(typescript@5.9.2):
dependencies:
'@rollup/plugin-node-resolve': 15.3.0
flowbite: 2.5.1
transitivePeerDependencies:
- rollup
flowbite-react@0.10.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.18(yaml@2.6.0)):
dependencies:
'@floating-ui/core': 1.6.6
'@floating-ui/react': 0.26.21(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
'@floating-ui/core': 1.6.9
'@floating-ui/react': 0.27.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
'@iarna/toml': 2.2.5
'@typescript-eslint/typescript-estree': 8.26.0(typescript@5.9.2)
chokidar: 4.0.3
classnames: 2.5.1
debounce: 2.1.0
flowbite: 2.5.1
comment-json: 4.2.5
debounce: 2.2.0
deepmerge-ts: 7.1.4
klona: 2.0.6
package-manager-detector: 0.2.9
react: 18.3.1
react-dom: 18.3.1(react@18.3.1)
react-icons: 5.2.1(react@18.3.1)
tailwind-merge: 2.4.0
recast: 0.23.11
tailwind-merge-v2: tailwind-merge@2.6.0
tailwind-merge-v3: tailwind-merge@3.0.1
tailwindcss: 3.4.18(yaml@2.6.0)
transitivePeerDependencies:
- rollup
- supports-color
- typescript
flowbite-typography@1.0.5:
dependencies:
@@ -3134,14 +3206,6 @@ snapshots:
lodash.isplainobject: 4.0.6
lodash.merge: 4.6.2
flowbite@2.5.1:
dependencies:
'@popperjs/core': 2.11.8
flowbite-datepicker: 1.3.0
mini-svg-data-uri: 1.4.4
transitivePeerDependencies:
- rollup
foreground-child@3.3.1:
dependencies:
cross-spawn: 7.0.6
@@ -3193,6 +3257,8 @@ snapshots:
has-flag@4.0.0:
optional: true
has-own-prop@2.0.0: {}
hasown@2.0.2:
dependencies:
function-bind: 1.1.2
@@ -3349,8 +3415,6 @@ snapshots:
is-hexadecimal@2.0.1: {}
is-module@1.0.0: {}
is-number@7.0.0: {}
is-plain-obj@4.1.0: {}
@@ -3383,6 +3447,8 @@ snapshots:
json-schema-traverse@1.0.0:
optional: true
klona@2.0.6: {}
lilconfig@3.1.3: {}
lines-and-columns@1.2.4: {}
@@ -3898,8 +3964,6 @@ snapshots:
mime-db: 1.52.0
optional: true
mini-svg-data-uri@1.4.4: {}
minimatch@9.0.5:
dependencies:
brace-expansion: 2.0.2
@@ -3984,6 +4048,8 @@ snapshots:
package-json-from-dist@1.0.1: {}
package-manager-detector@0.2.9: {}
parse-entities@2.0.0:
dependencies:
character-entities: 1.2.4
@@ -4016,8 +4082,6 @@ snapshots:
picomatch@2.3.1: {}
picomatch@4.0.3: {}
pify@2.3.0: {}
pirates@4.0.7: {}
@@ -4101,10 +4165,6 @@ snapshots:
react: 18.3.1
react-dom: 18.3.1(react@18.3.1)
react-icons@5.2.1(react@18.3.1):
dependencies:
react: 18.3.1
react-icons@5.5.0(react@18.3.1):
dependencies:
react: 18.3.1
@@ -4149,6 +4209,16 @@ snapshots:
dependencies:
picomatch: 2.3.1
readdirp@4.1.2: {}
recast@0.23.11:
dependencies:
ast-types: 0.16.1
esprima: 4.0.1
source-map: 0.6.1
tiny-invariant: 1.3.3
tslib: 2.8.1
recma-build-jsx@1.0.0:
dependencies:
'@types/estree': 1.0.8
@@ -4274,6 +4344,8 @@ snapshots:
mdast-util-to-markdown: 2.1.2
unified: 11.0.5
repeat-string@1.6.1: {}
require-from-string@2.0.2:
optional: true
@@ -4313,8 +4385,7 @@ snapshots:
search-insights@2.14.0: {}
semver@7.7.3:
optional: true
semver@7.7.3: {}
serialize-javascript@6.0.2:
dependencies:
@@ -4379,8 +4450,7 @@ snapshots:
source-map: 0.6.1
optional: true
source-map@0.6.1:
optional: true
source-map@0.6.1: {}
source-map@0.7.4: {}
@@ -4457,7 +4527,9 @@ snapshots:
tabbable@6.2.0: {}
tailwind-merge@2.4.0: {}
tailwind-merge@2.6.0: {}
tailwind-merge@3.0.1: {}
tailwindcss@3.4.18(yaml@2.6.0):
dependencies:
@@ -4518,6 +4590,8 @@ snapshots:
third-party-capital@1.0.20: {}
tiny-invariant@1.3.3: {}
to-regex-range@5.0.1:
dependencies:
is-number: 7.0.0
@@ -4526,6 +4600,10 @@ snapshots:
trough@2.2.0: {}
ts-api-utils@2.1.0(typescript@5.9.2):
dependencies:
typescript: 5.9.2
ts-interface-checker@0.1.13: {}
tslib@2.8.1: {}

View File

@@ -5,7 +5,12 @@ import Toggle from "@/components/Toggle";
import Link from "next/link";
import PlanTable from "./plan_table";
import { useState } from "react";
import { Accordion } from "flowbite-react";
import {
Accordion,
AccordionPanel,
AccordionTitle,
AccordionContent,
} from "flowbite-react";
import { FaCheck, FaCircleCheck } from "react-icons/fa6";
export default function _Page() {
@@ -322,11 +327,11 @@ export default function _Page() {
</h2>
<Accordion>
<Accordion.Panel>
<Accordion.Title>
<AccordionPanel>
<AccordionTitle>
How long does it take to set up Firezone?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
A simple deployment takes{" "}
<Link
href="/kb/quickstart"
@@ -353,11 +358,11 @@ export default function _Page() {
Visit our docs
</Link>{" "}
for more information and step by step instructions.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>Is there a self-hosted plan?</Accordion.Title>
<Accordion.Content>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>Is there a self-hosted plan?</AccordionTitle>
<AccordionContent>
All of the source code for the entire Firezone product is
available at our{" "}
<Link
@@ -369,24 +374,24 @@ export default function _Page() {
, and you're free to self-host Firezone for your organization
without restriction. However, we don't offer documentation or
support for self-hosting Firezone at this time.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
Do I need to rip and replace my current VPN to use Firezone?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
No. As long they're set up to access different resources, you
can run Firezone alongside your existing remote access
solutions, and switch over whenever youre ready. Theres no
need for any downtime or unnecessary disruptions.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
Can I try Firezone before I buy it?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
Yes. The Starter plan is free to use without limitation. No
credit card is required to get started. The Enterprise plan
includes a free pilot period to evaluate whether Firezone is a
@@ -398,13 +403,13 @@ export default function _Page() {
Contact sales
</Link>{" "}
to request a demo.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
My seat counts have changed. Can I adjust my plan?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
<p>Yes.</p>
<p className="mt-2">
For the <strong>Team</strong> plan, you can add or remove
@@ -418,26 +423,26 @@ export default function _Page() {
manager to request a seat increase. You'll then be billed for
the prorated amount for the remainder of the billing cycle.
</p>
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
What happens to my data with Firezone enabled?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
Network traffic is always end-to-end encrypted, and by default,
routes directly to Gateways running on your infrastructure. In
rare circumstances, encrypted traffic can pass through our
global relay network if a direct connection cannot be
established. Firezone can never decrypt the contents of your
traffic.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
How do I cancel or change my plan?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
For Starter and Team plans, you can downgrade by going to your
Account settings in your Firezone admin portal. For Enterprise
plans, contact your account manager for subscription updates. If
@@ -449,31 +454,31 @@ export default function _Page() {
contact support
</Link>
.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>When will I be billed?</Accordion.Title>
<Accordion.Content>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>When will I be billed?</AccordionTitle>
<AccordionContent>
The Team plan is billed monthly on the same day you start
service until canceled. Enterprise plans are billed annually.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
What payment methods are available?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
The Starter plan is free and does not require a credit card to
get started. Team and Enterprise plans can be paid via credit
card, ACH, or wire transfer.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
Do you offer special pricing for nonprofits and educational
institutions?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
Yes. Not-for-profit organizations and educational institutions
are eligible for a 50% discount.{" "}
<Link
@@ -483,18 +488,18 @@ export default function _Page() {
Contact sales
</Link>{" "}
to request the discount.
</Accordion.Content>
</Accordion.Panel>
<Accordion.Panel>
<Accordion.Title>
</AccordionContent>
</AccordionPanel>
<AccordionPanel>
<AccordionTitle>
What payment methods are available?
</Accordion.Title>
<Accordion.Content>
</AccordionTitle>
<AccordionContent>
The Starter plan is free and does not require a credit card to
get started. Team and Enterprise plans can be paid via credit
card, ACH, or wire transfer.
</Accordion.Content>
</Accordion.Panel>
</AccordionContent>
</AccordionPanel>
</Accordion>
</div>
</section>

View File

@@ -1,21 +1,14 @@
import { Clipboard as FlowbiteClipboard } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react";
import { ClipboardWithIcon } from "flowbite-react";
import type { ClipboardWithIconTheme } from "flowbite-react";
const clipboardTheme: CustomFlowbiteTheme["clipboard"] = {
withIcon: {
base: "absolute end-2 top-2 inline-flex items-center justify-center rounded p-1.5 text-neutral-500 transition transform duration-200 hover:text-neutral-800 hover:bg-neutral-50",
icon: {
defaultIcon: "h-4 w-4",
successIcon: "h-4 w-4 text-accent-500",
},
const clipboardTheme: ClipboardWithIconTheme = {
base: "absolute end-3 top-4 inline-flex items-center justify-center rounded p-2 text-neutral-500 transition transform duration-200 hover:text-neutral-800 hover:bg-neutral-50",
icon: {
defaultIcon: "h-4 w-4",
successIcon: "h-4 w-4 text-accent-500",
},
};
export default function Clipboard({ valueToCopy }: { valueToCopy: string }) {
return (
<FlowbiteClipboard.WithIcon
theme={clipboardTheme?.withIcon}
valueToCopy={valueToCopy}
/>
);
return <ClipboardWithIcon theme={clipboardTheme} valueToCopy={valueToCopy} />;
}

View File

@@ -15,7 +15,7 @@ import {
import { usePathname } from "next/navigation";
import Button from "@/components/Button";
import { HiChevronDown } from "react-icons/hi2";
import type { CustomFlowbiteTheme } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react/types";
import { HiBars3 } from "react-icons/hi2";
import { useDrawer } from "@/components/Providers/DrawerProvider";
import { useScrollPosition } from "@/hooks/useScrollPosition";
@@ -53,8 +53,8 @@ const navbarThemeLight: CustomFlowbiteTheme["navbar"] = {
link: {
base: "block py-2 pl-3 pr-4 md:p-0 border-t border-neutral-200 md:border-t-0 md:border-transparent",
active: {
on: "bg-neutral-200 rounded text-white md:bg-transparent text-primary-450 font-semibold",
off: "text-neutral-700 hover:text-primary-450 hover:bg-neutral-100 transition transform duration-50 md:hover:bg-transparent md:hover:border-b-2 md:hover:border-primary-450",
on: "bg-neutral-100 rounded md:bg-transparent font-semibold text-primary-450 md:text-primary-450",
off: "text-neutral-700 hover:text-primary-450 md:hover:text-primary-450 hover:bg-neutral-100 transition transform duration-50 md:hover:bg-transparent md:hover:border-b-2 md:hover:border-primary-450",
},
disabled: {
on: "text-neutral-400 hover:cursor-not-allowed",
@@ -100,8 +100,8 @@ const navbarThemeDark: CustomFlowbiteTheme["navbar"] = {
link: {
base: "block py-2 pl-3 pr-4 md:p-0 border-t border-neutral-700 md:border-t-0 md:border-transparent",
active: {
on: "rounded text-white md:bg-transparent text-primary-450 font-semibold",
off: "text-neutral-200 hover:text-primary-450 hover:bg-primary-900 hover:text-primary-450 transition transform duration-50 md:hover:bg-transparent md:hover:border-b-2 md:hover:border-primary-450",
on: "rounded bg-primary-900 md:bg-transparent font-semibold text-primary-450 md:text-primary-450",
off: "text-neutral-200 hover:text-primary-450 md:hover:text-primary-450 hover:bg-primary-900 transition transform duration-50 md:hover:bg-transparent md:hover:border-b-2 md:hover:border-primary-450",
},
disabled: {
on: "text-neutral-400 hover:cursor-not-allowed",

View File

@@ -1,8 +1,14 @@
"use client";
import { Route } from "next";
import { usePathname } from "next/navigation";
import type { CustomFlowbiteTheme } from "flowbite-react";
import { Sidebar as FlowbiteSidebar } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react/types";
import {
Sidebar as FlowbiteSidebar,
SidebarItem as FlowbiteSidebarItem,
SidebarItems as FlowbiteSidebarItems,
SidebarItemGroup as FlowbiteSidebarItemGroup,
SidebarCollapse as FlowbiteSidebarCollapse,
} from "flowbite-react";
import Link from "next/link";
import { useDrawer } from "@/components/Providers/DrawerProvider";
@@ -20,7 +26,7 @@ const FlowbiteSidebarTheme: CustomFlowbiteTheme["sidebar"] = {
off: "w-64",
},
inner:
"h-full overflow-y-auto overflow-x-hidden rounded px-3 py-4 dark:bg-neutral-800",
"h-full overflow-y-auto overflow-x-hidden bg-white rounded px-3 py-4 dark:bg-neutral-800",
},
collapse: {
button:
@@ -29,7 +35,7 @@ const FlowbiteSidebarTheme: CustomFlowbiteTheme["sidebar"] = {
base: "h-6 w-6 text-neutral-500 transition duration-75 group-hover:text-neutral-900 dark:text-neutral-400 dark:group-hover:text-white",
open: {
off: "",
on: "text-neutral-900",
on: "text-neutral-900 dark:text-white",
},
},
label: {
@@ -114,17 +120,17 @@ export function SidebarItem({
if (href) {
return (
<FlowbiteSidebar.Item as={Link} href={href} active={p === href}>
<FlowbiteSidebarItem as={Link} href={href as any} active={p === href}>
{children}
</FlowbiteSidebar.Item>
</FlowbiteSidebarItem>
);
} else {
return <FlowbiteSidebar.Item>{children}</FlowbiteSidebar.Item>;
return <FlowbiteSidebarItem>{children}</FlowbiteSidebarItem>;
}
}
export function SidebarItems({ children }: { children: React.ReactNode }) {
return <FlowbiteSidebar.Items>{children}</FlowbiteSidebar.Items>;
return <FlowbiteSidebarItems>{children}</FlowbiteSidebarItems>;
}
export function SidebarItemGroup({
@@ -135,14 +141,14 @@ export function SidebarItemGroup({
children: React.ReactNode;
}) {
return (
<FlowbiteSidebar.ItemGroup>
<FlowbiteSidebarItemGroup>
{label && (
<FlowbiteSidebar.Item theme={ItemGroupLabelTheme?.item}>
<FlowbiteSidebarItem theme={ItemGroupLabelTheme?.item}>
{label}
</FlowbiteSidebar.Item>
</FlowbiteSidebarItem>
)}
{children}
</FlowbiteSidebar.ItemGroup>
</FlowbiteSidebarItemGroup>
);
}
@@ -158,9 +164,9 @@ export function SidebarCollapse({
const p = usePathname();
return (
<FlowbiteSidebar.Collapse open={p.startsWith(prefix)} label={label}>
<FlowbiteSidebarCollapse open={p.startsWith(prefix)} label={label}>
{children}
</FlowbiteSidebar.Collapse>
</FlowbiteSidebarCollapse>
);
}

View File

@@ -1,6 +1,6 @@
"use client";
import { Tabs } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react";
import { Tabs, TabItem } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react/types";
const customTheme: CustomFlowbiteTheme["tabs"] = {
base: "flex flex-col gap-2",
@@ -85,9 +85,9 @@ function TabsItem({
icon?: FlowbiteIcon;
}) {
return (
<Tabs.Item title={title} icon={icon} {...props}>
<TabItem title={title} icon={icon} {...props}>
{children}
</Tabs.Item>
</TabItem>
);
}

View File

@@ -1,6 +1,6 @@
"use client";
import type { CustomFlowbiteTheme } from "flowbite-react";
import type { CustomFlowbiteTheme } from "flowbite-react/types";
import { Tooltip as FlowbiteTooltip } from "flowbite-react";
export default function Tooltip({

View File

@@ -1,5 +1,5 @@
/** @type {import('tailwindcss').Config} */
import flowbite from "flowbite-react/tailwind";
import flowbite from "flowbite-react/plugin/tailwindcss";
const firezoneColors = {
// See our brand palette in Figma.
@@ -66,11 +66,12 @@ const firezoneColors = {
/** @type {import('tailwindcss').Config} */
module.exports = {
darkMode: "class",
content: [
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
flowbite.content(),
"./node_modules/flowbite-react/dist/**/*.js",
],
theme: {
extend: {
@@ -135,5 +136,5 @@ module.exports = {
},
},
},
plugins: [flowbite.plugin(), require("flowbite-typography")],
plugins: [flowbite, require("flowbite-typography")],
};

View File

@@ -9,7 +9,7 @@
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",